diff --git a/sources/scripts/dotgrid.js b/sources/scripts/dotgrid.js index 4895d44..ed79715 100644 --- a/sources/scripts/dotgrid.js +++ b/sources/scripts/dotgrid.js @@ -92,7 +92,7 @@ function Dotgrid(width,height,grid_x,grid_y,block_x,block_y,thickness = 3,lineca this.svg_el.style.height = this.height; this.svg_el.style.stroke = this.color; this.svg_el.style.strokeWidth = this.thickness; - this.svg_el.style.fill = this.fill ? "black" : "none"; + this.svg_el.style.fill = this.fill ? "black" : "none !important"; this.svg_el.style.strokeLinecap = this.linecap; this.element.appendChild(this.svg_el); @@ -113,7 +113,6 @@ function Dotgrid(width,height,grid_x,grid_y,block_x,block_y,thickness = 3,lineca var o = e.target.getAttribute("data-operation"); if(!o){ return; } - console.log(o) if(o == "line"){ this.draw_line(); } if(o == "arc_c"){ this.draw_arc("0,1"); } if(o == "arc_r"){ this.draw_arc("0,0"); } @@ -250,27 +249,27 @@ function Dotgrid(width,height,grid_x,grid_y,block_x,block_y,thickness = 3,lineca // Draw this.draw_line = function() { - if(from === null || to === null){ return; } + if(from === null || to === null){ return; } - to = new Pos(to[0] * -1, to[1]); + to = new Pos(to[0] * -1, to[1]).sub(this.offset) + from = new Pos(from[0] * -1,from[1]).sub(this.offset) + end = end ? new Pos(end[0] * -1,end[1]).sub(this.offset) : null; - var end_point = end ? new Pos(end[0] * -1,end[1]).sub(this.offset) : null; + this.segments.push(new Path_Line(from,to,end)); - from = new Pos(from[0] * -1,from[1]) - - this.segments.push(new Path_Line(from.sub(this.offset),to.sub(this.offset),end_point)); - - this.draw(); - reset(); + this.draw(); + reset(); } this.draw_arc = function(orientation) { if(from === null || to === null){ return; } - var end_point = end ? new Pos(end[0] * -1,end[1]).sub(this.offset) : null; + to = new Pos(to[0] * -1, to[1]).sub(this.offset) + from = new Pos(from[0] * -1,from[1]).sub(this.offset) + end = end ? new Pos(end[0] * -1,end[1]).sub(this.offset) : null; - this.segments.push(new Path_Arc(new Pos(from[0] * -1,from[1]).sub(this.offset),new Pos(to[0] * -1,to[1]).sub(this.offset),orientation,end_point)); + this.segments.push(new Path_Arc(from,to,orientation,end)); this.draw(); reset(); @@ -280,7 +279,11 @@ function Dotgrid(width,height,grid_x,grid_y,block_x,block_y,thickness = 3,lineca { if(from === null || to === null || end === null){ return; } - this.segments.push(new Path_Bezier(new Pos(from[0] * -1,from[1]).sub(this.offset),new Pos(to[0] * -1,to[1]).sub(this.offset),new Pos(end[0] * -1,end[1]).sub(this.offset))); + to = new Pos(to[0] * -1, to[1]).sub(this.offset) + from = new Pos(from[0] * -1,from[1]).sub(this.offset) + end = new Pos(end[0] * -1,end[1]).sub(this.offset) + + this.segments.push(new Path_Bezier(from,to,end)); this.draw(); reset(); diff --git a/sources/scripts/keyboard.js b/sources/scripts/keyboard.js index 2ccee31..274677d 100644 --- a/sources/scripts/keyboard.js +++ b/sources/scripts/keyboard.js @@ -1,22 +1,29 @@ function Keyboard() { - this.listen = function(event) + this.listen = function(e) { // save - if(event.key == "s" && (event.ctrlKey || event.metaKey)){ + if(e.key == "s" && (e.ctrlKey || e.metaKey)){ dotgrid.export(); return; } // undo - if(event.key == "z" && (event.ctrlKey || event.metaKey)){ + if(e.key == "z" && (e.ctrlKey || e.metaKey)){ dotgrid.erase(); return; } - switch (event.keyCode) { - case 83 : dotgrid.draw_arc(event.shiftKey ? "1,1" : "0,1"); break; // 'S' - case 65 : dotgrid.draw_arc(event.shiftKey ? "1,0" : "0,0"); break; // 'a' + // Reset + if((e.key == "Backspace" || e.key == "Delete") && e.ctrlKey && e.shiftKey){ + e.preventDefault(); + dotgrid.theme.reset(); + return; + } + + switch (e.keyCode) { + case 83 : dotgrid.draw_arc(e.shiftKey ? "1,1" : "0,1"); break; // 'S' + case 65 : dotgrid.draw_arc(e.shiftKey ? "1,0" : "0,0"); break; // 'a' case 68 : dotgrid.draw_line(); break; // 'd' case 70 : dotgrid.draw_bezier(); break; // 'f' case 82 : dotgrid.draw_close(); break; // 'r' @@ -35,7 +42,7 @@ function Keyboard() case 69 : dotgrid.export(); break; // 'e' case 13 : dotgrid.export(); break; // 'e' - case 9 : dotgrid.toggle_fill(); event.preventDefault(); break; // 'tab' + case 9 : dotgrid.toggle_fill(); e.preventDefault(); break; // 'tab' case 38 : dotgrid.mod_move(0,-10); break; // 'up' case 40 : dotgrid.mod_move(0,10); break; // 'down' diff --git a/sources/scripts/theme.js b/sources/scripts/theme.js index 2491ce8..3872bcc 100644 --- a/sources/scripts/theme.js +++ b/sources/scripts/theme.js @@ -54,8 +54,8 @@ function Theme() html += ".bl { background:"+theme.b_low+" !important ; fill:"+theme.b_low+" !important }\n"; html += ".b_inv { background:"+theme.b_inv+" !important ; fill:"+theme.b_inv+" !important }\n"; + html += "#dotgrid svg.vector { fill:"+theme.f_high+" }\n"; html += "#dotgrid #cursor { border-color:"+theme.f_med+"}\n"; - html += "#dotgrid #cursor_from { background:"+theme.f_low+"; border-color:"+theme.f_low+"}\n"; html += "#dotgrid #cursor_to { background:"+theme.f_low+"; border-color:"+theme.f_low+"}\n"; html += "#dotgrid #cursor_end { background:"+theme.f_low+"; border-color:"+theme.f_low+"}\n";