Fixed example

.gitignore

@@ -12,8 +12,7 @@ test/data
 # Ignore example data
 example/node_modules
 example/npm-debug.log
-example/www_static/css/lib
+example/mobile_app
-example/www_static/js/lib
 
 # Ignore binary files
 *.o

es5-ff-spa-loader.js

@@ -173,7 +173,7 @@ var FFSpaLoader = (/** @lends module:FFSpaLoader */function () {
 						var query = 'CREATE TABLE cache_store(id INTEGER PRIMARY KEY AUTOINCREMENT, key TEXT NOT NULL, value TEXT NOT NULL)';
 						utilDebug('websql.init query: '+query);
 						tx.executeSql(query, [], function(tx,res) {
-							var query = 'CREATE UNIQUE INDEX cache_store__key__udx ON TABLE cache_store';
+							var query = 'CREATE UNIQUE INDEX cache_store__key__udx ON cache_store (key)';
 							utilDebug('websql.init query: '+query);
 							tx.executeSql(query, [], function(tx,res) {}, sqlErrorHandler(options.errorHandler)); // FIX<E: asyns error ?
 						}, sqlErrorHandler(options.errorHandler));	
@@ -664,6 +664,23 @@ var FFSpaLoader = (/** @lends module:FFSpaLoader */function () {
 		}
 	};
 	
+	var clearServer = function(cb) {
+		if (cb === undefined) {
+			cb = function() {};
+		}
+		if (cacheHasService('meta')) {
+			cacheDeleteValue('meta','server_url',function(err) {
+				if (err !== null) {
+					cb(err);
+				} else {
+					cb(null);
+				}
+			});
+		} else {
+			cb(null);
+		}
+	}
+	
 	/**
      * Helper for automatic selecting the best to none cache backend option.
      * 
@@ -725,6 +742,7 @@ var FFSpaLoader = (/** @lends module:FFSpaLoader */function () {
 		factory: factory,
 		start: start,
 		bootDevice: bootDevice,
-		autoSelectCache: autoSelectCache
+		autoSelectCache: autoSelectCache,
+		clearServer: clearServer
 	};
 })();

example/example.js

@@ -6,9 +6,10 @@ var fs       = require('fs');
 var minify   = require('minify');
 var fetch    = require('fetch');
 var cors     = require('cors');
+var morgan   = require('morgan')
 
 // example options;
-var serverUrl = 'http://localhost:8080';
+var serverUrl = 'http://10.11.12.216:8080';
 var useInline = true; // or false
 
 var clientResourcesWeb = [];
