Cleanup

desktop/sources/scripts/dotgrid.js

@@ -58,7 +58,7 @@ function Dotgrid (width, height, grid_x, grid_y, block_x, block_y) {
 
   this.new = function () {
     this.set_zoom(1.0)
-    this.set_size({ width: 300, height: 300 })
+    this.setSize({ width: 300, height: 300 })
     this.history.push(this.tool.layers)
     this.clear()
   }
@@ -87,25 +87,25 @@ function Dotgrid (width, height, grid_x, grid_y, block_x, block_y) {
   this.save = function () {
     if (DOTGRID.tool.length() < 1) { console.warn('Nothing to save'); return }
 
-    this.renderer.to_grid(grab)
+    this.renderer.toGRID(grab)
   }
 
   this.export = function () {
     if (DOTGRID.tool.length() < 1) { console.warn('Nothing to export'); return }
 
-    this.renderer.to_svg(grab)
+    this.renderer.toSVG(grab)
   }
 
   this.render = function () {
     if (DOTGRID.tool.length() < 1) { console.warn('Nothing to render'); return }
 
     const size = { width: DOTGRID.tool.settings.size.width * 2, height: DOTGRID.tool.settings.size.height * 2 }
-    this.renderer.to_png(size, grab)
+    this.renderer.toPNG(size, grab)
   }
 
   // Basics
 
-  this.set_size = function (size = { width: 300, height: 300 }, ui = true, scale = 1) {
+  this.setSize = function (size = { width: 300, height: 300 }, ui = true, scale = 1) {
     size = { width: clamp(step(size.width, 15), 105, 1080), height: clamp(step(size.height, 15), 120, 1080) }
 
     this.tool.settings.size.width = size.width
@@ -131,7 +131,7 @@ function Dotgrid (width, height, grid_x, grid_y, block_x, block_y) {
   }
 
   this.set_zoom = function (scale) {
-    this.set_size({ width: this.tool.settings.size.width, height: this.tool.settings.size.height }, true, scale)
+    this.setSize({ width: this.tool.settings.size.width, height: this.tool.settings.size.height }, true, scale)
 
     try {
       webFrame.setZoomFactor(scale)

desktop/sources/scripts/guide.js

@@ -24,12 +24,19 @@ DOTGRID.Guide = function () {
     this.drawMirror()
     this.drawRulers()
 
+    DOTGRID.renderer.update()
+    let ctx = this.el.getContext('2d')
+    let image64 = DOTGRID.renderer.svg64()
+    let img = new Image()
+    img.src = image64
+    ctx.drawImage(img, 0, 0, this.el.width, this.el.height)
+
     if (DOTGRID.tool.index == 2) { this.drawMarkers(); this.drawVertices() }
-    this.drawPath(new Generator(DOTGRID.tool.layers[2], DOTGRID.tool.styles[2]).toString({ x: 0, y: 0 }, this.scale), DOTGRID.tool.styles[2])
+    // this.drawPath(new Generator(DOTGRID.tool.layers[2], DOTGRID.tool.styles[2]).toString({ x: 0, y: 0 }, this.scale), DOTGRID.tool.styles[2])
     if (DOTGRID.tool.index == 1) { this.drawMarkers(); this.drawVertices() }
-    this.drawPath(new Generator(DOTGRID.tool.layers[1], DOTGRID.tool.styles[1]).toString({ x: 0, y: 0 }, this.scale), DOTGRID.tool.styles[1])
+    // this.drawPath(new Generator(DOTGRID.tool.layers[1], DOTGRID.tool.styles[1]).toString({ x: 0, y: 0 }, this.scale), DOTGRID.tool.styles[1])
     if (DOTGRID.tool.index == 0) { this.drawMarkers(); this.drawVertices() }
-    this.drawPath(new Generator(DOTGRID.tool.layers[0], DOTGRID.tool.styles[0]).toString({ x: 0, y: 0 }, this.scale), DOTGRID.tool.styles[0])
+    // this.drawPath(new Generator(DOTGRID.tool.layers[0], DOTGRID.tool.styles[0]).toString({ x: 0, y: 0 }, this.scale), DOTGRID.tool.styles[0])
 
     this.drawHandles()
     this.drawTranslation()

desktop/sources/scripts/renderer.js

@@ -17,10 +17,10 @@ DOTGRID.Renderer = function () {
   this.svg_el.appendChild(this.layer_1)
 
   this.update = function () {
-    this.svg_el.setAttribute('width', (DOTGRID.tool.settings.size.width - (5)) + 'px')
+    this.svg_el.setAttribute('width', (DOTGRID.tool.settings.size.width) + 'px')
-    this.svg_el.setAttribute('height', (DOTGRID.tool.settings.size.height + (10)) + 'px')
+    this.svg_el.setAttribute('height', (DOTGRID.tool.settings.size.height) + 'px')
-    this.svg_el.style.width = (DOTGRID.tool.settings.size.width - (5))
+    this.svg_el.style.width = (DOTGRID.tool.settings.size.width)
-    this.svg_el.style.height = DOTGRID.tool.settings.size.height + (10)
+    this.svg_el.style.height = DOTGRID.tool.settings.size.height
     this.svg_el.style.strokeWidth = DOTGRID.tool.style().thickness
 
     let styles = DOTGRID.tool.styles
@@ -57,31 +57,31 @@ DOTGRID.Renderer = function () {
     return b64Start + svg64
   }
 
-  this.to_png = function (size = DOTGRID.tool.settings.size, callback) {
+  this.toPNG = function (size = DOTGRID.tool.settings.size, callback) {
     let image64 = this.svg64()
     let img = new Image()
 
     let canvas = document.createElement('canvas')
 
     canvas.width = (size.width) * 2
-    canvas.height = (size.height + 30) * 2
+    canvas.height = (size.height) * 2
 
     let ctx = canvas.getContext('2d')
 
     img.onload = function () {
-      ctx.drawImage(img, 0, 0, (size.width) * 2, (size.height + 30) * 2)
+      ctx.drawImage(img, 0, 0, (size.width) * 2, (size.height) * 2)
       let data = canvas.toDataURL('image/png')
       callback(data, 'export.png')
     }
     img.src = image64
   }
 
-  this.to_svg = function (callback) {
+  this.toSVG = function (callback) {
     const image64 = this.svg64()
     callback(image64, 'export.svg')
   }
 
-  this.to_grid = function (callback) {
+  this.toGRID = function (callback) {
     const text = DOTGRID.tool.export()
     const file = new Blob([text], { type: 'text/plain' })
     callback(URL.createObjectURL(file), 'export.grid')

desktop/sources/scripts/tool.js

@@ -77,7 +77,7 @@ DOTGRID.Tool = function () {
       dot.settings.size = { width: dot.settings.width, height: dot.settings.height }
     }
     if (this.settings && (this.settings.size.width != dot.settings.size.width || this.settings.size.height != dot.settings.size.height)) {
-      DOTGRID.set_size({ width: dot.settings.size.width, height: dot.settings.size.height })
+      DOTGRID.setSize({ width: dot.settings.size.width, height: dot.settings.size.height })
     }
 
     this.layers = dot.layers