added save/load actions (c-s/c-o), still not done and need more testing...

Signed-off-by: Alex A. Naanou <alex.nanou@gmail.com>

index.html

@@ -84,9 +84,9 @@
 <script src="ext-lib/spin.js"></script>
 <script src="ext-lib/jquery.spin.js"></script>
 <!-- zip functionality -->
-<!--script src="ext-lib/jszip.js"></script>
+<script src="ext-lib/jszip.js"></script>
 <script src="ext-lib/jszip-load.js"></script>
-<script src="ext-lib/jszip-inflate.js"></script-->
+<script src="ext-lib/jszip-inflate.js"></script>
 <!--script src="ext-lib\jszip-deflate.js"></script-->
 
 <script src="lib/jli.js"></script>
@@ -143,6 +143,101 @@ function showInfo(){
 		'</div>'))
 }
 
+
+
+// setup download link...
+var USE_ZIP = true
+var USE_DATA_URL = true
+function generateMagazineDownload(){
+	var zip = new JSZip()
+	var json = JSON.stringify(buildJSON(true, true))
+					// this is a really odd one, Chrome seems to replace some 
+					// entities with actual chars...
+					// what is even more odd, this then confuses some unicode
+					// readers/wwriters...
+					.replace(/–/g, '&ndash;')
+	if(USE_ZIP){
+		zip.file('magazine.json', json)
+		var content = zip.generate()
+	} else {
+		var content = btoa(json)
+	}
+	if(USE_DATA_URL){
+		$('#data_download')
+			.attr('href','data:text/octet-stream;base64,'+content)
+			.css('display', 'inline')
+		if(USE_ZIP){
+			$('#data_download')
+				.attr('download','magazine.zip')
+		} else {
+			$('#data_download')
+				.attr('download','magazine.json')
+		}
+	} else {
+		location.href="data:application/zip;base64,"+content
+	}
+}
+
+/*
+// util...
+// from: http://stackoverflow.com/a/11058858
+function ab2str(buf) {
+  return String.fromCharCode.apply(null, new Uint16Array(buf));
+}
+
+function str2ab(str) {
+  var buf = new ArrayBuffer(str.length*2); // 2 bytes for each char
+  var bufView = new Uint16Array(buf);
+  for (var i=0, strLen=str.length; i<strLen; i++) {
+	bufView[i] = str.charCodeAt(i);
+  }
+  return buf;
+}
+*/
+
+
+// upload...
+function handleFileSelect(evt) {
+	var files = evt.target.files; // FileList object
+
+	// Loop through the FileList and render image files as thumbnails.
+	for (var i = 0, f; f = files[i]; i++) {
+
+		var reader = new FileReader();
+
+		// Closure to capture the file information.
+		reader.onload = (function(theFile) {
+			return function(e) {
+					console.log('loading...')
+					var raw_data = e.target.result
+					window.JSON_DATA = raw_data
+
+					if(USE_ZIP){
+						var zip = new JSZip(raw_data)
+						console.log('zip loaded...')
+						var json = zip.file('magazine.json').data
+					} else {
+						var json = raw_data
+					}
+
+
+					loadJSON($.parseJSON(json), true)
+					console.log('done.')
+				};
+		})(f);
+
+		// Read in the image file as a data URL.
+		if(USE_ZIP){
+			reader.readAsArrayBuffer(f)
+		} else {
+			reader.readAsBinaryString(f)
+		}
+		//reader.readAsText(f)
+	}
+}
+
+
+
 var KEYBOARD_CONFIG = {
 	'.overlay': {
 		title: 'Overlay mode.',
@@ -185,6 +280,28 @@ var KEYBOARD_CONFIG = {
 						getPageTargetScale(PAGES_IN_RIBBON*2)))
 				setCurrentPage(n)
 			},
+
+		'O': {
+				// load...
+				// XXX needs testing...
+				'ctrl': function(){
+					showInOverlay('<h1>Open Issue</h1>'+
+						'<input type="file" id="upload" name="file" multiple onchange="handleFileSelect(event)"/>')
+				},
+			},
+		'S': {
+				// save...
+				// XXX needs testing...
+				'ctrl': function(){
+					showInOverlay('<h1>Save Issue</h1>'+
+						'<p>NOTE: this download will not include the actual '+
+						'images. at this point, images should be added manually.</p>'+
+						'<p><a id="data_download" href="#">Download</a></p>')
+
+					// setup the data...
+					$(generateMagazineDownload)
+				},
+			},
 	},
 
 	// ignore all keys except Esc here...

lib/keyboard.js

@@ -14,7 +14,7 @@
 // toKeyName(<code>) and toKeyCode(<name>) for a more uniform access.
 //
 // NOTE: these are un-shifted ASCII key names rather than actual key 
-// 		code values.
+// 		code translations.
 // NOTE: ASCII letters (capital) are not present because they actually 
 // 		match their key codes and are accessible via:
 // 			String.fromCharCode(<code>) or <letter>.charCodeAt(0)
@@ -38,16 +38,16 @@ var _SPECIAL_KEYS = {
 	114:	'F3',		118:	'F7',		122:	'F11',
 	115:	'F4',		119:	'F8',		123:	'F12',
 
-	// number row..
+	// Number row..
 	49: '1',	50: '2',	51: '3',	52: '4',	53: '5',
 	54: '6', 	55: '7',	56: '8',	57: '9',	48: '0',
 
-	// punctuation...
+	// Punctuation...
 	// top row...
-	192: '`',	189: '-',	187: '=',
+	192: '`',		/* Numbers */		189: '-',	187: '=',
 	// right side of keyboard...
-	219: '[',	221: ']',	220: '\\',
-	186: ';',	222: '\'',
+				219: '[',	221: ']',	220: '\\',
+				186: ';',	222: '\'',
 	188: ',',	190: '.',	191: '/',
 }