Showing posts with label Google Gadget. Show all posts
Showing posts with label Google Gadget. Show all posts

Friday, June 20, 2008

KnowledgeTree document download via Google Gadget

This is an installment feature for the KT-Gadget, a widget for KnowledgeTree, an open-source document management system.

As mentioned in the previous post, I employed an application proxy to act as a bridge between a Google Gadget and KnowledgeTree's SOAP services. Originally, the application proxy responses were formatted in XML. Moving forward, I decided to adopt the JSON format instead of XML owing to simpler methods in handling JSON feeds from both PHP and (of course) Javascript worlds.

The application proxy's SOAP client is based on PHP and converting an associative array of response items to JSON format is implemented simply by using PHP's json_encode function. At the gadget side, the requests for remote data are invoked using Google's _IG_FetchContent function. Using Javascript's eval() function, the returned JSON text response is converted to an object whose members can be easily accessed using dot or subscript operators.

Here are the details.. To download a document, KT-Gadget sends a request to the helper application by invoking the url:

http://kt-gadget.pipoltek.com/pipoltek.com/json/?oid=download_document&sid=rsop4e364ptf4slkp2a2vtvb96&did=4

The JSON response by the application proxy is of the form:
{"response":{"status_code":0,"message":"http:\/\/docs.pipoltek.com\/ktwebservice\/download.php?code=d2db2c0868ab0c9cd053fe2e43ab9926d1bcf94c&d=4&u=6a0j9qqpqc11de6nju6o0ej5o7"}}

The relevant block of KT-Gadget code is reproduced hereunder:

var url = "http://kt-gadget.pipoltek.com/pipoltek.com/json/?oid=get_folder_contents&sid=" + sessionID__MODULE_ID__ + "&fid=6";
_IG_FetchContent(url, function (jsonFeed) {
var jsonData = eval('(' + jsonFeed + ')');
if (jsonData.response.status_code != 0) {
alert ('Error in retrieving document!');
} else{
dd_link = jsonData.response.message;
_gel("ktg-lnk").innerHTML = '<a href="' + dd_link + '">@';
}
})

Once the application proxy has responded, the JSON text response (jsonFeed) is converted to an object (jsonData) using the eval() function. The response contains the download URL the value of which can be referenced as jsonData.response.message.

Where did the Session-ID (sid) and Document-ID (did) used as URL parameters come from? The Session-ID is assigned during login and the Document-ID, together with the rest of the document details, is returned by a call to get_folder_contents.

Here's the login invocation:
http://kt-gadget.pipoltek.com/pipoltek.com/json/?oid=login&uid=rexjun&pwd=cabanilla

The invocation to get_folder_contents:
http://kt-gadget.pipoltek.com/pipoltek.com/json/?oid=get_folder_contents&sid=0j8jkhjn55t7r3b0rshbcchpn1&fid=6

If you get a "Session is invalid" error, it's because the link is using an ID of an expired session. Change the URL parameter (sid) to a fresh Session-ID returned by the login call to get better results.

You may try out KT-Gadget by adding it to your iGoogle page or view the gadget source code here.

Thursday, June 12, 2008

Accessing Soap Services from Google Gadgets

The earlier gadget projects I developed have utilized third-party web services from a variety of sources:

  • Google Maps for geographic data
  • Google Docs spreadsheet as XML datasource
  • IP-Geolocation (IP address->Country) service from HostIP.Info
  • User profile and gaming statistics as XML feeds from Xfire.
Given the constraints of a space-restricted, remotely-hosted, javascript-only application, gadgets primarily rely on web services to provide richer data content without the attendant complexity. However, javascript is beset by cross-domain restrictions that even impact xmlHttpRequest, the very underpinnings of Ajax. Since Google gadgets are javascript apps, the same-origin security policy prevents it from making requests outside the domain it is running on.

Although Google addressed this problem by providing the _IG_FetchXMLContent function, it lacks support for https, SOAP and POST. It looks like the newer gadget.io.makeRequest function is intended to address these deficiencies. However, the availability of the gadget.io.* functions in Google's production servers is yet forthcoming.

