Recently they just announced a web services API for accessing their articles and other information. And as I’ve talked about in other posts and webinars, it’s often quite easy to use web services with Xojo apps.

I’ll show you how you can quickly create an iOS app that shows the most recent TDWTF posts and then displays them when you tap on their title.

To start, create a Xojo iOS project.

On the default View (View1), use the Inspector to set a couple properties:

• BackButtonTitle: Articles
• Title: The Daily WTF

Now drag a Table from the Library onto the View and stretch it to fit the entire layout area. Name the table ArticleTable. This Table will be used to display the list of recent articles.

To get the articles, you just have to make the appropriate API call. Looking at the API docs, there is an API command called /articles/recent which returns a JSON document of the recent articles and related information. This is the actual API call. To see its JSON results, use a tool like Paw (now with Xojo extensions) or RESTy with this URL (a browser will also show the unformatted JSON):

http://thedailywtf.com/api/articles/recent

If you look at the JSON results, you’ll see that it returns an array of articles with a “Title” entry containing the title of the article and a “Url” entry containing the URL of the article.

To call this in the Xojo app, I’ll use an HTTPSocket. In the Library, drag the item called “Generic Object” onto the Layout. It will appear in the Shelf at the bottom. In its Inspector, change the name to WTFSocket and set its super to “Xojo.Net.HTTPSocket”.

Now add an event handler to the socket, right->click on the socket, select “Add To” and then “Event Handler”. Add the PageReceived event handler. In it, put this code to request the articles:

// Convert the binary Content data to JSON text and then
// parse it to an array.
Dim jsonText As Text = TextEncoding.UTF8.ConvertDataToText(Content)
Dim jsonArray() As Auto = Data.ParseJSON(jsonText)

// Loop through the array and add each article to
// the table.
ArticleTable.AddSection("")
For i As Integer = 0 To jsonArray.Ubound
  Dim article As Dictionary = jsonArray(i)

  Dim cell As iOSTableCellData = ArticleTable.CreateCell
  cell.Text = article.Value("Title")
  cell.Tag = article.Value("Url")

  Dim author As Dictionary = article.Value("Author")
  cell.DetailText = article.Value("DisplayDate") + " by " + author.Value("Name")
  ArticleTable.AddRow(0, cell)
Next

The URL is being put into the Tag for the cell so that it can be used later to display the article when its row is tapped.

You’ll also see I’m also accessing the “DisplayDate” value and grabbing the “Name” from the “Author” object in the JSON.

Now you’ll want to call the web service. Add the Open event handler to the View with this code:

// Call the /articles/recent web service
WTFSocket.Send("GET", "http://thedailywtf.com/api/articles/recent")

Run the project and you’ll see the list of recent article appear:

The final step is to display the article when it is tapped in the list. You’ll want another View to display the article (Insert->View). Name the view ArticleView. On this View, set the NavigationBarVisible property to ON and drag an HTML Viewer onto it. Make the HTML Viewer fill the entire View layout and name it ArticleViewer.

Add a method to ArticleView called ShowArticle(url As Text) with this code:

ArticleViewer.LoadURL(url)

This method loads the URL into the HTML Viewer and is called when its row is tapped in the list of articles.

Speaking of which, back on View1 add the Action event handler to the table with this code:

// Get the URL from the tag for the tapped row
Dim url As Text = Me.RowData(section, row).Tag

// Display the article on the new view and show it
Dim v As New ArticleView
v.ShowArticle(url)
PushTo(v)

Now run the project. You’ll see the list of article as before. Tap on an article to show the new view with the article.

Take a look at the full API to see what other cool features you can add to the app. Here are some suggestions:

• Display a random article
• Display more than the last 8 recent articles
• Cache the article contents on the device and use the cache when the article is displayed again
• Display articles by month/year

When we created the iOS app for XDC 2015 last spring, I decided to take a different route and try out a few of the commercial REST API clients to see if any of them would make my life easier. The one I settled on was Paw from LuckyMarmot, primarily for its support of extensions written in JavaScript.

There is a small library of extensions available on the Paw website, most of which are for code examples and that got me thinking… why not have examples of the request in Xojo code, both old and new framework so that I don’t need to do that by hand every time.

Examples

For the sake of this example, let’s say that we’re making a request to login to a fictitious API. The URL of this request is https://www.example.com/api/login, it expects that you will pass the username (name) and password (1234) as URL parameters and that a preshared key is to be included in the body of the request as JSON.

Paw comes with an extension for creating cURL requests and the output of that extension looks like this:

curl -X "GET" "https://www.example.com/api/login?username=name&password=1234" 
 -H "Content-Type: application/json" 
 -d "{"preshared-key":"QU^k9h36zdF8nx7Y"}"

Using our Paw extensions, the Old Framework Xojo extension generates code that looks like this:

// Login (Old Framework)

// Set up the socket
dim h as new HTTPSecureSocket
h.Secure = True
h.ConnectionType = h.TLSv12
h.setRequestHeader("Content-Type","application/json")

// JSON
Dim js As New JSONItem
js.Value("preshared-key") = "QU^k9h36zdF8nx7Y"

// Convert Dictionary to JSON Text
Dim data As String = js.toString()

// Assign to the Request's Content
h.SetRequestContent(data,"application/json")

// Set the URL
dim url as string = "https://www.example.com/api/login?username=name&password=1234"

// Send Synchronous Request
dim s as string = h.SendRequest("GET",url,30)

If you’re using the new framework extension, it generates code that looks like this:

// Login (New Framework)

// Set up the socket
// "mySocket" should be a property stored elsewhere so it will not go out of scope
mySocket = new Xojo.Net.HTTPSocket
mySocket.RequestHeader("Content-Type") = "application/json"

// JSON
Dim d As New Dictionary
d.Value("preshared-key") = "QU^k9h36zdF8nx7Y"

// Convert Dictionary to JSON Text
Dim json As Text = Xojo.Data.GenerateJSON(d)

// Convert Text to Memoryblock
Dim data As Xojo.Core.MemoryBlock = Xojo.Core.TextEncoding.UTF8.ConvertTextToData(json)

// Assign to the Request's Content
mySocket.SetRequestContent(data,"application/json")

// Set the URL
dim url as Text = "https://www.example.com/api/login?username=name&password=1234"

// Send Asynchronous Request
mySocket.Send("GET",url)

These extensions are available for download using the link below. Once downloaded, extract the folders into the Paw Extensions folder which you can reach by going to the Paw menu and selecting Extensions->Open Extensions Directory. Once they’re in there, you can make them available by selecting Extensions->Reload All Extensions.

Versions for the Classic Framework and Xojo Framework are available on GitHub:

• Paw Extension for HTTPSocket
• Paw Extension for Xojo.Net.HTTPSocket
• Paw Extension for URLConnection

CONCLUSION:

Paw is an excellent tool for storing and managing API configurations and examples, plus adding the ability to copy and paste Xojo HTTP socket code makes it an even better part of your library if you work with a lot of HTTP RESTful APIs.