Porting between Symbian Web Runtime and Nokia Asha Web Apps
This article explains the differences between Symbian Web Runtime and Series 40 Web Apps, and the changes you need to make to port between the two formats.
The Symbian Web Runtime (WRT) is the official Web Runtime offering by Nokia for Symbian devices. Series 40 Web Apps are W3C compliant widgets than run on Nokia Series 40 devices.
Both types of web apps are packaged in a zip file containing much the same files. The main change in this area when porting is to use the correct file extension:
- Series 40 Web App has extension .wgt
- Symbian Web Runtime has extension .wgz
It is also necessary to change the registration file, as discussed below.
Symbian and Series 40 Web Apps use similar but different registration files:
- Symbian Web Runtime: info.plist
- Series 40 Web Apps: config.xml
It is relatively easy to rename the file and convert the needed tags. An example is given below.
If the info.plist file of a Symbian Widget is
<xmlversion="1.0"encoding="UTF8"> <DOCTYPEplistPUBLIC "//Nokia//DTDPLIST1.0//EN" "http://www.nokia.com/NOKIA_COM_1/DTDs/plist-1.0.dtd"> <plist version="1.0"><dict> <key>DisplayName</key> <string>A Widget</string> <key>Identifier</key> <string>xxx.xxx.widget</string> <key>MainHTML</key> <string>AWidget.html</string> </dict></plist>
and the config.xml of a S40 Web App must be altered as
<?xml version="1.0" encoding="UTF-8"?> <widget xmlns=" http://www.w3.org/ns/widgets" height="200" id="http://nokia.com/simplemaps" version="0.1.0" viewmodes="windowed fullscreen" width="200"> <name short="AW">A Widget</name> ... <icon src="icon.png"/> <content src="AWidget.html"/> ... </widget>
If need be, developers can add other tags such as
<description>...</description> <author email=" firstname.lastname@example.org" href=" http://www.website.com/"> Corporation </author> <license>...</license>
Size of UI elements
The typical screen size of Series 40 device (240 x 320 px) is different from typical Symbian touch devices (640 x 360 px), so the application must change the width and height of some items in html or css in order to optimise the UI. This includes text, images and videos.
Comparison of recommended dimensions of a button on common devices running Symbian WRT and Series 40 Web App.
|Device||Physical size||Pixel size|
|Nokia N8-00 (Symbian^3)||7 x 7 mm||60 x 60 px|
|Nokia X3-02 (Series 40)||6.1 x 6.1 mm||40 x 40 px|
For more information see Series 40 Web App UX Guidelines.
Media file size
Series 40 devices are typically are less powerful than Symbian devices. In order to run applications at acceptable speeds, it may be necessary to use smaller media files, including images, audio and video.
Series 40 Web Apps have one more icon compared to Symbian WRT widget. They both share the main icon defined in the info.plist or config.xml. This icon is used in the application menus. In addition a favicon is needed in Series 40 Web Apps. The favicon is used in Nokia Browser history and favorites listing. The favicon is a 16x16 px pixel image. To include favicon add following line to index.html head-section:
<link rel="icon" type="image/png" href="favicon.png"/>
Series 40 Web Apps supports preferences attribute to store key-value pairs as defined in the W3C Widget interface specification. Preference should be defined in config.xml before using.
Config.xml: <preference name="key" value=""/>
var val = widget.preferences.getItem("key");
//or alternative way to access preferences
var val = widget.preferences["key"];
widget.preferences["key"] = "value”
Symbian WRT equivalent would be:
var val = widget.preferenceForKey("key");