0
0
mirror of https://github.com/Doodle3D/doodle3d-client.git synced 2024-11-22 09:17:56 +01:00

- fixed canvasdrawing bug w.r.t. touch-enabled devices

- removed some superfluous lines
This commit is contained in:
Adriaan Wormgoor 2013-10-11 18:40:03 +02:00
parent 53e9a7e4a4
commit aea89d3422
2 changed files with 16 additions and 10 deletions

View File

@ -121,15 +121,15 @@ function SettingsWindow() {
console.log("f:showSettings()"); console.log("f:showSettings()");
this.loadSettings(); // reload settings this.loadSettings(); // reload settings
this.window.css("display","table"); // this.window.css("display","table");
$("#contentOverlay").fadeIn(375, function() { $("#contentOverlay").fadeIn(375, function() {
document.body.removeEventListener('touchmove',prevent,false); // document.body.removeEventListener('touchmove',prevent,false);
}); });
} }
this.hideSettings = function() { this.hideSettings = function() {
$("#contentOverlay").fadeOut(375, function() { $("#contentOverlay").fadeOut(375, function() {
document.body.addEventListener('touchmove',prevent,false); // document.body.addEventListener('touchmove',prevent,false);
self.window.css("display","none"); // self.window.css("display","none");
}); });
} }

View File

@ -62,6 +62,7 @@ function initDoodleDrawing() {
canvas.addEventListener('touchstart',onCanvasTouchDown,false); canvas.addEventListener('touchstart',onCanvasTouchDown,false);
canvas.addEventListener('touchmove',onCanvasTouchMove,false); canvas.addEventListener('touchmove',onCanvasTouchMove,false);
canvas.addEventListener('touchend',onCanvasTouchEnd,false); canvas.addEventListener('touchend',onCanvasTouchEnd,false);
document.body.addEventListener('touchmove',prevent,false);
} }
//*/ //*/
@ -183,7 +184,7 @@ function redrawDoodle() {
function adjustBounds(x, y) { function adjustBounds(x, y) {
var newPointsOutsideOfCurrentBounds = false; var newPointsOutsideOfCurrentBounds = false;
// console.log("f:adjustBounds("+x+","+y+")"); console.log("f:adjustBounds("+x+","+y+")");
if (doodleBounds[0] == -1) { if (doodleBounds[0] == -1) {
// if doodleBounds[0] is -1 then it isn't initted yet, so x and y are both the min and max vals // if doodleBounds[0] is -1 then it isn't initted yet, so x and y are both the min and max vals
@ -386,10 +387,12 @@ function onCanvasTouchDown(e) {
console.log("f:onCanvasTouchDown >> e: " , e); console.log("f:onCanvasTouchDown >> e: " , e);
// var x = e.touches[0].pageX - e.touches[0].target.offsetLeft; // var x = e.touches[0].pageX - e.touches[0].target.offsetLeft;
// var y = e.touches[0].pageY - e.touches[0].target.offsetTop; // var y = e.touches[0].pageY - e.touches[0].target.offsetTop;
// var x = e.touches[0].pageX - drawCanvasTopLeftCoords[0]; var x = e.touches[0].pageX - drawCanvasTopLeftCoords[0];
// var y = e.touches[0].pageY - drawCanvasTopLeftCoords[1]; var y = e.touches[0].pageY - drawCanvasTopLeftCoords[1];
var x = e.touches[0].layerX; // var x = e.touches[0].pageX;
var y = e.touches[0].layerY; // var y = e.touches[0].pageY;
// var x = e.touches[0].layerX;
// var y = e.touches[0].layerY;
_points.push([x, y, true]); _points.push([x, y, true]);
adjustBounds(x, y); adjustBounds(x, y);
@ -403,13 +406,16 @@ function onCanvasTouchDown(e) {
function onCanvasTouchMove(e) { function onCanvasTouchMove(e) {
e.preventDefault(); e.preventDefault();
console.log("f:onCanvasTouchMove >> e: " , e);
// var x = e.touches[0].pageX - e.touches[0].target.offsetLeft; // var x = e.touches[0].pageX - e.touches[0].target.offsetLeft;
// var y = e.touches[0].pageY - e.touches[0].target.offsetTop; // var y = e.touches[0].pageY - e.touches[0].target.offsetTop;
var x = e.touches[0].pageX - drawCanvasTopLeftCoords[0]; var x = e.touches[0].pageX - drawCanvasTopLeftCoords[0];
var y = e.touches[0].pageY - drawCanvasTopLeftCoords[1]; var y = e.touches[0].pageY - drawCanvasTopLeftCoords[1];
// var x = e.touches[0].layerX; // var x = e.touches[0].layerX;
// var y = e.touches[0].layerY; // var y = e.touches[0].layerY;
// var x = e.touches[0].layerX;
// var y = e.touches[0].layerY;
console.log("f:onCanvasTouchMove >> x,y = "+x+","+y+" , e: " , e);
if (prevPoint.x != -1 || prevPoint.y != -1) { if (prevPoint.x != -1 || prevPoint.y != -1) {
var dist = Math.sqrt(Math.pow((prevPoint.x - x), 2) + Math.pow((prevPoint.y - y), 2)); var dist = Math.sqrt(Math.pow((prevPoint.x - x), 2) + Math.pow((prevPoint.y - y), 2));