Renamed some variables

This commit is contained in:
Devine Lu Linvega 2019-01-08 18:22:14 +12:00
parent 56c9e21699
commit 6bcaeccc5c
3 changed files with 50 additions and 50 deletions

View File

@ -7,7 +7,7 @@ DOTGRID.Guide = function () {
this.el.height = 640
this.el.style.width = '320px'
this.el.style.height = '320px'
this.show_extras = true
this.showExtras = true
this.scale = 2
@ -21,20 +21,20 @@ DOTGRID.Guide = function () {
this.el.getContext('2d').restore()
this.draw_mirror()
this.draw_rulers()
this.drawMirror()
this.drawRulers()
if (DOTGRID.tool.index == 2) { this.draw_markers(); this.draw_vertices() }
this.draw_path(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.draw_markers(); this.draw_vertices() }
this.draw_path(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.draw_markers(); this.draw_vertices() }
this.draw_path(new Generator(DOTGRID.tool.layers[0], DOTGRID.tool.styles[0]).toString({ x: 0, y: 0 }, this.scale), DOTGRID.tool.styles[0])
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])
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])
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.draw_handles()
this.draw_translation()
this.draw_cursor()
this.draw_preview()
this.drawHandles()
this.drawTranslation()
this.drawCursor()
this.drawPreview()
}
this.clear = function () {
@ -42,7 +42,7 @@ DOTGRID.Guide = function () {
}
this.toggle = function () {
this.show_extras = !this.show_extras
this.showExtras = !this.showExtras
this.update()
DOTGRID.interface.update(true)
}
@ -57,41 +57,41 @@ DOTGRID.Guide = function () {
this.update()
}
this.draw_mirror = function () {
if (!this.show_extras) { return }
this.drawMirror = function () {
if (!this.showExtras) { return }
if (DOTGRID.tool.style().mirror_style === 0) { return }
const middle = { x: DOTGRID.tool.settings.size.width + (DOTGRID.grid_width), y: DOTGRID.tool.settings.size.height + (2 * DOTGRID.grid_height) }
if (DOTGRID.tool.style().mirror_style === 1 || DOTGRID.tool.style().mirror_style === 3) {
this.draw_rule({ x: middle.x, y: DOTGRID.grid_height * 2 }, { x: middle.x, y: (DOTGRID.tool.settings.size.height + DOTGRID.grid_height) * 2 })
this.drawRule({ x: middle.x, y: DOTGRID.grid_height * 2 }, { x: middle.x, y: (DOTGRID.tool.settings.size.height + DOTGRID.grid_height) * 2 })
}
if (DOTGRID.tool.style().mirror_style === 2 || DOTGRID.tool.style().mirror_style === 3) {
this.draw_rule({ x: DOTGRID.grid_width * 2, y: middle.y }, { x: (DOTGRID.tool.settings.size.width + DOTGRID.grid_width) * 2, y: middle.y })
this.drawRule({ x: DOTGRID.grid_width * 2, y: middle.y }, { x: (DOTGRID.tool.settings.size.width + DOTGRID.grid_width) * 2, y: middle.y })
}
}
this.draw_handles = function () {
if (!this.show_extras) { return }
this.drawHandles = function () {
if (!this.showExtras) { return }
for (const segment_id in DOTGRID.tool.layer()) {
const segment = DOTGRID.tool.layer()[segment_id]
for (const vertex_id in segment.vertices) {
const vertex = segment.vertices[vertex_id]
this.draw_handle(vertex)
this.drawHandle(vertex)
}
}
}
this.draw_vertices = function () {
this.drawVertices = function () {
for (const id in DOTGRID.tool.vertices) {
this.draw_vertex(DOTGRID.tool.vertices[id])
this.drawVertex(DOTGRID.tool.vertices[id])
}
}
this.draw_markers = function () {
if (!this.show_extras) { return }
this.drawMarkers = function () {
if (!this.showExtras) { return }
const cursor = { x: parseInt(DOTGRID.cursor.pos.x / DOTGRID.grid_width), y: parseInt(DOTGRID.cursor.pos.y / DOTGRID.grid_width) }
@ -102,7 +102,7 @@ DOTGRID.Guide = function () {
let color = is_step ? DOTGRID.theme.active.b_med : DOTGRID.theme.active.b_low
if ((y == 0 || y == DOTGRID.grid_y) && cursor.x == x + 1) { color = DOTGRID.theme.active.b_high } else if ((x == 0 || x == DOTGRID.grid_x - 1) && cursor.y == y + 1) { color = DOTGRID.theme.active.b_high } else if (cursor.x == x + 1 && cursor.y == y + 1) { color = DOTGRID.theme.active.b_high }
this.draw_marker({
this.drawMarker({
x: parseInt(x * DOTGRID.grid_width) + DOTGRID.grid_width,
y: parseInt(y * DOTGRID.grid_height) + DOTGRID.grid_height
}, is_step ? 2.5 : 1.5, color)
@ -110,7 +110,7 @@ DOTGRID.Guide = function () {
}
}
this.draw_marker = function (pos, radius = 1, color) {
this.drawMarker = function (pos, radius = 1, color) {
let ctx = this.el.getContext('2d')
ctx.beginPath()
ctx.lineWidth = 2
@ -120,7 +120,7 @@ DOTGRID.Guide = function () {
ctx.closePath()
}
this.draw_vertex = function (pos, radius = 5) {
this.drawVertex = function (pos, radius = 5) {
let ctx = this.el.getContext('2d')
ctx.beginPath()
ctx.lineWidth = 2
@ -130,7 +130,7 @@ DOTGRID.Guide = function () {
ctx.closePath()
}
this.draw_rule = function (from, to) {
this.drawRule = function (from, to) {
let ctx = this.el.getContext('2d')
ctx.beginPath()
@ -143,7 +143,7 @@ DOTGRID.Guide = function () {
ctx.closePath()
}
this.draw_ruler = function (pos) {
this.drawRuler = function (pos) {
let offset = 15 * this.scale
let top = offset
let bottom = (DOTGRID.tool.settings.size.height * this.scale) + offset
@ -151,22 +151,22 @@ DOTGRID.Guide = function () {
let right = (DOTGRID.tool.settings.size.width * this.scale)
// Translation
this.draw_rule({ x: pos.x * this.scale, y: top }, { x: pos.x * this.scale, y: bottom })
this.draw_rule({ x: left, y: pos.y * this.scale }, { x: right, y: pos.y * this.scale })
this.drawRule({ x: pos.x * this.scale, y: top }, { x: pos.x * this.scale, y: bottom })
this.drawRule({ x: left, y: pos.y * this.scale }, { x: right, y: pos.y * this.scale })
}
this.draw_rulers = function () {
this.drawRulers = function () {
if (!DOTGRID.cursor.translation) { return }
let ctx = this.el.getContext('2d')
this.draw_ruler(DOTGRID.cursor.translation.to)
this.drawRuler(DOTGRID.cursor.translation.to)
ctx.setLineDash([])
ctx.restore()
}
this.draw_handle = function (pos, radius = 6) {
this.drawHandle = function (pos, radius = 6) {
let ctx = this.el.getContext('2d')
ctx.beginPath()
@ -192,7 +192,7 @@ DOTGRID.Guide = function () {
ctx.closePath()
}
this.draw_path = function (path, style) {
this.drawPath = function (path, style) {
let ctx = this.el.getContext('2d')
let p = new Path2D(path)
@ -211,7 +211,7 @@ DOTGRID.Guide = function () {
ctx.stroke(p)
}
this.draw_translation = function () {
this.drawTranslation = function () {
if (!DOTGRID.cursor.translation) { return }
let ctx = this.el.getContext('2d')
@ -230,7 +230,7 @@ DOTGRID.Guide = function () {
ctx.restore()
}
this.draw_cursor = function (pos = DOTGRID.cursor.pos, radius = DOTGRID.tool.style().thickness - 1) {
this.drawCursor = function (pos = DOTGRID.cursor.pos, radius = DOTGRID.tool.style().thickness - 1) {
let ctx = this.el.getContext('2d')
ctx.beginPath()
@ -250,11 +250,11 @@ DOTGRID.Guide = function () {
ctx.closePath()
}
this.draw_preview = function () {
this.drawPreview = function () {
let ctx = this.el.getContext('2d')
let operation = DOTGRID.cursor.operation && DOTGRID.cursor.operation.cast ? DOTGRID.cursor.operation.cast : null
if (!DOTGRID.tool.can_cast(operation)) { return }
if (!DOTGRID.tool.canCast(operation)) { return }
if (operation == 'close') { return }
let path = new Generator([{ vertices: DOTGRID.tool.vertices, type: operation }]).toString({ x: 0, y: 0 }, 2)
@ -265,7 +265,7 @@ DOTGRID.Guide = function () {
strokeLinejoin: 'round',
strokeLineDash: [5, 15]
}
this.draw_path(path, style)
this.drawPath(path, style)
ctx.setLineDash([])
ctx.restore()

View File

@ -108,11 +108,11 @@ DOTGRID.Interface = function () {
if (segments[i].vertices.length > 2) { multi_vertices = true; break }
}
document.getElementById('option_line').className.baseVal = !DOTGRID.tool.can_cast('line') ? 'icon inactive' : 'icon'
document.getElementById('option_arc_c').className.baseVal = !DOTGRID.tool.can_cast('arc_c') ? 'icon inactive' : 'icon'
document.getElementById('option_arc_r').className.baseVal = !DOTGRID.tool.can_cast('arc_r') ? 'icon inactive' : 'icon'
document.getElementById('option_bezier').className.baseVal = !DOTGRID.tool.can_cast('bezier') ? 'icon inactive' : 'icon'
document.getElementById('option_close').className.baseVal = !DOTGRID.tool.can_cast('close') ? 'icon inactive' : 'icon'
document.getElementById('option_line').className.baseVal = !DOTGRID.tool.canCast('line') ? 'icon inactive' : 'icon'
document.getElementById('option_arc_c').className.baseVal = !DOTGRID.tool.canCast('arc_c') ? 'icon inactive' : 'icon'
document.getElementById('option_arc_r').className.baseVal = !DOTGRID.tool.canCast('arc_r') ? 'icon inactive' : 'icon'
document.getElementById('option_bezier').className.baseVal = !DOTGRID.tool.canCast('bezier') ? 'icon inactive' : 'icon'
document.getElementById('option_close').className.baseVal = !DOTGRID.tool.canCast('close') ? 'icon inactive' : 'icon'
document.getElementById('option_thickness').className.baseVal = DOTGRID.tool.layer().length < 1 ? 'icon inactive' : 'icon'
document.getElementById('option_linecap').className.baseVal = DOTGRID.tool.layer().length < 1 ? 'icon inactive' : 'icon'
@ -130,10 +130,10 @@ DOTGRID.Interface = function () {
document.getElementById('option_export').className.baseVal = sum_segments < 1 ? 'icon inactive source' : 'icon source'
document.getElementById('option_render').className.baseVal = sum_segments < 1 ? 'icon inactive source' : 'icon source'
document.getElementById('option_grid').className.baseVal = DOTGRID.guide.show_extras ? 'icon inactive source' : 'icon source'
document.getElementById('option_grid').className.baseVal = DOTGRID.guide.showExtras ? 'icon inactive source' : 'icon source'
// Grid
if (DOTGRID.guide.show_extras) { document.getElementById('grid_path').setAttribute('d', 'M65,155 Q155,245 245,155 M65,155 Q155,65 245,155 M155,125 A30,30 0 0,1 185,155 A30,30 0 0,1 155,185 A30,30 0 0,1 125,155 A30,30 0 0,1 155,125 ') } else { document.getElementById('grid_path').setAttribute('d', 'M65,155 Q155,245 245,155 M65,155 ') }
if (DOTGRID.guide.showExtras) { document.getElementById('grid_path').setAttribute('d', 'M65,155 Q155,245 245,155 M65,155 Q155,65 245,155 M155,125 A30,30 0 0,1 185,155 A30,30 0 0,1 155,185 A30,30 0 0,1 125,155 A30,30 0 0,1 155,125 ') } else { document.getElementById('grid_path').setAttribute('d', 'M65,155 Q155,245 245,155 M65,155 ') }
// Mirror
if (DOTGRID.tool.style().mirror_style == 0) { document.getElementById('mirror_path').setAttribute('d', 'M60,60 L60,60 L120,120 M180,180 L180,180 L240,240 M210,90 L210,90 L180,120 M120,180 L120,180 L90,210') } else if (DOTGRID.tool.style().mirror_style == 1) { document.getElementById('mirror_path').setAttribute('d', 'M60,60 L240,240 M180,120 L210,90 M120,180 L90,210') } else if (DOTGRID.tool.style().mirror_style == 2) { document.getElementById('mirror_path').setAttribute('d', 'M210,90 L210,90 L90,210 M60,60 L60,60 L120,120 M180,180 L180,180 L240,240') } else if (DOTGRID.tool.style().mirror_style == 3) { document.getElementById('mirror_path').setAttribute('d', 'M60,60 L60,60 L120,120 L180,120 L210,90 M240,240 L240,240 L180,180 L120,180 L90,210') } else if (DOTGRID.tool.style().mirror_style == 4) { document.getElementById('mirror_path').setAttribute('d', 'M120,120 L120,120 L120,120 L180,120 M120,150 L120,150 L180,150 M120,180 L120,180 L180,180 L180,180 L180,180 L240,240 M120,210 L120,210 L180,210 M120,90 L120,90 L180,90 M60,60 L60,60 L120,120 ') }

View File

@ -163,7 +163,7 @@ DOTGRID.Tool = function () {
this.cast = function (type) {
if (!this.layer()) { this.layers[this.index] = [] }
if (!this.can_cast(type)) { console.warn('Cannot cast'); return }
if (!this.canCast(type)) { console.warn('Cannot cast'); return }
this.add_segment(type, this.vertices.slice())
@ -227,7 +227,7 @@ DOTGRID.Tool = function () {
return false
}
this.can_cast = function (type) {
this.canCast = function (type) {
if (!type) { return false }
// Cannot cast close twice
if (type == 'close') {