diff --git a/desktop/sources/links/main.css b/desktop/sources/links/main.css index da35994..0bea271 100644 --- a/desktop/sources/links/main.css +++ b/desktop/sources/links/main.css @@ -49,12 +49,6 @@ body { background:var(--background) !important; } .b_inv { background:var(--b_inv) !important ; ; } .icon { color:var(--f_high) !important; stroke:var(--f_high) !important; } #dotgrid svg.vector { stroke:var(--f_high) !important; } -#dotgrid svg.vector #layer_1 { stroke:var(--f_high) !important; } -#dotgrid svg.vector #layer_2 { stroke:var(--f_med) !important; } -#dotgrid svg.vector #layer_3 { stroke:var(--f_low) !important; } -#dotgrid svg.vector #mirror_layer_1 { stroke:var(--f_high) !important; } -#dotgrid svg.vector #mirror_layer_2 { stroke:var(--f_med) !important; } -#dotgrid svg.vector #mirror_layer_3 { stroke:var(--f_low) !important; } #dotgrid #preview { stroke:var(--f_high) !important; } #dotgrid #cursor { border-color:var(--f_med); } #dotgrid #cursor.keyboard { border-color:var(--f_high) !Important; } diff --git a/desktop/sources/scripts/dotgrid.js b/desktop/sources/scripts/dotgrid.js index 178c2bf..54f5134 100644 --- a/desktop/sources/scripts/dotgrid.js +++ b/desktop/sources/scripts/dotgrid.js @@ -110,6 +110,7 @@ function Dotgrid(width,height,grid_x,grid_y,block_x,block_y, color = "#000000") this.svg_el.appendChild(this.mirror_el); this.theme.start(); + this.tool.start(); this.guide.start(); this.interface.start(); @@ -438,21 +439,34 @@ 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.strokeWidth = this.tool.style().thickness; this.svg_el.style.fill = this.fill ? this.theme.active.f_high : "none"; this.layer_1.style.strokeWidth = this.tool.styles[0].thickness; - this.layer_2.style.strokeWidth = this.tool.styles[1].thickness; - this.layer_3.style.strokeWidth = this.tool.styles[2].thickness; - this.layer_1.style.strokeLinecap = this.tool.styles[0].strokeLinecap; - this.layer_2.style.strokeLinecap = this.tool.styles[1].strokeLinecap; - this.layer_3.style.strokeLinecap = this.tool.styles[2].strokeLinecap; - this.layer_1.style.strokeLinejoin = this.tool.styles[0].strokeLinejoin; + this.layer_1.style.stroke = this.tool.styles[0].color; + this.mirror_layer_1.style.strokeWidth = this.tool.styles[0].thickness; + this.mirror_layer_1.style.strokeLinecap = this.tool.styles[0].strokeLinecap; + this.mirror_layer_1.style.strokeLinejoin = this.tool.styles[0].strokeLinejoin; + this.mirror_layer_1.style.stroke = this.tool.styles[0].color; + + this.layer_2.style.strokeWidth = this.tool.styles[1].thickness; + this.layer_2.style.strokeLinecap = this.tool.styles[1].strokeLinecap; this.layer_2.style.strokeLinejoin = this.tool.styles[1].strokeLinejoin; + this.layer_2.style.stroke = this.tool.styles[1].color; + this.mirror_layer_2.style.strokeWidth = this.tool.styles[1].thickness; + this.mirror_layer_2.style.strokeLinecap = this.tool.styles[1].strokeLinecap; + this.mirror_layer_2.style.strokeLinejoin = this.tool.styles[1].strokeLinejoin; + this.mirror_layer_2.style.stroke = this.tool.styles[1].color; + + this.layer_3.style.strokeWidth = this.tool.styles[2].thickness; + this.layer_3.style.strokeLinecap = this.tool.styles[2].strokeLinecap; this.layer_3.style.strokeLinejoin = this.tool.styles[2].strokeLinejoin; + this.layer_3.style.stroke = this.tool.styles[2].color; + this.mirror_layer_3.style.strokeWidth = this.tool.styles[2].thickness; + this.mirror_layer_3.style.strokeLinecap = this.tool.styles[2].strokeLinecap; + this.mirror_layer_3.style.strokeLinejoin = this.tool.styles[2].strokeLinejoin; + this.mirror_layer_3.style.stroke = this.tool.styles[2].color; // Draw Mirror if(this.mirror_index == 1){ @@ -476,7 +490,7 @@ function Dotgrid(width,height,grid_x,grid_y,block_x,block_y, color = "#000000") this.mirror_layer_3.setAttribute("transform","") } - this.offset_el.setAttribute("transform","translate("+(this.offset.x)+","+(this.offset.y)+")") + this.offset_el.setAttribute("transform","translate(0,0)") this.preview(); this.render.draw(); diff --git a/desktop/sources/scripts/tool.js b/desktop/sources/scripts/tool.js index 02f1244..f04e708 100644 --- a/desktop/sources/scripts/tool.js +++ b/desktop/sources/scripts/tool.js @@ -3,13 +3,20 @@ function Tool() this.index = 0; this.layers = [[],[],[]]; this.styles = [ - {thickness:5,strokeLinecap:"round",strokeLinejoin:"round"}, - {thickness:5,strokeLinecap:"round",strokeLinejoin:"round"}, - {thickness:5,strokeLinecap:"round",strokeLinejoin:"round"} + {thickness:5,strokeLinecap:"round",strokeLinejoin:"round",color:"#f00"}, + {thickness:5,strokeLinecap:"round",strokeLinejoin:"round",color:"#0f0"}, + {thickness:5,strokeLinecap:"round",strokeLinejoin:"round",color:"#00f"} ]; this.verteces = []; this.reqs = {line:2,arc_c:2,arc_r:2,bezier:3,close:0}; + this.start = function() + { + this.styles[0].color = dotgrid.theme.active.f_high + this.styles[1].color = dotgrid.theme.active.f_med + this.styles[2].color = dotgrid.theme.active.f_low + } + this.reset = function() { this.layers = [[],[],[]];