Skip to content

Instantly share code, notes, and snippets.

@phun-ky
Created October 14, 2021 10:11
Show Gist options
  • Save phun-ky/460a96a0ce8e40e0a5f63b80fdcf9a5a to your computer and use it in GitHub Desktop.
Save phun-ky/460a96a0ce8e40e0a5f63b80fdcf9a5a to your computer and use it in GitHub Desktop.
Stripped whatinput
/*
* Usage:
*
* whatinput(el) // Where el is ither document.documentElement(default) or the element you want to
* // add whatinput attributes to.
*/
const whatinput=e=>{const t=e||document.documentElement;e||(e=window);let n=null,o="initial",s=o,r=Date.now();const i=["button","input","select","textarea"];let a=[16,17,18,91,93],d=[];const u={keydown:"keyboard",keyup:"keyboard",mousedown:"mouse",mousemove:"mouse",MSPointerDown:"pointer",MSPointerMove:"pointer",pointerdown:"pointer",pointermove:"pointer",touchstart:"touch",touchend:"touch"};let c=!1;const l={x:null,y:null},p={2:"touch",3:"touch",4:"mouse"};let m=!1;try{const t=Object.defineProperty({},"passive",{get:()=>m=!0});e.addEventListener("test",null,t)}catch(e){}const w=()=>{const t=!!m&&{passive:!0};window.PointerEvent?(e.addEventListener("pointerdown",h),e.addEventListener("pointermove",y)):window.MSPointerEvent?(e.addEventListener("MSPointerDown",h),e.addEventListener("MSPointerMove",y)):(e.addEventListener("mousedown",h),e.addEventListener("mousemove",y),"ontouchstart"in window&&(e.addEventListener("touchstart",h,t),e.addEventListener("touchend",h))),e.addEventListener(f(),y,t),e.addEventListener("keydown",h),e.addEventListener("keyup",h),e.addEventListener("focusin",L),e.addEventListener("focusout",E)},h=e=>{const t=e.which;let n=u[e.type];"pointer"===n&&(n=b(e));const r=!d.length&&-1===a.indexOf(t),c=d.length&&-1!==d.indexOf(t);let l="keyboard"===n&&t&&(r||c)||"mouse"===n||"touch"===n;if(M(n)&&(l=!1),l&&o!==n&&(o=n,v("input")),l&&s!==n){const e=document.activeElement;e&&e.nodeName&&(-1===i.indexOf(e.nodeName.toLowerCase())||"button"===e.nodeName.toLowerCase()&&!e.closest("form"))&&(s=n,v("intent"))}},v=e=>{t.setAttribute("data-what"+e,"input"===e?o:s)},y=e=>{let t=u[e.type];"pointer"===t&&(t=b(e)),g(e),(!c&&!M(t)||c&&"wheel"===e.type||"mousewheel"===e.type||"DOMMouseScroll"===e.type)&&s!==t&&(s=t,v("intent"))},L=e=>{e.target.nodeName?(n=e.target.nodeName.toLowerCase(),t.setAttribute("data-whatelement",n),e.target.classList&&e.target.classList.length&&t.setAttribute("data-whatclasses",e.target.classList.toString().replace(" ",","))):E()},E=()=>{n=null,t.removeAttribute("data-whatelement"),t.removeAttribute("data-whatclasses")},b=e=>"number"==typeof e.pointerType?p[e.pointerType]:"pen"===e.pointerType?"touch":e.pointerType,M=e=>{const t=Date.now(),n="mouse"===e&&"touch"===o&&t-r<200;return r=t,n},f=()=>{let e=null;return e="onwheel"in document.createElement("div")?"wheel":void 0!==document.onmousewheel?"mousewheel":"DOMMouseScroll"},g=e=>{l.x!==e.screenX||l.y!==e.screenY?(c=!1,l.x=e.screenX,l.y=e.screenY):c=!0};u[f()]="mouse",w()};export default whatinput;
Sign up for free to join this conversation on GitHub. Already have an account? Sign in to comment