forked from mfranzke/datalist-polyfill
-
Notifications
You must be signed in to change notification settings - Fork 0
/
datalist-polyfill.min.js
6 lines (6 loc) · 7.52 KB
/
datalist-polyfill.min.js
1
2
3
4
5
6
/*
* Datalist polyfill - https://github.com/mfranzke/datalist-polyfill
* @license Copyright(c) 2017 by Maximilian Franzke
* Supported by Christian, Johannes, @mitchhentges, @mertenhanisch, @ailintom, @Kravimir, @mischah, @hryamzik, @ottoville, @IceCreamYou, @wlekin, @eddr, @beebee1987, @mricherzhagen, @acespace90, @damien-git, @nexces, @Sora2455 and @jscho13 - many thanks for that !
*/
function getInternetExplorerVersion(){var e=window.navigator.userAgent,t=e.indexOf("MSIE ");if(0<t)return parseInt(e.substring(t+5,e.indexOf(".",t)),10);if(0<e.indexOf("Trident/")){var n=e.indexOf("rv:");return parseInt(e.substring(n+3,e.indexOf(".",n)),10)}return-1}function isEdge(){return Boolean(-1!==window.navigator.userAgent.indexOf("Edge/"))}!function(){"use strict";var s=window.document,e="list"in s.createElement("input")&&Boolean(s.createElement("datalist")&&window.HTMLDataListElement),l=10<=getInternetExplorerVersion(),u=isEdge();if(e&&!l&&!u)return;Element.prototype.matches||(Element.prototype.matches=Element.prototype.msMatchesSelector);var d=!1,p=" / ",c=["text","email","number","search","tel","url"],o="polyfilled",v="polyfilling";window.addEventListener("touchstart",function e(){d=!0,window.removeEventListener("touchstart",e)});var i,t=window.MutationObserver||window.WebKitMutationObserver;void 0!==t&&(i=new t(function(e){var t=!1;if(e.forEach(function(e){e.target instanceof HTMLElement&&"datalist"===e.target.tagName.toLowerCase()&&1<e.addedNodes.length&&(t=e.target)}),t){var n=s.querySelector('input[list="'+t.id+'"]');""!==b(n)&&k(E(t,n).length,t.getElementsByClassName(v)[0])}}));function n(e){var t=e.target,n=t.list,i=38===e.keyCode||40===e.keyCode;if("input"===t.tagName.toLowerCase()&&null!==n)if(l||u)""===b(t)||i||13===e.keyCode||27===e.keyCode||!l&&"text"!==t.type||(f(t,n),t.focus());else{var r=!1,a=n.getElementsByClassName(v)[0]||C(t,n);if(27!==e.keyCode&&13!==e.keyCode&&(""!==b(t)||i)&&void 0!==a){0<E(n,t).length&&(r=!0);var o=a.options.length-1;d?a.selectedIndex=0:i&&"number"!==t.getAttribute("type")&&(a.selectedIndex=38===e.keyCode?o:0,a.focus())}k(r,a)}}function r(e){var t=e.target,n=t.list;if(t.matches("input[list]")&&t.matches("."+o)&&n){var i=n.querySelector('option[value="'+b(t).replace(/\\([\s\S])|(")/g,"\\$1$2")+'"]');i&&i.getAttribute("data-originalvalue")&&m(t,i.getAttribute("data-originalvalue"))}}function a(e){if(e.target.matches("input[list]")){var t=e.target,n=t.list;if("input"===t.tagName.toLowerCase()&&null!==n){if(t.matches("."+o)||y(t,e.type),u&&"focusin"===e.type){var i=t.list.options[0];i.value=i.value}if(!l&&!u){var r=n.getElementsByClassName(v)[0]||C(t,n),a=r&&r.querySelector("option:not(:disabled)")&&("focusin"===e.type&&""!==b(t)||e.relatedTarget&&e.relatedTarget===r);k(a,r)}}}}var f=function(e,t){var i=b(e);Array.prototype.slice.call(t.options,0).forEach(function(e){var t=e.getAttribute("data-originalvalue"),n=t||e.value;t||e.setAttribute("data-originalvalue",n),e.label||e.text||(e.label=n),e.value=g(e,i)?i+"###[P0LYFlLLed]###"+n.toLowerCase():n})},g=function(e,t){var n=e.value.toLowerCase(),i=t.toLowerCase(),r=e.getAttribute("label"),a=e.text.toLowerCase();return Boolean(!1===e.disabled&&(""!==n&&-1!==n.indexOf(i)||r&&-1!==r.toLowerCase().indexOf(i)||""!==a&&-1!==a.indexOf(i)))},y=function(e,t){e.setAttribute("autocomplete","off"),e.setAttribute("role","textbox"),e.setAttribute("aria-haspopup","true"),e.setAttribute("aria-autocomplete","list"),e.setAttribute("aria-owns",e.getAttribute("list")),"focusin"===t?(e.addEventListener("keyup",n),e.addEventListener("focusout",a,!0),(l||u&&"text"===e.type)&&e.addEventListener("input",r)):"blur"===t&&(e.removeEventListener("keyup",n),e.removeEventListener("focusout",a,!0),(l||u&&"text"===e.type)&&e.removeEventListener("input",r)),e.className+=" "+o},b=function(e){return"email"===e.getAttribute("type")&&null!==e.getAttribute("multiple")?e.value.substring(e.value.lastIndexOf(",")+1):e.value},m=function(e,t){var n;e.value="email"===e.getAttribute("type")&&null!==e.getAttribute("multiple")&&-1<(n=e.value.lastIndexOf(","))?e.value.slice(0,n)+","+t:t};if(s.addEventListener("focusin",a,!0),!l&&!u){var h,w,E=function(e,r){void 0!==i&&i.disconnect();var t=e.getElementsByClassName(v)[0]||C(r,e),a=b(r),o=s.createDocumentFragment(),l=s.createDocumentFragment();Array.prototype.slice.call(e.querySelectorAll("option:not(:disabled)")).sort(function(e,t){var n=e.value,i=t.value;return"url"===r.getAttribute("type")&&(n=n.replace(/(^\w+:|^)\/\//,""),i=i.replace(/(^\w+:|^)\/\//,"")),n.localeCompare(i)}).forEach(function(e){var t=e.value,n=e.getAttribute("label"),i=e.text;if(g(e,a)){var r=i.substr(0,t.length+p.length);i&&!n&&i!==t&&r!==t+p?e.innerText=t+p+i:e.text||(e.innerText=n||t),o.appendChild(e)}else l.appendChild(e)}),t.appendChild(o);var n=t.options.length;return t.size=10<n?10:n,t.multiple=!d&&n<2,(e.getElementsByClassName("ie9_fix")[0]||e).appendChild(l),void 0!==i&&i.observe(e,{childList:!0}),t.options},C=function(t,e){if(!(t.getAttribute("type")&&-1===c.indexOf(t.getAttribute("type"))||null===e)){window.addEventListener("resize",function(){var e=t.getClientRects();r.style.width=e[0].width+"px"});var n=t.getClientRects(),i=window.getComputedStyle(t),r=s.createElement("select");if(r.setAttribute("class",v),r.style.position="absolute",k(!1,r),r.setAttribute("tabindex","-1"),r.setAttribute("aria-live","polite"),r.setAttribute("role","listbox"),d||r.setAttribute("aria-multiselectable","false"),"block"===i.getPropertyValue("display"))r.style.marginTop="-"+i.getPropertyValue("margin-bottom");else{var a="rtl"===i.getPropertyValue("direction")?"right":"left";r.style.setProperty("margin-"+a,"-"+(n[0].width+parseFloat(i.getPropertyValue("margin-"+a)))+"px"),r.style.marginTop=parseInt(n[0].height+(t.offsetTop-e.offsetTop),10)+"px"}if(r.style.borderRadius=i.getPropertyValue("border-radius"),r.style.width=n[0].width+"px",d){var o=s.createElement("option");o.innerText=e.title,o.disabled=!0,o.setAttribute("class","message"),r.appendChild(o)}return e.appendChild(r),d?r.addEventListener("change",A):r.addEventListener("click",A),r.addEventListener("blur",A),r.addEventListener("keydown",A),r.addEventListener("keypress",x),r}},x=function(e){var t=e.target,n=t.parentNode,i=s.querySelector('input[list="'+n.id+'"]');"select"===t.tagName.toLowerCase()&&null!==i&&(!e.key||"Backspace"!==e.key&&1!==e.key.length||(i.focus(),"Backspace"===e.key?(i.value=i.value.substr(0,i.value.length-1),L(i)):i.value+=e.key,E(n,i)))},A=function(e){var t=e.currentTarget,n=t.parentNode,i=s.querySelector('input[list="'+n.id+'"]');if("select"===t.tagName.toLowerCase()&&null!==i){var r=e.type,a="keydown"===r&&13!==e.keyCode&&27!==e.keyCode;("change"===r||"click"===r||"keydown"===r&&(13===e.keyCode||"Tab"===e.key))&&0<t.value.length&&t.value!==n.title?(m(i,t.value),L(i),"Tab"!==e.key&&i.focus(),13===e.keyCode&&e.preventDefault(),a=!1):"keydown"===r&&27===e.keyCode&&i.focus(),k(a,t)}},L=function(e){var t;"function"==typeof Event?t=new Event("input",{bubbles:!0}):(t=s.createEvent("Event")).initEvent("input",!0,!1),e.dispatchEvent(t)},k=function(e,t){e?t.removeAttribute("hidden"):t.setAttributeNode(s.createAttribute("hidden")),t.setAttribute("aria-hidden",(!e).toString())};(h=window.HTMLInputElement)&&h.prototype&&void 0===h.prototype.list&&Object.defineProperty(h.prototype,"list",{get:function(){var e=s.getElementById(this.getAttribute("list"));return"object"==typeof this&&this instanceof h&&e&&e.matches("datalist")?e:null}}),(w=window.HTMLElement)&&w.prototype&&void 0===w.prototype.options&&Object.defineProperty(w.prototype,"options",{get:function(){return"object"==typeof this&&this instanceof w?this.getElementsByTagName("option"):null}})}}();