@@ -34,7 +35,6 @@ var stringHash = function (str) {
 var fetchHashResource = function(fetchEntry,cb) {
 	fetch.fetchUrl(serverUrl + fetchEntry.url,function(err, meta, data) {
 		if (err !== null) { return cb(err); }
-		console.log('fetched url: '+fetchEntry.url+' length: '+meta.responseHeaders['content-length']);
 		var assetHash = stringHash(''+data);
 		clientResourcesWeb.push({
 			url: fetchEntry.url,
@@ -100,8 +100,6 @@ function renderIndex(server) {
 	};
 }
 
-
-
 addClientResource('/static/module/jquery/jquery.js','js');
 addClientResource('/static/module/angular/angular.js','js');
 addClientResource('/static/module/angular-route/angular-route.js','js');
@@ -115,6 +113,7 @@ addClientResource('/static/js/controller/page-foo.js','js');
 addClientResource('/static/js/controller/page-index.js','js');
 
 var server = express();
+server.use(morgan('dev'))
 server.use(cors({credentials: true, origin: '*'}));
 server.set('view engine', 'ejs');
 server.set('views',                                       path.join(__dirname,'www_views'));

example/package.json

@@ -15,6 +15,7 @@
     "express": "4.11.x",
     "fetch": "0.3.x",
     "jquery": "^2.1.4",
-    "minify": "^2.0.2"
+    "minify": "^2.0.2",
+    "morgan": "^1.6.1"
   }
 }

example/www_static/css/boot.css

@@ -1,13 +1,7 @@
 
-body {
-	margin-top: 100px;
-	background-color: #222;
-}
-
-@media ( min-width :768px) {
 body {
 	margin-top: 50px;
-	}
+	background-color: #222;
 }
 
 #wrapper {
@@ -16,25 +10,14 @@ body {
 
 #page-wrapper {
 	width: 100%;
-	padding: 0;
+	padding: 10px;
 	background-color: #fff;
 }
 
 .huge {
 	font-size: 50px;
-	line-height: normal;
 }
 
-@media ( min-width :768px) {
-	#wrapper {
-		padding-left: 225px;
-	}
-	#page-wrapper {
-		padding: 10px;
-	}
-}
-
-/* Top Navigation */
 .top-nav {
 	padding: 0 15px;
 }
@@ -134,7 +117,3 @@ ul.alert-dropdown {
 .side-nav>li>ul>li>a:hover {
 	color: #fff;
 }
-
-.huge {
-	font-size: 40px;
-}

example/www_static/css/style.css

@@ -42,3 +42,18 @@
 	background-color: #C110D8;
 }
 
+@media	only screen and (-webkit-min-device-pixel-ratio: 1.3),
+		only screen and (-o-min-device-pixel-ratio: 13/10),
+		only screen and (min-resolution: 120dpi) {
+		
+		body {
+        	font-size:1.8em !important;
+    	}
+		
+		@media screen and (min-width: 1440px) {
+    		body {
+        		font-size:2em !important;
+    		}
+		}
+}
+

example/www_static/js/controller/page-foo.js

@@ -1,10 +1,22 @@
 
+var tpl = '<div><h2>Foo</h2><p>Welcome to the foo.</p></div>';
+tpl += '<input type=\"button\" class=\"btn btn-default\" ng-click=\"doReboot()\" value=\"Reboot\"></input>';
+tpl += '<input type=\"button\" class=\"btn btn-default\" ng-click=\"doClearServer()\" value=\"Clear Server\"></input>';
+
 pageRouteInit.push(function ($routeProvider, $locationProvider) {
 	$routeProvider.when('/example-ui/foo', {
-		template: '<div><h2>Foo</h2><p>Welcome to the foo.</p></div>',
+		template: tpl,
 		controller: PageFoo
 	});
 });
 
-function PageFoo($scope, $http) {
+function PageFoo($scope) {
+	$scope.doReboot = function ( path ) {
+  		window.location.reload(true);
+	};
+	
+	$scope.doClearServer = function ( path ) {
+		FFSpaLoader.clearServer();
+  		window.location.reload(true);
+	};
 }

example/www_static/js/example-app.js

@@ -5,18 +5,23 @@ var serverUrl = window.FFServerUrl;
 console.log('FF provided serverUrl: '+serverUrl);
 
 $(document.createElement('div')).attr('id', 'wrapper').appendTo($('body'));
-$(document.createElement('div')).attr('ng-include', '\''+serverUrl+'/example-ui/thtml/header\'').appendTo($('#wrapper'));
+$(document.createElement('div')).attr('ng-controller', 'ApplicationController').attr('ng-include', '\''+serverUrl+'/example-ui/thtml/header\'').appendTo($('#wrapper'));
 $(document.createElement('div')).attr('id', 'page-wrapper').appendTo($('#wrapper'));
 $(document.createElement('div')).attr('id', 'container-fluid').attr('ng-view', '').appendTo($('#page-wrapper'));
 $(document.createElement('div')).attr('ng-include', '\''+serverUrl+'/example-ui/thtml/footer\'').appendTo($('body'));
 
 var pageRouteInit = [];
-angular.module('exampleUI', ['ngRoute']).config(
+var exampleUI = angular.module('exampleUI', ['ngRoute']).config(
-	['$routeProvider', '$locationProvider', function
+	['$routeProvider','$locationProvider','$sceDelegateProvider', function
-	 ($routeProvider, $locationProvider) {
+	 ($routeProvider , $locationProvider , $sceDelegateProvider) {
-		
 		pageRouteInit.forEach(function(init) { init($routeProvider, $locationProvider); });
+		$sceDelegateProvider.resourceUrlWhitelist(['self',serverUrl+'/**']);
 		$routeProvider.otherwise({ redirectTo: '/example-ui' });
-	$locationProvider.html5Mode({enabled: true, requireBase: false});
+		$locationProvider.html5Mode({requireBase: false});
 }]);
 
+exampleUI.controller('ApplicationController',function($scope,$http,$location) {
+	$scope.goLink = function ( path ) {
+  		$location.path( path );
+	};
+});

example/www_views/thtml/header.ejs

@@ -6,8 +6,8 @@
 			<span class="icon-bar"></span>
 			<span class="icon-bar"></span>
 		</button>
-		<a class="navbar-brand" href="/example-ui/">Home</a>
+		<a class="navbar-brand" ng-click="goLink('/example-ui/')">Home</a>
-		<a class="navbar-brand" href="/example-ui/foo">Foo</a>
+		<a class="navbar-brand" ng-click="goLink('/example-ui/foo')">Foo</a>
-		<a class="navbar-brand" href="/example-ui/bar">Bar</a>
+		<a class="navbar-brand" ng-click="goLink('/example-ui/bar')">Bar</a>
 	</div>
 </nav>