June 14, 2008
Creating an App
by Marco Vitanza

In my previous posts, I introduced SearchMonkey and talked about creating a custom data service. Now, I'll discuss how to use the data service in an app, and the different display options that apps have.

Besides entering a name and description for a new app, the first thing you need to do is decide whether it will be an Enhanced Result or an Infobar. An Enhanced Result will replace the normal listings in search results, and has the option of displaying a thumbnail image, a description, up to four links, and up to four name-value tidbits. The description and name-value items share the same space, so showing all four will make the description disappear. An Infobar, on the other hand, will appear as a small icon and label under a search result, and will expand to show a portion of generic HTML when clicked.

The next step in the app-creation process is to choose a trigger URL pattern and find some test URLs. The trigger pattern is what determines which search results your app will apply to, and can contain asterisks (*) at the beginning and end to act as wildcards. The pattern I chose for my Blogspot app was

*.blogspot.com/*

The dev tool will try to automatically find URLs that match your pattern, but you can enter in custom ones if you want. The first URL on the list will act as your app's preview if you make it sharable or it is accepted into the Gallery.

Next, you need to select which data services your app is going to use. Data from the Yahoo Index is available for all apps, and you can also add custom data services that you have made. Some URLs have extra data from the Yahoo Index, like an hAtom feed or hCard fields, but these will not necessarily have recent data since they come from the periodic crawls of the page by Yahoo's search bot.

Finally, you must connect your data with the presentation layer. SearchMonkey lets you write some basic PHP to manipulate (if necessary) and display your data. If your app is an Enhanced Result, it's easy to insert fields from either the Yahoo Index or custom data services. Here is an example with my RottenTomatoes Celebrity app:

$stars = Data::get('smid:XXX/rel:Person/rel:Review/review:rating');
$stars = intval($stars) / 20.0;
// Key-Value pairs - up to 4
$ret['dict'][0]['key'] = 'Tomatometer';
$ret['dict'][0]['value'] = Data::getStarsFromNum($stars);

The $ret array is the default PHP variable you use to build your presentation data and then give to the backend processing to render. The Data class and associated functions are provided by Yahoo. Data::get(), which retrieves values from data services' DataRSS, is the most commonly used of these. The result of the above code (and a few other lines) looks like this:

When making an Infobar app, you have more freedom with the presentation since you can output any HTML that you want (no CSS or JavaScript allowed). A simplified version of the code I used for my Blogspot inforbar is:

$myhtml = '';
foreach("rel:Posting" in MyCustomDataService)
  $myhtml .= $pDate . ' <a href="' . $pLink . '">' . $pTitle . '</a><br/>';
$ret['infobar']['blob'] = $myhtml;

You can easily preview your app after every change to make sure things are looking good. When you're satisfied, you can try it in a live Yahoo search, make it sharable, and even submit it for consideration into the Yahoo Search Gallery.

I hope these posts have been informative and piqued the interest of potential developers out there. The barriers to entry are minimal, which should make for an interesting future as SearchMonkey grows as a platform and the Gallery starts to fill with cool and useful apps.

Post Comment

Name:
Comment:  
Security Code: Verification Code Five Digits