Enyo 2.0

Overview

Enyo 2.0 is a free and open-source JavaScript framework for building cross-platform web apps. You can use Enyo 2.0 to build apps for the BlackBerry platform. If you already have a Enyo 2.0 based app, you can port it to the BlackBerry platform.

Porting process demo using the Onyx Sampler sample app

Onyx is a UI library for the Enyo 2.0 JavaScript framework. Onyx includes a variety of commonly used widgets, such as toolbars, text input fields, buttons, check boxes, progress bars, and so on. You can use the widgets from the Onyx UI library to build BlackBerry WebWorks apps.

We are going to demonstrate the porting process using the Onyx Sampler sample app. This sample app works on BlackBerry 10, BlackBerry PlayBook, and BlackBerry 7 and later devices. If you already have an app built with Enyo 2.0, you can follow the same instructions to port your own app by adapting the instructions as necessary. Alternatively, you can get the Onyx Sampler sample app and use it to follow the instructions.

Porting apps built using the Enyo 2.0 framework to the BlackBerry platform involves the following activities:
  • Incorporate the Enyo core files and the necessary libraries with the app source files.
  • Build a BlackBerry WebWorks app from the app source files.
  • Load the BlackBerry WebWorks app on the device.

Obtain the OnyxSampler source files

  1. Download the OnyxSampler app source files from the BlackBerry WebWorks Community Samples repo on GitHub.
  2. Extract the contents of the compressed file at a location of your choice.
  3. From the extracted files, navigate to the following location:
    \Enyo-2.0-OnyxSampler\lib\onyx\examples\
  4. Copy the OnyxSampler folder to a convenient location (for example, C:\OnyxSampler).

Incorporating the Enyo core files and the necessary libraries

The OnyxSampler folder contains the app's source code. To deploy the app, we incorporate the Enyo core files, and other libraries that the source code refers to, in the OnyxSampler folder. One of the ways you can do this is to use Enyo Bootplate. Enyo Bootplate contains the latest release of Enyo core files and the most common libraries. We also use the icon file available in Enyo Bootplate. Here are the steps to accomplish all of this:

  1. Download the Enyo Bootplate (bootplate-<x.x.x>.zip) from the Enyo website, where <x.x.x> denotes the version of Enyo.
  2. Extract the contents of the compressed file to a location of your choice.
  3. Copy the enyo and lib folders and the icon.png file from the extracted content into the OnyxSampler folder.
  4. In the OnyxSampler folder, edit the index.html file as follows:
    1. Locate the index.html file and open it in any text editor.
    2. To update the reference to the Enyo core files, find the <script> element with the attribute src="../../../../enyo/enyo.js" and replace it with src="./enyo/enyo.js".

      The updated <script> element appears as follows:

      <script src="./enyo/enyo.js" type="text/javascript"></script>
    3. To update the reference to the Onyx UI library, find the <script> element with the attribute src="../../../onyx/package.js" and replace it with src="./lib/onyx/package.js".

      The updated <script> element appears as follows:

      <script src="./lib/onyx/package.js" type="text/javascript"></script>
    4. To update the reference to the fittable package in the layout library, find the <script> element with the attribute src="../../../layout/fittable/package.js" and replace it with src="./lib/layout/fittable/package.js".

      The updated <script> element appears as follows:

      <script src="./lib/layout/fittable/package.js" type="text/javascript"></script>
    5. Save the file and exit the text editor.
  5. In the OnyxSampler folder, in the enyo subfolder, delete the minify, samples, and tools folders.

Further reading

Building a BlackBerry WebWorks app package

A BlackBerry WebWorks app is packaged into a file with a .cod extension. The BlackBerry WebWorks Packager (bbwp) is a command-line tool that generates a .cod file from a .zip file, and it is included with the BlackBerry WebWorks SDK. The .zip file is a BlackBerry WebWorks application archive file. It contains your app source files and a configuration file named config.xml (BlackBerry WebWorks configuration file).

Building a BlackBerry WebWorks app from your source files involves the following activities:
  1. Creating a BlackBerry WebWorks configuration file (config.xml).
  2. Creating a BlackBerry WebWorks application archive (.zip file).
  3. Generating a .cod file.

Create a BlackBerry WebWorks configuration file (config.xml)

In a text editor of your choice (for example, Notepad++), do the following:
  1. Copy the following XML code and paste it into a blank text file:
    <?xml version="1.0" encoding="UTF-8"?>
    <widget xmlns="http://www.w3.org/ns/widgets"
    		xmlns:rim="http://www.blackberry.com/ns/widgets"
    		version="2.0.0.0" id="OnyxSampler">
    	<name>Onyx Sampler</name>
    	<author>Enyo 2.0</author>
    	<content src="index.html"/>
    	<icon src="icon.png"/>
    </widget>

    All the elements are required except the <icon> element.

  2. Save the file as config.xml in the OnyxSampler folder.

Create a .zip file

In a file archiver of your choice (for example, 7-Zip), do the following:
  1. Select the contents of the OnyxSampler folder.
  2. Using the contents of the folder, create a .zip archive with the name OnyxSampler.zip.
  3. Save the OnyxSampler.zip file to the OnyxSampler folder.

Make sure that you create the .zip file from the contents of the OnyxSampler folder and not from the folder itself. The .zip file must have the config.xml file at the root level, not in a subfolder.

Generate a .cod file

Before you begin:

To complete this task, you must have the BlackBerry WebWorks SDK installed on your computer. You can download the SDK from the Downloads page.

  1. At the command prompt, change your directory to the location where you installed the BlackBerry WebWorks SDK. The default locations are:
    • Windows XP: C:\Program Files\Research In Motion\BlackBerry WebWorks SDK <version>
    • Windows 7: C:\Program Files (x86)\Research In Motion\BlackBerry WebWorks SDK <version>
    • Mac OS: /Developer/SDKs/Research In Motion/BlackBerry WebWorks SDK <version>
  2. Type the following command:
    bbwp C:\OnyxSampler\OnyxSampler.zip -o C:\OnyxSampler\build
    If the build process is completed successfully, two new folders should appear in the OnyxSampler\build folder: device and simulator, each containing the OnyxSample.cod file.

Further reading

Loading a BlackBerry WebWorks app on a BlackBerry device

The JavaLoader tool is a command line tool available with the BlackBerry WebWorks SDK for loading your app on BlackBerry devices. You can use this tool to load your app on a device. Note that you will need to use a signed .cod file.

The resources below can help you sign your app and load it on a smartphone or a simulator.

Further reading

Last modified: 2013-10-02