You create an HTML5 app through an HTML5 project. When you create an HTML5 project, you first create a
skeleton project, then look after the configuration to ensure that your HTML5 app will work correctly on your
target system.
The process for creating HTML5 apps is similar to the process for creating Cordova apps. You create the
project with the default folders and files, then add and modify files for your scripts, HTML5, images,
etc., and modify the config.xml file to configure the app's behavior.
To create an HTML5 project, use the create command. This command creates a skeleton project and
pre-populates the files required to run an HTML5 app on the platform. If you build the app without
modifications, by default, the app is set up to handle the deviceready event, and
displays the index.html page with the Cordova logo.
An HTML5 application created with Apache Cordova is a standalone app, which means you aren't required to
point to a remote server to load a webpage. The app runs on the target and can run in a standalone
fashion.
Configuring apps for QNX SDK for Apps and Media
Your HTML5 app doesn't run on a mobile device, such as a tablet or a smartphone.
Instead, it runs in an HMI on your target board. Therefore, you must make the
following changes to your app so that it functions correctly:
- Disable pinch and zoom on the HTML5 app. This incorrect resizing can cause your
app to behave incorrectly. In the index.html file (or other
starting page for your app), set the height and
width to match your screen dimensions, and set the
user-scaleable to no as shown here:
<meta name="viewport" content="width=800, height=480,
initial-scale=1.0, user-scalable=no"/>
- Whitelist any required URIs, such as URLs or network locations, that aren't local to the app. To
whitelist a URI, use the <access>
element in the config.xml file. For example:
<access subdomains="true" origin="www.qnx.com" >
<access subdomains="true" origin="file:///SDCard" />
For improved security, it's best to whitelist
only the locations you require and use HTTPS for sensitive information. For more information about whitelisting, see the Whitelist Guide in the Cordova
Documentation.
Running Cordova create
To run the Cordova
create command, navigate to
the
[location you installed HTML5
SDK]/html5sdk/cordova/cordova-qnxcar/bin folder on your host
computer. You run the command with the following parameters:
create project_path package_name app_ID
where:
- project_path — The location of an empty
directory.
- package_name — (Optional) A reverse domain name,
such as com.company.appname.
- app_ID — (Optional) A unique name. The name should
be unique on the target system.
For example:
create hello com.example.hello helloWorld
Attention: The package_name and
app_ID must be alphanumeric characters and can't be more
than 50 characters long.
Project folders
The create command creates the following subfolders in the folder you specified as
the project_path:
- www
- This folder contains all your project resources, including the index.html file, which is the
starting page for your app. It also contains subfolders for various resources, including CSS
and JavaScript files, as well as any other resources you might add.
-
Note: When you start to add code and resources to your app, save any project resource files
used by the app in the /www folder (or in the relevant subfolder
within /www).
- native
- The location where plugins native to the platform exist. Each HTML5
project includes plugins required for target boards and VMware
images.
- lib
- The Cordova Framework JavaScript libraries required to run on the target.
- cordova
- The tools to build and work with the project:
- build
- Interprets your HTML5 and JavaScript code, builds the binaries, and packages the
web assets to a .bar file. For more details, see "Test and package."
- clean
- Removes any files, such .bar files, that the
build command created.
- version
- Returns the version of the Cordova that's being used for your HTML5 app.
- whereis.cmd
- Searches the directories in your PATH environment to locate the
file that you typed. This command is available only for Windows.