Atlas48/pointvec
1
0
Fork 0
Code Issues Pull Requests Projects Releases Wiki Activity

Implemented undo/redo

Browse Source
This commit is contained in:
Devine Lu Linvega 2018-02-01 09:21:59 +13:00
parent 698644c3a7
commit cfc49dc435
7 changed files with 60 additions and 62 deletions
Show Stats Download Patch File Download Diff File Expand all files Collapse all files

1
LAYOUT.md
View File

@ -10,6 +10,7 @@
- Copy: `CmdOrCtrl+C`
- Paste: `CmdOrCtrl+V`
- Undo: `CmdOrCtrl+Z`
- Redo: `CmdOrCtrl+Shift+Z`
- Delete: `Backspace`
- Move Up: `Up`
- Move Down: `Down`

3
README.md
View File

@ -22,6 +22,7 @@ Clicking on the canvas will insert control points, up to 3CPs. CPs can be moved
- Copy: `CmdOrCtrl+C`
- Paste: `CmdOrCtrl+V`
- Undo: `CmdOrCtrl+Z`
- Redo: `CmdOrCtrl+Shift+Z`
- Delete: `Backspace`
- Move Up: `Up`
- Move Down: `Down`
@ -51,7 +52,7 @@ Clicking on the canvas will insert control points, up to 3CPs. CPs can be moved
- Control Points: `J`
- Expert Mode: `:`
<img src='https://cdn.rawgit.com/hundredrabbits/Dotgrid/master/LAYOUT.svg?v=2' width="600"/>
<img src='https://cdn.rawgit.com/hundredrabbits/Dotgrid/master/LAYOUT.svg?v=3' width="600"/>
## Extras

2
main.js
View File

@ -32,8 +32,6 @@ app.on('ready', () =>
app.win = new BrowserWindow({width: 400, height: 420, minWidth: 400, minHeight: 420, backgroundColor:"#000", frame:false, autoHideMenuBar: true, icon: __dirname + '/icon.ico'})
app.win.loadURL(`file://${__dirname}/sources/index.html`);
app.win.toggleDevTools();
app.win.on('closed', () => {
win = null

2
sources/index.html
View File

@ -2,6 +2,7 @@
<head>
<script type="text/javascript" src="scripts/lib/theme.js"></script>
<script type="text/javascript" src="scripts/lib/controller.js"></script>
<script type="text/javascript" src="scripts/lib/history.js"></script>
<script type="text/javascript" src="scripts/pos.js"></script>
<script type="text/javascript" src="scripts/path_line.js"></script>
@ -13,7 +14,6 @@
<script type="text/javascript" src="scripts/render.js"></script>
<script type="text/javascript" src="scripts/serializer.js"></script>
<script type="text/javascript" src="scripts/interface.js"></script>
<script type="text/javascript" src="scripts/history.js"></script>
<link rel="stylesheet" type="text/css" href="links/reset.css"/>
<link rel="stylesheet" type="text/css" href="links/fonts.css"/>
<link rel="stylesheet" type="text/css" href="links/main.css"/>

34
sources/scripts/dotgrid.js
View File

@ -241,14 +241,12 @@ function Dotgrid(width,height,grid_x,grid_y,block_x,block_y,thickness = 3,lineca
}
this.segments = this.history.prev();
console.log(this.history.a)
this.draw();
}
this.redo = function()
{
this.segments = this.history.next();
console.log(this.history.a)
this.draw();
}
@ -281,6 +279,22 @@ function Dotgrid(width,height,grid_x,grid_y,block_x,block_y,thickness = 3,lineca
this.draw();
}
this.translate = function(t)
{
for(id in dotgrid.segments){
var segment = dotgrid.segments[id];
if(segment.from && segment.from.is_equal(dotgrid.translation.from)){ segment.from = new Pos(-dotgrid.translation.to.x,dotgrid.translation.to.y)}
if(segment.to && segment.to.is_equal(dotgrid.translation.from)){ segment.to = new Pos(-dotgrid.translation.to.x,dotgrid.translation.to.y)}
if(segment.end && segment.end.is_equal(dotgrid.translation.from)){ segment.end = new Pos(-dotgrid.translation.to.x,dotgrid.translation.to.y)}
}
dotgrid.history.push(dotgrid.segments);
dotgrid.translation = null;
dotgrid.reset();
dotgrid.draw();
}
// STROKE
this.draw_line = function()
@ -449,22 +463,6 @@ function Dotgrid(width,height,grid_x,grid_y,block_x,block_y,thickness = 3,lineca
return false;
}
this.translate = function(t)
{
for(id in dotgrid.segments){
var segment = dotgrid.segments[id];
if(segment.from && segment.from.is_equal(dotgrid.translation.from)){ segment.from = new Pos(-dotgrid.translation.to.x,dotgrid.translation.to.y)}
if(segment.to && segment.to.is_equal(dotgrid.translation.from)){ segment.to = new Pos(-dotgrid.translation.to.x,dotgrid.translation.to.y)}
if(segment.end && segment.end.is_equal(dotgrid.translation.from)){ segment.end = new Pos(-dotgrid.translation.to.x,dotgrid.translation.to.y)}
}
dotgrid.translation = null;
dotgrid.reset();
dotgrid.history.push(dotgrid.segments);
dotgrid.draw();
}
this.preview = function(operation)
{
if(from && to && operation == "line"){

40
sources/scripts/history.js
View File

@ -1,40 +0,0 @@
function History()
{
this.index = 0;
this.a = [];
this.push = function(data)
{
var d = data.slice(0);
if(this.index != this.a.length){
this.a = this.a.slice(0,this.index);
}
this.a.push(d);
this.index = this.a.length;
console.log(`history: ${this.index}/${this.a.length}`)
}
this.pop = function()
{
console.log(`history: ${this.index}/${this.a.length}`)
return this.a.pop();
}
this.prev = function()
{
this.index = clamp(this.index-1,0,this.a.length-1);
console.log(`history: ${this.index}/${this.a.length}`)
return this.a[this.index].slice(0);
}
this.next = function()
{
this.index = clamp(this.index+1,0,this.a.length-1);
console.log(`history: ${this.index}/${this.a.length}`)
return this.a[this.index].slice(0);
}
function copy(data){ return JSON.parse(JSON.stringify(data)); }
function clamp(v, min, max) { return v < min ? min : v > max ? max : v; }
}

40
sources/scripts/lib/history.js Normal file
View File

@ -0,0 +1,40 @@
function History()
{
this.index = 0;
this.a = [];
this.push = function(data)
{
if(this.index < this.a.length-1){
this.fork();
}
this.index = this.a.length;
this.a = this.a.slice(0,this.index);
this.a.push(copy(data));
}
this.fork = function()
{
this.a = this.a.slice(0,this.index+1);
}
this.pop = function()
{
return this.a.pop();
}
this.prev = function()
{
this.index = clamp(this.index-1,0,this.a.length-1);
return copy(this.a[this.index]);
}
this.next = function()
{
this.index = clamp(this.index+1,0,this.a.length-1);
return copy(this.a[this.index]);
}
function copy(data){ return data.slice(0); }
function clamp(v, min, max) { return v < min ? min : v > max ? max : v; }
}