Development and deployment of Firefox OS apps

Source: Internet
Author: User

All Firefox OS applications adopt the HTML5 standard. As long as HTML, CSS, and JS are used, developing apps is very simple, but firefox OS provides some features for mobile devices, such as phones, text messages, WIFI, and 3G networks. However, you can call these functions to manipulate JS objects like common JS components. Mozilla is also negotiating with W3C to add these new features to the HTML5 standard.

There are currently two methods to deploy the Firefox OS App.

1. Before gaia compilation, describe the directory structure of the App project of your App project in detail) in the apps or test_apps directory of gaia source code, and then make

This method can be run in the simulator or burned to the B2G mobile phone to run your application.

2. Deploy your App to the web server and install it online. In this case, you need to publish your application to the App store or write a separate page for App installation so that users can install your application through this page. Detailed descriptions will be provided later.

Next we will use a simple Demo to illustrate how to develop the Firefox OS App.

1. Create a folder named testapp as the root directory of the Project. Note that the folder name must be a lowercase letter)

2. Create index.html in the testappdirectory. The Code is as follows:

 
 
  1. <!DOCTYPE html> 
  2. <meta charset="utf-8" /> 
  3. <body>      
  4. hello Firefox OS  
  5. </body> 

3. Create manifest. webapp in the testapp directory. The Code is as follows:

 
 
  1. {  
  2. "name": "Test App",  
  3. "launch_path": "/index.html",  
  4. "developer": {  
  5. "name": "chy",  
  6. "url": "http://chyblog.sinaapp.com"  
  7. },  
  8. "appcache_path": "/cache.manifest",  
  9. "fullscreen": "true",  
  10. "icons": {  
  11. "120": "/style/testApp.png"  
  12. },  
  13. "permissions": [  
  14. ]  

Bytes

5. Deployment: We deploy testapp In the first method mentioned above, put test_apps under gaia source code, and re-compile the giai source code. Run the simulator after compilation. In your Firefox OS, you will see your new application.

6. to install the application online, first place the application on the web server and add an installation page. The source code is as follows:

 
 
  1. <!DOCTYPE html> 
  2.  
  3.      <meta charset="UTF-8"/> 
  4.      <title>online install</title> 
  5.      <script type="text/javascript"> 
  6.      function install() {  
  7.          var request = window.navigator.mozApps.install("http://demos.chyblog.com/testapp/manifest.webapp");  
  8.          request.onsuccess = function() {  
  9.              // Save the App object that is returned  
  10.              var appRecord = this.result;  
  11.              alert('Installation successful!')  
  12.          };  
  13.          request.onerror = function() {  
  14.              // Display the error information from the DOMError object  
  15.              alert('Install failed, error: ' + this.error.name);  
  16.          };  
  17.      }  
  18.      </script> 
  19.  
  20.  <body> 
  21.      <input type="button" value="install Test App" onclick="install()"/><br> 
  22.      from:<a href="http://www.chyblog.com">http://www.chyblog.com</a> 
  23.  </body> 

You need

 
 
  1. var request = window.navigator.mozApps.install("http://demos.chyblog.com/testapp/manifest.webapp"); 

Address secret in

After deployment, use the firefox browser in B2G to access the URL of the installation page, click the "install Test App" button, and install it as prompted. You can also use the demo page to install the application.

Effect

 

Source code download: http://chyblog-chyblog.stor.sinaapp.com/wp-content/uploads/2012/09/testapp.zip

Contact Us

The content source of this page is from Internet, which doesn't represent Alibaba Cloud's opinion; products and services mentioned on that page don't have any relationship with Alibaba Cloud. If the content of the page makes you feel confusing, please write us an email, we will handle the problem within 5 days after receiving your email.

If you find any instances of plagiarism from the community, please send an email to: info-contact@alibabacloud.com and provide relevant evidence. A staff member will contact you within 5 working days.

A Free Trial That Lets You Build Big!

Start building with 50+ products and up to 12 months usage for Elastic Compute Service

  • Sales Support

    1 on 1 presale consultation

  • After-Sales Support

    24/7 Technical Support 6 Free Tickets per Quarter Faster Response

  • Alibaba Cloud offers highly flexible support services tailored to meet your exact needs.