diff options
-rw-r--r-- | config.xml-example | 1 | ||||
-rwxr-xr-x | scripts/prepare_index_html.js | 33 | ||||
-rw-r--r-- | www/index.html | 61 | ||||
-rw-r--r-- | www/js/config.js-example | 5 |
4 files changed, 62 insertions, 38 deletions
diff --git a/config.xml-example b/config.xml-example index 4719c1e..db64ef0 100644 --- a/config.xml-example +++ b/config.xml-example @@ -105,5 +105,6 @@ <plugin name="cordova-plugin-whitelist" spec="~1.2.1" /> <plugin name="ionic-plugin-keyboard" spec="~2.0.1" /> <engine name="android" spec="~5.1.1" /> + <hook src="scripts/prepare_index_html.js" type="after_prepare" /> </widget> diff --git a/scripts/prepare_index_html.js b/scripts/prepare_index_html.js new file mode 100755 index 0000000..379b0d9 --- /dev/null +++ b/scripts/prepare_index_html.js @@ -0,0 +1,33 @@ +#!/usr/bin/env node + +// This script is run as a hook by Cordova, it's not intended for manual +// execution. + +var fs = require('fs'); +var path = require('path'); +var _ = require("../www/jslib/lodash.min.js"); + +function processTemplate(filename, context) { + // Reads a file, processes it as a lodash template with the given context, + // and writes the result back to the original file. + var data = fs.readFileSync(filename, 'utf8'); + var template = _.template(data); + var result = template(context); + fs.writeFileSync(filename, result, 'utf8'); +} + +module.exports = function(context) { + var CONFIG = require("../www/js/config.js"); + + var files = [ + "platforms/android/assets/www/index.html", + "platforms/ios/www/index.html", + ]; + files.forEach(function(file) { + if (fs.existsSync(file)) { + processTemplate(file, {CONFIG: CONFIG}); + } else { + console.log("file didn't exist: ", file); + } + }); +} diff --git a/www/index.html b/www/index.html index 21837d2..aae1e71 100644 --- a/www/index.html +++ b/www/index.html @@ -1,19 +1,18 @@ <!DOCTYPE html> <html> + <!-- Whilst it looks like a normal lodash template, this file is + pre-processed by Cordova during the app build process, not at run time. + The `scripts/prepare_index_html.js` file is run as an after_prepare + hook, and templates this file with the CONFIG object from + `www/js/config.js`. + --> <head> <title></title> <meta name="viewport" content="width=device-width, initial-scale=1.0, maximum-scale=1.0, user-scalable=no" /> <meta charset="utf-8"> - <script type="text/javascript"> - function add_script(s) { - var script = document.createElement("script"); - script.src = s; - $('head').prepend(script); - } - </script> <script type="text/javascript" src="jslib/jquery-1.9.1.min.js"></script> - <!--<link rel="stylesheet" href="css/jquery.mobile-1.3.1.min.css">--> + <script type="text/javascript"> var css; if (navigator.userAgent.match(/(iPhone|iPod|iPad)/)) { @@ -26,13 +25,16 @@ linkElement.type = "text/css"; linkElement.rel = 'stylesheet'; $('head').prepend(linkElement); - // alert(css); </script> <link rel="stylesheet" href="css/fms-jquerymobile.css" type="text/css" media="screen" title="no title" charset="utf-8"> <link rel="stylesheet" href="css/normalize.css" type="text/css" media="screen" title="no title" charset="utf-8"> <link rel="stylesheet" href="css/fms.css" type="text/css" media="screen" title="no title" charset="utf-8"> + <% if ( CONFIG.COBRAND ) { %> + <link rel="stylesheet" href="cobrands/<%= CONFIG.COBRAND %>/css/style.css" type="text/css" media="screen" title="no title" charset="utf-8"> + <% } %> + <script type="text/javascript"> var FMS = {}; </script> @@ -42,11 +44,9 @@ <script type="text/javascript" src="js/mobile_config.js"></script> <script type="text/javascript" src="jslib/jquery.mobile-1.3.1.min.js"></script> <script type="text/javascript" src="jslib/moment-2.0.0.min.js"></script> - <script type="text/javascript"> - if (CONFIG && CONFIG.LANGUAGE == 'sv') { - add_script('jslib/moment-2.0.0.sv.min.js'); - } - </script> + <% if ( CONFIG.LANGUAGE === 'sv' ) { %> + <script type="text/javascript" src="jslib/moment-2.0.0.sv.min.js"></script> + <% } %> <script type="text/javascript" src="cordova.js"></script> @@ -60,21 +60,17 @@ <script type="text/javascript" src="js/OpenLayers.fixmystreet.js"></script> <script type="text/javascript" src="js/map-OpenLayers.js"></script> - <script type="text/javascript"> - if (CONFIG && CONFIG.MAP_TYPE == 'FMS') { - add_script("js/map-bing-ol.js"); - add_script("js/map-fms.js"); - } else if (CONFIG && CONFIG.MAP_TYPE == 'Bing') { - add_script("js/map-bing-ol.js"); - } else { - add_script("js/map-OpenStreetMap.js"); - } - </script> + <% if ( CONFIG.MAP_TYPE === "FMS" ) { %> + <script type="text/javascript" src="js/map-bing-ol.js"></script> + <script type="text/javascript" src="js/map-fms.js"></script> + <% } else if ( CONFIG.MAP_TYPE === "Bing" ) { %> + <script type="text/javascript" src="js/map-bing-ol.js"></script> + <% } else { %> + <script type="text/javascript" src="js/map-OpenStreetMap.js"></script> + <% } %> <script type="text/javascript" src="js/locate.js"></script> - <script type="text/javascript"> - add_script("js/strings."+CONFIG.LANGUAGE+".js"); - </script> + <script type="text/javascript" src="js/strings.<%= CONFIG.LANGUAGE %>.js"></script> <script type="text/javascript" src="js/files.js"></script> @@ -117,17 +113,6 @@ }; </script> - - <script type="text/javascript"> - // Include the cobrand's CSS, if CONFIG.COBRAND is set - if (CONFIG && CONFIG.COBRAND) { - var linkElement = document.createElement("link"); - linkElement.href = 'cobrands/' + CONFIG.COBRAND + '/css/style.css'; - linkElement.type = "text/css"; - linkElement.rel = 'stylesheet'; - $('head').append(linkElement); - } - </script> </head> <body onload="onload()"> <div id="map_box"> diff --git a/www/js/config.js-example b/www/js/config.js-example index c2d3f71..aa9296b 100644 --- a/www/js/config.js-example +++ b/www/js/config.js-example @@ -36,3 +36,8 @@ var CONFIG = { // Bing Maps API key if needed BING_MAPS_API_KEY: '' }; + + +// This bit is so this can be imported as a nodejs module for hook processing +var module = module || {}; +module.exports = CONFIG; |