From f846ae85e68f880a8e391dd81685cbf776d463ef Mon Sep 17 00:00:00 2001 From: Devine Lu Linvega Date: Fri, 3 Aug 2018 11:17:29 +1200 Subject: [PATCH] Starting to clean up --- desktop/sources/scripts/cursor.js | 8 ++--- desktop/sources/scripts/guide.js | 60 +++++++++++-------------------- 2 files changed, 23 insertions(+), 45 deletions(-) diff --git a/desktop/sources/scripts/cursor.js b/desktop/sources/scripts/cursor.js index 9efc9f8..01b97bc 100644 --- a/desktop/sources/scripts/cursor.js +++ b/desktop/sources/scripts/cursor.js @@ -83,19 +83,15 @@ function Cursor() this.pos_relative = function(pos) { - var ratio = dotgrid.guide.scale == 1 ? 2 : 1.5; - var offset = {x:dotgrid.guide.el.offsetLeft * ratio,y:dotgrid.guide.el.offsetTop * ratio} - return { - x:pos.x - offset.x, - y:pos.y - offset.y + x:pos.x - dotgrid.guide.el.offsetLeft, + y:pos.y - dotgrid.guide.el.offsetTop }; } this.pos_snap = function(pos) { var grid = dotgrid.tool.settings.size.width/dotgrid.grid_x; - return { x:clamp(step(pos.x,grid),0,dotgrid.tool.settings.size.width), y:clamp(step(pos.y,grid),0,dotgrid.tool.settings.size.height) diff --git a/desktop/sources/scripts/guide.js b/desktop/sources/scripts/guide.js index 7f1d579..57d2951 100644 --- a/desktop/sources/scripts/guide.js +++ b/desktop/sources/scripts/guide.js @@ -8,7 +8,7 @@ function Guide() this.el.style.height = "320px"; this.show_extras = true; - this.scale = 2; // require('electron').remote.getCurrentWindow().this.scaleFactor; + this.scale = 1; // require('electron').remote.getCurrentWindow().this.scaleFactor; this.start = function() { @@ -95,7 +95,7 @@ function Guide() var ctx = this.el.getContext('2d'); ctx.beginPath(); ctx.lineWidth = 2; - ctx.arc((pos.x * this.scale)+30, (pos.y * this.scale)+30, radius, 0, 2 * Math.PI, false); + ctx.arc((pos.x * this.scale), (pos.y * this.scale), radius, 0, 2 * Math.PI, false); ctx.fillStyle = dotgrid.theme.active.f_med; ctx.fill(); ctx.closePath(); @@ -106,10 +106,9 @@ function Guide() var ctx = this.el.getContext('2d'); ctx.beginPath(); - ctx.setLineDash([0,0]); ctx.lineWidth = 3; ctx.lineCap="round"; - ctx.arc(Math.abs(pos.x * -this.scale)+30, Math.abs(pos.y * this.scale)+30, radius+3, 0, 2 * Math.PI, false); + ctx.arc(Math.abs(pos.x * -this.scale), Math.abs(pos.y * this.scale), radius+3, 0, 2 * Math.PI, false); ctx.fillStyle = dotgrid.theme.active.f_high; ctx.fill(); ctx.strokeStyle = dotgrid.theme.active.f_high; @@ -117,13 +116,13 @@ function Guide() ctx.closePath(); ctx.beginPath(); - ctx.arc((pos.x * this.scale)+30, (pos.y * this.scale)+30, radius, 0, 2 * Math.PI, false); + ctx.arc((pos.x * this.scale), (pos.y * this.scale), radius, 0, 2 * Math.PI, false); ctx.fillStyle = dotgrid.theme.active.f_low; ctx.fill(); ctx.closePath(); ctx.beginPath(); - ctx.arc((pos.x * this.scale)+30, (pos.y * this.scale)+30, radius-3, 0, 2 * Math.PI, false); + ctx.arc((pos.x * this.scale), (pos.y * this.scale), radius-3, 0, 2 * Math.PI, false); ctx.fillStyle = dotgrid.theme.active.f_high; ctx.fill(); ctx.closePath(); @@ -145,8 +144,6 @@ function Guide() var ctx = this.el.getContext('2d'); var p = new Path2D(path); - ctx.setLineDash([0,0]); - ctx.strokeStyle = style.color; ctx.lineWidth = style.thickness * this.scale; ctx.lineCap = style.strokeLinecap; @@ -159,29 +156,26 @@ function Guide() if(style.strokeLineDash){ ctx.setLineDash(style.strokeLineDash); } - ctx.stroke(p); + ctx.setLineDash([0,0]); } this.draw_translation = function() { if(!dotgrid.cursor.translation){ return; } - // From - var ctx = this.el.getContext('2d'); - var from = dotgrid.cursor.translation.from; - var to = dotgrid.cursor.translation.to; - if(to.x<=0) { - ctx.beginPath(); - ctx.setLineDash([0,0]); - ctx.moveTo((from.x * -this.scale)+30,(from.y * this.scale)+30); - ctx.lineTo((to.x * -this.scale)+30,(to.y * this.scale)+30); - ctx.lineCap="round"; - ctx.lineWidth = 5; - ctx.strokeStyle = dotgrid.theme.active.b_inv; - ctx.stroke(); - ctx.closePath(); - } + var ctx = this.el.getContext('2d'); + + ctx.beginPath(); + ctx.moveTo((dotgrid.cursor.translation.from.x * this.scale),(dotgrid.cursor.translation.from.y * this.scale)); + ctx.lineTo((dotgrid.cursor.translation.to.x * this.scale),(dotgrid.cursor.translation.to.y * this.scale)); + ctx.lineCap="round"; + ctx.lineWidth = 5; + ctx.strokeStyle = dotgrid.theme.active.b_inv; + ctx.setLineDash([5,10]); + ctx.stroke(); + ctx.setLineDash([0,0]); + ctx.closePath(); } this.draw_cursor = function(pos = dotgrid.cursor.pos,radius = dotgrid.tool.style().thickness-1) @@ -189,28 +183,17 @@ function Guide() var ctx = this.el.getContext('2d'); ctx.beginPath(); - ctx.setLineDash([0,0]); ctx.lineWidth = 3; - ctx.lineCap="round"; + ctx.lineCap = "round"; ctx.arc(Math.abs(pos.x * -this.scale), Math.abs(pos.y * this.scale), 3, 0, 2 * Math.PI, false); ctx.fillStyle = dotgrid.theme.active.f_low; ctx.fill(); ctx.closePath(); ctx.beginPath(); - ctx.setLineDash([0,0]); ctx.lineWidth = 3; - ctx.lineCap="round"; - ctx.arc(Math.abs(pos.x * -this.scale)+30, Math.abs(pos.y * this.scale)+30, 3, 0, 2 * Math.PI, false); - ctx.fillStyle = dotgrid.theme.active.f_low; - ctx.fill(); - ctx.closePath(); - - ctx.beginPath(); - ctx.setLineDash([0,0]); - ctx.lineWidth = 3; - ctx.lineCap="round"; - ctx.arc(Math.abs(pos.x * -this.scale)+30, Math.abs(pos.y * this.scale)+30, clamp(radius,5,100), 0, 2 * Math.PI, false); + ctx.lineCap = "round"; + ctx.arc(Math.abs(pos.x * -this.scale), Math.abs(pos.y * this.scale), clamp(radius,5,100), 0, 2 * Math.PI, false); ctx.strokeStyle = dotgrid.theme.active.f_med; ctx.stroke(); ctx.closePath(); @@ -231,7 +214,6 @@ function Guide() strokeLinejoin:"round", strokeLineDash:[5, 15] } - this.draw_path(path,style) }