Some progress

This commit is contained in:
Devine Lu Linvega 2019-01-09 16:27:59 +12:00
parent d4812be0a8
commit 136ffa55fc
2 changed files with 27 additions and 25 deletions

View File

@ -8,7 +8,7 @@ function Dotgrid (width, height) {
this.theme = new Theme(defaultTheme) this.theme = new Theme(defaultTheme)
this.history = new History() this.history = new History()
this.grid = {x:20,y:20} this.grid = { x: 20, y: 20, width: 0, height: 0 }
// ISU // ISU
@ -118,16 +118,16 @@ function Dotgrid (width, height) {
console.log('No window') console.log('No window')
} }
this.grid.x = size.width / 15 this.grid = {
this.grid.y = size.height / 15 x: size.width / 15,
y: size.height / 15,
this.grid_width = this.tool.settings.size.width / this.grid.x width: this.tool.settings.size.width / size.width / 15,
this.grid_height = this.tool.settings.size.height / this.grid.y height: this.tool.settings.size.height / size.height / 15
}
DOTGRID.renderer.resize(size)
this.renderer.resize(size)
this.interface.update() this.interface.update()
DOTGRID.renderer.update() this.renderer.update()
} }
this.set_zoom = function (scale) { this.set_zoom = function (scale) {
@ -151,29 +151,31 @@ function Dotgrid (width, height) {
this.history.clear() this.history.clear()
this.tool.reset() this.tool.reset()
this.reset() this.reset()
DOTGRID.renderer.update() this.renderer.update()
DOTGRID.interface.update(true) this.interface.update(true)
} }
this.resize = function () { this.resize = function () {
const size = { width: step(window.innerWidth - 90, 15), height: step(window.innerHeight - 120, 15) } const size = { width: step(window.innerWidth - 90, 15), height: step(window.innerHeight - 120, 15) }
if (size.width == DOTGRID.tool.settings.size.width && size.height == DOTGRID.tool.settings.size.height) { if (size.width == this.tool.settings.size.width && size.height == this.tool.settings.size.height) {
return return
} }
console.log(`Resized: ${size.width}x${size.height}`) console.log(`Resized: ${size.width}x${size.height}`)
DOTGRID.tool.settings.size.width = size.width this.tool.settings.size.width = size.width
DOTGRID.tool.settings.size.height = size.height this.tool.settings.size.height = size.height
DOTGRID.grid.x = size.width / 15 this.grid = {
DOTGRID.grid.y = size.height / 15 x: size.width / 15,
y: size.height / 15
}
DOTGRID.grid_width = DOTGRID.tool.settings.size.width / DOTGRID.grid.x this.grid.width = this.tool.settings.size.width / this.grid.x
DOTGRID.grid_height = DOTGRID.tool.settings.size.height / DOTGRID.grid.y this.grid.height = this.tool.settings.size.height / this.grid.y
DOTGRID.renderer.resize(size) this.renderer.resize(size)
document.title = `Dotgrid — ${size.width}x${size.height}` document.title = `Dotgrid — ${size.width}x${size.height}`
} }

View File

@ -60,13 +60,13 @@ function Renderer (dotgrid) {
if (dotgrid.tool.style().mirror_style === 0) { 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 + (this.scale * dotgrid.grid_height) } const middle = { x: dotgrid.tool.settings.size.width + (dotgrid.grid.width), y: dotgrid.tool.settings.size.height + (this.scale * dotgrid.grid.height) }
if (dotgrid.tool.style().mirror_style === 1 || dotgrid.tool.style().mirror_style === 3) { if (dotgrid.tool.style().mirror_style === 1 || dotgrid.tool.style().mirror_style === 3) {
this.drawRule({ x: middle.x, y: dotgrid.grid_height * this.scale }, { x: middle.x, y: (dotgrid.tool.settings.size.height + dotgrid.grid_height) * this.scale }) this.drawRule({ x: middle.x, y: dotgrid.grid.height * this.scale }, { x: middle.x, y: (dotgrid.tool.settings.size.height + dotgrid.grid.height) * this.scale })
} }
if (dotgrid.tool.style().mirror_style === 2 || dotgrid.tool.style().mirror_style === 3) { if (dotgrid.tool.style().mirror_style === 2 || dotgrid.tool.style().mirror_style === 3) {
this.drawRule({ x: dotgrid.grid_width * this.scale, y: middle.y }, { x: (dotgrid.tool.settings.size.width + dotgrid.grid_width) * this.scale, y: middle.y }) this.drawRule({ x: dotgrid.grid.width * this.scale, y: middle.y }, { x: (dotgrid.tool.settings.size.width + dotgrid.grid.width) * this.scale, y: middle.y })
} }
} }
@ -91,7 +91,7 @@ function Renderer (dotgrid) {
this.drawGrid = function () { this.drawGrid = function () {
if (!this.showExtras) { return } if (!this.showExtras) { return }
const cursor = { x: parseInt(dotgrid.cursor.pos.x / dotgrid.grid_width), y: parseInt(dotgrid.cursor.pos.y / dotgrid.grid_width) } const cursor = { x: parseInt(dotgrid.cursor.pos.x / dotgrid.grid.width), y: parseInt(dotgrid.cursor.pos.y / dotgrid.grid.width) }
for (let x = dotgrid.grid.x - 1; x >= 0; x--) { for (let x = dotgrid.grid.x - 1; x >= 0; x--) {
for (let y = dotgrid.grid.y; y >= 0; y--) { for (let y = dotgrid.grid.y; y >= 0; y--) {
@ -101,8 +101,8 @@ function Renderer (dotgrid) {
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 } 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.drawMarker({ this.drawMarker({
x: parseInt(x * dotgrid.grid_width) + dotgrid.grid_width, x: parseInt(x * dotgrid.grid.width) + dotgrid.grid.width,
y: parseInt(y * dotgrid.grid_height) + dotgrid.grid_height y: parseInt(y * dotgrid.grid.height) + dotgrid.grid.height
}, is_step ? 2.5 : 1.5, color) }, is_step ? 2.5 : 1.5, color)
} }
} }