Getting Started with the Emulator

The following is a brief look at the workflow involved in developing an application with the new Enyo framework, while utilizing the HP webOS Emulator. The source code comes from "StyleMatters", an example app included with the Enyo distribution.

These instructions assume that you have already installed VirtualBox (3.x or 4.x) and the webOS 3.0.2 SDK, which includes Enyo version 1.0.

On Windows, Enyo should be installed under "c:\Program Files\HP webOS\SDK\share\refcode\webos-framework\enyo" on 32-bit systems, or "c:\Program Files (x86)\HP webOS\SDK\share\refcode\webos-framework\enyo" on 64-bit systems.

On Mac and Linux, Enyo should be installed under /opt/PalmSDK/Current/share/refcode/framework/enyo/.

To run the "StyleMatters" application in the Emulator, do the following:

  1. Launch the webOS Emulator.

    Open a command prompt (on Windows) or terminal/console window (on Mac/Linux) and enter the command: 

    palm-emulator

  2. A VirtualBox window appears. Select the appropriate device image and click the "Start Emulator" button. The Emulator starts up.

  3. Copy the directory for the StyleMatters example application to a new location, where we'll make some minor modifications.

    On Windows: 

    mkdir \src\StyleMatters
cd "c:\Program Files\HP webOS\SDK\share\refcode\webos-framework\enyo"
xcopy 1.0\support\examples\StyleMatters \src\StyleMatters /e

    On Mac/Linux: 

    cd /opt/PalmSDK/Current/share/refcode/framework/enyo
cp -r 1.0/support/examples/StyleMatters /src/

    Of course, you may also perform the copying through your computer's graphical interface.

  4. Enter the directory with the copied files (cd c:\src\StyleMatters\ or cd /src/StyleMatters/) and open the index.html file in a text editor.

    Change the <script> tag to point to the location of the enyo.js file from the Enyo framework. In our current example, the <script> tag would look like this on Windows: 

    <script src="../../Program Files/HP webOS/SDK/share/refcode/webos-framework/enyo/1.0/framework/enyo.js"
  type="text/javascript"></script>

    or like this on Mac/Linux: 

    <script src="../../opt/PalmSDK/Current/share/refcode/framework/enyo/1.0/framework/enyo.js"
  type="text/javascript"></script>

    (Note: Technically, in the current SDK, palm-package should work properly as long as the src value in the <script> tag ends in "1.0/framework/enyo.js", even if the full path is not valid. However, the full path must be valid if you want to run the same source code in a WebKit-based browser.)

  5. From the command line or terminal window, go to c:/src/ or /src/. Then create an application package using the following command: 

    palm-package StyleMatters

    The package file will be created in the same directory, and will be named com.palm.stylematters_1.0.0_all.ipk.

  6. Again from the command line or terminal, install the application on the Emulator with the command: 

    palm-install com.palm.stylematters_1.0.0_all.ipk

  7. Finally, launch the newly-installed application: 

    palm-launch com.palm.stylematters

For more information on developing applications with the Enyo framework, see the Enyo Tutorial, conceptual documentation, and the Enyo API Reference. Also, be sure to look at the example code included with the SDK.