So, why choose Liquid Modules?

Friday, 12 April 2013

Liquid Modules Trust in TrustPilot API -VB

Trust Pilot is an online review application which enables consumers to share reviews and experiences on the site they make purchases on. The major difference with Trustpilot and other review platforms is that it is open to the public. Trustpilot see this level of transparency as a benefit to both consumers and companies.

Ratings

Consumers can rate their experience using the 5 stars on top of their review. One star means very poor experience and five star marked in green being excellent. Overall ratings for the site a check mark in green or red Green means the site has a good rating and red is a sign to stay away – the site has mostly negative reviews and lots of user complaints.

ASP.NET API

Traditionally Trustpilot provides a means of integration by providing a piece of code to be copied and pasted within the reviews page on a particular site.  The HTML code is in the form of an iframe which you can paste on a page to display the reviews matching the style chosen in the administration side of the application.
When working with Trustpilot’s widget we wanted to customise our iframe for our client and control how the frame is displayed. This proved to be difficult as the frame is hosted by Trustpilot, and there are no reliable means to inject styling to the iframe. Using Javascript we tried to embed our CSS file within the head tag of the iframe, however because of security reasons this was restricted.
The trouble here is it is not easy to find information about how to customise your widget, and after a lot of searches on Google we stumbled upon a link which spoke about an API used by TrustPilot. On the development side of the Trustpilot site, which is not very easy to find, there is documentation on how to integrate the widget using the API.

How it Works

Trustpilot provides a JSON feed in a form of a zip file, to set of models in C#.NET. The Feed Model downloads the zip file, parses the JSON  and uses System.Web.Caching for caching the results, ensuring that the user does not have to wait for the server to download the feed and parse it every time. Once the feed has been downloaded it is parsed into separate models. That pretty much completes the complicated part of getting your reviews to your server.  The next step is displaying the reviews to the front end, which can be done anyway you like.

Six Simple steps using VB.NET.

The code provided by Trustpilot is all in C#, so the task for us was to convert it all to VB.NET.  Using online code convertors we managed to convert models to VB.Net. Below are the steps to implement the model.

Step 1:  Check Cache

' Check if we have a feed in the cache
        Const CACHE_KEY As String = "PluginsAspxSample.Default.Feed"
        Dim cachedFeed = TryCast(Cache.[Get](CACHE_KEY), FeedModel)
        If cachedFeed IsNot Nothing Then
            Return cachedFeed
        End If

Step 2: Web Request

' You url can be found on http://b2b.trustpilot.com/Modules/Plugins, where you also find the documentation.
        Const URL As String = "http://s.trustpilot.com/tpelements/1195944/f.json.gz"
        Dim request = DirectCast(WebRequest.Create(URL), HttpWebRequest)
        request.Method = WebRequestMethods.Http.[Get]
        request.AutomaticDecompression = DecompressionMethods.GZip

Step 3: Download Data

' Download the json data
        Dim feedData As String
        Using response = DirectCast(request.GetResponse(), HttpWebResponse)
            Using responseStream = response.GetResponseStream()
                feedData = New StreamReader(responseStream).ReadToEnd()
            End Using
        End Using

Step 4: Deserialize Date

' Deserialize the json
        Dim feed = New JavaScriptSerializer().Deserialize(Of FeedModel)(feedData)

Step 5: Cache Data

' Add to cache
        Cache.Add(CACHE_KEY, feed, dependencies:=Nothing, absoluteExpiration:=Cache.NoAbsoluteExpiration, slidingExpiration:=New TimeSpan(hours:=0, minutes:=1, seconds:=0), priority:=CacheItemPriority.Normal, _
         onRemoveCallback:=Nothing)

Finally: Return the feed
        ' Return the feed
        Return feed

Front page HTML

<div class="reviews">
<% For Each review In Feed.Reviews.Take(4)%>
<div class="item">
<img src='<%=review.TrustScore.StarsImageUrls("small")%>' class="stars" alt="review stars"/>
<%Dim time As DateTime = review.Created.Human%>
<%Dim format As String = "d MMM "%>
<span class="date"><%=time.ToString(format)%></span>
<h3><%= review.Title %></h3>
<p class="desc"><%=Shorten(review.Content, 125)%>
<a href="<%= Feed.ReviewPageUrl %>" target="_blank">Read more</a></p>
<div class="author">
<img src='<%= review.User.ImageUrls("i24")%>' alt='<%= review.User.Name %>' class="user-img" />
<p>
 <%= review.User.Name %>
<% If (review.User.City <> String.Empty) Then%>                                                                                                      
<br />
<%= review.User.City %>
<% End If%>
</p>
</div>
<div class="clear"></div>
</div>
<% Next%>
</div>


We came across a few problems while converting the code. The first problem was dealing with the caching of the data as C# and VB use different mechanisms. The next problem we encountered was linking each one of our posts to the exact post on Trustpilot web page. To overcome this we linked to the Trustpilot reviews page only.

Useful Links