I decided not to hold my breath..

KT-Gadget is a widget front-end to KnowledgeTree - an open-source document management system. To access KnowledgeTree's SOAP services, I had to deploy another application to receive the requests from Google's _IG_FetchXMLContent calls, make the corresponding SOAP requests, and generate the appropriate XML output. Two basic functions are implemented: login and get_folder_contents. The functions are based on PHP, the same language that was used to develop KnowlegeTree.

After pushing the login button, the gadget will indicate the progress of the subsequent operations:
  • Logging in
  • Fetching Documents
  • Sorting Documents
In its current state, the gadget is useful as a watcher of some sort of inbox for workflow-enabled documents like incoming faxes needing disposition or requisitions requiring approval. Sit around and watch your work pile up...

I plan to implement two more functions: download_document and perform_document_workflow_transition. We don't want work to pile up, do we? Other nice-to-have features: watch all accessible folders and sub-folders; show number of documents per folder; folder and document colors based on certain thresholds like document count, age, metadata contents (priority, etc); automatic refresh.

But don't hold your breath...

Thursday, May 22, 2008

Xfire Gadget

Have XML feed, will gadgetize..

Xfire provides xml feeds on gamer profiles, gameplays, friends, screenshots -- a whole lot of goodies. An Xfire gadget would be a good addition to one's blog, website or iGoogle.

One of the goals was to determine how close the gadget can resemble the real thing so it was initially developed using the default Xfire skin. Making a cross-browser scrollable table was not a trivial task and once the problem was solved, I started to hate the over-sized scroll bars. More coding lies ahead..

Employing the Ajax paradigm of single-page experience, remote services, rich visual controls and other design patterns, any web app can now come real close to the regular desktop UI.

A live gadget using a COD4 skin is displayed in another blog.

Sunday, March 23, 2008

IP Geolocation Gadget

Geolocation by IP address is the method of determining the geographic location of an Internet-connected device by examining data related to the IP address it is using. Google is effectively using geolocation to deliver targeted content by redirecting Google visitors to pages translated into their local language. On the other hand, geolocation can also be used to filter content. Just recently, selected YouTube videos have been discovered to bear special tags indicating that it is inappropriate for viewing in some countries .

There are several IP geolocation services in the Internet so I gave some of them a spin. Here are the results according to increasing accuracy in determining my location.


- IP2location got my country right but was not able to provide my city.
- IPligence got my city wrong.. or maybe it did not know my city and gave the national capital instead as default.
- Geobytes and Maxmind got my city right.
- HostIP.info not only got my city right but also has an API to go with it. And did I mention that the service is free?

Point your browser to http://api.hostip.info/ and you get an XML feed containing not only your City and Country but also your geographic coordinates as well. Sweet!


I can't resist the temptation to use this geolocation service and mix it up with Google Maps API into a Google gadget.. so I came up with another widget called WTHAMI?. Here it is in action..


If it doesn't get your location right, don't sue me. You can update your location at HostIP.info.

Saturday, March 22, 2008

Cebumapia, the Google Gadget

I've always wondered if I could package Cebumapia as a Google Gadget.. After taking a peek at the other Gadget samples, I was determined to build it. The wondering stage is over now..



The gadget uses the Google Maps API to render the map, overlay markers and trigger events when the mouse hovers on markers and when these are clicked. Markers are stored in xml files and fetched using the gadget-specific _IG_FetchXmlContent function.

The Cebumapia gadget code is miniscule - only 200 lines. But then, functionality is trimmed down to the very basic and UI is just as minimalistic. Take out the module header, css and html portions, and you are left with only 100 lines of javascript code.

If you've been wanting to create your own killer gadget and thinking you don't have the time, start now! My advise.. Start with small reliable code and incrementally build on it. Me? I'm planning to add a local news feed.. spruce up the UI for an iPhone-ish look.. or maybe not.

Add the Cebumapia gadget to your iGoogle page..

See the gadget embedded in Blogger template at Cebumapia.