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

Re-added copy path with ctrl+c

Browse Source
This commit is contained in:
Devine Lu Linvega 2018-10-02 07:38:14 +12:00
parent b7f188c7bf
commit 3879dd794c
11 changed files with 76 additions and 53 deletions
Show Stats Download Patch File Download Diff File Expand all files Collapse all files

12
desktop/sources/index.html
View File

@ -26,11 +26,13 @@
</head>
<body>
<script>
'use strict';
const webFrame = require('electron').webFrame
const {dialog,app} = require('electron').remote;
const fs = require('fs');
dotgrid = new Dotgrid(300,300,20,20,4,4);
const dotgrid = new Dotgrid(300,300,20,20,4,4);
dotgrid.controller = new Controller();
dotgrid.controller.add("default","*","About",() => { require('electron').shell.openExternal('https://github.com/hundredrabbits/Dotgrid'); },"CmdOrCtrl+,");
@ -46,13 +48,15 @@
dotgrid.controller.add("default","File","Render(.png)",() => { dotgrid.render(); },"CmdOrCtrl+R");
dotgrid.controller.add("default","File","Export(.svg)",() => { dotgrid.export(); },"CmdOrCtrl+E");
dotgrid.controller.add_role("default","Edit","copy");
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","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 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","Close",() => { dotgrid.tool.cast("close") },"Z");
dotgrid.controller.add("default","Stroke","Undo",() => { dotgrid.tool.undo() },"CmdOrCtrl+Z");
dotgrid.controller.add("default","Stroke","Redo",() => { dotgrid.tool.redo() },"CmdOrCtrl+Shift+Z");
dotgrid.controller.add("default","Effect","Linecap",() => { dotgrid.tool.toggle("linecap"); },"Q");
dotgrid.controller.add("default","Effect","Linejoin",() => { dotgrid.tool.toggle("linejoin"); },"W");
@ -74,6 +78,8 @@
dotgrid.controller.add("default","Layers","Foreground",() => { dotgrid.tool.select_layer(0) },"CmdOrCtrl+1");
dotgrid.controller.add("default","Layers","Middleground",() => { dotgrid.tool.select_layer(1) },"CmdOrCtrl+2");
dotgrid.controller.add("default","Layers","Background",() => { dotgrid.tool.select_layer(2) },"CmdOrCtrl+3");
dotgrid.controller.add("default","Layers","Next Layer",() => { dotgrid.tool.select_next_layer() },"Tab");
dotgrid.controller.add("default","Layers","Prev Layer",() => { dotgrid.tool.select_prev_layer() },"Shift+Tab");
dotgrid.controller.add("default","View","Color Picker",() => { dotgrid.picker.start(); },"G");
dotgrid.controller.add("default","View","Toggle Grid",() => { dotgrid.guide.toggle(); },"H");

6
desktop/sources/links/main.css
View File

@ -43,4 +43,8 @@ body.web #interface #menu #option_open { display: none; }
body #guide { opacity: 0; transition: opacity 500ms; }
body.ready #guide { opacity: 1 }
body #interface { opacity: 0; transition: opacity 250ms, bottom 500ms; bottom:15px; }
body.ready #interface { opacity: 1; bottom:20px; }
body.ready #interface { opacity: 1; bottom:20px; }
@media (max-width: 560px) {
#interface #menu svg.icon.source { opacity: 0; }
}

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

