MicroViews: Script Hosting & Tooltips

Summary

The current work that has been taking place on the MicroViews project has been setting up the script hosting and tooltips which form the first feature of MicroViews.

Script Hosting

The script is currently hosted from within ECS at http://microviews.eprints.org. This site is to be the public face for the project which will include documentation and advocacy for the library. It also includes a PHP script which is responsible for building the JavaScript include file which provides MicroViews functionality. There are a number of features to this script that are worth discussing.

The server side script has two key features which help in the hosting of the MicroViews library.

The first feature of the script is to look at the User Agent string supplied with the request. This opens the various JavaScript source files that will be used to create a single file that is then sent to the browser and included as part of the document. The reason for doing this is so that the browser only includes the appropriate code for that browser. So for example if you make the request from a desktop browser then only the code required to make tooltips work will be included in the file along with the core MicroViews code. On the other hand if the request is made from a mobile device then only the code to render the mobile gateway page will be sent.

The second key feature of the server side script is that it can include a version of the jQuery library. This means that if the web author has not already included the jQuery library on their site then they can just do it all from the MicroViews site by adding an option to the request url.

Other potential future features of the script host is to support compression of the JavaScript that is sent back to the browser. By carrying out this compression not only is bandwidth saved as the total amount of data being sent reduced, the performance for the end user is quicker as it takes less time for their browser JavaScript engine to parse the script sent back. I had attempted to implement compression but at the moment it is disabled as there were errors occurring with the browser JavaScript engines in Firefox and Internet Explorer not being able to execute the script. This is likely to be a problem with the compression engine I was using. This will be an issue which I will return to later as I think that this feature will pay dividends in the future with regards to mitigating scalability issues.

Tooltips

The tooltips are the simplest feature to implement which is why I choose to implement them first as this means that the library can be released for public use as early as possible. The tooltips were created as a prototype during the 2009 JISC Developer Happiness Days. All that needed to be done was to repurpose the code and harden it for production use. Initially the prototype was using a PHP script as a proxy to pull data from a linked EPrints repository into the same domain. This means that the prototype didn’t have to worry about the issue of making cross domain requests as the PHP script, in effect, would receive a request from the prototype code. It in turn then makes a request to the appropriate EPrints repository to get the actual JSON data. The response was then parsed by the server and it built the HTML to place inside the tooltip.

The problem with this approach is that it means the service has a single point of failure if the server were to go down and the proxy script is not available. I rectified this problem by changing the communication method to JSONP. This allows the communication to occur directly between the script and the repository regardless of crossing domains. JSONP works by adding<script> tags dynamically to the page DOM when a request is made. The request will contain data which is required by the remote side and the name of a JavaScript method that is already present which should be called once the request is complete. In effect you are including an additional JavaScript file from another domain which makes a call to a method that already exists in the code you have loaded. This allows cross domain data requests without the need of a proxy. This reduces the time it takes for the library to handle the request for data.

The tooltips themselves are produced using the qtip JQuery plugin. This plugin offers all the code required to make tooltips that remain on the page at all times and offers a number of visual themes that can be customized. I may modify the library in the event that there is demand for a more customized version of the tooltip.

The final feature of note in the tooltip is the image loader. This will also be used in both the mobile and inplace views that are to be implemented. The image loader looks at the documents that are associated with the EPrint and then attempts the to load the image using EPrints 3.1 style preview URLs if that fails then it will try to load images using the new EPrints 3.2 style of preview URLs. At the moment this is not as efficient as it could be, but it seems that this is the best solution at the moment as EPrints does not indicate which documents have preview images and those which are another format. Certainly if anyone is aware of an approach that would be compatible with the change from EPrints 3.1 to 3.2, and is more efficient than the current approach any feedback is appreciated!