Web Runtime QuickStart

Your favourite internet experience with a single click What you should already know Start here Get to know the development process Get to know the tools Study WRT widget development Shortcuts to development resources

Your favourite internet experience with a single click

S60 Web Runtime (WRT) widgets are stand-alone web applications that run on S60 devices. Widgets use the same standard internet technologies as web pages (such as HTML, JavaScript™, Ajax, and CSS technologies): You can consider a widget to be a web page without a browser UI. However, S60 WRT widgets have the added benefit of integration with S60 platform features and data.

Together, these features make it possible to optimise content for S60 devices and make it relevant to a user’s situation, to minimise network usage for content updates, and to create easier navigation than is possible with a full web page in a mobile browser. Essentially, widgets present the user with internet content simply, efficiently, and in a relevant way.

S60 Web Runtime was introduced in S60 3rd Edition, Feature Pack 2, but a software update makes it available on a number of S60 3rd Edition, Feature Pack 1 devices as well. With the introduction of S60 Browser 7.1 selected S60 3rd Edition, Feature Pack 2 devices and all S60 5th Edition devices from Nokia gain a Platform Services binding. This binding provides widgets with a JavaScript API to access device information such as contacts and calendar records and location data. In addition, the S60 WRTKit UI-class library provides building-block images and code that speeds the creation of appealing widgets for S60 devices. More recently, Forum Nokia released plug-ins for Aptana Studio, Adobe Dreamweaver, and Microsoft Visual Studio, making widget development with these popular web-development environment simple and intuitive.

What you should already know

Starting widget development for the S60 platform is easy: All you need is basic-level programming experience within the area of web development. Knowledge of JavaScript, HTML, CSS, and Ajax will be an advantage and can enable you to create rich internet applications integrated with the powerful S60 platform.

Start here

If you haven’t already done so, review the Web Runtime section to get a detailed overview of the technology.

Get to know the development process

The WRT widget-development process is simple and straightforward: In just three steps, you can go from nothing to a ready-to-deploy WRT widget. These steps are achieved easily without the need for special tools. If you would like to see how to take these steps with the Nokia WRT plug-ins and extensions please visit:

• the Nokia WRT Plug-in for Aptana Studio QuickStart page.
• the Nokia WRT Extension for Adobe Dreamweaver QuickStart page.
• the Nokia WRT Plug-in for Visual Studio QuickStart page.

In addition, you may want to download Nokia Platform Services 2.0 beta to experience the simplicity of the next-generation JavaScript API for accessing device information.

1. Create the widget functionality

An S60 WRT widget consists of files based on traditional web technologies and a few WRT widget-specific files. Some of these files are described below.

WRT widget-specific files:

• info.plist (mandatory)
  
  This XML-formatted file contains the property and configuration information for the widget, such as the HTML file used and a unique identifier.
  
  
• icon.png (optional)
  
  This custom icon file represents the widget on an S60 device.

Files based on standard web technologies:

• <name>.html (mandatory)
  
  This standard HTML file principally contains information for structuring a widget. The name of the HTML file must be defined within the info.plist properties.

Additional CSS, JavaScript, or image files can be added to the widget package as well.

2. Create a package of the widget component files

Once the widget code has been written, a package for installation on an S60 device can be created as follows:

• Select the file system folder that contains the widget components.
• From the folder’s shortcut menu, create a ZIP file of the folder using a ZIP utility, such as WinZip.
• Change the extension on the resulting file to .wgz.

After the *.wgz package has been created, you can test your widget in the emulator available in the S60 3rd Edition, Feature Pack 2, S60 5th Edition, and Nokia N97 SDKs, or on a compatible S60 device.

3. Deploy and publish

S60 WRT widgets can be deployed as *.wgz files to S60 devices in several ways: Just select the most suitable option for your business plan. If you decide to distribute the widget from your website, users can download the widget either directly to their S60 devices or to their PCs for transfer to and installation on their S60 devices.

Deployment method	Deployment location on the device	Installation method
Transfer via Bluetooth connection, e-mail, or other communication method	Inbox folder of the Messaging application	Messaging application
Transfer using a USB cable	Phone memory	File Manager application
Transfer via a memory card	Memory card	File Manager application
Transfer using the Web Browser for S60		Automatic installation if the file is identified on the server with MIME type: AddType x-nokia-widget .wgz

Note: Widgets do not need to be signed.

Get to know the tools

As you’ve seen, the development process for WRT widgets is straightforward, which means you can use your favourite web-development tool or text editor to create WRT widget code. However, Forum Nokia offers tools that simplify the development process further. These tools are:

• The Nokia WRT Plug-in for Aptana Studio.
• The Nokia WRT Extension for Adobe Dreamweaver.
• The Nokia WRT Plug-in for Visual Studio.
• The emulators in the S60 3rd Edition, Feature Pack 2, S60 5th Edition, and Nokia N97 SDKs.

Nokia WRT plug-ins and extensions

The Nokia WRT plug-in and extensions add the features WRT widget developers need to develop with Aptana Studio, Aptana Studio Pro, Adobe Dreamweaver, and Microsoft Visual Studio. All the plug-ins and extensions provide features for importing existing WRT widget projects and creating new projects. WRT widget code can be written rapidly using features such as full JavaScript code completion for the WRT 1.0 API. Once the widget has been coded, the plug-ins provide features to preview, debug, validate, package, and deploy the widget. In addition, the plug-ins include the WRTKit library, which contains images and JavaScript code to enable the creation of visually appealing and functionally rich WRT widgets. And you have the freedom to use the Aptana Studio plug-in and Adobe Dreamweaver extension on both Windows and Mac computers.

In addition, Nokia WRT Plug-in 2.0 for Aptana Studio offers full WRT 1.1 API support in the form of code completion and platform services emulation in the widget preview.

The Nokia WRT plug-ins and extensions enable you to use your favourite web-authoring tool to develop useful, exciting WRT widgets that maximise the traffic to your website or web service from S60 devices.

For more information, visit the Tools for Mobile Web Developers page »

S60 emulators

Another option for testing your WRT widget is the emulator included in the S60 3rd Edition, Feature Pack 2, S60 5th Edition, and Nokia N97 SDKs. The emulator allows you to install *.wgz files and run WRT widgets as you would on a device. If you’re taking advantage of the Platform Services bindings, you’ll need to test your widget in the S60 5th Edition or Nokia N97 SDKs’ emulator. The emulator also offers various tools to make testing easier, such as a position-simulation tool for testing widgets that access GPS information. Finally, to test widgets that implement home screen views for the Nokia N97 mobile computer, the Nokia N97 SDK includes an implementation of the home screen.

For more information, see the S60 SDKs: Features for web and Web Runtime developers page in the Tools section »

Study WRT widget development

Forum Nokia provides a number of resources to help you learn about WRT widget development. If you haven’t started developing widgets, the Getting Started with Web Runtime Widgets for S60 Screencast and the document Getting Started with Nokia Web Widget Development are good places to start.

For a comprehensive course in WRT widget development, check out the e-learning module Widgets for the S60 Platform. And don’t forget that the Web Developer’s Library provides a comprehensive guide and reference to all aspects of WRT widget development.

Shortcuts to development resources

• Getting Started with Nokia Web Widget Development
• Getting Started with Web Runtime Widgets for S60 Screencast
• Web technology e-learning modules
• Web Developer’s Library
• Web Runtime articles in the Forum Nokia Wiki
• Information on key event handling
• Getting Started with Ajax — Overview and Examples
• JavaScript Systeminfo Services API
• Nokia Platform Services 2.0 beta
• Discussion Boards
• Documentation

Rate This