-
Notifications
You must be signed in to change notification settings - Fork 0
/
visicom-autocomplete.min.js
1 lines (1 loc) · 10.9 KB
/
visicom-autocomplete.min.js
1
let visicomAutoComplete=function(){return function(e){let t={selector:"#visicom-autocomplete",apiUrl:"https://api.visicom.ua/data-api/4.0/{lang}/",proxyApiGeocodeUrl:"",proxyApiFeatureUrl:"",apiKey:"",placeholder:"Search...",minChars:3,delay:150,width:"400px",height:"35px",map:null,marker:null,suggestsLimit:5,maxCharsInSuggest:55,lang:"local",searchTextPrefix:"",customFeatures:[],onSuggestSelected:e=>console.log("Suggest selected: "+e.html)},n=d((t=Object.assign({},t,e)).selector);if(!n)return void console.log(`Couldn't find element with '${t.selector}' selector.`);let l=n.innerHTML.trim();n.classList.add("visicom-autocomplete"),n.style.width=t.width,n.style.height=t.height;let r=document.createElement("input");r.placeholder=t.placeholder,r.setAttribute("autocomplete","off"),r.setAttribute("autocorrect","off"),r.setAttribute("autocapitalize","off"),r.setAttribute("spellcheck","false");let a=document.createElement("div");a.classList.add("visicom-suggests");let o=document.createElement("button");if(o.classList.add("close"),o.style.width=t.height,o.style.height=t.height,n.appendChild(r),n.appendChild(a),n.appendChild(o),!l||!l.includes('href="https://api.visicom.ua/"'))return void console.log("Visicom link not available.");if(n.removeChild(n.firstElementChild),!t.apiKey&&!t.proxyApiGeocodeUrl&&!t.proxyApiFeatureUrl)return void console.log("You didn't specify your API key.");let s=[],i=-1,c=null,u="";if(t.map&&!t.marker)if("undefined"==typeof L||null===L)console.log("Leaflet object is not available. Cannot create marker object.");else{let e='<svg xmlns="http://www.w3.org/2000/svg" \n width="24" height="24" viewBox="0 0 24 24">\n\n <defs> \n <filter id="blur1" x="-100%" y="-100%" width="400%" height="400%"> \n <feGaussianBlur stdDeviation="2"></feGaussianBlur>\n </filter>\n </defs>\n \n <style>\n .selected-bg {\n fill: #808080;\n filter: url(#blur1);\n }\n .selected-fill {\n fill: #ffffff;\n stroke: #ff0000;\n stroke-width: 1.7px;\n }\n </style> \n\n <g>\n <circle class="selected-bg" cx="12" cy="12" r="9"/> \n <circle class="selected-fill" cx="11" cy="11" r="9" />\n <path fill="#ff0000" d="m11 5.7c-2.1285 0-3.85 1.7215-3.85 3.85 0 2.8875 3.85 7.15 3.85 7.15s3.85-4.2625 3.85-7.15c0-2.1285-1.7215-3.85-3.85-3.85zm0 5.225c-0.759 0-1.375-0.616-1.375-1.375s0.616-1.375 1.375-1.375 1.375 0.616 1.375 1.375-0.616 1.375-1.375 1.375z"/>\n </g> \n </svg>';t.marker=L.marker([],{icon:L.divIcon({html:e,iconSize:[24,24]}),draggable:!0})}function d(e){return document.querySelector(e)}function m(e,t,n){e.attachEvent?e.attachEvent("on"+t,n):e.addEventListener(t,n)}function p(){s=[],i=-1,o.classList.remove("visible"),a.classList.remove("open"),r.value="",r.focus(),t.map&&t.marker&&t.map.removeLayer(t.marker)}function f(){s=s.slice(0,t.suggestsLimit),a.innerHTML="";let e="";s.forEach(t=>{e+="<div>",e+=t.html,e+="</div>"}),e&&a.classList.add("open"),a.innerHTML=e}function h(e){var n;r.value=s[e].html.replace("<strong>","").replace("</strong>",""),r.focus(),a.classList.remove("open"),t.onSuggestSelected(s[e]),t.map&&(n=s[e],t.marker&&t.map.removeLayer(t.marker),void 0!==n.feature.coords?(t.map.setView(n.feature.coords,19),t.marker&&(t.marker.setLatLng(n.feature.coords),t.map.addLayer(t.marker))):function(e){let n=t.proxyApiFeatureUrl?`${t.proxyApiFeatureUrl}?feature_id=${e}&lang=${t.lang}&key=${t.apiKey}`:`${t.apiUrl.replace("{lang}",t.lang)}/feature/${e}.json?key=${t.apiKey}`;return fetch(n).then(e=>e.json())}(n.feature.id).then(e=>{"Point"===e.geometry.type?(t.map.setView([e.geometry.coordinates[1],e.geometry.coordinates[0]],19),t.marker&&(t.marker.setLatLng([e.geometry.coordinates[1],e.geometry.coordinates[0]]),t.map.addLayer(t.marker))):e.properties.categories.includes("adr_address")?(t.map.setView([e.geo_centroid.coordinates[1],e.geo_centroid.coordinates[0]],19),t.marker&&(t.marker.setLatLng([e.geo_centroid.coordinates[1],e.geo_centroid.coordinates[0]]),t.map.addLayer(t.marker))):t.map.fitBounds(function(e){let t=e.bbox||(e.geometry||{}).bbox;return t?[[t[1],t[0]],[t[3],t[2]]]:{}}(e),{animate:!0,maxZoom:17})}).catch(e=>{console.log("Error in API request: "+e),p()}))}function g(e,t){return 0===e.indexOf(t)}function y(e,n,l){return l?e.length>=t.maxCharsInSuggest?v(e.substring(0,t.maxCharsInSuggest).concat("..."),n):v(e,n):e}function v(e,t){let n=e.toLowerCase(),l=t.toLowerCase();return n.indexOf(l)<0?e:`${e.substring(0,n.indexOf(l))}<strong>${e.substring(n.indexOf(l),n.indexOf(l)+t.length)}</strong>${e.substring(n.indexOf(l)+t.length)}`}function x(e){return e.filter(e=>e)}m(r,"input",function(){i=-1,clearTimeout(c),c=null,c=setTimeout(function(){if((u=r.value).length>0){if(o.classList.add("visible"),u.length<t.minChars)return;s=[];let e=[];if(a.classList.remove("open"),t.customFeatures.forEach(e=>{e.keywords.toLowerCase().includes(u.toLocaleLowerCase())&&s.push({html:y(e.html,u,!0),feature:{coords:e.coords}})}),(e=k.search(u)).length)return e.forEach(function(e){var t={html:k.format(e),feature:{coords:e}};s.push(t)}),void f();e=[],function(e){let n=t.proxyApiGeocodeUrl?`${t.proxyApiGeocodeUrl}?text=${t.searchTextPrefix} ${e}&lang=${t.lang}&key=${t.apiKey}&limit=${t.suggestsLimit}`:`${t.apiUrl.replace("{lang}",t.lang)}/geocode.json?text=${t.searchTextPrefix} ${e}&key=${t.apiKey}&limit=${t.suggestsLimit}`;return fetch(n).then(e=>e.json())}(u).then(t=>{"FeatureCollection"===t.type?e=t.features:"Feature"===t.type&&e.push(t),e.forEach(e=>{(e.properties.name||e.properties.vitrine)&&s.push({html:function(e,t,n){let l=e.properties,r=l.categories,a=null;return g(r,"adm_country")?a=x([l.name]).join(""):g(r,"adm_district")?a=x([l.name," ",l.type," ",o(l.settlement_type,l.settlement)]).join(""):g(r,"adm_level1")?a=x([l.name,", ",l.country]).join(""):g(r,"adm_level2")?a=x([l.name,", ",l.country,", ",l.level1]).join(""):g(r,"adm_level3")?a=x([l.name,", ",l.level1,", ",l.level2]).join(""):g(r,"adm_settlement")?a=x([o(l.type,l.name)," ",l.level1," ",l.level2," ",l.level3]).join(""):g(r,"adr_street")?a=x([l.type," ",l.name,", ",o(l.settlement_type,l.settlement)," ",l.zone]).join(""):g(r,"adr_address")?a=x([l.settlement,", ",l.street_type," ",l.street,", ",l.name]).join(""):g(r,"poi")&&(a=x([l.vitrine," ",l.address]).join("")),y(a||l.name,t,n);function o(e,t){return e?t+" "+e:t}}(e,u,!0),feature:e})}),f()}).catch(e=>{console.log("Error in API request: "+e),p()})}else p()},t.delay)}),m(document,"keydown",function(e){27===e.keyCode&&p()}),m(a,"click",function(e){let t=Array.prototype.indexOf.call(e.target.parentNode.children,e.target);a.childNodes.forEach(e=>e.classList.remove("selected")),i=t,a.childNodes[i].classList.add("selected"),h(t)}),m(r,"keydown",function(e){if(13===e.keyCode)s.length>0&&h(i>0?i:0);else if(38===e.keyCode||40===e.keyCode){if(e.preventDefault(),0===s.length)return;let t=!1;a.classList.contains("open")||(a.classList.add("open"),t=!0),a.childNodes.forEach(e=>e.classList.remove("selected")),38!==e.keyCode||t?t||(i=i===s.length-1?-1:i+1):i=i<0?s.length-1:i-1,i>=0?(r.value=s[i].html.replace("<strong>","").replace("</strong>",""),a.childNodes[i].classList.add("selected")):(r.value=u,r.setSelectionRange(u.length,u.length))}}),m(r,"focus",function(e){s.length>0&&!a.classList.contains("open")&&a.classList.add("open")}),m(r,"click",function(e){s.length>0&&!a.classList.contains("open")&&a.classList.add("open")}),m(o,"click",function(){p()}),m(d("body"),"click",function(e){e.target==this&&(a.classList.remove("open"),r.blur())}),t.map&&t.map.on("click",function(){a.classList.remove("open"),r.blur()});let k={search:function(e){if(0===e.length||e.trim().length<4)return[];let t=k.parse(e);if(null===t)return[];let n=[[t.lat,t.lng]];return-1!==e.search(/[NSEW]/)?n:(n.push([t.lng,t.lat]),n)},format:function(e){function t(e){let t={};return t.hemisphere=e>=0?1:-1,e=Math.abs(e),t.degrees=Math.floor(e),t.degreesDecimal=Math.min(9999,Math.round(1e4*(e-t.degrees))),e=60*e%60,t.minutes=Math.floor(e),t.minutesDecimal=Math.min(999,Math.round(1e3*(e-t.minutes))),e=60*e%60,t.seconds=Math.floor(e),t.secondsDecimal=Math.min(9,Math.floor(10*(e-t.seconds))),t}let n=t(e[0]),l=t(e[1]);return`${n="DDD°MM′SS″H".replace("H",1===n.hemisphere?"N":"S").replace("DDD",n.degrees).replace("MM",n.minutes).replace("SS",n.seconds)} ${l="DDD°MM′SS″H".replace("H",1===l.hemisphere?"E":"W").replace("DDD",l.degrees).replace("MM",l.minutes).replace("SS",l.seconds)}`},parse:function(e){function t(e,t){let n=(e=e.toUpperCase()).match(/[NEWS]/g);if(1===n.length){if("N"===n[0])return{lat:t[0],lng:t[1]};if("E"===n[0])return{lng:t[0],lat:t[1]};if("S"===n[0])return{lat:-t[0],lng:t[1]};if("W"===n[0])return{lng:-t[0],lat:t[1]}}else if(2===n.length){let e={};return"E"===n[0]?e.lng=t[0]:"W"===n[0]?e.lng=-t[0]:"N"===n[0]?e.lat=t[0]:"S"===n[0]&&(e.lat=-t[0]),"E"===n[1]?e.lng=t[1]:"W"===n[1]?e.lng=-t[1]:"N"===n[1]?e.lat=t[1]:"S"===n[1]&&(e.lat=-t[1]),e}}let n=e.match(/\d/g);if(null==n)return null;if(1.5*(null==n?0:n.length)<=(null==(n=e.match(/\D/g))?0:n.length))return null;if(null===(n=(e=(e=e.replace(/,/gim,".")).replace(/([+-])\s(\d+)/gim,"$1$2")).match(/[+-]?\d+[.,]?(?:\d+)?/gim)))return null;if(6===n.length||4===n.length){let l=function(e,t){let n=/^[+-]/,l="",r="",a=0,o=0;return 6===t.length?(null!==t[0].match(n)?(l=t[0].match(n),t[0]=t[0].replace(n,"")):l="+",null!==t[3].match(n)?(r=t[3].match(n),t[3]=t[3].replace(n,"")):r="+",a=parseFloat(t[0])+1/60*parseFloat(t[1])+1/3600*parseFloat(t[2]),o=parseFloat(t[3])+1/60*parseFloat(t[4])+1/3600*parseFloat(t[5]),[parseFloat(l+a),parseFloat(r+o)]):4===t.length?(null!==t[0].match(n)?(l=t[0].match(n),t[0]=t[0].replace(n,"")):l="+",null!==t[2].match(n)?(r=t[2].match(n),t[2]=t[2].replace(n,"")):r="+",a=parseFloat(t[0])+1/60*parseFloat(t[1]),o=parseFloat(t[2])+1/60*parseFloat(t[3]),[parseFloat(l+a),parseFloat(r+o)]):null}(0,n);return null!==/[news]/gi.exec(e)?t(e,l):{lat:parseFloat(l[0]),lng:parseFloat(l[1])}}return 2===n.length?null!==/[news]/gi.exec(e)?t(e,[parseFloat(n[0]),parseFloat(n[1])]):{lat:parseFloat(n[0]),lng:parseFloat(n[1])}:null}};return{clear:p}}}();"function"==typeof define&&define.amd?define("visicomAutoComplete",function(){return visicomAutoComplete}):"undefined"!=typeof module&&module.exports?module.exports=visicomAutoComplete:window.visicomAutoComplete=visicomAutoComplete;