Atlas48/pointvec
1
0
Fork 0
Code Issues Pull Requests Projects Releases Wiki Activity

Cleanup in progress

Browse Source
This commit is contained in:
Devine Lu Linvega 2019-04-22 08:49:47 +09:00
parent e045a6023f
commit 64f5853156
15 changed files with 241 additions and 233 deletions
Show Stats Download Patch File Download Diff File Expand all files Collapse all files

2
desktop/.eslintrc.json
View File

@ -5,6 +5,6 @@
"node": true "node": true
}, },
"globals": { "globals": {
"DOTGRID": true "dotgrid": true
} }
} }

2
desktop/main.js
View File

@ -24,7 +24,7 @@ app.on('ready', () => {
}) })
app.win.loadURL(`file://${__dirname}/sources/index.html`) app.win.loadURL(`file://${__dirname}/sources/index.html`)
// app.inspect() app.inspect()
app.win.on('closed', () => { app.win.on('closed', () => {
win = null win = null

2
desktop/package.json
View File

@ -32,7 +32,7 @@
"dependencies": {}, "dependencies": {},
"standard": { "standard": {
"globals": [ "globals": [
"DOTGRID" "dotgrid"
] ]
} }
} }

152
desktop/sources/index.html
View File

@ -11,6 +11,7 @@
<!-- Dotgrid --> <!-- Dotgrid -->
<script type="text/javascript" src="scripts/dotgrid.js"></script> <script type="text/javascript" src="scripts/dotgrid.js"></script>
<script type="text/javascript" src="scripts/manager.js"></script> <script type="text/javascript" src="scripts/manager.js"></script>
<script type="text/javascript" src="scripts/source.js"></script>
<script type="text/javascript" src="scripts/renderer.js"></script> <script type="text/javascript" src="scripts/renderer.js"></script>
<script type="text/javascript" src="scripts/cursor.js"></script> <script type="text/javascript" src="scripts/cursor.js"></script>
<script type="text/javascript" src="scripts/interface.js"></script> <script type="text/javascript" src="scripts/interface.js"></script>
@ -33,94 +34,97 @@
const {dialog,app} = require('electron').remote; const {dialog,app} = require('electron').remote;
const fs = require('fs'); const fs = require('fs');
DOTGRID.controller = new Controller(); const dotgrid = new Dotgrid()
dotgrid.controller = new Controller();
DOTGRID.controller.add("default","*","About",() => { require('electron').shell.openExternal('https://github.com/hundredrabbits/Dotgrid'); },"CmdOrCtrl+,"); dotgrid.controller.add("default","*","About",() => { require('electron').shell.openExternal('https://github.com/hundredrabbits/Dotgrid'); },"CmdOrCtrl+,");
DOTGRID.controller.add("default","*","Fullscreen",() => { app.toggleFullscreen(); },"CmdOrCtrl+Enter"); dotgrid.controller.add("default","*","Fullscreen",() => { app.toggleFullscreen(); },"CmdOrCtrl+Enter");
DOTGRID.controller.add("default","*","Hide",() => { app.toggleVisible(); },"CmdOrCtrl+H"); dotgrid.controller.add("default","*","Hide",() => { app.toggleVisible(); },"CmdOrCtrl+H");
DOTGRID.controller.add("default","*","Inspect",() => { app.inspect(); },"CmdOrCtrl+."); dotgrid.controller.add("default","*","Inspect",() => { app.inspect(); },"CmdOrCtrl+.");
DOTGRID.controller.add("default","*","Reset",() => { DOTGRID.reset(); DOTGRID.theme.reset(); },"CmdOrCtrl+Backspace"); dotgrid.controller.add("default","*","Reset",() => { dotgrid.reset(); dotgrid.theme.reset(); },"CmdOrCtrl+Backspace");
DOTGRID.controller.add("default","*","Quit",() => { app.exit(); },"CmdOrCtrl+Q"); dotgrid.controller.add("default","*","Quit",() => { app.exit(); },"CmdOrCtrl+Q");
DOTGRID.controller.add("default","File","New",() => { DOTGRID.new(); },"CmdOrCtrl+N"); dotgrid.controller.add("default","File","New",() => { dotgrid.source.new(); },"CmdOrCtrl+N");
DOTGRID.controller.add("default","File","Open",() => { DOTGRID.open(); },"CmdOrCtrl+O"); dotgrid.controller.add("default","File","Open",() => { dotgrid.source.open(); },"CmdOrCtrl+O");
DOTGRID.controller.add("default","File","Save(.grid)",() => { DOTGRID.save(); },"CmdOrCtrl+S"); dotgrid.controller.add("default","File","Save(.grid)",() => { dotgrid.source.save(); },"CmdOrCtrl+S");
DOTGRID.controller.add("default","File","Render(.png)",() => { DOTGRID.render(); },"CmdOrCtrl+R"); dotgrid.controller.add("default","File","Render(.png)",() => { dotgrid.source.render(); },"CmdOrCtrl+R");
DOTGRID.controller.add("default","File","Export(.svg)",() => { DOTGRID.export(); },"CmdOrCtrl+E"); dotgrid.controller.add("default","File","Export(.svg)",() => { dotgrid.source.export(); },"CmdOrCtrl+E");
DOTGRID.controller.add_role("default","Edit","copy"); dotgrid.controller.addRole("default","Edit","copy");
DOTGRID.controller.add_role("default","Edit","cut"); dotgrid.controller.addRole("default","Edit","cut");
DOTGRID.controller.add_role("default","Edit","paste"); dotgrid.controller.addRole("default","Edit","paste");
DOTGRID.controller.add("default","Edit","Undo",() => { DOTGRID.tool.undo() },"CmdOrCtrl+Z"); dotgrid.controller.add("default","Edit","Undo",() => { dotgrid.tool.undo() },"CmdOrCtrl+Z");
DOTGRID.controller.add("default","Edit","Redo",() => { DOTGRID.tool.redo() },"CmdOrCtrl+Shift+Z"); dotgrid.controller.add("default","Edit","Redo",() => { dotgrid.tool.redo() },"CmdOrCtrl+Shift+Z");
DOTGRID.controller.add("default","Stroke","Line",() => { DOTGRID.tool.cast("line"); },"A"); dotgrid.controller.add("default","Stroke","Line",() => { dotgrid.tool.cast("line"); },"A");
DOTGRID.controller.add("default","Stroke","Arc",() => { DOTGRID.tool.cast("arc_c"); },"S"); // 0,1 dotgrid.controller.add("default","Stroke","Arc",() => { dotgrid.tool.cast("arc_c"); },"S"); // 0,1
DOTGRID.controller.add("default","Stroke","Arc Rev",() => { DOTGRID.tool.cast("arc_r")},"D"); // 0,0 dotgrid.controller.add("default","Stroke","Arc Rev",() => { dotgrid.tool.cast("arc_r")},"D"); // 0,0
DOTGRID.controller.add("default","Stroke","Bezier",() => { DOTGRID.tool.cast("bezier") },"F"); dotgrid.controller.add("default","Stroke","Bezier",() => { dotgrid.tool.cast("bezier") },"F");
DOTGRID.controller.add("default","Stroke","Close",() => { DOTGRID.tool.cast("close") },"Z"); dotgrid.controller.add("default","Stroke","Close",() => { dotgrid.tool.cast("close") },"Z");
DOTGRID.controller.add("default","Stroke","Arc(full)",() => { DOTGRID.tool.cast("arc_c_full"); },"T"); // 1,1 dotgrid.controller.add("default","Stroke","Arc(full)",() => { dotgrid.tool.cast("arc_c_full"); },"T"); // 1,1
DOTGRID.controller.add("default","Stroke","Arc Rev(full)",() => { DOTGRID.tool.cast("arc_r_full")},"Y"); // 1,0 dotgrid.controller.add("default","Stroke","Arc Rev(full)",() => { dotgrid.tool.cast("arc_r_full")},"Y"); // 1,0
DOTGRID.controller.add("default","Stroke","Clear Selection",() => { DOTGRID.tool.clear(); },"Escape"); dotgrid.controller.add("default","Stroke","Clear Selection",() => { dotgrid.tool.clear(); },"Escape");
DOTGRID.controller.add("default","Effect","Linecap",() => { DOTGRID.tool.toggle("linecap"); },"Q"); dotgrid.controller.add("default","Effect","Linecap",() => { dotgrid.tool.toggle("linecap"); },"Q");
DOTGRID.controller.add("default","Effect","Linejoin",() => { DOTGRID.tool.toggle("linejoin"); },"W"); dotgrid.controller.add("default","Effect","Linejoin",() => { dotgrid.tool.toggle("linejoin"); },"W");
DOTGRID.controller.add("default","Effect","Mirror",() => { DOTGRID.tool.toggle("mirror"); },"E"); dotgrid.controller.add("default","Effect","Mirror",() => { dotgrid.tool.toggle("mirror"); },"E");
DOTGRID.controller.add("default","Effect","Fill",() => { DOTGRID.tool.toggle("fill"); },"R"); dotgrid.controller.add("default","Effect","Fill",() => { dotgrid.tool.toggle("fill"); },"R");
DOTGRID.controller.add("default","Effect","Thicker",() => { DOTGRID.tool.toggle("thickness",1) },"}"); dotgrid.controller.add("default","Effect","Thicker",() => { dotgrid.tool.toggle("thickness",1) },"}");
DOTGRID.controller.add("default","Effect","Thinner",() => { DOTGRID.tool.toggle("thickness",-1) },"{"); dotgrid.controller.add("default","Effect","Thinner",() => { dotgrid.tool.toggle("thickness",-1) },"{");
DOTGRID.controller.add("default","Effect","Thicker +5",() => { DOTGRID.tool.toggle("thickness",5) },"]"); dotgrid.controller.add("default","Effect","Thicker +5",() => { dotgrid.tool.toggle("thickness",5) },"]");
DOTGRID.controller.add("default","Effect","Thinner -5",() => { DOTGRID.tool.toggle("thickness",-5) },"["); dotgrid.controller.add("default","Effect","Thinner -5",() => { dotgrid.tool.toggle("thickness",-5) },"[");
DOTGRID.controller.add("default","Effect","Toggle Crest",() => { DOTGRID.tool.toggleCrest(); }, "CmdOrCtrl+K"); dotgrid.controller.add("default","Effect","Toggle Crest",() => { dotgrid.tool.toggleCrest(); }, "CmdOrCtrl+K");
DOTGRID.controller.add("default","Manual","Add Point",() => { DOTGRID.tool.addVertex(DOTGRID.cursor.pos); DOTGRID.renderer.update() },"Enter"); dotgrid.controller.add("default","Manual","Add Point",() => { dotgrid.tool.addVertex(dotgrid.cursor.pos); dotgrid.renderer.update() },"Enter");
DOTGRID.controller.add("default","Manual","Move Up",() => { DOTGRID.cursor.pos.y -= 15; DOTGRID.renderer.update() },"Up"); dotgrid.controller.add("default","Manual","Move Up",() => { dotgrid.cursor.pos.y -= 15; dotgrid.renderer.update() },"Up");
DOTGRID.controller.add("default","Manual","Move Right",() => { DOTGRID.cursor.pos.x += 15; DOTGRID.renderer.update() },"Right"); dotgrid.controller.add("default","Manual","Move Right",() => { dotgrid.cursor.pos.x += 15; dotgrid.renderer.update() },"Right");
DOTGRID.controller.add("default","Manual","Move Down",() => { DOTGRID.cursor.pos.y += 15; DOTGRID.renderer.update() },"Down"); dotgrid.controller.add("default","Manual","Move Down",() => { dotgrid.cursor.pos.y += 15; dotgrid.renderer.update() },"Down");
DOTGRID.controller.add("default","Manual","Move Left",() => { DOTGRID.cursor.pos.x -= 15; DOTGRID.renderer.update() },"Left"); dotgrid.controller.add("default","Manual","Move Left",() => { dotgrid.cursor.pos.x -= 15; dotgrid.renderer.update() },"Left");
DOTGRID.controller.add("default","Manual","Remove Point",() => { DOTGRID.tool.removeSegmentsAt(DOTGRID.cursor.pos); },"Shift+Backspace"); dotgrid.controller.add("default","Manual","Remove Point",() => { dotgrid.tool.removeSegmentsAt(dotgrid.cursor.pos); },"Shift+Backspace");
DOTGRID.controller.add("default","Manual","Remove Segment",() => { DOTGRID.tool.removeSegment(); },"Backspace"); dotgrid.controller.add("default","Manual","Remove Segment",() => { dotgrid.tool.removeSegment(); },"Backspace");
DOTGRID.controller.add("default","Layers","Foreground",() => { DOTGRID.tool.selectLayer(0) },"CmdOrCtrl+1"); dotgrid.controller.add("default","Layers","Foreground",() => { dotgrid.tool.selectLayer(0) },"CmdOrCtrl+1");
DOTGRID.controller.add("default","Layers","Middleground",() => { DOTGRID.tool.selectLayer(1) },"CmdOrCtrl+2"); dotgrid.controller.add("default","Layers","Middleground",() => { dotgrid.tool.selectLayer(1) },"CmdOrCtrl+2");
DOTGRID.controller.add("default","Layers","Background",() => { DOTGRID.tool.selectLayer(2) },"CmdOrCtrl+3"); dotgrid.controller.add("default","Layers","Background",() => { dotgrid.tool.selectLayer(2) },"CmdOrCtrl+3");
DOTGRID.controller.add("default","Layers","Next Layer",() => { DOTGRID.tool.selectNextLayer() }); dotgrid.controller.add("default","Layers","Next Layer",() => { dotgrid.tool.selectNextLayer() });
DOTGRID.controller.add("default","Layers","Prev Layer",() => { DOTGRID.tool.selectPrevLayer() }); dotgrid.controller.add("default","Layers","Prev Layer",() => { dotgrid.tool.selectPrevLayer() });
DOTGRID.controller.add("default","Layers","Merge Layers",() => { DOTGRID.tool.merge() },"M"); dotgrid.controller.add("default","Layers","Merge Layers",() => { dotgrid.tool.merge() },"M");
DOTGRID.controller.add("default","View","Zoom In",() => { DOTGRID.modZoom(0.25) },"CmdOrCtrl+=") dotgrid.controller.add("default","View","Zoom In",() => { dotgrid.modZoom(0.25) },"CmdOrCtrl+=")
DOTGRID.controller.add("default","View","Zoom Out",() => { DOTGRID.modZoom(-0.25) },"CmdOrCtrl+-") dotgrid.controller.add("default","View","Zoom Out",() => { dotgrid.modZoom(-0.25) },"CmdOrCtrl+-")
DOTGRID.controller.add("default","View","Zoom Reset",() => { DOTGRID.modZoom(1,true) },"CmdOrCtrl+0") dotgrid.controller.add("default","View","Zoom Reset",() => { dotgrid.modZoom(1,true) },"CmdOrCtrl+0")
DOTGRID.controller.add("default","View","Color Picker",() => { DOTGRID.picker.start(); },"G"); dotgrid.controller.add("default","View","Color Picker",() => { dotgrid.picker.start(); },"G");
DOTGRID.controller.add("default","View","Toggle Grid",() => { DOTGRID.renderer.toggle(); },"H"); dotgrid.controller.add("default","View","Toggle Grid",() => { dotgrid.renderer.toggle(); },"H");
DOTGRID.controller.add("default","View","Toggle Interface",() => { DOTGRID.interface.toggle(); },"Tab"); dotgrid.controller.add("default","View","Toggle Interface",() => { dotgrid.interface.toggle(); },"Tab");
DOTGRID.controller.add("default","Theme","Open Theme",() => { DOTGRID.theme.open(); },"CmdOrCtrl+Shift+o") dotgrid.controller.add("default","Theme","Open Theme",() => { dotgrid.theme.open(); },"CmdOrCtrl+Shift+o")
DOTGRID.controller.add("default","Theme","Reset Theme",() => { DOTGRID.theme.reset(); },"CmdOrCtrl+Shift+Backspace") dotgrid.controller.add("default","Theme","Reset Theme",() => { dotgrid.theme.reset(); },"CmdOrCtrl+Shift+Backspace")
DOTGRID.controller.add("default","Theme","Download Themes..",() => { require('electron').shell.openExternal('https://github.com/hundredrabbits/Themes'); }) dotgrid.controller.add("default","Theme","Download Themes..",() => { require('electron').shell.openExternal('https://github.com/hundredrabbits/Themes'); })
DOTGRID.controller.add("picker","*","About",() => { require('electron').shell.openExternal('https://github.com/hundredrabbits/Dotgrid'); },"CmdOrCtrl+,"); dotgrid.controller.add("picker","*","About",() => { require('electron').shell.openExternal('https://github.com/hundredrabbits/Dotgrid'); },"CmdOrCtrl+,");
DOTGRID.controller.add("picker","*","Fullscreen",() => { app.toggleFullscreen(); },"CmdOrCtrl+Enter"); dotgrid.controller.add("picker","*","Fullscreen",() => { app.toggleFullscreen(); },"CmdOrCtrl+Enter");
DOTGRID.controller.add("picker","*","Hide",() => { app.toggleVisible(); },"CmdOrCtrl+H"); dotgrid.controller.add("picker","*","Hide",() => { app.toggleVisible(); },"CmdOrCtrl+H");
DOTGRID.controller.add("picker","*","Inspect",() => { app.inspect(); },"CmdOrCtrl+."); dotgrid.controller.add("picker","*","Inspect",() => { app.inspect(); },"CmdOrCtrl+.");
DOTGRID.controller.add("picker","*","Documentation",() => { DOTGRID.controller.docs(); },"CmdOrCtrl+Esc"); dotgrid.controller.add("picker","*","Documentation",() => { dotgrid.controller.docs(); },"CmdOrCtrl+Esc");
DOTGRID.controller.add("picker","*","Reset",() => { DOTGRID.reset(); DOTGRID.theme.reset(); },"CmdOrCtrl+Backspace"); dotgrid.controller.add("picker","*","Reset",() => { dotgrid.reset(); dotgrid.theme.reset(); },"CmdOrCtrl+Backspace");
DOTGRID.controller.add("picker","*","Quit",() => { app.exit(); },"CmdOrCtrl+Q"); dotgrid.controller.add("picker","*","Quit",() => { app.exit(); },"CmdOrCtrl+Q");
DOTGRID.controller.add_role("picker","Edit","undo"); dotgrid.controller.addRole("picker","Edit","undo");
DOTGRID.controller.add_role("picker","Edit","redo"); dotgrid.controller.addRole("picker","Edit","redo");
DOTGRID.controller.add_role("picker","Edit","cut"); dotgrid.controller.addRole("picker","Edit","cut");
DOTGRID.controller.add_role("picker","Edit","copy"); dotgrid.controller.addRole("picker","Edit","copy");
DOTGRID.controller.add_role("picker","Edit","paste"); dotgrid.controller.addRole("picker","Edit","paste");
DOTGRID.controller.add_role("picker","Edit","delete"); dotgrid.controller.addRole("picker","Edit","delete");
DOTGRID.controller.add_role("picker","Edit","selectall"); dotgrid.controller.addRole("picker","Edit","selectall");
DOTGRID.controller.add("picker","Mode","Stop Picker Mode",() => { DOTGRID.picker.stop(); },"Escape"); dotgrid.controller.add("picker","Mode","Stop Picker Mode",() => { dotgrid.picker.stop(); },"Escape");
DOTGRID.controller.commit(); dotgrid.controller.commit();
DOTGRID.install(document.body); dotgrid.install(document.body);
DOTGRID.start();
window.addEventListener('load', () => { dotgrid.start(); })
</script> </script>
</body> </body>
</html> </html>

32
desktop/sources/scripts/cursor.js
View File

@ -20,12 +20,12 @@ function Cursor () {
this.pos = this.atEvent(e) this.pos = this.atEvent(e)
// Translation // Translation
if (DOTGRID.tool.vertexAt(this.pos)) { if (dotgrid.tool.vertexAt(this.pos)) {
this.translate(this.pos, this.pos, e.shiftKey, e.ctrlKey || e.metaKey, e.altKey) this.translate(this.pos, this.pos, e.shiftKey, e.ctrlKey || e.metaKey, e.altKey)
} }
DOTGRID.renderer.update() dotgrid.renderer.update()
DOTGRID.interface.update() dotgrid.interface.update()
e.preventDefault() e.preventDefault()
} }
@ -40,10 +40,10 @@ function Cursor () {
} }
if (this.last_pos.x !== this.pos.x || this.last_pos.y !== this.pos.y) { if (this.last_pos.x !== this.pos.x || this.last_pos.y !== this.pos.y) {
DOTGRID.renderer.update() dotgrid.renderer.update()
} }
DOTGRID.interface.update() dotgrid.interface.update()
e.preventDefault() e.preventDefault()
this.last_pos = this.pos this.last_pos = this.pos
@ -53,26 +53,26 @@ function Cursor () {
this.pos = this.atEvent(e) this.pos = this.atEvent(e)
if (this.translation && !isEqual(this.translation.from, this.translation.to)) { if (this.translation && !isEqual(this.translation.from, this.translation.to)) {
if (this.translation.layer === true) { DOTGRID.tool.translateLayer(this.translation.from, this.translation.to) } else if (this.translation.copy) { DOTGRID.tool.translateCopy(this.translation.from, this.translation.to) } else if (this.translation.multi) { DOTGRID.tool.translateMulti(this.translation.from, this.translation.to) } else { DOTGRID.tool.translate(this.translation.from, this.translation.to) } if (this.translation.layer === true) { dotgrid.tool.translateLayer(this.translation.from, this.translation.to) } else if (this.translation.copy) { dotgrid.tool.translateCopy(this.translation.from, this.translation.to) } else if (this.translation.multi) { dotgrid.tool.translateMulti(this.translation.from, this.translation.to) } else { dotgrid.tool.translate(this.translation.from, this.translation.to) }
} else if (e.target.id === 'guide') { } else if (e.target.id === 'guide') {
DOTGRID.tool.addVertex({ x: this.pos.x, y: this.pos.y }) dotgrid.tool.addVertex({ x: this.pos.x, y: this.pos.y })
DOTGRID.picker.stop() dotgrid.picker.stop()
} }
this.translate() this.translate()
DOTGRID.interface.update() dotgrid.interface.update()
DOTGRID.renderer.update() dotgrid.renderer.update()
e.preventDefault() e.preventDefault()
} }
this.alt = function (e) { this.alt = function (e) {
this.pos = this.atEvent(e) this.pos = this.atEvent(e)
DOTGRID.tool.removeSegmentsAt(this.pos) dotgrid.tool.removeSegmentsAt(this.pos)
e.preventDefault() e.preventDefault()
setTimeout(() => { DOTGRID.tool.clear() }, 150) setTimeout(() => { dotgrid.tool.clear() }, 150)
} }
// Position Mods // Position Mods
@ -83,15 +83,15 @@ function Cursor () {
this.relativePos = function (pos) { this.relativePos = function (pos) {
return { return {
x: pos.x - DOTGRID.renderer.el.offsetLeft, x: pos.x - dotgrid.renderer.el.offsetLeft,
y: pos.y - DOTGRID.renderer.el.offsetTop y: pos.y - dotgrid.renderer.el.offsetTop
} }
} }
this.snapPos = function (pos) { this.snapPos = function (pos) {
return { return {
x: clamp(step(pos.x, 15), 15, DOTGRID.tool.settings.size.width), x: clamp(step(pos.x, 15), 15, dotgrid.tool.settings.size.width),
y: clamp(step(pos.y, 15), 15, DOTGRID.tool.settings.size.height) y: clamp(step(pos.y, 15), 15, dotgrid.tool.settings.size.height)
} }
} }

112
desktop/sources/scripts/dotgrid.js
View File

@ -18,6 +18,8 @@ function Dotgrid () {
this.install = function (host) { this.install = function (host) {
this.theme = new Theme(defaultTheme) this.theme = new Theme(defaultTheme)
this.history = new History() this.history = new History()
this.source = new Source(this)
this.manager = new Manager(this) this.manager = new Manager(this)
this.renderer = new Renderer(this) this.renderer = new Renderer(this)
this.tool = new Tool(this) this.tool = new Tool(this)
@ -39,25 +41,25 @@ function Dotgrid () {
this.renderer.start() this.renderer.start()
this.interface.start() this.interface.start()
document.addEventListener('mousedown', function (e) { DOTGRID.cursor.down(e) }, false) document.addEventListener('mousedown', function (e) { dotgrid.cursor.down(e) }, false)
document.addEventListener('mousemove', function (e) { DOTGRID.cursor.move(e) }, false) document.addEventListener('mousemove', function (e) { dotgrid.cursor.move(e) }, false)
document.addEventListener('contextmenu', function (e) { DOTGRID.cursor.alt(e) }, false) document.addEventListener('contextmenu', function (e) { dotgrid.cursor.alt(e) }, false)
document.addEventListener('mouseup', function (e) { DOTGRID.cursor.up(e) }, false) document.addEventListener('mouseup', function (e) { dotgrid.cursor.up(e) }, false)
document.addEventListener('copy', function (e) { DOTGRID.copy(e) }, false) document.addEventListener('copy', function (e) { dotgrid.copy(e) }, false)
document.addEventListener('cut', function (e) { DOTGRID.cut(e) }, false) document.addEventListener('cut', function (e) { dotgrid.cut(e) }, false)
document.addEventListener('paste', function (e) { DOTGRID.paste(e) }, false) document.addEventListener('paste', function (e) { dotgrid.paste(e) }, false)
window.addEventListener('drop', DOTGRID.drag) window.addEventListener('drop', dotgrid.drag)
this.new() this.source.new()
setTimeout(() => { document.body.className += ' ready' }, 250) setTimeout(() => { document.body.className += ' ready' }, 250)
} }
this.update = function () { this.update = function () {
DOTGRID.resize() this.resize()
DOTGRID.manager.update() this.manager.update()
DOTGRID.interface.update() this.interface.update()
DOTGRID.renderer.update() this.renderer.update()
} }
this.clear = function () { this.clear = function () {
@ -73,50 +75,6 @@ function Dotgrid () {
this.update() this.update()
} }
// File
this.new = function () {
this.setZoom(1.0)
this.history.push(this.tool.layers)
this.clear()
}
this.open = function () {
if (!dialog) { return }
const paths = dialog.showOpenDialog({ properties: ['openFile'], filters: [{ name: 'Dotgrid Image', extensions: ['dot', 'grid'] }] })
if (!paths) { console.warn('Nothing to load'); return }
fs.readFile(paths[0], 'utf-8', (err, data) => {
if (err) { alert('An error ocurred reading the file :' + err.message); return }
this.tool.replace(JSON.parse(data.toString().trim()))
this.renderer.update()
})
}
this.save = function () {
if (DOTGRID.tool.length() < 1) { console.warn('Nothing to save'); return }
this.manager.toGRID(grab)
}
this.export = function () {
if (DOTGRID.tool.length() < 1) { console.warn('Nothing to export'); return }
this.manager.toSVG(grab)
}
this.render = function () {
if (DOTGRID.tool.length() < 1) { console.warn('Nothing to render'); return }
this.manager.toPNG({ width: DOTGRID.tool.settings.size.width * 2, height: DOTGRID.tool.settings.size.height * 2 }, grab)
}
function grab (base64, name) {
const link = document.createElement('a')
link.setAttribute('href', base64)
link.setAttribute('download', name)
link.dispatchEvent(new MouseEvent(`click`, { bubbles: true, cancelable: true, view: window }))
}
// Basics // Basics
this.getSize = function () { this.getSize = function () {
@ -132,6 +90,8 @@ function Dotgrid () {
this.tool.settings.size.width = size.width this.tool.settings.size.width = size.width
this.tool.settings.size.height = size.height this.tool.settings.size.height = size.height
console.log(this.tool.settings.size)
try { try {
const win = require('electron').remote.getCurrentWindow() const win = require('electron').remote.getCurrentWindow()
win.setSize((size.width + 100) * scale, (size.height + 100) * scale, false) win.setSize((size.width + 100) * scale, (size.height + 100) * scale, false)
@ -196,39 +156,39 @@ function Dotgrid () {
reader.onload = function (e) { reader.onload = function (e) {
const data = e.target && e.target.result ? e.target.result : '' const data = e.target && e.target.result ? e.target.result : ''
if (data && !isJson(data)) { return } if (data && !isJson(data)) { return }
DOTGRID.tool.replace(JSON.parse(`${data}`)) dotgrid.tool.replace(JSON.parse(`${data}`))
DOTGRID.renderer.update() dotgrid.renderer.update()
} }
reader.readAsText(file) reader.readAsText(file)
} }
this.copy = function (e) { this.copy = function (e) {
DOTGRID.renderer.update() dotgrid.renderer.update()
if (e.target !== this.picker.input) { if (e.target !== this.picker.input) {
e.clipboardData.setData('text/source', DOTGRID.tool.export(DOTGRID.tool.layer())) e.clipboardData.setData('text/source', dotgrid.tool.export(dotgrid.tool.layer()))
e.clipboardData.setData('text/plain', DOTGRID.tool.path()) e.clipboardData.setData('text/plain', dotgrid.tool.path())
e.clipboardData.setData('text/html', DOTGRID.manager.el.outerHTML) e.clipboardData.setData('text/html', dotgrid.manager.el.outerHTML)
e.clipboardData.setData('text/svg+xml', DOTGRID.manager.el.outerHTML) e.clipboardData.setData('text/svg+xml', dotgrid.manager.el.outerHTML)
e.preventDefault() e.preventDefault()
} }
DOTGRID.renderer.update() dotgrid.renderer.update()
} }
this.cut = function (e) { this.cut = function (e) {
DOTGRID.renderer.update() dotgrid.renderer.update()
if (e.target !== this.picker.input) { if (e.target !== this.picker.input) {
e.clipboardData.setData('text/source', DOTGRID.tool.export(DOTGRID.tool.layer())) e.clipboardData.setData('text/source', dotgrid.tool.export(dotgrid.tool.layer()))
e.clipboardData.setData('text/plain', DOTGRID.tool.export(DOTGRID.tool.layer())) e.clipboardData.setData('text/plain', dotgrid.tool.export(dotgrid.tool.layer()))
e.clipboardData.setData('text/html', DOTGRID.manager.el.outerHTML) e.clipboardData.setData('text/html', dotgrid.manager.el.outerHTML)
e.clipboardData.setData('text/svg+xml', DOTGRID.manager.el.outerHTML) e.clipboardData.setData('text/svg+xml', dotgrid.manager.el.outerHTML)
DOTGRID.tool.layers[DOTGRID.tool.index] = [] dotgrid.tool.layers[dotgrid.tool.index] = []
e.preventDefault() e.preventDefault()
} }
DOTGRID.renderer.update() dotgrid.renderer.update()
} }
this.paste = function (e) { this.paste = function (e) {
@ -236,17 +196,17 @@ function Dotgrid () {
let data = e.clipboardData.getData('text/source') let data = e.clipboardData.getData('text/source')
if (isJson(data)) { if (isJson(data)) {
data = JSON.parse(data.trim()) data = JSON.parse(data.trim())
DOTGRID.tool.import(data) dotgrid.tool.import(data)
} }
e.preventDefault() e.preventDefault()
} }
DOTGRID.renderer.update() dotgrid.renderer.update()
} }
} }
window.addEventListener('resize', function (e) { window.addEventListener('resize', function (e) {
DOTGRID.update() dotgrid.update()
}, false) }, false)
window.addEventListener('dragover', function (e) { window.addEventListener('dragover', function (e) {
@ -263,5 +223,3 @@ function isJson (text) { try { JSON.parse(text); return true } catch (error) { r
function isEqual (a, b) { return a && b && a.x === b.x && a.y === b.y } function isEqual (a, b) { return a && b && a.x === b.x && a.y === b.y }
function clamp (v, min, max) { return v < min ? min : v > max ? max : v } function clamp (v, min, max) { return v < min ? min : v > max ? max : v }
function step (v, s) { return Math.round(v / s) * s } function step (v, s) { return Math.round(v / s) * s }
const DOTGRID = new Dotgrid()

6
desktop/sources/scripts/generator.js
View File

@ -10,15 +10,15 @@ function Generator (layer, style) {
for (const k1 in l) { for (const k1 in l) {
const seg = l[k1] const seg = l[k1]
for (const k2 in seg.vertices) { for (const k2 in seg.vertices) {
if (mirror === 1 || mirror === 3) { seg.vertices[k2].x = (DOTGRID.tool.settings.size.width) - seg.vertices[k2].x + 15 } if (mirror === 1 || mirror === 3) { seg.vertices[k2].x = (dotgrid.tool.settings.size.width) - seg.vertices[k2].x + 15 }
if (mirror === 2 || mirror === 3) { seg.vertices[k2].y = (DOTGRID.tool.settings.size.height) - seg.vertices[k2].y + 15 } if (mirror === 2 || mirror === 3) { seg.vertices[k2].y = (dotgrid.tool.settings.size.height) - seg.vertices[k2].y + 15 }
// Offset // Offset
seg.vertices[k2].x += offset.x seg.vertices[k2].x += offset.x
seg.vertices[k2].y += offset.y seg.vertices[k2].y += offset.y
// Rotate // Rotate
const center = { x: (DOTGRID.tool.settings.size.width / 2) + offset.x + (7.5), y: (DOTGRID.tool.settings.size.height / 2) + offset.y + 30 } const center = { x: (dotgrid.tool.settings.size.width / 2) + offset.x + (7.5), y: (dotgrid.tool.settings.size.height / 2) + offset.y + 30 }
seg.vertices[k2] = rotatePoint(seg.vertices[k2], center, angle) seg.vertices[k2] = rotatePoint(seg.vertices[k2], center, angle)
// Scale // Scale

10
desktop/sources/scripts/interface.js
View File

@ -51,10 +51,10 @@ function Interface (dotgrid) {
<svg <svg
id="option_${name}" id="option_${name}"
title="${name.capitalize()}" title="${name.capitalize()}"
onmouseout="DOTGRID.interface.out('${type}','${name}')" onmouseout="dotgrid.interface.out('${type}','${name}')"
onmouseup="DOTGRID.interface.up('${type}','${name}')" onmouseup="dotgrid.interface.up('${type}','${name}')"
onmousedown="DOTGRID.interface.down('${type}','${name}')" onmousedown="dotgrid.interface.down('${type}','${name}')"
onmouseover="DOTGRID.interface.over('${type}','${name}')" onmouseover="dotgrid.interface.over('${type}','${name}')"
viewBox="0 0 300 300" viewBox="0 0 300 300"
class="icon ${type}"> class="icon ${type}">
<path id="${name}_path" class="icon_path" d="${tool.icon}"/>${name === 'depth' ? `<path class="icon_path inactive" d=""/>` : ''} <path id="${name}_path" class="icon_path" d="${tool.icon}"/>${name === 'depth' ? `<path class="icon_path inactive" d=""/>` : ''}
@ -148,7 +148,7 @@ function Interface (dotgrid) {
document.onkeydown = function (e) { document.onkeydown = function (e) {
if (e.key === 'Tab') { if (e.key === 'Tab') {
DOTGRID.interface.toggle() dotgrid.interface.toggle()
e.preventDefault() e.preventDefault()
} }
} }

2
desktop/sources/scripts/lib/controller.js
View File

@ -18,7 +18,7 @@ function Controller () {
this.menu[mode][cat][label] = { fn: fn, accelerator: accelerator } this.menu[mode][cat][label] = { fn: fn, accelerator: accelerator }
} }
this.add_role = function (mode, cat, label) { this.addRole = function (mode, cat, label) {
if (!this.menu[mode]) { this.menu[mode] = {} } if (!this.menu[mode]) { this.menu[mode] = {} }
if (!this.menu[mode][cat]) { this.menu[mode][cat] = {} } if (!this.menu[mode][cat]) { this.menu[mode][cat] = {} }
this.menu[mode][cat][label] = { role: label } this.menu[mode][cat][label] = { role: label }

20
desktop/sources/scripts/manager.js
View File

@ -19,23 +19,23 @@ function Manager (dotgrid) {
} }
this.update = function () { this.update = function () {
this.el.setAttribute('width', (DOTGRID.tool.settings.size.width + 15) + 'px') this.el.setAttribute('width', (dotgrid.tool.settings.size.width + 15) + 'px')
this.el.setAttribute('height', (DOTGRID.tool.settings.size.height + 15) + 'px') this.el.setAttribute('height', (dotgrid.tool.settings.size.height + 15) + 'px')
this.el.style.width = (DOTGRID.tool.settings.size.width + 15) this.el.style.width = (dotgrid.tool.settings.size.width + 15)
this.el.style.height = DOTGRID.tool.settings.size.height + 15 this.el.style.height = dotgrid.tool.settings.size.height + 15
const styles = DOTGRID.tool.styles const styles = dotgrid.tool.styles
const paths = DOTGRID.tool.paths() const paths = dotgrid.tool.paths()
for (const id in this.layers) { for (const id in this.layers) {
let style = styles[id] let style = styles[id]
let path = paths[id] let path = paths[id]
let layer = this.layers[id] let layer = this.layers[id]
// Easter Egg // Easter Egg
if (DOTGRID.tool.settings.crest === true) { if (dotgrid.tool.settings.crest === true) {
style = styles[0] style = styles[0]
path = paths[0] path = paths[0]
layer.setAttribute('transform', `rotate(${parseInt(id) * 120} ${(DOTGRID.tool.settings.size.width / 2) + 7.5} ${(DOTGRID.tool.settings.size.height / 2) + 7.5})`) layer.setAttribute('transform', `rotate(${parseInt(id) * 120} ${(dotgrid.tool.settings.size.width / 2) + 7.5} ${(dotgrid.tool.settings.size.height / 2) + 7.5})`)
} }
layer.style.strokeWidth = style.thickness layer.style.strokeWidth = style.thickness
@ -57,7 +57,7 @@ function Manager (dotgrid) {
// Exporters // Exporters
this.toPNG = function (size = DOTGRID.tool.settings.size, callback) { this.toPNG = function (size = dotgrid.tool.settings.size, callback) {
this.update() this.update()
let image64 = this.svg64() let image64 = this.svg64()
@ -82,7 +82,7 @@ function Manager (dotgrid) {
this.toGRID = function (callback) { this.toGRID = function (callback) {
this.update() this.update()
const text = DOTGRID.tool.export() const text = dotgrid.tool.export()
const file = new Blob([text], { type: 'text/plain' }) const file = new Blob([text], { type: 'text/plain' })
callback(URL.createObjectURL(file), 'export.grid') callback(URL.createObjectURL(file), 'export.grid')
} }

20
desktop/sources/scripts/picker.js
View File

@ -15,14 +15,14 @@ function Picker (dotgrid) {
this.isActive = true this.isActive = true
this.input.setAttribute('placeholder', `${DOTGRID.tool.style().color.replace('#', '').trim()}`) this.input.setAttribute('placeholder', `${dotgrid.tool.style().color.replace('#', '').trim()}`)
this.input.setAttribute('maxlength', 6) this.input.setAttribute('maxlength', 6)
DOTGRID.interface.el.className = 'picker' dotgrid.interface.el.className = 'picker'
this.input.focus() this.input.focus()
this.input.value = '' this.input.value = ''
try { DOTGRID.controller.set('picker') } catch (err) { } try { dotgrid.controller.set('picker') } catch (err) { }
} }
this.update = function () { this.update = function () {
@ -40,13 +40,13 @@ function Picker (dotgrid) {
this.isActive = false this.isActive = false
DOTGRID.interface.el.className = '' dotgrid.interface.el.className = ''
this.input.blur() this.input.blur()
this.input.value = '' this.input.value = ''
try { DOTGRID.controller.set() } catch (err) { console.log('No controller') } try { dotgrid.controller.set() } catch (err) { console.log('No controller') }
setTimeout(() => { DOTGRID.interface.update(true); DOTGRID.renderer.update() }, 250) setTimeout(() => { dotgrid.interface.update(true); dotgrid.renderer.update() }, 250)
} }
this.validate = function () { this.validate = function () {
@ -54,8 +54,8 @@ function Picker (dotgrid) {
const hex = `#${this.input.value}` const hex = `#${this.input.value}`
DOTGRID.tool.style().color = hex dotgrid.tool.style().color = hex
DOTGRID.tool.style().fill = DOTGRID.tool.style().fill !== 'none' ? hex : 'none' dotgrid.tool.style().fill = dotgrid.tool.style().fill !== 'none' ? hex : 'none'
this.stop() this.stop()
} }
@ -95,6 +95,6 @@ function Picker (dotgrid) {
return re.test(val) return re.test(val)
} }
this.input.onkeydown = function (event) { DOTGRID.picker.listen(event, true) } this.input.onkeydown = function (event) { dotgrid.picker.listen(event, true) }
this.input.onkeyup = function (event) { DOTGRID.picker.listen(event) } this.input.onkeyup = function (event) { dotgrid.picker.listen(event) }
} }

45
desktop/sources/scripts/source.js Normal file
View File

@ -0,0 +1,45 @@
'use strict'
function Source (dotgrid) {
this.new = function () {
dotgrid.setZoom(1.0)
dotgrid.history.push(dotgrid.tool.layers)
dotgrid.clear()
}
this.open = function () {
if (!dialog) { return }
const paths = dialog.showOpenDialog({ properties: ['openFile'], filters: [{ name: 'Dotgrid Image', extensions: ['dot', 'grid'] }] })
if (!paths) { console.warn('Nothing to load'); return }
fs.readFile(paths[0], 'utf-8', (err, data) => {
if (err) { alert('An error ocurred reading the file :' + err.message); return }
dotgrid.tool.replace(JSON.parse(data.toString().trim()))
dotgrid.renderer.update()
})
}
this.save = function () {
if (dotgrid.tool.length() < 1) { console.warn('Nothing to save'); return }
dotgrid.manager.toGRID(grab)
}
this.export = function () {
if (dotgrid.tool.length() < 1) { console.warn('Nothing to export'); return }
dotgrid.manager.toSVG(grab)
}
this.render = function () {
if (dotgrid.tool.length() < 1) { console.warn('Nothing to render'); return }
dotgrid.manager.toPNG({ width: dotgrid.tool.settings.size.width * 2, height: dotgrid.tool.settings.size.height * 2 }, grab)
}
function grab (base64, name) {
const link = document.createElement('a')
link.setAttribute('href', base64)
link.setAttribute('download', name)
link.dispatchEvent(new MouseEvent(`click`, { bubbles: true, cancelable: true, view: window }))
}
}

2
desktop/sources/scripts/tool.js
View File

@ -78,7 +78,7 @@ function Tool (dotgrid) {
dot.settings.size = { width: dot.settings.width, height: dot.settings.height } 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)) { if (this.settings && (this.settings.size.width !== dot.settings.size.width || this.settings.size.height !== dot.settings.size.height)) {
dotgrid.setSize({ width: dot.settings.size.width / 15, height: dot.settings.size.height / 15 }) dotgrid.setSize({ width: dot.settings.size.width, height: dot.settings.size.height })
} }
this.layers = dot.layers this.layers = dot.layers

5
index.html
View File

@ -32,6 +32,7 @@
<script type="text/javascript" src="desktop/sources/scripts/picker.js"></script> <script type="text/javascript" src="desktop/sources/scripts/picker.js"></script>
<!-- Web Specific --> <!-- Web Specific -->
<script type="text/javascript" src="web/events.js"></script> <script type="text/javascript" src="web/events.js"></script>
<script type="text/javascript" src="web/source.js"></script>
<!-- Styles --> <!-- Styles -->
<link rel="stylesheet" type="text/css" href="desktop/sources/links/reset.css"/> <link rel="stylesheet" type="text/css" href="desktop/sources/links/reset.css"/>
<link rel="stylesheet" type="text/css" href="desktop/sources/links/fonts.css"/> <link rel="stylesheet" type="text/css" href="desktop/sources/links/fonts.css"/>
@ -44,8 +45,8 @@
'use strict'; 'use strict';
function Listener(){} function Listener(){}
const dialog = null; const dialog = null;
DOTGRID.install(document.body); dotgrid.install(document.body);
DOTGRID.start(); dotgrid.start();
</script> </script>
</body> </body>
</html> </html>

62
web/events.js
View File

@ -7,46 +7,46 @@ document.onkeyup = (e) =>
if(e.target && e.target.id === "picker_input"){ return; } if(e.target && e.target.id === "picker_input"){ return; }
// Output // Output
if((e.ctrlKey || e.metaKey) && ch === "s"){ DOTGRID.save(); e.preventDefault(); return; } if((e.ctrlKey || e.metaKey) && ch === "s"){ dotgrid.save(); e.preventDefault(); return; }
if((e.ctrlKey || e.metaKey) && ch === "r"){ DOTGRID.render(); e.preventDefault(); return; } if((e.ctrlKey || e.metaKey) && ch === "r"){ dotgrid.render(); e.preventDefault(); return; }
if((e.ctrlKey || e.metaKey) && ch === "e"){ DOTGRID.export(); e.preventDefault(); return; } if((e.ctrlKey || e.metaKey) && ch === "e"){ dotgrid.export(); e.preventDefault(); return; }
if((e.ctrlKey || e.metaKey) && ch === "k"){ DOTGRID.tool.toggleCrest(); e.preventDefault(); return; } if((e.ctrlKey || e.metaKey) && ch === "k"){ dotgrid.tool.toggleCrest(); e.preventDefault(); return; }
if(ch === "backspace" && e.ctrlKey){ DOTGRID.theme.reset(); e.preventDefault(); } if(ch === "backspace" && e.ctrlKey){ dotgrid.theme.reset(); e.preventDefault(); }
if(ch === "backspace"){ DOTGRID.tool.removeSegment(); e.preventDefault(); } if(ch === "backspace"){ dotgrid.tool.removeSegment(); e.preventDefault(); }
if(ch === "escape"){ DOTGRID.tool.clear(); DOTGRID.picker.stop(); e.preventDefault(); } if(ch === "escape"){ dotgrid.tool.clear(); dotgrid.picker.stop(); e.preventDefault(); }
if(ch === "1"){ DOTGRID.tool.selectLayer(0); e.preventDefault(); } if(ch === "1"){ dotgrid.tool.selectLayer(0); e.preventDefault(); }
if(ch === "2"){ DOTGRID.tool.selectLayer(1); e.preventDefault(); } if(ch === "2"){ dotgrid.tool.selectLayer(1); e.preventDefault(); }
if(ch === "3"){ DOTGRID.tool.selectLayer(2); e.preventDefault(); } if(ch === "3"){ dotgrid.tool.selectLayer(2); e.preventDefault(); }
if(ch === "h"){ DOTGRID.renderer.toggle(); e.preventDefault(); } if(ch === "h"){ dotgrid.renderer.toggle(); e.preventDefault(); }
if(ch === "?"){ DOTGRID.reset(); DOTGRID.theme.reset(); e.preventDefault(); } if(ch === "?"){ dotgrid.reset(); dotgrid.theme.reset(); e.preventDefault(); }
if(ch === "a"){ DOTGRID.tool.cast("line"); e.preventDefault(); } if(ch === "a"){ dotgrid.tool.cast("line"); e.preventDefault(); }
if(ch === "s"){ DOTGRID.tool.cast("arc_c"); e.preventDefault(); } if(ch === "s"){ dotgrid.tool.cast("arc_c"); e.preventDefault(); }
if(ch === "d"){ DOTGRID.tool.cast("arc_r"); e.preventDefault(); } if(ch === "d"){ dotgrid.tool.cast("arc_r"); e.preventDefault(); }
if(ch === "t"){ DOTGRID.tool.cast("arc_c_full"); e.preventDefault(); } if(ch === "t"){ dotgrid.tool.cast("arc_c_full"); e.preventDefault(); }
if(ch === "y"){ DOTGRID.tool.cast("arc_r_full"); e.preventDefault(); } if(ch === "y"){ dotgrid.tool.cast("arc_r_full"); e.preventDefault(); }
if(ch === "f"){ DOTGRID.tool.cast("bezier"); e.preventDefault(); } if(ch === "f"){ dotgrid.tool.cast("bezier"); e.preventDefault(); }
if(ch === "z"){ DOTGRID.tool.cast("close"); e.preventDefault(); } if(ch === "z"){ dotgrid.tool.cast("close"); e.preventDefault(); }
if(ch === "q"){ DOTGRID.tool.toggle("linecap"); e.preventDefault(); } if(ch === "q"){ dotgrid.tool.toggle("linecap"); e.preventDefault(); }
if(ch === "w"){ DOTGRID.tool.toggle("linejoin"); e.preventDefault(); } if(ch === "w"){ dotgrid.tool.toggle("linejoin"); e.preventDefault(); }
if(ch === "e"){ DOTGRID.tool.toggle("mirror"); e.preventDefault(); } if(ch === "e"){ dotgrid.tool.toggle("mirror"); e.preventDefault(); }
if(ch === "r"){ DOTGRID.tool.toggle("fill"); e.preventDefault(); } if(ch === "r"){ dotgrid.tool.toggle("fill"); e.preventDefault(); }
if(ch === "g"){ DOTGRID.picker.start(); e.preventDefault(); } if(ch === "g"){ dotgrid.picker.start(); e.preventDefault(); }
if(ch === "}"){ DOTGRID.tool.toggle("thickness",1); e.preventDefault(); } if(ch === "}"){ dotgrid.tool.toggle("thickness",1); e.preventDefault(); }
if(ch === "{"){ DOTGRID.tool.toggle("thickness",-1); e.preventDefault(); } if(ch === "{"){ dotgrid.tool.toggle("thickness",-1); e.preventDefault(); }
if(ch === "]"){ DOTGRID.tool.toggle("thickness",5); e.preventDefault(); } if(ch === "]"){ dotgrid.tool.toggle("thickness",5); e.preventDefault(); }
if(ch === "["){ DOTGRID.tool.toggle("thickness",-5); e.preventDefault(); } if(ch === "["){ dotgrid.tool.toggle("thickness",-5); e.preventDefault(); }
if(ch === "m"){ DOTGRID.tool.merge(); e.preventDefault(); } if(ch === "m"){ dotgrid.tool.merge(); e.preventDefault(); }
if(ch === "i"){ DOTGRID.theme.invert(); e.preventDefault(); } if(ch === "i"){ dotgrid.theme.invert(); e.preventDefault(); }
} }
document.onkeydown = (e) => document.onkeydown = (e) =>
{ {
if(e.keyCode === 9){ DOTGRID.tool.selectNextLayer(); e.preventDefault(); } if(e.keyCode === 9){ dotgrid.tool.selectNextLayer(); e.preventDefault(); }
} }