From 73d4e60ef9841bdfb9409b1790f8021059cf10be Mon Sep 17 00:00:00 2001 From: Vilius Date: Sun, 21 Aug 2016 18:15:35 +0300 Subject: [PATCH] quicksave, quickload support --- index.html | 3 ++ js/events.js | 16 +++++++--- js/file.js | 86 +++++++++++++++++++++++++++++++--------------------- js/help.js | 16 +++++----- 4 files changed, 72 insertions(+), 49 deletions(-) diff --git a/index.html b/index.html index 1bd9fbc..a3aec17 100644 --- a/index.html +++ b/index.html @@ -109,6 +109,9 @@
  • Open
  • Save as
  • Print
    • +
    • +
  • Quick save
    • +
  • Quick load
  • diff --git a/js/events.js b/js/events.js index a1a193a..690077b 100644 --- a/js/events.js +++ b/js/events.js @@ -137,7 +137,17 @@ function EVENTS_CLASS() { EVENTS.command_pressed = true; EVENTS.ctrl_pressed = true; } - + + //F9 + if (k == 120) { + FILE.file_quicksave(); + } + + //F10 + if (k == 121) { + FILE.file_quickload(); + } + //up if (k == 38) { if (DRAW.active_tool == 'select_tool') { @@ -197,10 +207,6 @@ function EVENTS_CLASS() { EDIT.save_state(); IMAGE.trim(); } - //o - open - else if (k == 79){ - FILE.open(); - } //s - save else if (k == 83) { if (POP != undefined) diff --git a/js/file.js b/js/file.js index e23993d..6cb5f3d 100644 --- a/js/file.js +++ b/js/file.js @@ -185,9 +185,6 @@ function FILE_CLASS() { fname = user_response.name; var tempCanvas = document.createElement("canvas"); var tempCtx = tempCanvas.getContext("2d"); - var save_mode_for_ie = false; - if(window.Blob && window.navigator.msSaveOrOpenBlob && window.FileReader) - save_mode_for_ie = true; tempCanvas.width = WIDTH; tempCanvas.height = HEIGHT; @@ -298,38 +295,8 @@ function FILE_CLASS() { if (HELPER.strpos(fname, '.json') == false) fname = fname + ".json"; - var export_data = {}; - - //basic info - export_data.info = { - width: WIDTH, - height: HEIGHT, - }; - - //layers - export_data.layers = []; - for(var i = LAYER.layers.length-1; i >=0; i--){ - var layer = { - name:LAYER.layers[i].name, - title:LAYER.layers[i].title, - visible: 1, - opacity: LAYER.layers[i].opacity, - }; - if (LAYER.layers[i].visible == false) - layer.visible = 0; - export_data.layers.push(layer); - } - - //image data - export_data.image_data = []; - for(var i = LAYER.layers.length-1; i >=0; i--){ - var data_tmp = document.getElementById(LAYER.layers[i].name).toDataURL("image/png"); - export_data.image_data.push({name: LAYER.layers[i].name, data: data_tmp}); - } - - var data_json = JSON.stringify(export_data, null, 6); - delete export_data; - + var data_json = this.export_as_json(); + var blob = new Blob([data_json], {type: "text/plain"}); //var data = window.URL.createObjectURL(blob); //html5 saveAs(blob, fname); @@ -381,6 +348,42 @@ function FILE_CLASS() { FILE.file_info.general['Last modified'] = object.lastModifiedDate; }; + this.export_as_json = function(){ + var export_data = {}; + + //basic info + export_data.info = { + width: WIDTH, + height: HEIGHT, + }; + + //layers + export_data.layers = []; + for(var i = LAYER.layers.length-1; i >=0; i--){ + var layer = { + name:LAYER.layers[i].name, + title:LAYER.layers[i].title, + visible: 1, + opacity: LAYER.layers[i].opacity, + }; + if (LAYER.layers[i].visible == false) + layer.visible = 0; + export_data.layers.push(layer); + } + + //image data + export_data.image_data = []; + for(var i = LAYER.layers.length-1; i >=0; i--){ + var data_tmp = document.getElementById(LAYER.layers[i].name).toDataURL("image/png"); + export_data.image_data.push({name: LAYER.layers[i].name, data: data_tmp}); + } + + var data_json = JSON.stringify(export_data, null, 6); + delete export_data; + + return data_json; + }; + this.load_json = function (data) { var json = JSON.parse(data); @@ -429,5 +432,18 @@ function FILE_CLASS() { img.src = data; } }; + + this.file_quicksave = function(){ + var data_json = this.export_as_json(); + localStorage.setItem('quicksave_data', data_json); + }; + + this.file_quickload = function(){ + var json = localStorage.getItem('quicksave_data'); + if(json == '' || json == null){ + return false; + } + this.load_json(json); + }; } \ No newline at end of file diff --git a/js/help.js b/js/help.js index 08d2bd7..9f97f42 100644 --- a/js/help.js +++ b/js/help.js @@ -12,25 +12,23 @@ function HELP_CLASS() { //shortcuts this.help_shortcuts = function () { - POP.add({title: "D", value: 'Dublicate'}); + POP.add({title: "F9", value: 'Quck save'}); + POP.add({title: "F10", value: 'Quick load'}); + POP.add({title: "S", value: 'Save'}); + POP.add({title: "T", value: 'Trim'}); + POP.add({title: "D", value: 'Dublicate layer'}); POP.add({title: "Del", value: 'Delete selection'}); POP.add({title: "F", value: 'Auto adjust colors'}); POP.add({title: "G", value: 'Grid on/off'}); POP.add({title: "L", value: 'Rotate left'}); POP.add({title: "N", value: 'New layer'}); - POP.add({title: "O", value: 'Open file(s)'}); POP.add({title: "R", value: 'Resize'}); - POP.add({title: "S", value: 'Save'}); - POP.add({title: "T", value: 'Trim'}); POP.add({title: "-", value: 'Zoom out'}); POP.add({title: "+", value: 'Zoom in'}); POP.add({title: "CTRL + Z", value: 'Undo'}); POP.add({title: "CTRL + A", value: 'Select all'}); POP.add({title: "CTRL + V", value: 'Paste'}); - POP.add({title: "Arrow keys", value: 'Move active layer by 10px'}); - POP.add({title: "CTRL + Arrow keys", value: 'Move active layer by 50px'}); - POP.add({title: "SHIFT + Arrow keys", value: 'Move active layer by 1px'}); - POP.add({title: "Drag & Drop", value: 'Imports images'}); + POP.add({title: "Arrow keys", value: 'Move active layer'}); POP.show('Keyboard Shortcuts', ''); }; //about @@ -40,7 +38,7 @@ function HELP_CLASS() { POP.add({title: "Description:", value: 'Online image editor'}); POP.add({title: "Author:", value: 'ViliusL'}); POP.add({title: "Email:", html: '' + email + ''}); - POP.add({title: "Source:", html: 'github.com/viliusle/miniPaint'}); + POP.add({title: "GitHub:", html: 'github.com/viliusle/miniPaint'}); POP.show('About', ''); };