Customizing Generated Code

Modify generated JavaScript code to customize the Hybrid App.

1. Use the Hybrid App Package Generation wizard to generate the Hybrid App package and its files.
   When the Hybrid App package is generated, the Custom.js file is generated if not already present in the project. The Custom.js file is located in Generated Hybrid App\<hybridapp_project_name>\html\js.
2. Right-click the Custom.js file and select the editor with which to open the file.
3. Add your JavaScript code. For example, you can add code to call the APIs that are available through PhoneGap (also known as Apache Cordova).
   Find the line: hwc.customAfterHybridAppLoad = function() {, and add:

    document.addEventListener("deviceready", phoneGapIsReady, false);  
   //call the phoneGapIsReady function when PhoneGap is fully loaded.
   

   Then add this function:

   function phoneGapIsReady() {
        hwc.showAlertDialog("The connection type is " + navigator.network.connection.type + " and
         the platform and version is " + device.platform + " " + device.version);
   }

   In this example, when the Hybrid App is launched, the connection type, operating systerm platform and version, and device version is shown.
4. Save and close the Custom.js file.
   Since the Custom.js file is generated only if it is not already present in the Hybrid App project, this file will not be re-generated if you subsequently re-generate the Hybrid App package, so any modifications you make are preserved.
5. Deploy the Hybrid App package to SAP Mobile Server.
   Any time you customize the code, you must redeploy the Hybrid App package to SAP Mobile Server.
   You can also add your own separate JavaScript files to Generated Hybrid Apps\hybridapp_project_name\html\js, then add custom code to the Custom.js file that calls the functions in the JavaScript files you added. Modularizing your custom code can prevent the Custom.js file from becoming too long, and make it easier for multiple developers to collaborate on the same Hybrid App.