diff --git a/.gitignore b/.gitignore index da23d0d..44e4d24 100644 --- a/.gitignore +++ b/.gitignore @@ -23,3 +23,5 @@ build/Release # Deployed apps should consider commenting this line out: # see https://npmjs.org/doc/faq.html#Should-I-check-my-node_modules-folder-into-git node_modules + +package-lock.json \ No newline at end of file diff --git a/index.html b/index.html new file mode 100644 index 0000000..80d22fc --- /dev/null +++ b/index.html @@ -0,0 +1,58 @@ + + + + + + Touch Emulator Manual + + + + +
Touch Emulator Manual
+ +
+
+ +
Manual:
+ + +
+
+
Touch Events:
+ + + + \ No newline at end of file diff --git a/package.json b/package.json index 3c8b179..08c6541 100644 --- a/package.json +++ b/package.json @@ -7,6 +7,7 @@ "test": "tests" }, "scripts": { + "dev": "vite dev", "test": "echo \"Error: no test specified\" && exit 1" }, "repository": { @@ -25,5 +26,8 @@ "bugs": { "url": "https://github.com/hammerjs/touchemulator/issues" }, - "homepage": "https://github.com/hammerjs/touchemulator" + "homepage": "https://github.com/hammerjs/touchemulator", + "devDependencies": { + "vite": "^3.2.4" + } } diff --git a/touch-emulator.js b/touch-emulator.js index 358b2d0..429265b 100644 --- a/touch-emulator.js +++ b/touch-emulator.js @@ -4,6 +4,7 @@ var isMultiTouch = false; var multiTouchStartPos; var eventTarget; + var eventTargetList = []; var touchElements = {}; // polyfills @@ -137,21 +138,39 @@ // The EventTarget on which the touch point started when it was first placed on the surface, // even if the touch point has since moved outside the interactive area of that element. // also, when the target doesnt exist anymore, we update it + if (ev.type == 'mousedown' || !eventTarget || (eventTarget && !eventTarget.dispatchEvent)) { - if(ev.composedPath() && ev.composedPath().length > 0){ - eventTarget = ev.composedPath()[0] - }else { + var composedPathList = ev.composedPath(); + // Emulating event bubble from composedPath()[0] to ev.target for DOMs inside Web Components . + if(composedPathList.length > 0){ + for(var i = 0; i < composedPathList.length; i = i+1){ + if(composedPathList[i]!==ev.target && (eventTargetList.length === 0 || eventTargetList.indexOf(composedPathList[i]) === -1 )){ + eventTargetList.push(composedPathList[i]) + } else { + break; + } + } + + for(var j = 0; j < eventTargetList.length; j = j+1){ + processTriggerForOneElement(ev, touchType, eventTargetList[j]) + } + } else { eventTarget = ev.target; + processTriggerForOneElement(ev, touchType, eventTarget) } } + } + } + + function processTriggerForOneElement(ev, touchType, eventTarget){ // shiftKey has been lost, so trigger a touchend if (isMultiTouch && !ev.shiftKey) { - triggerTouch('touchend', ev); + triggerTouch('touchend', ev, eventTarget); isMultiTouch = false; } - triggerTouch(touchType, ev); + triggerTouch(touchType, ev, eventTarget); // we're entering the multi-touch mode! if (!isMultiTouch && ev.shiftKey) { @@ -164,7 +183,7 @@ screenX: ev.screenX, screenY: ev.screenY }; - triggerTouch('touchstart', ev); + triggerTouch('touchstart', ev, eventTarget); } // reset @@ -172,8 +191,8 @@ multiTouchStartPos = null; isMultiTouch = false; eventTarget = null; + eventTargetList = []; } - } } /** @@ -181,7 +200,7 @@ * @param eventName * @param mouseEv */ - function triggerTouch(eventName, mouseEv) { + function triggerTouch(eventName, mouseEv, eventTarget) { var touchEvent = document.createEvent('Event'); touchEvent.initEvent(eventName, true, true); diff --git a/vite.config.js b/vite.config.js new file mode 100644 index 0000000..3c2af7b --- /dev/null +++ b/vite.config.js @@ -0,0 +1,9 @@ +import { defineConfig } from 'vite'; + +// https://vitejs.dev/config/ +export default defineConfig({ + server: { + host: '0.0.0.0', + port: 8080, + }, +});