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

Implemented offset

Browse Source
This commit is contained in:
Devine Lu Linvega 2017-11-06 13:18:57 +13:00
parent d4be61a250
commit e09894af69
4 changed files with 43 additions and 17 deletions
Show Stats Download Patch File Download Diff File Expand all files Collapse all files

7
sources/index.html
View File

@ -14,12 +14,19 @@
</head> </head>
<body> <body>
<script> <script>
try{
const {dialog,app} = require('electron').remote; const {dialog,app} = require('electron').remote;
const fs = require('fs'); const fs = require('fs');
}
catch(err){
console.log("standalone")
}
dotgrid = new Dotgrid(300,300,30,30,5,5, 10,"square","#000000"); dotgrid = new Dotgrid(300,300,30,30,5,5, 10,"square","#000000");
dotgrid.install(); dotgrid.install();
var keyboard = new Keyboard(); var keyboard = new Keyboard();
document.onkeyup = function myFunction(event){ keyboard.listen(event); }; document.onkeyup = function myFunction(event){ keyboard.listen(event); };
document.addEventListener('mousedown', function(e){ dotgrid.mouse_down(e); }, false); document.addEventListener('mousedown', function(e){ dotgrid.mouse_down(e); }, false);
document.addEventListener('mousemove', function(e){ dotgrid.mouse_move(e); }, false); document.addEventListener('mousemove', function(e){ dotgrid.mouse_move(e); }, false);

34
sources/scripts/dotgrid.js
View File

