Merge pull request #1 from virushuo/master

using shift key to lock lines at vertical / horizontal
This commit is contained in:
Roland Rytz 2017-04-04 17:14:15 +02:00 committed by GitHub
commit 3a2cf48f31

67
draw.js
View file

@ -47,23 +47,39 @@ function initDraw(){
var drawing = true; var drawing = true;
var undoHistory = []; var undoHistory = [];
var _global_key_status = {"L_SHIFT":0, "R_SHIFT":0, buff:{}};
var lastPos = [0, 0]; var lastPos = [0, 0];
render(path); render(path);
container.addEventListener("mousedown", function(e){ container.addEventListener("mousedown", function(e){
var e_clientX = e.clientX;
var e_clientY = e.clientY;
if(_global_key_status.R_SHIFT || _global_key_status.L_SHIFT === 1){
var r = lockHorV(e);
e_clientX=r[0];
e_clientY=r[1];
}
lastPos = [ lastPos = [
e.clientX e_clientX
,e.clientY ,e_clientY
]; ];
}); });
container.addEventListener("mouseup", function(e){ container.addEventListener("mouseup", function(e){
if(Math.abs(lastPos[0] - e.clientX) + Math.abs(lastPos[1] - e.clientY) <= 4 && drawing){ var e_clientX = e.clientX;
var e_clientY = e.clientY;
if(_global_key_status.R_SHIFT || _global_key_status.L_SHIFT === 1){
e_clientX = lastPos[0];
e_clientY = lastPos[1];
}
if(Math.abs(lastPos[0] - e_clientX) + Math.abs(lastPos[1] - e_clientY) <= 4 && drawing){
path.push([ path.push([
~~((e.clientX - (container.clientWidth/2 - innerContainer.clientWidth/2 + zoomOrigin[0]))/zoom)+0.5 ~~((e_clientX - (container.clientWidth/2 - innerContainer.clientWidth/2 + zoomOrigin[0]))/zoom)+0.5
,~~((e.clientY - (container.clientHeight/2 - innerContainer.clientHeight/2 + zoomOrigin[1]))/zoom)+0.5 ,~~((e_clientY - (container.clientHeight/2 - innerContainer.clientHeight/2 + zoomOrigin[1]))/zoom)+0.5
]); ]);
render(path); render(path);
@ -77,11 +93,31 @@ function initDraw(){
} }
}); });
function lockHorV(e){
var e_clientX = e.clientX;
var e_clientY = e.clientY;
var x_offset = Math.abs(e.clientX -lastPos[0]);
var y_offset = Math.abs(e.clientY-lastPos[1]);
var offset = y_offset - x_offset ;
if(y_offset > x_offset ) //keep x
e_clientX = lastPos[0];
else if (x_offset > y_offset) //keep y
e_clientY =lastPos[1];
return [e_clientX,e_clientY];
}
window.addEventListener("mousemove", function(e){ window.addEventListener("mousemove", function(e){
var e_clientX = e.clientX;
var e_clientY = e.clientY;
if(!dragging && drawing){ if(!dragging && drawing){
if(_global_key_status.R_SHIFT || _global_key_status.L_SHIFT === 1){
var r = lockHorV(e);
e_clientX=r[0];
e_clientY=r[1];
}
var last = [ var last = [
~~((e.clientX - (container.clientWidth/2 - innerContainer.clientWidth/2 + zoomOrigin[0]))/zoom)+0.5 ~~((e_clientX - (container.clientWidth/2 - innerContainer.clientWidth/2 + zoomOrigin[0]))/zoom)+0.5
,~~((e.clientY - (container.clientHeight/2 - innerContainer.clientHeight/2 + zoomOrigin[1]))/zoom)+0.5 ,~~((e_clientY - (container.clientHeight/2 - innerContainer.clientHeight/2 + zoomOrigin[1]))/zoom)+0.5
]; ];
render(path.concat([last])); render(path.concat([last]));
} }
@ -96,9 +132,24 @@ function initDraw(){
redo(); redo();
} else if(e.key == "Escape"){ } else if(e.key == "Escape"){
exportOverlay.style.display = "none"; exportOverlay.style.display = "none";
} } else if (e.key === "Shift" ){
if(e.code === "ShiftRight")
_global_key_status.R_SHIFT = 0;
else if(e.code === "ShiftLeft")
_global_key_status.L_SHIFT = 0;
}
}); });
window.addEventListener("keydown", function(e){
if (e.key === "Shift" ){
if(e.code === "ShiftRight")
_global_key_status.R_SHIFT = 1;
else if(e.code === "ShiftLeft")
_global_key_status.L_SHIFT = 1;
}
});
finishButton.addEventListener("click", function(e){ finishButton.addEventListener("click", function(e){
finish(); finish();
}); });