Tim/CryptoAssist
1
0
Fork 0
Code Issues Pull Requests Releases Wiki Activity

Implemented snapshots

Browse Source
This commit is contained in:
Tim Stallard
2017-03-18 17:08:15 +00:00
parent 2b323470b4
commit 34702a2638
7 changed files with 77 additions and 23 deletions
Download Patch File Download Diff File Expand all files Collapse all files

12
src/diagram/addSnapshot.js Normal file
View File

@@ -0,0 +1,12 @@
var diagram = require("./index.js");
var events = require("../events.js");
module.exports = function(snapshotName){
var state = JSON.parse(require("./export.js")()).state;
diagram.snapshots.push({
date: new Date().getTime(),
name: snapshotName,
state: state
});
events.emit("snapshotsChanged");
}

6
src/diagram/import.js
View File

@@ -4,9 +4,5 @@ var $ = require("jquery");
module.exports = function(newDiagram){ module.exports = function(newDiagram){
Object.assign(diagram, JSON.parse(newDiagram)); Object.assign(diagram, JSON.parse(newDiagram));
$("#workspace>*").remove(); require("./updateState.js")();
for(var block of diagram.state){
require("../pageInteraction/addBlockToPage.js")(block);
}
events.emit("diagramImport");
} }

11
src/diagram/updateState.js Normal file
View File

@@ -0,0 +1,11 @@
var diagram = require("./index.js");
var events = require("../events.js");
var $ = require("jquery");
module.exports = function(){
$("#workspace>*").remove(); //remove old lines + block
for(var block of diagram.state){ //add blocks to page
require("../pageInteraction/addBlockToPage.js")(block);
}
events.emit("diagramImport"); //trigger line re-draw
}

7
src/events.js
View File

@@ -1,11 +1,16 @@
var subscriptions = {}; var subscriptions = {};
module.exports = { module.exports = {
subscribe: function(event, callback){ subscribe: function(events, callback){
if(!Array.isArray(events)){ //if not an array, make it a single item array
events = [events];
}
for(var event of events){
if(!subscriptions[event]){ if(!subscriptions[event]){
subscriptions[event] = []; subscriptions[event] = [];
} }
subscriptions[event].push(callback); subscriptions[event].push(callback);
}
}, },
emit: function(event, data){ emit: function(event, data){
if(subscriptions[event]){ if(subscriptions[event]){

16
src/index.html
View File

@@ -3,12 +3,18 @@
<title>Cryptography Assistant</title> <title>Cryptography Assistant</title>
</head> </head>
<body> <body>
<div id="header"> <ul id="header">
<a href="#" id="projectName">New Diagram</a> <li><a href="#" id="projectName">New Diagram</a></li>
<a href="#" id="import">Open File</a> <li><a href="#" id="import">Open File</a></li>
<a href="#" id="export">Save</a> <li><a href="#" id="export">Save</a></li>
<li>
<a href="#" id="snapshotsLink">Snapshots</a>
<ul id="snapshots">
<li><a href="#" id="addSnapshot">Add Snapshot</a></li>
</ul>
</li>
</ul>
<input type="file" id="importUpload"></input> <input type="file" id="importUpload"></input>
</div>
<div id="blocks"> <div id="blocks">
</div> </div>
<div id="workspace"> <div id="workspace">

34
src/menu.js
View File

@@ -2,18 +2,18 @@ var $ = require("jquery");
var events = require("./events.js"); var events = require("./events.js");
var diagram = require("./diagram"); var diagram = require("./diagram");
$("#header>a#export").click(function(){ $("#header a#export").click(function(){
var fileSaver = require("file-saver"); var fileSaver = require("file-saver");
var exported = require("./diagram/export.js")(); var exported = require("./diagram/export.js")();
var exportedBlob = new Blob([exported], {type: "text/plain;chartset=utf-8"}) var exportedBlob = new Blob([exported], {type: "text/plain;chartset=utf-8"})
fileSaver.saveAs(exportedBlob, diagram.name + ".json"); fileSaver.saveAs(exportedBlob, diagram.name + ".json");
}); });
$("#header>a#import").click(function(){ $("#header a#import").click(function(){
$("#header>#importUpload").click(); $("#importUpload").click();
}); });
$("#header>#importUpload").change(function(){ $("#importUpload").change(function(){
var reader = new FileReader(); var reader = new FileReader();
reader.onload = function(){ reader.onload = function(){
require("./diagram/import.js")(reader.result); require("./diagram/import.js")(reader.result);
@@ -32,3 +32,29 @@ $("#header>a#projectName").click(function(){
events.subscribe("diagramImport", function(){ events.subscribe("diagramImport", function(){
$("#header>a#projectName").html(diagram.name); $("#header>a#projectName").html(diagram.name);
}); });
$("#header a#addSnapshot").click(function(){
var name = prompt("Please enter a name for the snapshot");
require("./diagram/addSnapshot.js")(name);
});
events.subscribe(["snapshotsChanged", "diagramImport"], function(){
$("#snapshots>.snapshot").remove();
diagram.snapshots.sort((a, b)=>(b.date - a.date));
for(var i in diagram.snapshots){
var date = new Date(diagram.snapshots[i].date);
$("#snapshots").append(
`<li class="snapshot"><a href="#" data-i="${i}">${date.getDay()}/${date.getMonth()}/${date.getFullYear()} ${date.getHours()}:${date.getMinutes()} - ${diagram.snapshots[i].name}</a></li>`
);
}
});
$("#header #snapshots").on("click", ".snapshot>a", function(){
var snapshot = diagram.snapshots[parseInt($(this).data("i"))]
var newSnapshotName = prompt("Reverting to this snapshot will cause you to lose your current work. If you would like to make a snapshot of your current workspace, please enter a name for it:");
if(newSnapshotName){
require("./diagram/addSnapshot.js")(newSnapshotName);
}
diagram.state = JSON.parse(JSON.stringify(snapshot.state));
require("./diagram/updateState.js")();
});

2
src/styles.scss
View File

@@ -9,11 +9,9 @@ body{
flex-direction: column; flex-direction: column;
} }
#header{
#importUpload{ #importUpload{
display: none; display: none;
} }
}
#blocks{ #blocks{
display: flex; display: flex;