Share via

Internet Explorer 8 Features Could Stickiness to Your Website in Minutes – Part 2 Accelerators, Adventures with Tadawul Site?

  • Article

Building an accelerator is a simple task. Number one site that comes to mind in Saudi Arabia is obviously the Tadawul, which is the Saudi Stock Market and I decided to build an accelerator that searches the stock information in this site. The only challenge here was the only way to search in the site was based on Stock Symbol which is a numeric value. Searching with Stock Symbol may not seem intuitive but this is a limitation from the site itself, you can invoke any service through GET or POST.

1) Create an XML document using the OpenService Format Specification for Accelerators. Here I will only build the basic functionality but the specification is comprehensive in the features that could be implemented. Publish document to your website. I named it TadawulAccelerator.xml and put it under root.

<?xml version="1.0" encoding="UTF-8"?>
<openServiceDescription xmlns="https://www.microsoft.com/schemas/openservicedescription/1.0">
  <homepageUrl>https://www.tadawul.com.sa</homepageUrl>
  <display>
    <name>Search Stock Symbol in Tadawul</name>
    <icon>https://www.tadawul.com.sa/favicon.ico</icon>
  </display>
  <activity category="define">
    <activityAction context="selection">
       <preview method="get" action="https://www.tadawul.com.sa/wps/portal/!ut/p/.cmd/cs/.ce/7_0_A/.s/7_0_4A0/_s.7_0_A/7_0_4A0"/>
       <execute method="get" action="https://www.tadawul.com.sa/wps/portal/!ut/p/_s.7_0_A/7_0_4BC?CompanySymbol=&amp;ANN_ACTION=ANN_SEARCH&amp;symbol={selection}&amp;tabOrder=1"/>
    </activityAction>
  </activity>
</openServiceDescription>

The XML is self explanatory.

  • display tags control what you see when you right click. One thing worth mentioning here is the favicon link. This doesn’t exist in the Tadawul site but I’m putting it here just for showing how it should be done.
  • activity tags define how to call the service.
  • preview section : An Accelerator can provide an optional HTML preview that is displayed when the user hovers over an Accelerator on the menu. Previews are useful to quickly obtain a map, in-place definition or translation, content ratings, or links to related content. In our case to demonstrate the functionality I’m displaying the ticker. Again this is a limitation of the site, if we provide a backend service that provides preview information we can easily call it here. As an example the Virtual Earth Accelerator displays a quick map during the preview mode. The preview window is limited to 320 width and 240 height on a 96 dots per inch (dpi) display. All content outside of the region is cut off. That’s why if you try the above accelerator some of the ticker is cutoff.
  • execute element specifies the main action triggered when the user invokes the Accelerator. Note the {selection} parameter, which means replace this token with the text the user selected in the page. There are different parameter types you can use.

2) Add a link or input to your web page and attach the following code.

<button onclick="window.external.AddService('TadawulAccelerator.xml')">Install Accelerator</button>

Sample web page I created looks like. Very simple page hence I didn’t give the code here.

image

3) When you click the Install Accelerator button, you get a warning message, click to install the accelerator.

4) Open any page, select an item. In our case it should be a numeric value that is a Stock Symbol. I’ve added two valid stock symbols which could be seen in the above page, 6010 or 6020.

image image

As you see building an accelerator for Tadawul was very simple. It only took couple of hours including the learning. The only thing that needs to be considered is the backend services that are called by the accelerator. We can use GET or POST to call the service and pass the following variables.

image

To get more information on the IE8 Features in general I recommend the MSDN Article New Features To Slice, Store, And Accelerate Your Web Applications.

Also the following article gives a complete overview of accelerator development see OpenService Accelerators Developer Guide.

See Internet Explorer 8 Readiness Toolkit

See Internet Explorer 8 Team Blog

Comments