959 lines
30 KiB
JavaScript
959 lines
30 KiB
JavaScript
/*
|
|
* Copyright (c) 2015-2016, Willem Cazander
|
|
* All rights reserved.
|
|
*
|
|
* Redistribution and use in source and binary forms, with or without modification, are permitted provided
|
|
* that the following conditions are met:
|
|
*
|
|
* * Redistributions of source code must retain the above copyright notice, this list of conditions and the
|
|
* following disclaimer.
|
|
* * Redistributions in binary form must reproduce the above copyright notice, this list of conditions and
|
|
* the following disclaimer in the documentation and/or other materials provided with the distribution.
|
|
*
|
|
* THIS SOFTWARE IS PROVIDED BY THE COPYRIGHT HOLDERS AND CONTRIBUTORS "AS IS" AND ANY
|
|
* EXPRESS OR IMPLIED WARRANTIES, INCLUDING, BUT NOT LIMITED TO, THE IMPLIED WARRANTIES OF
|
|
* MERCHANTABILITY AND FITNESS FOR A PARTICULAR PURPOSE ARE DISCLAIMED. IN NO EVENT SHALL
|
|
* THE COPYRIGHT HOLDER OR CONTRIBUTORS BE LIABLE FOR ANY DIRECT, INDIRECT, INCIDENTAL,
|
|
* SPECIAL, EXEMPLARY, OR CONSEQUENTIAL DAMAGES (INCLUDING, BUT NOT LIMITED TO, PROCUREMENT
|
|
* OF SUBSTITUTE GOODS OR SERVICES; LOSS OF USE, DATA, OR PROFITS; OR BUSINESS INTERRUPTION)
|
|
* HOWEVER CAUSED AND ON ANY THEORY OF LIABILITY, WHETHER IN CONTRACT, STRICT LIABILITY, OR
|
|
* TORT (INCLUDING NEGLIGENCE OR OTHERWISE) ARISING IN ANY WAY OUT OF THE USE OF THIS
|
|
* SOFTWARE, EVEN IF ADVISED OF THE POSSIBILITY OF SUCH DAMAGE.
|
|
*/
|
|
/* jslint browser: true */
|
|
/* global angular,define */
|
|
|
|
/**
|
|
* FFSpaLoader is an assets loader for single page applications.
|
|
* Its build around the concept the there is only a single static index.html which
|
|
* synces all its assets to local cache for offline and or fast page loads.
|
|
*
|
|
* @module FFSpaLoader
|
|
*/
|
|
(function (root, factory) {
|
|
if ( typeof define === 'function' && define.amd ) {
|
|
define('FFSpaLoader', factory(root));
|
|
} else if ( typeof exports === 'object' ) {
|
|
module.exports = factory(root);
|
|
} else {
|
|
root.FFSpaLoader = factory(root);
|
|
}
|
|
})(this || window, /** @lends module:FFSpaLoader */ function (rootWindow) {
|
|
'use strict';
|
|
|
|
/**
|
|
* The options to customize the loader.
|
|
*/
|
|
var options = {
|
|
debug: {
|
|
enable: false,
|
|
handler: null, // auto filled
|
|
prefix: 'FFSpaLoader.'
|
|
},
|
|
error: {
|
|
handler: null, // auto filled
|
|
title: 'Loader ',
|
|
style: 'body {color: #EFF0F1;background: #484948;} .ffError { margin: 3em;border-left: 0.3em solid #B55858;border-radius: 1em;padding: 0em 1em 0.3em 1em;}'
|
|
},
|
|
boot: {
|
|
cordova: {
|
|
enable: true,
|
|
timeout: -1,
|
|
flag: 'FFCordovaDevice'
|
|
},
|
|
angular: {
|
|
enable: true,
|
|
modules: []
|
|
},
|
|
},
|
|
server: {
|
|
url: null,
|
|
assets: null,
|
|
timeout: 4096,
|
|
flag: 'FFServerUrl',
|
|
header: {
|
|
request: {
|
|
'X-FFSpaLoader': 'sync'
|
|
},
|
|
response: { // TODO: add header check support
|
|
}
|
|
}
|
|
},
|
|
question: {
|
|
transport: 'http://',
|
|
title: 'Question',
|
|
submit: 'Start',
|
|
text: 'Please provide the server name',
|
|
style: 'body {color: #EFF0F1;background: #484948;} .ffQuestion { margin: 3em;border-left: 0.3em solid #3F68AD;border-radius: 1em;padding: 0em 1em 0.3em 1em;} .ffQuestion > div > input {margin: 0.4em;padding: 0.4em; line-height: 2em;background-color: #454442;color: #EFF0F1;border: none;border-radius: 0.4em;outline: none;min-width: 5em;} .ffQuestion > div > input:focus {border: none;} .ffQuestionError{color: #B55858;} .ffQuestionLoad {transition: all 0.5s ease;color: #484948;} .ffQuestionLoad > div > input {background-color: #484948;color: #484948;}',
|
|
validate: {
|
|
min: {
|
|
value: 3,
|
|
message: 'Server name is to short.'
|
|
},
|
|
max: {
|
|
value: 255,
|
|
message: 'Server name is to long.'
|
|
},
|
|
regex: {
|
|
value: '^([a-zA-Z0-9\.\:])*$',
|
|
message: 'Server name is invalid.'
|
|
}
|
|
}
|
|
},
|
|
cache: {
|
|
meta: null,
|
|
js: null,
|
|
css: null,
|
|
cssData: null
|
|
}
|
|
};
|
|
|
|
/**
|
|
* Use single instance for websql
|
|
* @private
|
|
*/
|
|
var cacheDB = null;
|
|
|
|
/**
|
|
* The factory which contains detection helpers and cache backend builders.
|
|
*/
|
|
var factory = {
|
|
detect: {
|
|
localStorage: function() {
|
|
try {
|
|
var testData = 'localStorageDetect';
|
|
rootWindow.localStorage.setItem(testData, testData); // throws err in private browsing mode
|
|
rootWindow.localStorage.removeItem(testData);
|
|
return true;
|
|
} catch(e) {
|
|
return false;
|
|
}
|
|
},
|
|
openDatabase: function() {
|
|
return 'openDatabase' in rootWindow;
|
|
},
|
|
sqlitePlugin: function() {
|
|
return 'sqlitePlugin' in rootWindow;
|
|
},
|
|
cordova: function() {
|
|
return 'cordova' in rootWindow;
|
|
},
|
|
cordovaDevice: function() {
|
|
return options.boot.cordova.flag in rootWindow;
|
|
}
|
|
},
|
|
cache: {
|
|
localStorage: function() {
|
|
return {
|
|
cacheGetValue: function(key, cb) {
|
|
try {
|
|
var dataRaw = rootWindow.localStorage.getItem(key);
|
|
var data = JSON.parse(dataRaw);
|
|
cb(null, data);
|
|
} catch(e) {
|
|
cb(e);
|
|
}
|
|
},
|
|
cacheSetValue: function(key, value, cb) {
|
|
try {
|
|
rootWindow.localStorage.setItem(key,JSON.stringify(value));
|
|
cb(null);
|
|
} catch(e) {
|
|
cb(e);
|
|
}
|
|
},
|
|
cacheDeleteValue: function(key, cb) {
|
|
try {
|
|
rootWindow.localStorage.removeItem(key);
|
|
cb(null);
|
|
} catch(e) {
|
|
cb(e);
|
|
}
|
|
}
|
|
};
|
|
},
|
|
websql: function(opt) {
|
|
if (opt === undefined) { opt = {}; }
|
|
if (opt.name === undefined) { opt.name = 'FFSpaLoader'; }
|
|
if (opt.size === undefined) { opt.size = 4 * 1024 * 1024; } // reg 4MB let user do higher
|
|
if (opt.version === undefined) { opt.version = '1.0'; }
|
|
if (opt.openDatabase === undefined) { opt.openDatabase = rootWindow.openDatabase; }
|
|
var nullDataHandler = function(cb) {
|
|
return function () {
|
|
cb(null);
|
|
};
|
|
};
|
|
var executeSql = function(tx, query, values, resultHandler, errorHandler) {
|
|
utilDebug('websql.executeSql '+query);
|
|
tx.executeSql(query, values, resultHandler, function(tx,err) {
|
|
errorHandler(new Error('Code: '+err.code+' '+err.message+' by query: '+query));
|
|
});
|
|
};
|
|
var cacheDBInit = function(cb) {
|
|
cacheDB.transaction(function(tx) {
|
|
var query = 'CREATE TABLE cache_store(id INTEGER PRIMARY KEY AUTOINCREMENT, key TEXT NOT NULL, value TEXT NOT NULL)';
|
|
executeSql(tx, query, [], function(tx) {
|
|
executeSql(tx, 'CREATE UNIQUE INDEX cache_store__key__udx ON cache_store (key)', [], nullDataHandler(cb), cb);
|
|
}, cb);
|
|
});
|
|
};
|
|
return {
|
|
cacheOpen: function(cb) {
|
|
if (cacheDB !== null) {
|
|
return cb(null); // open once.
|
|
}
|
|
try {
|
|
cacheDB = rootWindow.openDatabase(opt.name, opt.version, opt.name, opt.size);
|
|
} catch(e) {
|
|
return cb(e);
|
|
}
|
|
cacheDB.transaction(function(tx) {
|
|
executeSql(tx,'SELECT value FROM cache_store WHERE key = \"test-for-table\"', [], function() {
|
|
cb(null);
|
|
}, function() {
|
|
cacheDBInit(cb);
|
|
});
|
|
});
|
|
},
|
|
cacheGetValue: function(key, cb) {
|
|
cacheDB.transaction(function(tx) {
|
|
executeSql(tx, 'SELECT value FROM cache_store WHERE key = ?',[key], function(tx, res) {
|
|
if (res.rows.length === 0) {
|
|
cb(null, null);
|
|
} else {
|
|
var value = res.rows.item(0).value;
|
|
cb(null, JSON.parse(value));
|
|
}
|
|
}, cb);
|
|
});
|
|
},
|
|
cacheSetValue: function(key, value, cb) {
|
|
cacheDB.transaction(function(tx) {
|
|
executeSql(tx, 'SELECT value FROM cache_store WHERE key = ?',[key], function(tx, res) {
|
|
if (res.rows.length === 0) {
|
|
var queryInsert = 'INSERT INTO cache_store (key,value) VALUES (?,?)';
|
|
executeSql(tx, queryInsert, [key,JSON.stringify(value)], nullDataHandler(cb), cb);
|
|
} else {
|
|
var queryUpdate = 'UPDATE cache_store SET value = ? WHERE key = ?';
|
|
executeSql(tx, queryUpdate, [JSON.stringify(value),key], nullDataHandler(cb), cb);
|
|
}
|
|
}, cb);
|
|
});
|
|
},
|
|
cacheDeleteValue: function(key, cb) {
|
|
cacheDB.transaction(function(tx) {
|
|
executeSql(tx, 'DELETE FROM cache_store WHERE key = ?', [key], nullDataHandler(cb), cb);
|
|
});
|
|
}
|
|
};
|
|
},
|
|
}
|
|
};
|
|
|
|
/**
|
|
* Prints the debug message with prefix to the options.debug.handler if options.debug.enable is true.
|
|
* @param {String} message The message to log.
|
|
* @private
|
|
*/
|
|
var utilDebug = function (message) {
|
|
if (options.debug.enable !== true) {
|
|
return;
|
|
}
|
|
options.debug.handler(options.debug.prefix+message);
|
|
};
|
|
|
|
/**
|
|
* The default error handler which renders the error in the browser.
|
|
* @param {Error|String} err The error object or message.
|
|
* @private
|
|
*/
|
|
var utilErrorHandler = function(err) {
|
|
if (!(err instanceof Error)) {
|
|
err = new Error(err);
|
|
}
|
|
utilDebug('utilErrorHandler error '+err.name+' '+err.message);
|
|
|
|
var rootTag = document.createElement('div');
|
|
rootTag.setAttribute('class','ffError');
|
|
document.getElementsByTagName('body')[0].appendChild(rootTag);
|
|
|
|
var cssTag = document.createElement('style');
|
|
cssTag.type = 'text/css';
|
|
cssTag.innerHTML = options.error.style;
|
|
rootTag.appendChild(cssTag);
|
|
|
|
var titleTag = document.createElement('h1');
|
|
titleTag.appendChild(document.createTextNode(options.error.title+err.name));
|
|
rootTag.appendChild(titleTag);
|
|
|
|
var questionTag = document.createElement('p');
|
|
questionTag.appendChild(document.createTextNode(err.message));
|
|
rootTag.appendChild(questionTag);
|
|
|
|
try {
|
|
var stack = err.stack || '';
|
|
stack = stack.split('\n').map(function (line) { return line.trim()+'\n'; });
|
|
var stackText = stack.splice(stack[0] === 'Error' ? 2 : 1);
|
|
|
|
var traceTag = document.createElement('pre');
|
|
traceTag.appendChild(document.createTextNode(stackText));
|
|
rootTag.appendChild(traceTag);
|
|
} catch (stackError) {
|
|
utilDebug('No stack: '+stackError);
|
|
}
|
|
};
|
|
|
|
/**
|
|
* Fetches an url resource with a XMLHttpRequest.
|
|
* @param {String} url The url to fetch.
|
|
* @param {function} cb Error first callback when done.
|
|
* @private
|
|
*/
|
|
var utilHttpFetch = function (url, cb) {
|
|
var startTime = new Date().getTime();
|
|
var httpRequest = new XMLHttpRequest();
|
|
httpRequest.onreadystatechange = function() {
|
|
if (httpRequest.readyState === 4 && httpRequest.status === 200) {
|
|
utilDebug('utilHttpFetch url \"'+url+'\" done in '+(new Date().getTime()-startTime)+' ms.');
|
|
cb(null, httpRequest);
|
|
} else if (httpRequest.readyState === 4) {
|
|
cb('Wrong status '+httpRequest.status);
|
|
}
|
|
};
|
|
httpRequest.open('GET', url, true);
|
|
httpRequest.timeout = options.server.timeout; // ieX: after open()
|
|
httpRequest.ontimeout = function() {
|
|
cb('timeout after '+options.server.timeout+' of url '+url);
|
|
};
|
|
var headerKeys = Object.keys(options.server.header.request);
|
|
for (var headerKeyIdx in headerKeys) {
|
|
var headerKey = headerKeys[headerKeyIdx];
|
|
var headerValue = options.server.header.request[headerKey];
|
|
httpRequest.setRequestHeader(headerKey,headerValue);
|
|
}
|
|
httpRequest.send();
|
|
};
|
|
|
|
/**
|
|
* Async helper to run each step from the stack.
|
|
* @param {String} runType The runType used for debug logging.
|
|
* @param {Array} stack The stack to run all steps on.
|
|
* @param {function} step Stack Item + Error first callback when done function callback.
|
|
* @param {function} cb Error first callback when done.
|
|
* @private
|
|
*/
|
|
var utilRunStack = function(runType, stack, step, cb) {
|
|
if (stack.length === 0) {
|
|
return cb(null);
|
|
}
|
|
utilDebug(runType);
|
|
var startTime = new Date().getTime();
|
|
var runStack = stack;
|
|
var runStackStep = function(err) {
|
|
if (err !== null) { return cb(err); }
|
|
runStack = runStack.slice(1);
|
|
if (runStack.length === 0) {
|
|
utilDebug(runType+' done '+stack.length+' in '+(new Date().getTime()-startTime)+' ms.');
|
|
cb(null);
|
|
} else {
|
|
step(runStack[0],runStackStep);
|
|
}
|
|
};
|
|
step(runStack[0],runStackStep);
|
|
};
|
|
|
|
var cacheGetService = function (type) {
|
|
if (options.cache[type]) {
|
|
return options.cache[type];
|
|
}
|
|
return null;
|
|
};
|
|
|
|
var cacheHasService = function (type) {
|
|
return cacheGetService(type) !== null;
|
|
};
|
|
|
|
var cacheCheckType = function (type, cb, action) {
|
|
cacheHasService(type)?action():cb(new Error('No caching for '+type));
|
|
};
|
|
|
|
/**
|
|
* Retreive a cached value.
|
|
* @param {String} type The cache type to use.
|
|
* @param {String} key The key to get the value for.
|
|
* @param {function} cb Error first callback + value callback.
|
|
* @private
|
|
*/
|
|
var cacheGetValue = function(type, key , cb) {
|
|
cacheCheckType(type, cb, function() {
|
|
var cacheKey = type+'_'+key;
|
|
utilDebug('cacheGetValue key '+cacheKey);
|
|
cacheGetService(type).cacheGetValue(cacheKey,cb);
|
|
});
|
|
};
|
|
|
|
/**
|
|
* Store a value in cache.
|
|
* @param {String} type The cache type to use.
|
|
* @param {String} key The key to store the value for.
|
|
* @param {String} value The value to store.
|
|
* @param {function} cb Error first callback.
|
|
* @private
|
|
*/
|
|
var cacheSetValue = function(type, key, value, cb) {
|
|
cacheCheckType(type, cb, function() {
|
|
var cacheKey = type+'_'+key;
|
|
utilDebug('cacheSetValue key '+cacheKey);
|
|
cacheGetService(type).cacheSetValue(cacheKey,value,cb);
|
|
});
|
|
};
|
|
|
|
/**
|
|
* Deletes an cache value.
|
|
* @param {String} type The cache type to use.
|
|
* @param {String} key The key to delete the value.
|
|
* @param {function} cb Error first callback.
|
|
* @private
|
|
*/
|
|
var cacheDeleteValue = function(type, key, cb) {
|
|
cacheCheckType(type, cb, function() {
|
|
var cacheKey = type+'_'+key;
|
|
utilDebug('cacheDeleteValue key '+cacheKey);
|
|
cacheGetService(type).cacheDeleteValue(cacheKey,cb);
|
|
});
|
|
};
|
|
|
|
var cleanupCache = function (resources, cb) {
|
|
var typedKeys = {};
|
|
resources.forEach(function (r) {
|
|
var typeKey = typedKeys[r.type];
|
|
if (typeKey === undefined) {
|
|
typeKey = [];
|
|
typedKeys[r.type] = typeKey;
|
|
}
|
|
typeKey.push(r.hash);
|
|
});
|
|
var steps = [];
|
|
var keys = Object.keys(typedKeys);
|
|
for (var keyIdx in keys) {
|
|
var type = keys[keyIdx];
|
|
if (!cacheHasService(type)) {
|
|
continue;
|
|
}
|
|
steps.push({keys: typedKeys[type], type: type});
|
|
}
|
|
utilRunStack('cleanupCacheKeys',steps, function(typeKey, cb) {
|
|
cacheGetValue(typeKey.type,'keys',function (err,value) {
|
|
if (err !== null) {
|
|
return cb(err);
|
|
}
|
|
if (value === null) {
|
|
return cb(null);
|
|
}
|
|
var diff = [];
|
|
for (var i=0;i<value.length;i++) {
|
|
if (typeKey.keys.indexOf(value[i]) === -1) {
|
|
diff.push(value[i]);
|
|
}
|
|
}
|
|
var valueNew = value;
|
|
for (var i2=0;i2<diff.length;i2++) {
|
|
var keyIdx = valueNew.indexOf(diff[i2]);
|
|
if (keyIdx !== -1) {
|
|
valueNew.splice(keyIdx,1);
|
|
}
|
|
}
|
|
//utilDebug('cleanupCache value1: '+JSON.stringify(value));
|
|
//utilDebug('cleanupCache value2: '+JSON.stringify(valueNew));
|
|
|
|
utilRunStack('cleanupCacheItems',diff, function(key, cb) {
|
|
cacheDeleteValue(typeKey.type,key,cb);
|
|
}, function(err) {
|
|
if (err !== null) {
|
|
return cb(err);
|
|
}
|
|
if (diff.length === 0) {
|
|
cb(null);
|
|
} else {
|
|
cacheSetValue(typeKey.type,'keys',valueNew ,cb);
|
|
}
|
|
});
|
|
});
|
|
}, cb);
|
|
};
|
|
|
|
var injectResourceData = function(resource, data, cb) {
|
|
utilDebug('injectResourceData resource '+JSON.stringify(resource)+' data '+data.length);
|
|
var tag = null;
|
|
if (resource.type === 'css' || resource.type === 'cssData') {
|
|
tag = document.createElement('style');
|
|
tag.type = 'text/css';
|
|
}
|
|
if (resource.type === 'js') {
|
|
tag = document.createElement('script');
|
|
tag.type = 'text/javascript';
|
|
}
|
|
tag.appendChild(document.createTextNode(data));
|
|
|
|
document.getElementsByTagName('head')[0].appendChild(tag);
|
|
//var ref = document.getElementsByTagName('script')[0];
|
|
//ref.parentNode.insertBefore(tag, ref); // note in reverse order
|
|
cb(null);
|
|
};
|
|
|
|
/**
|
|
* Add all cache keys in central list so we can clear the cache item if resources are removed.
|
|
* @param {Object} resource The resource object with the type and hash.
|
|
* @param {function} cb Error first callback when done.
|
|
* @private
|
|
*/
|
|
var storeResourceKey = function (resource, cb) {
|
|
var cacheKey = 'keys';
|
|
cacheGetValue(resource.type,cacheKey,function (err,value) {
|
|
if (err !== null) {
|
|
return cb(err);
|
|
}
|
|
if (value === null) {
|
|
value = [];
|
|
}
|
|
value.push(resource.hash);
|
|
cacheSetValue(resource.type,cacheKey,value, cb);
|
|
});
|
|
};
|
|
|
|
var storeResource = function (resource, httpRequest, cb) {
|
|
utilDebug('storeResource url '+resource.url+' hash '+resource.hash);
|
|
var item = {
|
|
resource: resource,
|
|
data: httpRequest.responseText
|
|
};
|
|
cacheSetValue(resource.type, resource.hash, item , function(err) {
|
|
if (err !== null) {
|
|
cb(err);
|
|
} else {
|
|
storeResourceKey(resource,cb);
|
|
}
|
|
});
|
|
};
|
|
|
|
var loadResource = function (resource, cb) {
|
|
var resourceUrl = resource.url;
|
|
if (resourceUrl.indexOf('http') === -1) {
|
|
resourceUrl = options.server.url + resourceUrl;
|
|
}
|
|
utilDebug('loadResource '+JSON.stringify(resource));
|
|
if (cacheHasService(resource.type)) {
|
|
cacheGetValue(resource.type,resource.hash,function(err, value) {
|
|
if (err !== null) { return cb(err); }
|
|
if (value === null) {
|
|
utilDebug('loadResource cache miss'); // + hash mismatch as its the key
|
|
} else if (value.resource === undefined) {
|
|
utilDebug('loadResource cache wrong obj');
|
|
} else {
|
|
utilDebug('loadResource cache hit');
|
|
injectResourceData(value.resource,value.data,cb);
|
|
return;
|
|
}
|
|
utilHttpFetch(resourceUrl, function(err, httpRequest) {
|
|
if (err !== null) { return cb(err); }
|
|
storeResource(resource, httpRequest, function (err) {
|
|
if (err !== null) { return cb(err); }
|
|
injectResourceData(resource,httpRequest.responseText,cb);
|
|
});
|
|
});
|
|
});
|
|
} else {
|
|
// note: was links but now download + inject so order stays sequenced
|
|
utilHttpFetch(resourceUrl, function(err, httpRequest) {
|
|
if (err !== null) { return cb(err); }
|
|
injectResourceData(resource,httpRequest.responseText,cb);
|
|
});
|
|
}
|
|
};
|
|
|
|
/**
|
|
* Starts loader by downloading resource list or using cache version to
|
|
* load/refresh/inject the resources.
|
|
*
|
|
* @param {function} cb Error first callback when done.
|
|
* @private
|
|
*/
|
|
var startLoader = function (cb) {
|
|
if (options.server.url === null) {
|
|
cb(new Error('No url'));
|
|
return;
|
|
}
|
|
if (options.server.assets === null) {
|
|
cb(new Error('No assets'));
|
|
return;
|
|
}
|
|
rootWindow[options.server.flag] = options.server.url;
|
|
|
|
var resourcesUrl = options.server.url + options.server.assets;
|
|
utilDebug('startLoader assets \"'+resourcesUrl+'\"');
|
|
utilHttpFetch(resourcesUrl, function(err, httpRequest) {
|
|
if (err !== null) {
|
|
utilDebug('startLoader fetch error '+err);
|
|
if (cacheHasService('meta')) {
|
|
cacheGetValue('meta','server_resources',function(err, value) {
|
|
if (err !== null) {
|
|
cb(err);
|
|
} else if (value === null) {
|
|
cb(new Error('Have no cache of server resouces from '+options.server.url));
|
|
} else {
|
|
utilRunStack('injectResources', value, function(resource, cb) {
|
|
cacheGetValue(resource.type,resource.hash,function(err,item) {
|
|
injectResourceData(resource,item.data,cb);
|
|
});
|
|
} , cb);
|
|
}
|
|
});
|
|
} else {
|
|
cb(new Error('Could not fetch server resouces from '+options.server.url));
|
|
}
|
|
return;
|
|
}
|
|
var resources = [];
|
|
JSON.parse(httpRequest.responseText).data.resources.forEach(function (r) {
|
|
resources.push(r);
|
|
});
|
|
utilDebug('startLoader resources '+resources.length);
|
|
if (cacheHasService('meta')) {
|
|
cacheSetValue('meta','server_resources',resources, function (err) {
|
|
if (err !== null) { return cb(err); }
|
|
utilRunStack('loadResources', resources, loadResource , function (err) {
|
|
if (err !== null) { return cb(err); }
|
|
cleanupCache(resources,cb); // only clean when fetched + cached
|
|
});
|
|
});
|
|
} else {
|
|
utilRunStack('loadResources', resources, loadResource , cb);
|
|
}
|
|
});
|
|
};
|
|
|
|
/**
|
|
* Validates the user input url by downloading it.
|
|
*
|
|
* @param {HTMLElement} deleteTag The dom element to remove from the body tag after success.
|
|
* @param {function} cb Error first callback when done.
|
|
* @private
|
|
*/
|
|
var askUrlValidate = function (deleteTag, cb) {
|
|
var inputTag = document.getElementById('serverInput');
|
|
var inputErrorTag = document.getElementById('serverInputError');
|
|
var inputValueRaw = inputTag.value;
|
|
|
|
while (inputErrorTag.firstChild) {
|
|
inputErrorTag.removeChild(inputErrorTag.firstChild);
|
|
}
|
|
|
|
var inputValueHost = null;
|
|
if (inputValueRaw.indexOf("://") >= 0) {
|
|
inputValueHost = inputValueRaw.split('/')[2];
|
|
} else {
|
|
inputValueHost = inputValueRaw.split('/')[0];
|
|
}
|
|
|
|
if (options.question.validate.min.value !== false && inputValueHost.length < options.question.validate.min.value) {
|
|
inputErrorTag.appendChild(document.createTextNode(options.question.validate.min.message));
|
|
return;
|
|
}
|
|
if (options.question.validate.max.value !== false && inputValueHost.length > options.question.validate.max.value) {
|
|
inputErrorTag.appendChild(document.createTextNode(options.question.validate.max.message));
|
|
return;
|
|
}
|
|
if (options.question.validate.regex.value !== false && options.question.validate.regex.value.length !== 0) {
|
|
var regex = new RegExp(options.question.validate.regex.value);
|
|
if (inputValueHost.match(regex) === null) {
|
|
inputErrorTag.appendChild(document.createTextNode(options.question.validate.regex.message));
|
|
return;
|
|
}
|
|
}
|
|
|
|
if (inputValueRaw.indexOf('https') === 0) {
|
|
options.server.url = 'https://' + inputValueHost; // allow user to upgrade to https but not to downgrade to http
|
|
} else {
|
|
options.server.url = options.question.transport + inputValueHost;
|
|
}
|
|
|
|
var resourcesUrl = options.server.url + options.server.assets;
|
|
utilDebug('askUrlStart check assets '+resourcesUrl);
|
|
|
|
// TODO: check headers
|
|
utilHttpFetch(resourcesUrl,function(err, httpRequest) {
|
|
if (err !== null) {
|
|
inputErrorTag.appendChild(document.createTextNode('Error could not get data.'));
|
|
return;
|
|
}
|
|
if (httpRequest.responseText.length === 0) {
|
|
inputErrorTag.appendChild(document.createTextNode('Error Got empty data.'));
|
|
return;
|
|
}
|
|
|
|
deleteTag.setAttribute('class','ffQuestion ffQuestionLoad');
|
|
var clearUi = function(err) {
|
|
if (err !== null) { return cb(err); }
|
|
document.getElementsByTagName('body')[0].removeChild(deleteTag);
|
|
cb(null);
|
|
};
|
|
if (cacheHasService('meta')) {
|
|
cacheSetValue('meta','server_url',options.server.url, function(err) {
|
|
if (err !== null) { return cb(err); }
|
|
startLoader(clearUi);
|
|
});
|
|
} else {
|
|
startLoader(clearUi);
|
|
}
|
|
});
|
|
};
|
|
|
|
/**
|
|
* Creates the ask url ui.
|
|
*
|
|
* @param {function} cb Callback gets called when loader is done.
|
|
* @private
|
|
*/
|
|
var askUrl = function (cb) {
|
|
utilDebug('askUrl create ui');
|
|
|
|
var rootTag = document.createElement('div');
|
|
rootTag.setAttribute('class','ffQuestion');
|
|
|
|
var cssTag = document.createElement('style');
|
|
cssTag.type = 'text/css';
|
|
cssTag.innerHTML = options.question.style;
|
|
rootTag.appendChild(cssTag);
|
|
|
|
var titleTag = document.createElement('h1');
|
|
titleTag.appendChild(document.createTextNode(options.question.title));
|
|
rootTag.appendChild(titleTag);
|
|
|
|
var questionTag = document.createElement('p');
|
|
questionTag.appendChild(document.createTextNode(options.question.text));
|
|
rootTag.appendChild(questionTag);
|
|
|
|
var formTag = document.createElement('div');
|
|
rootTag.appendChild(formTag);
|
|
|
|
// var transportTag = document.createElement('label');
|
|
// transportTag.setAttribute('for','serverInput');
|
|
// transportTag.appendChild(document.createTextNode(options.question.transport));
|
|
// formTag.appendChild(transportTag);
|
|
|
|
var inputTag = document.createElement('input');
|
|
inputTag.type = 'text';
|
|
inputTag.id = 'serverInput';
|
|
inputTag.setAttribute('autofocus','');
|
|
inputTag.setAttribute('onkeydown','if (event.keyCode == 13) {document.getElementById(\'serverSubmit\').click()}');
|
|
formTag.appendChild(inputTag);
|
|
|
|
var submitTag = document.createElement('input');
|
|
submitTag.id = 'serverSubmit';
|
|
submitTag.type = 'submit';
|
|
submitTag.value = options.question.submit;
|
|
submitTag.onclick = function() {askUrlValidate(rootTag,cb);};
|
|
formTag.appendChild(submitTag);
|
|
|
|
var serverErrorTag = document.createElement('div');
|
|
serverErrorTag.id = 'serverInputError';
|
|
serverErrorTag.setAttribute('class','ffQuestionError');
|
|
formTag.appendChild(serverErrorTag);
|
|
|
|
document.getElementsByTagName('body')[0].appendChild(rootTag);
|
|
};
|
|
|
|
/**
|
|
* Starts an cache type by auto selecting if needed and opening it if needed.
|
|
*
|
|
* @param {String} type The cache type to start.
|
|
* @param {function} cb Callback gets called when loader is done.
|
|
* @private
|
|
*/
|
|
var startCacheType = function (type,cb) {
|
|
if (options.cache[type] !== null && options.cache[type] === false) {
|
|
utilDebug('startCacheType '+type+' disabled');
|
|
options.cache[type] = null;
|
|
return cb(null);
|
|
}
|
|
if (options.cache[type] === null) {
|
|
if (factory.detect.cordovaDevice() && factory.detect.sqlitePlugin()) {
|
|
utilDebug('startCacheType auto sqlitePlugin for '+type);
|
|
options.cache[type] = factory.cache.websql({openDatabase: rootWindow.sqlitePlugin});
|
|
} else if (factory.detect.openDatabase()) {
|
|
utilDebug('startCacheType auto openDatabase for '+type);
|
|
options.cache[type] = factory.cache.websql();
|
|
} else if (factory.detect.localStorage()) {
|
|
utilDebug('startCacheType auto localStorage for '+type);
|
|
options.cache[type] = factory.cache.localStorage();
|
|
} else {
|
|
utilDebug('startCacheType '+type+' none');
|
|
}
|
|
}
|
|
if (options.cache[type] !== null && typeof options.cache[type].cacheOpen === 'function') {
|
|
options.cache[type].cacheOpen(cb);
|
|
} else {
|
|
cb(null);
|
|
}
|
|
};
|
|
|
|
/**
|
|
* Starts all cache types.
|
|
*
|
|
* @param {function} cb Callback gets called when loader is done.
|
|
* @private
|
|
*/
|
|
var startCache = function (cb) {
|
|
startCacheType('meta', function(err) {
|
|
if (err !== null) { return cb(err); }
|
|
startCacheType('js', function(err) {
|
|
if (err !== null) { return cb(err); }
|
|
startCacheType('css', function(err) {
|
|
if (err !== null) { return cb(err); }
|
|
startCacheType('cssData', cb);
|
|
});
|
|
});
|
|
});
|
|
};
|
|
|
|
/**
|
|
* Starts the loader.
|
|
*
|
|
* @param {function} cb Optional callback gets called when loader is done.
|
|
*/
|
|
var start = function (cbArgu) {
|
|
var startTime = new Date().getTime();
|
|
var cb = function(err) {
|
|
if (err !== null) {
|
|
options.error.handler(err);
|
|
} else {
|
|
utilDebug('start done in '+(new Date().getTime()-startTime)+' ms.');
|
|
bootAngular(function(err) {
|
|
if (err !== null) { return options.error.handler(err); }
|
|
if (typeof cbArgu === 'function') {
|
|
cbArgu();
|
|
}
|
|
});
|
|
}
|
|
};
|
|
if (options.debug.enable === true) {
|
|
var optionsKeys = Object.keys(options);
|
|
for (var keyId in optionsKeys) {
|
|
var key = optionsKeys[keyId];
|
|
utilDebug('start config '+key+' '+JSON.stringify(options[key]));
|
|
}
|
|
}
|
|
bootCordova(function(err) {
|
|
if (err !== null) { return cb(err); }
|
|
startCache(function(err) {
|
|
if (err !== null) { return cb(err); }
|
|
if (options.server.url !== null) {
|
|
startLoader(cb);
|
|
return;
|
|
}
|
|
if (cacheHasService('meta')) {
|
|
cacheGetValue('meta','server_url',function(err, value) {
|
|
if (err !== null) {
|
|
cb(err);
|
|
} else if (value === undefined || value === null || value === '') {
|
|
askUrl(cb);
|
|
} else {
|
|
options.server.url = value;
|
|
startLoader(cb);
|
|
}
|
|
});
|
|
} else {
|
|
askUrl(cb);
|
|
}
|
|
});
|
|
});
|
|
};
|
|
|
|
/**
|
|
* Clears the server url.
|
|
*
|
|
* @param {function} cb Optional Error first callback gets called when value is deleted.
|
|
*/
|
|
var clearServerUrl = function(cb) {
|
|
if (cb === undefined) {
|
|
cb = function() {};
|
|
}
|
|
if (cacheHasService('meta')) {
|
|
cacheDeleteValue('meta','server_url',function(err) {
|
|
if (err !== null) { return cb(err); }
|
|
setTimeout(function() {cb(null);}); // return next tick so (websql) transaction is flushed before location.reload
|
|
});
|
|
} else {
|
|
cb(null);
|
|
}
|
|
};
|
|
|
|
/**
|
|
* Boots angular modules if enabled.
|
|
*
|
|
* @param {function} cb Error first callback gets called done.
|
|
* @private
|
|
*/
|
|
var bootAngular = function(cb) {
|
|
if (options.boot.angular.enable !== true) {
|
|
utilDebug('bootAngular disabled by options');
|
|
return cb(null);
|
|
}
|
|
if (options.boot.angular.modules.length === 0) {
|
|
utilDebug('bootAngular disabled by no modules');
|
|
return cb(null);
|
|
}
|
|
utilDebug('bootAngular start '+options.boot.angular.modules);
|
|
angular.bootstrap(document, options.boot.angular.modules);
|
|
cb(null);
|
|
};
|
|
|
|
/**
|
|
* Boots cordova applications which want to use the sqllite plugin as cache.
|
|
* Note: On none cordova page it will callback directly.
|
|
* Note: On none cordova device page is will timeout if option is set.
|
|
*
|
|
* @param {function} cb Error first callback gets called device is ready.
|
|
* @private
|
|
*/
|
|
var bootCordova = function(cb) {
|
|
if (options.boot.cordova.enable !== true) {
|
|
utilDebug('bootCordova disabled by options');
|
|
return cb(null);
|
|
}
|
|
if (factory.detect.cordova() !== true) {
|
|
utilDebug('bootCordova disabled by detect');
|
|
return cb(null);
|
|
}
|
|
var startTime = new Date().getTime();
|
|
var bootOnce = function() {
|
|
var callback = cb;
|
|
cb = null;
|
|
utilDebug('bootCordova done in '+(new Date().getTime()-startTime)+' ms.');
|
|
callback(null);
|
|
};
|
|
if (options.boot.cordova.timeout > 0) {
|
|
utilDebug('bootCordova timeout '+options.boot.cordova.timeout);
|
|
setTimeout ( function () {
|
|
utilDebug('bootCordova timeout');
|
|
bootOnce();
|
|
}, options.boot.cordova.timeout);
|
|
}
|
|
document.addEventListener('deviceready', function () {
|
|
rootWindow[options.boot.cordova.flag] = true;
|
|
utilDebug('bootCordova '+options.boot.cordova.flag);
|
|
bootOnce();
|
|
}, false);
|
|
};
|
|
|
|
// Auto fill handlers and return public object.
|
|
options.debug.handler = function(msg) {console.log(msg);};
|
|
options.error.handler = utilErrorHandler;
|
|
return {
|
|
options: options,
|
|
factory: factory,
|
|
start: start,
|
|
clearServerUrl: clearServerUrl
|
|
};
|
|
});
|