Transfer Browser to App

Now that the browser-solution based on Node.js and MongoDB as well as jQuery Mobile is finished, the solution has to be provided as cross plattform app.

The cross plattform app is developed and deployed with INTEL XDK. 

• In a first step a dummy-jQuery Mobile App is generated by the dialog designer.
• then the subdirectories are filled with the files from the browser develpment
• relative main-directory is www (so far it was static for node.js and express)
• css 
• jqm
• js
• lib
• the the index.html-File created by Intel XDK is modified, so that it references all the files from the subdirectories, that are needed, jquery and jquery mobile remain at this time as given by Intel XDK

Then programming has to be done on the app.js file

• the following statements are for the first call

document.addEventListener("deviceready", function () {

    nta1010login.init();

});

• the login-page shows as expected
• now the second call has to be prepared
• the ajax-envocation so far went to the node.js server from which the browser solution was called, that mean it was taken implicitley
• now the server has to be assigned explicitly - so far the url just had the path and not the protocol, the hostname and the portnumber
• an elegant solution is wrapping the assignment of the url within the ajax-call so the protocol, hostname and port can be supplied
• the central function is located in uisystem.getActiveServer
• the getActiveHost-Function checks the available hosts from a host-list
• first the local test-host is checked
• then the remote production host is checked
• if operating in browser-mode (appmode === false) then the url remains unmodified
• the uisystem.getActiveServer-function then is applied to all ajax calls to modify the url that so far only had the path
• login-page
• global definitions are provided
• the ajax call is modified
• the app may only be used, if the server has done the login at least once and the login data has been stored with the remember me feature
• the logging of the cookie access will be enhanced
• "splash-screen"
• there will be an additional splash-screen in the app
• the activeServer will be detected and an timer loop will assure the surveillance of the activeServer connection
• the camera will be detected
• the microphone will be detected
• the GPS will be detected
• nevertheless an animation will be shown
• the user gets an option to interfere for repeating the tests after changing system settings

Architecture and design have to cover the different needs of app and browser usage:

• different start ("Preprocessing")
• app
• index.html
• app.js
• uisplash.js
• nta1010login.js
• browser
• index.html
• nta1010login.html
• common business logic ("Mainprocessing")
• different requests for data
• app
• local storage access to IndexedDB
• remote access with AJAX to node.js and MongoDB
• browser
• remote access with AJAX to node.js and MongoDB
• different finish ("Postprocessing")
• app
• suspend-mode
• cancel-mode
• system shutdown
• browser
• regular logout
• browser gets closed 
• system shutdown

To cover all these different aspects some work has to be done.

October 27, 2016

Now the software was transfered from Browser to App. The way back is done by code-sharing:

C:\ntaback\static>MKLINK /J  js "C:\xdkprojekte\pro1002_jqm\www\js"

Verbindung erstellt für js <<===>> C:\xdkprojekte\pro1002_jqm\www\js

The administrator can share the sources of the app for the browser-solution by providing a Link as mentioned above.

Of cource the starting index.html-Pages are not shared and app.js too is not shared, because the different parameters for the environments habe to be defined in index.html and app.js.