From 321c41ffcc0d582bf63c4d68fb145672673ef3bf Mon Sep 17 00:00:00 2001 From: elioat Date: Fri, 12 Jan 2024 22:02:57 -0500 Subject: * --- js/inknswitch/index.html | 6 ++++-- js/inknswitch/ink.js | 40 +++++++++++++++++++++++++++++++++++++++- 2 files changed, 43 insertions(+), 3 deletions(-) (limited to 'js') diff --git a/js/inknswitch/index.html b/js/inknswitch/index.html index 535c41d..44e3808 100644 --- a/js/inknswitch/index.html +++ b/js/inknswitch/index.html @@ -27,6 +27,7 @@ margin: 0 auto; display: block; } + /* #toggleButton { border: 1px solid black; background-color: transparent; @@ -39,11 +40,12 @@ #toggleButton:hover { cursor: pointer; } + */ - - + +

diff --git a/js/inknswitch/ink.js b/js/inknswitch/ink.js index 58b923b..3a48ce6 100644 --- a/js/inknswitch/ink.js +++ b/js/inknswitch/ink.js @@ -75,6 +75,23 @@ canvas.addEventListener('mouseup', (e) => { } }); +canvas.addEventListener('touchstart', function(e) { + e.preventDefault(); + startDrawing(e.touches[0]); +}, false); + +canvas.addEventListener('touchmove', function(e) { + e.preventDefault(); + if (drawing) { + draw(e.touches[0]); + } +}, false); + +canvas.addEventListener('touchend', function(e) { + e.preventDefault(); + stopDrawing(); +}, false); + const savedImage = localStorage.getItem('canvasImage'); if (savedImage) { const img = new Image(); @@ -104,6 +121,7 @@ const toggle = () => { } }; +/* const toggleButton = document.getElementById('toggleButton'); toggleButton.style.pointerEvents = 'auto'; toggleButton.addEventListener('click', toggleMode); @@ -112,6 +130,7 @@ toggleButton.addEventListener('touchend', toggleMode); function toggleMode() { toggle(); } +*/ document.addEventListener('keydown', (e) => { // Cmd or Ctrl and D key to toggle modes @@ -139,4 +158,23 @@ document.addEventListener('keydown', (e) => { } localStorage.setItem('noteContent', noteArea.value); -}); \ No newline at end of file +}); + +let touchStartTimestamp; +let touchStartCount; + +document.addEventListener('touchstart', function(e) { + touchStartTimestamp = Date.now(); + touchStartCount = e.touches.length; +}, false); + +document.addEventListener('touchend', function(e) { + const touchEndTimestamp = Date.now(); + const touchEndCount = e.touches.length; + + // Check if the touch event was a two-finger tap + if (touchStartCount === 2 && touchEndCount === 0 && touchEndTimestamp - touchStartTimestamp < 500) { + // Two-finger tap detected + toggleMode(); + } +}, false); \ No newline at end of file -- cgit 1.4.1-2-gfad0