Posted on

Palm App : Basic App

Multi Level Dropdowns in NewForm

Step 1: In Eclipse, New -> Project -> Select Basic Application

Step 2: Provide the Project /App Name [Id for the app name wil be
com.<vendorname>.<appname>]
for the below application [com.mycompany.firstapp] is the ID. Version no: 1.0.0


Folder Contents

app folder—Contains the assistants, models, and views that make
up the application. Later in the tutorial, you add files to this
directory.
images folder—Any other images the application uses.
stylesheets folder—Contains the cascading style sheet file for
the application.
appinfo.json—The Application Information file.
icon.png—The image that the application presents in the Launcher
on the emulator or device.
index.html—The main stage on which the application’s scenes
appear.
sources.json—A list of the source files for each scene.

Application Information

{
  "id": "com.mycompany.firstapp",
  "version": "1.0.0",
  "vendor": "My Company",
  "type": "web",
  "main": "index.html",
  "title": "First App",
  "icon": "icon.png"
}

Step 3: Creating a scene for app
A scene is a formatted screen for presenting information or a task to the user.
Each scene has a view and an assistant. The view determines the layout and
appearance of the scene. The assistant determines the behavior(Like Event
Listener for any buttons or Checkboxes].


/app/assistants/Scene1-assistant.js —This is the assistant.
/app/views/first/Scene1-scene.html —This is the view.
sources.json —This file now includes JSON information that binds
Scene1-assistant.js to the Scene1 scene.

Step 4: Open palm web OS Emulator before debugging any app.

Step 5: Open Scene1-scene.html and replace the content with the following

<div id="main" class="palm-hasheader">
<div class="palm-header">Header</div>
<div id="count" class="palm-body-text">Hello World</div>
</div>

Step6 : Debug as Mojo Application – It detects the emulator
automatically and opens the debugged version of App.


Now you can see the Blank app though the codes have put in to show hello world.

Step7: To Show the scene, you must tell the stage to push the "scene1".
So need to add a code to push scene1 to the stage. Stage-assistant.js is the
file manages the entire stage of app.

1. Open stage-assistant.js.
2. Edit the StageAssistant.prototype.setup call to look like below:

Step8: Debug the App again.