'use strict'; (function($) { //toggle this between true and false to allow/disallow testing the app in the browser window.localApp = true; window.app = (function() { //this object will store methods and variables that will be accessible outside of the window.app module var pub = {}; //store our window variables like height and width var win = {}; //array to store images that need preloading var preload = [ //store images in here as just the filename, like: 'back.svg' ]; //this will store the device Operating System var devOS = ''; pub.defaultConfig = { connectionRequired : false, useStorage : false, showTutorial : false }; //flags for various app states pub.online = false; //is the app online or not pub.noAccessSent = false; //have we sent a message about the lack of network access pub.useLocalStorage = false; //are we able to use localStorage pub.firstUse = true; //is this the first use of the app //this runs when the $(document).ready() event is fired by jQuery pub.initialize = function initialize(config) { pub.config = $.extend({}, pub.defaultConfig, config); getWindowVars(); bindEvents(); preloadImages(); }; //this runs when the deviceready event is fired by PhoneGap pub.ready = function ready() { if(app.config.useStorage) { //if local storage is available if(checkStorage()) { //store DB reference as app.lib app.lib = new localStorageDB('library', localStorage); //if the DB doesn't exist if(app.lib.isNew()) { //create it buildDB(); } else { var checkFirst = app.lib.query( 'settings', { 'key' : 'first_use' } ); if(checkFirst[0]['val'] !== 1) { app.firstUse = false; } } } } //if this is the first use if(app.firstUse) { app.$tutorial.fadeIn(); app.$tutorial.on('tap, click', function(e) { if(e.preventDefault) { e.preventDefault(); } app.$tutorial.fadeOut(); app.$tutorial.off('tap').off('click'); app.lib.update( 'settings', { 'key' : 'first_use' }, function(row) { row['val'] = 0; return row; } ); app.lib.commit(); startUp(); }); } else { startUp(); } }; //get sceen vars and cache selectors function getWindowVars() { //window height and width win.width = $(window).width(); win.height = $(window).height(); app.$body = $('body'); app.$tutorial = $('#tutorial'); } //preload any images in the preload array function preloadImages() { for(var i = 0, total = preload.length; i < total; i++) { var img = new Image(); img.src = 'assets/img/' + preload[i]; } } //bind your events here function bindEvents() { //online/offline event toggle document.addEventListener('online', toggleConnection, false); document.addEventListener('offline', toggleConnection, false); //on resume/pause from active/inactive status document.addEventListener('resume', appResumed, false); document.addEventListener('pause', appPaused, false); //software/hardware back button on Android devices document.addEventListener('backbutton', backSoftButton, false); //bind other events below } //perform device-dependent start up tasks here function startUp() { checkOS(); checkConnection(); } //triggered when the Android software back button is tapped function backSoftButton() { } //triggered when the app is resumed from the background function appResumed() { } //triggered when the app is sent to the background function appPaused() { } //find the operating system of the device function checkOS() { //if we aren't testing the app locally if(!window.localApp) { devOS = device.platform; //if we are testing locally } else { //default to iOS devOS = 'iOS'; } } //check online status function checkConnection() { if(window.localApp) { app.online = true; } else { var networkState = navigator.network.connection.type; var states = {}; states[Connection.UNKNOWN] = 'Unknown connection'; states[Connection.ETHERNET] = 'Ethernet connection'; states[Connection.WIFI] = 'WiFi connection'; states[Connection.CELL_2G] = 'Cell 2G connection'; states[Connection.CELL_3G] = 'Cell 3G connection'; states[Connection.CELL_4G] = 'Cell 4G connection'; states[Connection.CELL] = 'Cell generic connection'; states[Connection.NONE] = 'No network connection'; if(states[networkState] == 'Unknown connection' || states[networkState] == 'No network conneciton') { app.online = false; } else { app.online = true; } } } //let user know there is no network connection function noAccess() { if(!app.noAccessSent && app.config.connectionRequired) { app.msgAlert('Cannot access network connection. You will not be able to use this app offline', 'Connection Error'); app.noAccessSent = true; } } //network connection status function toggleConnection(e) { //if the app went offline, remove the online flag if(e.type == 'offline') { app.online = false; triggerOfflineEvents(); //if the app came online } else { app.online = true; triggerOnlineEvents(); } } //any actions to perform when app loses network connection function triggerOfflineEvents() { //offline logic here noAccess(); } //any actions to perform when app gains network connection function triggerOnlineEvents() { //online logic here app.noAccessSent = false; } //set up database function buildDB() { app.lib.createTable( 'settings', [ 'key', 'val' ] ); app.lib.commit(); app.lib.insert( 'settings', { 'key' : 'first_use', 'val' : 1 } ); app.lib.commit(); } function checkStorage() { //if we can use local storage if(window.localStorage) { app.useLocalStorage = true; //if we can't } else { app.useLocalStorage = false; } return app.useLocalStorage; } //store data in local storage function storeData(key, val, obj) { //if we are using local storage if(app.useLocalStorage) { //if this is a JSON object, stringify it if(obj) { val = JSON.stringify(val); } //store the value localStorage.setItem(key, val); } } //retrieve data from local storage function getData(key, obj) { //if we are using local storage if(app.useLocalStorage) { //get the value var get = localStorage.getItem(key); //if this is a JSON string, parse it to an object if(obj && get) { get = JSON.parse(get); } return get; } else { return false; } } //use native notifications, if possible pub.msgAlert = function msgAlert(message, title) { //if the notification method exists if(navigator.notification) { //use notification style navigator.notification.alert(message, null, title, 'OK'); //if it doesn't } else { //if we weren't sent a title if(typeof title === 'undefined') { title = ''; //if we were, add a : and a space to it } else { title = title + ': '; } window.alert(title + message); } }; //return the pub object so we can access variables and methods using dot notation, like app.initialize() return pub; }()); $(document).ready(function() { //config object to pass to our app module var config = { connectionRequired : true, useStorage : true, showTutorial : true }; app.initialize(config); if(!window.localApp) { document.addEventListener('deviceready', app.ready, false); } else { app.ready(); } }); })(window.jQuery);