Changed the build process it generates a devel and a prod version

of the source, added some screenshots and a sample printout, couple
bugfixes.

Makefile

@@ -1,11 +1,12 @@
 ts    != date +"%Y-%m-%d-%H%M%S"
 dst    = .backup/$(ts)
-src    = js index.html css
+src    = js *.html css
 vers   = js/libs/version.js
 
 all: backup
 	@echo var VERSION = \"$(ts)\" > $(vers);
-	./mksingleton.pl index.html
+	./mksingleton.pl prod index.html
+	./mksingleton.pl dev  index.html
 
 backup:
 	mkdir -p $(dst)

index.html

@@ -15,16 +15,22 @@
   <script type="text/x-handlebars">
     <div class="navbar hidden-print">
       <div class="navbar-inner">
-        <a class="brand" href="#">DigiProof</a>
+	<div class="nav-collapse">
-        <ul class="nav">
+          <a class="brand" href="#">DigiProof</a>
-	  <li>{{#linkTo 'self'}}{{loc _self}}{{/linkTo}}</li>
+          <ul class="nav">
-	  <li>{{#linkTo 'successors'}}{{loc _successors}}{{/linkTo}}</li>
+	    <li>{{#linkTo 'self'}}{{loc _self}}{{/linkTo}}</li>
-          <li>{{#linkTo 'assets'}}{{loc _assets}}{{/linkTo}}</li>
+	    <li>{{#linkTo 'successors'}}{{loc _successors}}{{/linkTo}}</li>
-	  <li>{{#linkTo 'testament'}}{{loc _testament}}{{/linkTo}}</li>
+            <li>{{#linkTo 'assets'}}{{loc _assets}}{{/linkTo}}</li>
-	  <li>{{#linkTo 'data'}}{{loc _data}}{{/linkTo}}</li>
+	    <li>{{#linkTo 'testament'}}{{loc _testament}}{{/linkTo}}</li>
-	  <li>{{#linkTo 'about'}}{{loc _aboutmenu}}{{/linkTo}}</li>
+	    <li>{{#linkTo 'data'}}{{loc _data}}{{/linkTo}}</li>
-        </ul>
+	    <li>{{#linkTo 'about'}}{{loc _aboutmenu}}{{/linkTo}}</li>
-	<span class="pull-right">digiproof version {{VERSION}}</span>
+          </ul>
+	  {{#if isDevel}}
+	  <div class="pull-right img-rounded dpedge-devel">digiproof development version {{VERSION}}</div>
+	  {{else}}
+	  <div class="pull-right img-rounded dpedge-prod">digiproof version {{VERSION}}</div>
+	  {{/if}}
+	</div>
       </div>
     </div>
     {{outlet}}
@@ -67,6 +73,12 @@
 	    </li>
 	  </ol>
 	</div>
+	{{#if isDevel}}
+	<div class="span4">
+	  <h4>Development Version</h4>
+	  <p style="color: #ff8a00">{{loc _devel}}</p>
+	</div>
+	{{/if}}
       </div>
     </div>
   </script>
@@ -776,7 +788,31 @@
      </div>
    </div>
    {{else}}
-     <p>{{clear}}</p>
+     {{#if failed}}
+        <p>{{clear}}</p>
+     {{else}}
+	<div class="row-fluid">
+	  <div class="span2">{{loc _self}}:</div>
+	  <div class="span2"><b>{{self.name}}</b></div>
+	  <div class="span2">{{clear}}</div>
+	</div>
+
+	  {{#each successor in successors}}
+	    <div class="row-fluid">
+	      <div class="span2">{{loc _successor}}:</div>
+	      <div class="span2"><b>{{successor.name}}</b></div>
+	      <div class="span2">{{clear}}</div>
+	    </div>
+	  {{/each}}
+	  {{#each asset in assets}}
+	    <div class="row-fluid">
+	      <div class="span2">{{loc _asset}}:</div>
+	      <div class="span2"><b>{{asset.name}}</b></div>
+	      <div class="span2">{{clear}}</div>
+	    </div>
+	  {{/each}}
+	</ul>
+     {{/if}}
      <p><button class="btn btn-primary btn-default" {{action repeatEditing}}>{{loc _importagain}}</button></p>
    {{/if}}
   </script>
@@ -784,7 +820,6 @@
   <script type="text/x-handlebars" id="data/done">
    <h4>{{loc _import}}</h4>
    <p>{{clear}}</p>
-   <p>{{controller}}</p>
   </script>
 
 
@@ -793,7 +828,7 @@
   <script src="js/libs/handlebars.js"></script>
   <script src="js/libs/ember.js"></script>
   <script src="js/libs/ember-data.js"></script>
-  <script src="js/libs/localstorage_adapter.js"></script>
+  <script src="js/libs/localstorage_adapter_dev.js"></script>
   <script src="js/libs/moment.js"></script>
 
   <script src="js/libs/aes.js"></script>
@@ -817,6 +852,7 @@
   <script src="js/apphelpers.js"></script>
   <script src="js/controllers_asset.js"></script>
   <script src="js/controllers_index.js"></script>
+  <script src="js/controllers_application.js"></script>
   <script src="js/controllers_self.js"></script>
   <script src="js/controllers_successor.js"></script>
   <script src="js/controllers_data.js"></script>

js/apphelpers.js

@@ -74,3 +74,4 @@ function decode64(input) {
     
     return unescape(output);
 }
+

js/confirm.js

@@ -0,0 +1,21 @@
+
+function confirminit() {
+    window.onbeforeunload = function(e) {
+	if(window.confirmExit) return confirmExit();
+    };
+}
+
+var hadConfirmExit = false;
+function checkUnsavedChanges() {
+    if(App.store && App.store.isDirty && window.hadConfirmExit === false) {
+        if(confirm("unsafed changes"))
+            saveChanges();
+    }
+}
+
+function confirmExit() {
+    hadConfirmExit = true;
+    if(App.store && App.store.isDirty) {
+        return "ok";
+    }
+}

js/controllers_application.js

@@ -0,0 +1,7 @@
+
+App.ApplicationController = Ember.Controller.extend({
+    isDevel: isDevel,
+    VERSION: VERSION
+});
+
+

js/controllers_data.js

@@ -126,6 +126,7 @@ App.UploadFileView = Ember.TextField.extend({
 App.DataImportController = Ember.ObjectController.extend({
     isEditing: true,
     clear: '',
+    failed: false,
     errors: {},
 
     doneEditing: function() {
@@ -197,6 +198,15 @@ App.DataImportController = Ember.ObjectController.extend({
 		    // suck it in
 		    ImportJSON(importobj, pass);
 		    this.set('clear', translate('_importdone'));
+		    var isuccessors = [];
+		    $.each(importobj.successors, function(index, obj) {
+			if(obj.id != '0') {
+			    isuccessors.pushObject(obj);
+			}
+		    });
+		    this.set('successors', isuccessors);
+		    this.set('assets',     importobj.assets);
+		    this.set('self',       importobj.self);		    
 		}
 		else {
 		    throw 'decrypted variable $json doesnt contain anything, weird';
@@ -205,12 +215,14 @@ App.DataImportController = Ember.ObjectController.extend({
  	    catch (e) {
 		// console.log("decryption exception: %o", e);
 		this.set('clear', translate('_error_decrypt') + " (" + e + ")");
+		this.set('failed', true);
 	    }
 	}
 	else {
 	    // no password given
 	    this.set('isEditing', true);
 	    this.set('errors', validated);
+	    this.set('failed', true);
 	    this.set('clear', translate('_error_decrypt'));
 	}
     },

js/controllers_index.js

@@ -3,6 +3,7 @@ App.IndexController = Ember.Controller.extend({
     has_self:      App.Self.find(),
     has_asset:     App.Asset.find(),
     has_successor: App.Successor.find(),
+    isDevel: isDevel,
     VERSION: VERSION
 });
 

js/libs/localstorage_adapter_dev.js

@@ -1,3 +1,5 @@
+var isDevel = true;
+
 DS.LSSerializer = DS.JSONSerializer.extend({
 
   addBelongsTo: function(data, record, key, association) {

js/libs/localstorage_adapter_prod.js

@@ -0,0 +1,238 @@
+var isDevel = false;
+
+/*
+ * in the production actual saving to browser
+ * storage on disk is disabled here by overwriting
+ * the setItem and getItem function with dummies,
+ * which hold the data in memory only.
+ */
+localStorage.setItem = function(namespace, json) {
+    this.set('_fakestore') = { namespace: json };
+    return this;
+}
+
+localStorage.getItem = function(namespace) {
+    return this.get('_fakestore').namespace;
+}
+
+DS.LSSerializer = DS.JSONSerializer.extend({
+
+  addBelongsTo: function(data, record, key, association) {
+    data[key] = record.get(key + '.id');
+  },
+
+  addHasMany: function(data, record, key, association) {
+    data[key] = record.get(key).map(function(record) {
+      return record.get('id');
+    });
+  },
+
+  // extract expects a root key, we don't want to save all these keys to
+  // localStorage so we generate the root keys here
+  extract: function(loader, json, type, record) {
+    this._super(loader, this.rootJSON(json, type), type, record);
+  },
+
+  extractMany: function(loader, json, type, records) {
+    this._super(loader, this.rootJSON(json, type, 'pluralize'), type, records);
+  },
+
+  rootJSON: function(json, type, pluralize) {
+    var root = this.rootForType(type);
+    if (pluralize == 'pluralize') { root = this.pluralize(root); }
+    var rootedJSON = {};
+    rootedJSON[root] = json;
+    return rootedJSON;
+  }
+
+});
+
+DS.LSAdapter = DS.Adapter.extend(Ember.Evented, {
+
+  init: function() {
+    this._loadData();
+  },
+
+  generateIdForRecord: function() {
+    return Math.random().toString(32).slice(2).substr(0,5);
+  },
+
+  serializer: DS.LSSerializer.create(),
+
+  find: function(store, type, id) {
+    var namespace = this._namespaceForType(type);
+    this._async(function(){
+      var copy = Ember.copy(namespace.records[id]);
+      this.didFindRecord(store, type, copy, id);
+    });
+  },
+
+  findMany: function(store, type, ids) {
+    var namespace = this._namespaceForType(type);
+    this._async(function(){
+      var results = [];
+      for (var i = 0; i < ids.length; i++) {
+        results.push(Ember.copy(namespace.records[ids[i]]));
+      }
+      this.didFindMany(store, type, results);
+    });
+  },
+
+  // Supports queries that look like this:
+  //
+  //   {
+  //     <property to query>: <value or regex (for strings) to match>,
+  //     ...
+  //   }
+  //
+  // Every property added to the query is an "AND" query, not "OR"
+  //
+  // Example:
+  //
+  //  match records with "complete: true" and the name "foo" or "bar"
+  //
+  //    { complete: true, name: /foo|bar/ }
+  findQuery: function(store, type, query, recordArray) {
+    var namespace = this._namespaceForType(type);
+    this._async(function() {
+      var results = this.query(namespace.records, query);
+      this.didFindQuery(store, type, results, recordArray);
+    });
+  },
+
+  query: function(records, query) {
+    var results = [];
+    var id, record, property, test, push;
+    for (id in records) {
+      record = records[id];
+      for (property in query) {
+        test = query[property];
+        push = false;
+        if (Object.prototype.toString.call(test) == '[object RegExp]') {
+          push = test.test(record[property]);
+        } else {
+          push = record[property] === test;
+        }
+      }
+      if (push) {
+        results.push(record);
+      }
+    }
+    return results;
+  },
+
+  findAll: function(store, type) {
+    var namespace = this._namespaceForType(type);
+    this._async(function() {
+      var results = [];
+      for (var id in namespace.records) {
+        results.push(Ember.copy(namespace.records[id]));
+      }
+      this.didFindAll(store, type, results);
+    });
+  },
+
+  createRecords: function(store, type, records) {
+    var namespace = this._namespaceForType(type);
+    records.forEach(function(record) {
+      this._addRecordToNamespace(namespace, record);
+    }, this);
+    this._async(function() {
+      this._didSaveRecords(store, type, records);
+    });
+  },
+
+  updateRecords: function(store, type, records) {
+    var namespace = this._namespaceForType(type);
+    this._async(function() {
+      records.forEach(function(record) {
+        var id = record.get('id');
+        namespace.records[id] = record.serialize({includeId:true});
+      }, this);
+      this._didSaveRecords(store, type, records);
+    });
+  },
+
+  deleteRecords: function(store, type, records) {
+    var namespace = this._namespaceForType(type);
+    this._async(function() {
+      records.forEach(function(record) {
+        var id = record.get('id');
+        delete namespace.records[id];
+      });
+      this._didSaveRecords(store, type, records);
+    });
+
+  },
+
+  dirtyRecordsForHasManyChange: function(dirtySet, parent, relationship) {
+    dirtySet.add(parent);
+  },
+
+  dirtyRecordsForBelongsToChange: function(dirtySet, child, relationship) {
+    dirtySet.add(child);
+  },
+
+  // private
+
+  _getNamespace: function() {
+    return this.namespace || 'DS.LSAdapter';
+  },
+
+  _loadData: function() {
+      try {
+	  var storage = localStorage.getItem(this._getNamespace());
+	  this._data = storage ? JSON.parse(storage) : {};
+      }
+      catch(e) {
+	  this._data = {};
+      }
+  },
+
+  _didSaveRecords: function(store, type, records) {
+    var success = this._saveData();
+    if (success) {
+      store.didSaveRecords(records);
+    } else {
+      records.forEach(function(record) {
+        store.recordWasError(record);
+      });
+      this.trigger('QUOTA_EXCEEDED_ERR', records);
+    }
+  },
+
+  _saveData: function() {
+      try {
+	  localStorage.setItem(this._getNamespace(), JSON.stringify(this._data));
+	  return true;
+      }
+      catch(error) {
+	  if (error.name == 'QUOTA_EXCEEDED_ERR') {
+              return false;
+	  } else {
+              // IE, Ignore. throw new Error(error);
+	  }
+      }
+  },
+
+  _namespaceForType: function(type) {
+    var namespace = type.url || type.toString();
+    return this._data[namespace] || (
+      this._data[namespace] = {records: {}}
+    );
+  },
+
+  _addRecordToNamespace: function(namespace, record) {
+    var data = record.serialize({includeId: true});
+    namespace.records[data.id] = data;
+  },
+
+  _async: function(callback) {
+    var _this = this;
+    setTimeout(function(){
+      Ember.run(_this, callback);
+    }, 1);
+  }
+
+});
+

js/libs/version.js

@@ -1 +1 @@
-var VERSION = "2013-09-13-080748"
+var VERSION = "2013-09-13-155304"

js/locale.js

@@ -113,7 +113,10 @@ window.locale = {
 	    +"into the notes field below.",
 	"_aboutmenu": "About Digiproof",
 	"_about": "This is DigiProof, a JavaScript App to create a digital testament by Thomas Linden. Copyright (c) 2013. "
-	    +"Licensed under the terms of the General Public License Version 2."
+	    +"Licensed under the terms of the General Public License Version 2.",
+	"_devel": "Caution! This is the development version of DigiProof. It stores data to local disk using the browsers "
+	    +"localStorage feature. So, whatever you enter, persists over sessions, is unencrypted and can be viewed by anyone "
+	    +"with access to this device. Use for testing/developing purposes only and don't ever enter production account informations!"
     },
 
     "de": {
@@ -233,7 +236,11 @@ window.locale = {
 	    +"dazugehörige Ergänzungen hinzufügen.",
 	"_aboutmenu": "Über Digiproof",
 	"_about": "Dies ist DigiProof, eine Javascript App zum Erstellen eines digitalen Testaments von Thomas Linden. Copyright (c) 2013. "
-	    +"Veröffentlicht unter der General Public License Version 2."
+	    +"Veröffentlicht unter der General Public License Version 2.",
+	"_devel": "Achtung! Dies ist die Entwicklerversion von DigiProof. Eingegebene Daten werden auf der lokalen Festplatte "
+	    +"unter Verwendung des localStorage Features Ihres Browsers gespeichert. Was immer Sie eingeben, bleibt über Browsersitzungen "
+	    +"hinweg erhalten, ist nicht verschlüsselt und kann von jedem mit Zugriff auf das System gelesen werden. Verwenden Sie "
+	    +"diese Version ausschliesslich für Test- oder Entwicklungszwecke und geben Sie niemals echte Accountinformationen ein!"
     }
 };
 

mksingleton.pl

@@ -3,14 +3,14 @@ use Data::Dumper;
 use JavaScript::Minifier qw(minify);
 use CSS::Compressor qw( css_compress );
 
-my $index = shift;
+my ($type, $index) = @ARGV;
 
 if (!$index) {
-  print STDERR "Usage: $0 <index.html>\n";
+  print STDERR "Usage: $0 <prod|dev> <index.html>\n";
   exit 1;
 }
 
-my $out = "digiproof.html";
+my $out = "digiproof-$type.html";
 
 print STDERR "open index\n";
 open I, "<$index" or die "Could not open index: $index $!\n";
@@ -38,6 +38,9 @@ foreach (@source) {
   }
   elsif (/script src="([^"]*)"/) {
     my $jsfile = $1;
+    if ($jsfile =~ /localstorage/) {
+      $jsfile = "js/libs/localstorage_adapter_$type.js";
+    }
     print STDERR "Inserting $jsfile\n";
     print qq(<script type="text/javascript">\n);
     print &fetch($jsfile);
@@ -55,16 +58,30 @@ sub fetch {
   my $file = shift;
   open F, "<$file" or die "Could not open index: $file $!\n";
   if($file =~ /\.js/) {
-    my $js =  minify(input => *F);
+    my $js;
-    # ember.js (and probably others) contain strings which contain </script>
+    my $from = "/* js from $file */\n";
-    # which leads to rendering failures, those will be fixed here
+    if ($type eq 'prod') {
-    $js =~ s/<\/script>/' + Slash + 'script>/g;
+      $js =  minify(input => *F);
-    close F;
+      # ember.js (and probably others) contain strings which contain </script>
-    return "/* js from $file */\n" . $js;
+      # which leads to rendering failures, those will be fixed here
+      $js =~ s/<\/script>/' + Slash + 'script>/g;
+      close F;
+      return $from . $js;
+    }
+    else {
+      return $from . join '', <F>;
+      close F;
+    }
   }
   else {
+    my $from = "/* css from $file */\n";
     my $src = join "", <F>;
     close F;
-    return  "/* css from $file */\n" . css_compress($src);
+    if ($prod) {
+      return $from . $src;
+    }
+    else {
+      return $from . css_compress($src);
+    }
   }
 }