@ -102,7 +102,7 @@ function Cursor()
this.pos_snap = function(pos)
{
let grid = dotgrid.tool.settings.size.width/dotgrid.grid_x;
const grid = dotgrid.tool.settings.size.width/dotgrid.grid_x;
return {
x:clamp(step(pos.x,grid),grid,dotgrid.tool.settings.size.width),
y:clamp(step(pos.y,grid),grid,dotgrid.tool.settings.size.height+grid)

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

@ -69,7 +69,7 @@ function Dotgrid(width,height,grid_x,grid_y,block_x,block_y)
{
if(!dialog){ return; }
let paths = dialog.showOpenDialog({properties: ['openFile'],filters:[{name:"Dotgrid Image",extensions:["dot","grid"]}]});
const paths = dialog.showOpenDialog({properties: ['openFile'],filters:[{name:"Dotgrid Image",extensions:["dot","grid"]}]});
if(!paths){ console.warn("Nothing to load"); return; }
@ -97,7 +97,7 @@ function Dotgrid(width,height,grid_x,grid_y,block_x,block_y)
this.save_web = function(content)
{
console.info("Web Save");
let win = window.open("", "Save", `toolbar=no,location=no,directories=no,status=no,menubar=no,scrollbars=yes,resizable=yes,width=640,height=480,top=${screen.height-200},left=${screen.width-640}`);
const win = window.open("", "Save", `toolbar=no,location=no,directories=no,status=no,menubar=no,scrollbars=yes,resizable=yes,width=640,height=480,top=${screen.height-200},left=${screen.width-640}`);
win.document.body.innerHTML = `<style>body { background:${dotgrid.theme.active.background}; color:${dotgrid.theme.active.f_med}} pre { color:${dotgrid.theme.active.f_high} }</style><p>To save: Copy this into a .grid file.<br />To load: Drag the .grid onto the browser window.</p><pre>${content}</pre>`;
}
@ -139,7 +139,7 @@ function Dotgrid(width,height,grid_x,grid_y,block_x,block_y)
this.export_web = function(content)
{
console.info("Web Export");
let win = window.open("", "Save", `toolbar=no,location=no,directories=no,status=no,menubar=no,scrollbars=yes,resizable=yes,width=640,height=480,top=${screen.height-200},left=${screen.width-640}`);
const win = window.open("", "Save", `toolbar=no,location=no,directories=no,status=no,menubar=no,scrollbars=yes,resizable=yes,width=640,height=480,top=${screen.height-200},left=${screen.width-640}`);
win.document.body.innerHTML = `<style>body { background:${dotgrid.theme.active.background}}</style>${dotgrid.renderer.to_svg()}`;
}
@ -153,7 +153,7 @@ function Dotgrid(width,height,grid_x,grid_y,block_x,block_y)
this.tool.settings.size.height = size.height
try{
let win = require('electron').remote.getCurrentWindow();
const win = require('electron').remote.getCurrentWindow();
win.setSize((size.width+100)*scale,(size.height+100+(ui ? 10 : 0))*scale,true);
}
catch(err){
@ -203,7 +203,7 @@ function Dotgrid(width,height,grid_x,grid_y,block_x,block_y)
this.resize = function()
{
let 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){
return;
@ -230,11 +230,11 @@ function Dotgrid(width,height,grid_x,grid_y,block_x,block_y)
e.preventDefault();
e.stopPropagation();
let file = e.dataTransfer.files[0];
const file = e.dataTransfer.files[0];
if(!file || !file.path || file.path.indexOf(".dot") < 0 && file.path.indexOf(".grid") < 0){ console.warn("Dotgrid","Not a dot file"); return; }
let reader = new FileReader();
const reader = new FileReader();
reader.onload = function(e){
dotgrid.tool.replace(JSON.parse(e.target.result.toString().trim()));
dotgrid.guide.update();
@ -275,7 +275,7 @@ function Dotgrid(width,height,grid_x,grid_y,block_x,block_y)
this.paste = function(e)
{
if(e.target !== this.picker.el){
let data = e.clipboardData.getData("text/source");
const data = e.clipboardData.getData("text/source");
if (is_json(data)) {
data = JSON.parse(data.trim());
dotgrid.tool.import(data);

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

@ -7,11 +7,11 @@ function Generator(layer,style)
function operate(layer,offset,scale,mirror = 0,angle = 0)
{
let l = copy(layer)
const l = copy(layer)
for(let k1 in l){
let seg = l[k1];
for(let k2 in seg.vertices){
for(const k1 in l){
const seg = l[k1];
for(const k2 in seg.vertices){
if(mirror == 1){ seg.vertices[k2].x = (dotgrid.tool.settings.size.width) - seg.vertices[k2].x + 15 }
if(mirror == 2){ seg.vertices[k2].y = (dotgrid.tool.settings.size.height) - seg.vertices[k2].y + 30 }
@ -20,7 +20,7 @@ function Generator(layer,style)
seg.vertices[k2].y += offset.y
// Rotate
let 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] = rotate_point(seg.vertices[k2],center,angle)
// Scale
@ -33,12 +33,12 @@ function Generator(layer,style)
this.render = function(prev,segment,mirror = 0)
{
let type = segment.type;
let vertices = segment.vertices;
const type = segment.type;
const vertices = segment.vertices;
let html = '';
let skip = 0;
for(let id in vertices){
for(const id in vertices){
if(skip > 0){ skip -= 1; continue; }
let vertex = vertices[id]
@ -80,8 +80,8 @@ function Generator(layer,style)
{
let s = ""
let prev = null
for(let id in layer){
let seg = layer[id];
for(const id in layer){
const seg = layer[id];
s += `${this.render(prev,seg,mirror)}`
prev = seg.vertices ? seg.vertices[seg.vertices.length-1] : null
}

12
desktop/sources/scripts/guide.js
View File

@ -52,7 +52,7 @@ function Guide()
this.resize = function(size)
{
let offset = 15
const offset = 15
this.el.width = (size.width+offset)*this.scale;
this.el.height = (size.height+(offset*2))*this.scale;
this.el.style.width = (size.width+offset)+"px";
@ -65,10 +65,10 @@ function Guide()
{
if(!this.show_extras){ return; }
for(let segment_id in dotgrid.tool.layer()){
let segment = dotgrid.tool.layer()[segment_id];
for(let vertex_id in segment.vertices){
let vertex = segment.vertices[vertex_id];
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);
}
}
@ -76,7 +76,7 @@ function Guide()
this.draw_vertices = function()
{
for(let id in dotgrid.tool.vertices){
for(const id in dotgrid.tool.vertices){
this.draw_vertex(dotgrid.tool.vertices[id]);
}
}

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

@ -46,9 +46,9 @@ function Interface()
}
}
for(let type in options){
for(const type in options){
let tools = options[type];
for(let name in tools){
for(const name in tools){
let tool = tools[name];
html += `
<svg
@ -108,7 +108,7 @@ function Interface()
let segments = dotgrid.tool.layer()
let sum_segments = dotgrid.tool.length();
for(let i in segments){
for(const i in segments){
if(segments[i].vertices.length > 2){ multi_vertices = true; break; }
}

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

@ -36,9 +36,9 @@ function Controller()
{
let f = [];
let m = this.menu[this.mode];
for(let cat in m){
for(const cat in m){
let submenu = [];
for(let name in m[cat]){
for(const name in m[cat]){
let option = m[cat][name];
if(option.role){
submenu.push({role:option.role})
@ -74,7 +74,7 @@ function Controller()
{
let svg_html = "";
for(let id in this.layout){
for(const id in this.layout){
let key = this.layout[id];
let acc = this.accelerator_for_key(key.name,m);
svg_html += `<rect x="${key.x + 1}" y="${key.y + 1}" width="${key.width - 2}" height="${key.height - 2}" rx="4" ry="4" title="${key.name}" stroke="#ccc" fill="none" stroke-width="1"/>`;
@ -103,10 +103,10 @@ function Controller()
{
let txt = `## ${name} Mode\n\n`;
for(let id in mode){
for(const id in mode){
if(id == "*"){ continue; }
txt += `### ${id}\n`;
for(let name in mode[id]){
for(const name in mode[id]){
let option = mode[id][name];
txt += `- ${name}: \`${option.accelerator}\`\n`;
}
@ -119,9 +119,9 @@ function Controller()
this.accelerator_for_key = function(key,menu)
{
let acc = {basic:null,ctrl:null}
for(let cat in menu){
for(const cat in menu){
let options = menu[cat];
for(let id in options.submenu){
for(const id in options.submenu){
let option = options.submenu[id]; if(option.role){ continue; }
acc.basic = (option.accelerator.toLowerCase() == key.toLowerCase()) ? option.label.toUpperCase().replace("TOGGLE ","").substr(0,8).trim() : acc.basic;
acc.ctrl = (option.accelerator.toLowerCase() == ("CmdOrCtrl+"+key).toLowerCase()) ? option.label.toUpperCase().replace("TOGGLE ","").substr(0,8).trim() : acc.ctrl;

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

@ -104,9 +104,9 @@ function Tool()
this.remove_segments_at = function(pos)
{
for(let segment_id in this.layer()){
for(const segment_id in this.layer()){
let segment = this.layer()[segment_id];
for(let vertex_id in segment.vertices){
for(const vertex_id in segment.vertices){
let vertex = segment.vertices[vertex_id];
if(Math.abs(pos.x) == Math.abs(vertex.x) && Math.abs(pos.y) == Math.abs(vertex.y)){
segment.vertices.splice(vertex_id,1)
@ -130,9 +130,9 @@ function Tool()
this.vertex_at = function(pos)
{
for(let segment_id in this.layer()){
for(const segment_id in this.layer()){
let segment = this.layer()[segment_id];
for(let vertex_id in segment.vertices){
for(const vertex_id in segment.vertices){
let vertex = segment.vertices[vertex_id];
if(vertex.x == Math.abs(pos.x) && vertex.y == Math.abs(pos.y)){
return vertex;
@ -213,7 +213,7 @@ function Tool()
this.can_append = function(content)
{
for(let id in this.layer()){
for(const id in this.layer()){
let stroke = this.layer()[id];
if(stroke.type != content.type){ continue; }
if(!stroke.vertices){ continue; }
@ -259,9 +259,9 @@ function Tool()
this.translate = function(a,b)
{
for(let segment_id in this.layer()){
for(const segment_id in this.layer()){
let segment = this.layer()[segment_id];
for(let vertex_id in segment.vertices){
for(const vertex_id in segment.vertices){
let vertex = segment.vertices[vertex_id];
if(vertex.x == Math.abs(a.x) && vertex.y == Math.abs(a.y)){
segment.vertices[vertex_id] = {x:Math.abs(b.x),y:Math.abs(b.y)};
@ -277,9 +277,9 @@ function Tool()
{
let offset = {x:a.x - b.x,y:a.y - b.y}
for(let segment_id in this.layer()){
for(const segment_id in this.layer()){
let segment = this.layer()[segment_id];
for(let vertex_id in segment.vertices){
for(const vertex_id in segment.vertices){
let vertex = segment.vertices[vertex_id];
segment.vertices[vertex_id] = {x:vertex.x-offset.x,y:vertex.y-offset.y};
}
@ -320,7 +320,13 @@ function Tool()
this.select_next_layer = function()
{
this.index = this.index >= 2 ? 0 : this.index+1
this.index = this.index >= 2 ? 0 : this.index++
this.select_layer(this.index);
}
this.select_prev_layer = function()
{
this.index = this.index >= 0 ? 2 : this.index--
this.select_layer(this.index);
}

5
index.html
View File

@ -28,8 +28,9 @@
</head>
<body class='web'>
<script>
let dialog = null;
dotgrid = new Dotgrid(300,300,20,20,4,4);
'use strict';
const dialog = null;
const dotgrid = new Dotgrid(300,300,20,20,4,4);
dotgrid.install(document.body);
dotgrid.start();
</script>

10
web/events.js
View File

@ -2,16 +2,17 @@
document.onkeyup = (e) =>
{
let ch = e.key.toLowerCase();
const ch = e.key.toLowerCase();
if(e.target && e.target.id == "picker_input"){ return; }
if(ch == "backspace" && e.ctrlKey){ dotgrid.theme.reset(); e.preventDefault(); }
if(ch == "backspace"){ dotgrid.tool.remove_segment(); e.preventDefault(); }
if(ch == "escape"){ dotgrid.tool.clear(); dotgrid.picker.stop(); e.preventDefault(); }
if(ch == "1"){ dotgrid.tool.select_layer(0); e.preventDefault(); }
if(ch == "2"){ dotgrid.tool.select_layer(1); e.preventDefault(); }
if(ch == "3"){ dotgrid.tool.select_layer(2); e.preventDefault(); }
if(ch == "3"){ dotgrid.tool.select_layer(2); e.preventDefault(); }
if(ch == "h"){ dotgrid.guide.toggle(); e.preventDefault(); }
if(ch == "?"){ dotgrid.reset(); dotgrid.theme.reset(); e.preventDefault(); }
@ -33,4 +34,9 @@ document.onkeyup = (e) =>
if(ch == "["){ dotgrid.tool.toggle("thickness",-5); e.preventDefault(); }
if(ch == "i"){ dotgrid.theme.invert(); e.preventDefault(); }
}
document.onkeydown = (e) =>
{
if(e.keyCode == 9){ dotgrid.tool.select_next_layer(); e.preventDefault(); }
}