From 9721cdd49d68c11a7d3114dfc1b715146003d9e5 Mon Sep 17 00:00:00 2001 From: Devine Lu Linvega Date: Wed, 7 Mar 2018 16:08:34 +1300 Subject: [PATCH] Minor cleanup --- desktop/sources/index.html | 5 +- desktop/sources/scripts/dotgrid.js | 28 +++----- desktop/sources/scripts/pos.js | 47 -------------- desktop/sources/scripts/tool.js | 100 ++++++++++++++++------------- 4 files changed, 65 insertions(+), 115 deletions(-) delete mode 100644 desktop/sources/scripts/pos.js diff --git a/desktop/sources/index.html b/desktop/sources/index.html index 4c715cd..3dc3481 100644 --- a/desktop/sources/index.html +++ b/desktop/sources/index.html @@ -4,14 +4,15 @@ - + + @@ -23,7 +24,7 @@ const {dialog,app} = require('electron').remote; const fs = require('fs'); - dotgrid = new Dotgrid(300,300,20,20,4,4, 10,"square","#000000"); + dotgrid = new Dotgrid(300,300,20,20,4,4); dotgrid.install(); diff --git a/desktop/sources/scripts/dotgrid.js b/desktop/sources/scripts/dotgrid.js index bf9aa34..0915597 100644 --- a/desktop/sources/scripts/dotgrid.js +++ b/desktop/sources/scripts/dotgrid.js @@ -1,4 +1,4 @@ -function Dotgrid(width,height,grid_x,grid_y,block_x,block_y, color = "#000000") +function Dotgrid(width,height,grid_x,grid_y,block_x,block_y) { this.controller = new Controller(); this.theme = new Theme(); @@ -17,9 +17,6 @@ function Dotgrid(width,height,grid_x,grid_y,block_x,block_y, color = "#000000") this.block_x = block_x; this.block_y = block_y; - this.color = color; - this.offset = new Pos(0,0); - // Dotgrid this.element = document.createElement("div"); this.element.id = "dotgrid"; @@ -80,7 +77,6 @@ function Dotgrid(width,height,grid_x,grid_y,block_x,block_y, color = "#000000") this.svg_el.style.width = this.width; this.svg_el.style.height = this.height; - this.svg_el.style.stroke = this.color; this.svg_el.style.fill = "none"; this.svg_el.style.strokeWidth = this.tool.style().thickness; this.element.appendChild(this.svg_el); @@ -267,7 +263,7 @@ function Dotgrid(width,height,grid_x,grid_y,block_x,block_y, color = "#000000") this.mouse_down = function(e) { - var pos = this.position_in_grid(new Pos(e.clientX+5,e.clientY-5)); pos = this.position_on_grid(pos); + var pos = this.position_in_grid({x:e.clientX+5,y:e.clientY-5}); pos = this.position_on_grid(pos); if(e.altKey){ dotgrid.tool.remove_segments_at(pos); return; } if(dotgrid.tool.vertex_at(pos)){ console.log("Begin translation"); dotgrid.translation = {from:pos,to:pos}; return; } @@ -286,14 +282,14 @@ function Dotgrid(width,height,grid_x,grid_y,block_x,block_y, color = "#000000") if(o == "linejoin"){ this.mod_linejoin(); } if(o == "mirror"){ this.mod_mirror(); } if(o == "color"){ setTimeout(()=>{ this.picker.start(); }, 100) } - if(o == "depth"){ this.toggle_layer(); } + if(o == "depth"){ this.tool.select_next_layer(); } e.preventDefault(); } this.mouse_move = function(e) { - var pos = this.position_in_grid(new Pos(e.clientX+5,e.clientY-5)); pos = this.position_on_grid(pos); + var pos = this.position_in_grid({x:e.clientX+5,y:e.clientY-5}); pos = this.position_on_grid(pos); if(dotgrid.translation && (Math.abs(dotgrid.translation.from.x) != Math.abs(pos.x) || Math.abs(dotgrid.translation.from.y) != Math.abs(pos.y))){ dotgrid.translation.to = pos; } @@ -305,7 +301,7 @@ function Dotgrid(width,height,grid_x,grid_y,block_x,block_y, color = "#000000") this.mouse_up = function(e) { - var pos = this.position_in_grid(new Pos(e.clientX+5,e.clientY-5)); pos = this.position_on_grid(pos); + var pos = this.position_in_grid({x:e.clientX+5,y:e.clientY-5}); pos = this.position_on_grid(pos); if(e.altKey){ return; } @@ -327,7 +323,7 @@ function Dotgrid(width,height,grid_x,grid_y,block_x,block_y, color = "#000000") this.mouse_alt = function(e) { - var pos = this.position_in_grid(new Pos(e.clientX+5,e.clientY-5)); pos = this.position_on_grid(pos); + var pos = this.position_in_grid({x:e.clientX+5,y:e.clientY-5}); pos = this.position_on_grid(pos); dotgrid.tool.remove_segments_at(pos); e.preventDefault(); setTimeout(() => { dotgrid.tool.clear(); },150); @@ -409,13 +405,6 @@ function Dotgrid(width,height,grid_x,grid_y,block_x,block_y, color = "#000000") this.draw(); } - this.toggle_layer = function() - { - var index = this.tool.index; - index = index >= 2 ? 0 : index+1; - this.tool.select_layer(index); - } - this.set_size = function(size = {width:300,height:300},interface = true) { var win = require('electron').remote.getCurrentWindow(); @@ -523,7 +512,6 @@ function Dotgrid(width,height,grid_x,grid_y,block_x,block_y, color = "#000000") this.history.clear(); this.tool.reset(); this.reset(); - this.color = "#000000" this.draw(); } @@ -589,7 +577,7 @@ function Dotgrid(width,height,grid_x,grid_y,block_x,block_y, color = "#000000") this.position_in_grid = function(pos) { - return new Pos((window.innerWidth/2) - (this.width/2) - pos.x,pos.y - (30+10)) + return {x:(window.innerWidth/2) - (this.width/2) - pos.x,y:pos.y - (30+10)} } this.position_on_grid = function(pos) @@ -603,7 +591,7 @@ function Dotgrid(width,height,grid_x,grid_y,block_x,block_y, color = "#000000") x = 50 y = -50 } - return new Pos(x,y); + return {x:x,y:y}; } } diff --git a/desktop/sources/scripts/pos.js b/desktop/sources/scripts/pos.js deleted file mode 100644 index dfaaa79..0000000 --- a/desktop/sources/scripts/pos.js +++ /dev/null @@ -1,47 +0,0 @@ -function Pos(x,y) -{ - this.__serialized_name__ = "."; - this.x = x; - this.y = y; - - this.toString = function() - { - return x+","+y; - } - - this.sub = function(pos2) - { - return new Pos(this.x - pos2.x,this.y - pos2.y) - } - - this.add = function(pos2) - { - return new Pos(this.x + pos2.x,this.y + pos2.y) - } - - this.is_equal = function(pos2) - { - return Math.abs(pos2.x) == Math.abs(this.x) && Math.abs(pos2.y) == Math.abs(this.y); - } - - this.scale = function(a) - { - return new Pos(this.x*a,this.y*a) - } - - this.mirror = function(x = -1,y = 1) - { - return new Pos(this.x * x,this.y * y); - } - - this.clamp = function(min,max) - { - return new Pos(clamp(this.x,min,max),clamp(this.y,min,max)); - } - - function clamp(v, min, max) { return v < min ? min : v > max ? max : v; } -} - -// This is ugly, but Pos.__serialized_name__ == "."; -// Let's keep the character count low. -window["."] = Pos; \ No newline at end of file diff --git a/desktop/sources/scripts/tool.js b/desktop/sources/scripts/tool.js index 6b79008..770c146 100644 --- a/desktop/sources/scripts/tool.js +++ b/desktop/sources/scripts/tool.js @@ -24,22 +24,53 @@ function Tool() this.index = 0; } - this.style = function() + this.clear = function() { - if(!this.styles[this.index]){ - this.styles[this.index] = []; - } - return this.styles[this.index]; + this.verteces = []; + dotgrid.preview(); + dotgrid.draw(); } - this.layer = function() + this.undo = function() { - if(!this.layers[this.index]){ - this.layers[this.index] = []; - } - return this.layers[this.index]; + this.layers = dotgrid.history.prev(); + dotgrid.draw(); } + this.redo = function() + { + this.layers = dotgrid.history.next(); + dotgrid.draw(); + } + + // I/O + + this.export = function(target = {layers:this.layers,styles:this.styles}) + { + return JSON.stringify(copy(target), null, 2); + } + + this.import = function(layer) + { + this.layers[this.index] = this.layers[this.index].concat(layer) + dotgrid.history.push(this.layers); + this.clear(); + dotgrid.draw(); + } + + this.replace = function(dot) + { + if(!dot.layers || dot.layers.length != 3){ console.log("Incompatible version"); return; } + + this.layers = dot.layers; + this.styles = dot.styles; + this.clear(); + dotgrid.draw(); + dotgrid.history.push(this.layers); + } + + // EDIT + this.remove_segment = function() { if(this.verteces.length > 0){ this.clear(); return; } @@ -198,47 +229,24 @@ function Tool() dotgrid.draw(); } - this.clear = function() + // Style + + this.style = function() { - this.verteces = []; - dotgrid.preview(); - dotgrid.draw(); + if(!this.styles[this.index]){ + this.styles[this.index] = []; + } + return this.styles[this.index]; } - this.undo = function() - { - this.layers = dotgrid.history.prev(); - dotgrid.draw(); - } + // Layers - this.redo = function() + this.layer = function() { - this.layers = dotgrid.history.next(); - dotgrid.draw(); - } - - this.export = function(target = {layers:this.layers,styles:this.styles}) - { - return JSON.stringify(copy(target), null, 2); - } - - this.replace = function(dot) - { - if(!dot.layers || dot.layers.length != 3){ console.log("Incompatible version"); return; } - - this.layers = dot.layers; - this.styles = dot.styles; - this.clear(); - dotgrid.draw(); - dotgrid.history.push(this.layers); - } - - this.import = function(layer) - { - this.layers[this.index] = this.layers[this.index].concat(layer) - dotgrid.history.push(this.layers); - this.clear(); - dotgrid.draw(); + if(!this.layers[this.index]){ + this.layers[this.index] = []; + } + return this.layers[this.index]; } this.select_layer = function(id)