@ -10,6 +10,7 @@ function Dotgrid(width,height,grid_x,grid_y,block_x,block_y,thickness = 3,lineca
this.thickness = thickness; this.thickness = thickness;
this.linecap = linecap; this.linecap = linecap;
this.color = color; this.color = color;
this.offset = new Pos(0,0);
this.element = null; this.element = null;
@ -73,6 +74,7 @@ function Dotgrid(width,height,grid_x,grid_y,block_x,block_y,thickness = 3,lineca
cursor_end.id = "cursor_end"; cursor_end.id = "cursor_end";
this.element.appendChild(cursor_end); this.element.appendChild(cursor_end);
this.offset_el = document.createElementNS("http://www.w3.org/2000/svg", "g");
this.mirror_el = document.createElementNS("http://www.w3.org/2000/svg", "g"); this.mirror_el = document.createElementNS("http://www.w3.org/2000/svg", "g");
this.mirror_path = document.createElementNS("http://www.w3.org/2000/svg", "path"); this.mirror_path = document.createElementNS("http://www.w3.org/2000/svg", "path");
@ -92,7 +94,8 @@ function Dotgrid(width,height,grid_x,grid_y,block_x,block_y,thickness = 3,lineca
this.svg_el.style.strokeLinecap = this.linecap; this.svg_el.style.strokeLinecap = this.linecap;
this.element.appendChild(this.svg_el); this.element.appendChild(this.svg_el);
this.svg_el.appendChild(this.path); this.offset_el.appendChild(this.path)
this.svg_el.appendChild(this.offset_el);
this.svg_el.appendChild(this.mirror_el); this.svg_el.appendChild(this.mirror_el);
this.mirror_el.appendChild(this.mirror_path); this.mirror_el.appendChild(this.mirror_path);
@ -187,17 +190,23 @@ function Dotgrid(width,height,grid_x,grid_y,block_x,block_y,thickness = 3,lineca
this.mod_move = function(x,y) this.mod_move = function(x,y)
{ {
if(!to && !end){ if(!to && !end && from){
this.set_from([from[0]+(x*10),from[1]+(y*10)]) this.set_from([from[0]-(x),from[1]+(y)])
this.draw(); this.draw();
return; return;
} }
if(!end){ if(!end && to){
this.set_to([to[0]+(x*10),to[1]+(y*10)]) this.set_to([to[0]-(x),to[1]+(y)])
this.draw(); this.draw();
return; return;
} }
this.set_end([end[0]+(x*10),end[1]+(y*10)]) if(end){
this.set_end([end[0]-(x),end[1]+(y)])
this.draw();
return;
}
// Move offset
this.offset = this.offset.add(new Pos(x,y));
this.draw(); this.draw();
} }
@ -220,7 +229,9 @@ function Dotgrid(width,height,grid_x,grid_y,block_x,block_y,thickness = 3,lineca
this.svg_el.style.strokeWidth = this.thickness; this.svg_el.style.strokeWidth = this.thickness;
this.mirror_path.setAttribute("d",this.mirror ? d : ''); this.mirror_path.setAttribute("d",this.mirror ? d : '');
this.mirror_path.setAttribute("transform","translate(300,0),scale(-1,1)") this.mirror_path.setAttribute("transform","translate("+(300 - (this.offset.x))+","+(this.offset.y)+"),scale(-1,1)")
this.offset_el.setAttribute("transform","translate("+(this.offset.x)+","+(this.offset.y)+")")
this.update_interface(); this.update_interface();
} }
@ -231,7 +242,10 @@ function Dotgrid(width,height,grid_x,grid_y,block_x,block_y,thickness = 3,lineca
if(from === null || to === null){ return; } if(from === null || to === null){ return; }
var end_point = end ? new Pos(end[0] * -1,end[1]) : null; var end_point = end ? new Pos(end[0] * -1,end[1]) : null;
this.segments.push(new Path_Line(new Pos(from[0] * -1,from[1]),new Pos(to[0] * -1,to[1]),end_point));
from = new Pos(from[0],from[1])
this.segments.push(new Path_Line(new Pos(from.x * -1,from.y).sub(this.offset),new Pos(to[0] * -1,to[1]).sub(this.offset),end_point.sub(this.offset)));
this.draw(); this.draw();
reset(); reset();
@ -242,7 +256,7 @@ function Dotgrid(width,height,grid_x,grid_y,block_x,block_y,thickness = 3,lineca
if(from === null || to === null){ return; } if(from === null || to === null){ return; }
var end_point = end ? new Pos(end[0] * -1,end[1]) : null; var end_point = end ? new Pos(end[0] * -1,end[1]) : null;
this.segments.push(new Path_Arc(new Pos(from[0] * -1,from[1]),new Pos(to[0] * -1,to[1]),orientation,end_point)); this.segments.push(new Path_Arc(new Pos(from[0] * -1,from[1]).sub(this.offset),new Pos(to[0] * -1,to[1]).sub(this.offset),orientation,end_point.sub(this.offset)));
this.draw(); this.draw();
reset(); reset();
@ -252,7 +266,7 @@ function Dotgrid(width,height,grid_x,grid_y,block_x,block_y,thickness = 3,lineca
{ {
if(from === null || to === null){ return; } if(from === null || to === null){ return; }
this.segments.push(new Path_Bezier(new Pos(from[0] * -1,from[1]),new Pos(to[0] * -1,to[1]),new Pos(end[0] * -1,end[1]))); this.segments.push(new Path_Bezier(new Pos(from[0] * -1,from[1]).sub(this.offset),new Pos(to[0] * -1,to[1]).sub(this.offset),new Pos(end[0] * -1,end[1]).sub(this.offset)));
this.draw(); this.draw();
reset(); reset();

8
sources/scripts/keyboard.js
View File

@ -24,10 +24,10 @@ function Keyboard()
case 8 : dotgrid.erase(); break; // 'Backspace' case 8 : dotgrid.erase(); break; // 'Backspace'
case 69 : dotgrid.export(); break; // 'e' case 69 : dotgrid.export(); break; // 'e'
case 38 : dotgrid.mod_move(0,-1); break; // 'up' case 38 : dotgrid.mod_move(0,-10); break; // 'up'
case 40 : dotgrid.mod_move(0,1); break; // 'down' case 40 : dotgrid.mod_move(0,10); break; // 'down'
case 37 : dotgrid.mod_move(1,0); break; // 'left' case 37 : dotgrid.mod_move(-10,0); break; // 'left'
case 39 : dotgrid.mod_move(-1,0); break; // 'right' case 39 : dotgrid.mod_move(10,0); break; // 'right'
} }
dotgrid.draw(); dotgrid.draw();
} }

5
sources/scripts/pos.js
View File

@ -13,6 +13,11 @@ function Pos(x,y)
return new Pos(this.x - pos2.x,this.y - pos2.y) return new Pos(this.x - pos2.x,this.y - pos2.y)
} }
this.add = function(pos2)
{
return new Pos(this.x + pos2.x,this.y + pos2.y)
}
this.is_equal = function(pos2) this.is_equal = function(pos2)
{ {
return pos2.x == this.x && pos2.y == this.y; return pos2.x == this.x && pos2.y == this.y;