/*js //==>>>==>>>==>>>==>>>==>>>==>>>==>>>==>>>==>>>==>>>==>>>==>>>==>>> // // CssHidex v1.16 [ Commercial Version ] // Copyright (c) phpkobo.com ( http://www.phpkobo.com/ ) // Email : admin@phpkobo.com // ID : HDXCS-116 // URL : http://www.phpkobo.com/csshidex // //==<<<==<<<==<<<==<<<==<<<==<<<==<<<==<<<==<<<==<<<==<<<==<<<==<<< */ //////////////////////////////////////////////////////////////////// // $shorthands function $(selector,el_ref){ return (el_ref?el_ref:document).querySelector(selector); }; function $$(selector,el_ref){ return (el_ref?el_ref:document).querySelectorAll(selector); }; function $id(id){ return document.getElementById(id); }; function $ce(tagName){ return document.createElement(tagName); }; //////////////////////////////////////////////////////////////////// // jQuery.offset function jqOffset(el){ var rect=el.getBoundingClientRect(); var el_body=document.documentElement; return { x:rect.left+el_body.scrollLeft, y:rect.top+el_body.scrollTop }; }; //////////////////////////////////////////////////////////////////// // ajaxCall function ajaxCall(url_server,requ,callback,auxproc,errproc){ const xhr=new XMLHttpRequest(); xhr.open("POST",url_server,true); xhr.setRequestHeader("Content-Type", "application/x-www-form-urlencoded; charset=UTF-8"); xhr.addEventListener("load",function(){ if (xhr.status==200){ let str=xhr.responseText; const sig="[!json!]"; const pos=str.indexOf(sig); if(pos!=-1){ if(pos>0){ const pretext=str.substr(0,pos); if(errproc){errproc("SBL",pretext);} } str=str.substr(pos+sig.length); const resp=JSON.parse(str); if (resp.result=="OK"){ if(callback){callback(resp);} }else{ if(errproc){errproc("NOR",resp.result);} } }else{ if(errproc){errproc("SMS",str);} } }else{ let s=""; s+="status:"+xhr.status+"\n"; s+="statusText:"+xhr.statusText; if(errproc){errproc("N2H",s);} } }); if(auxproc){auxproc(xhr);} xhr.send("requ="+encodeURIComponent(JSON.stringify(requ))); return xhr; }; //////////////////////////////////////////////////////////////////// // protect a webpage form drag-and-drop function preventFileDrop(){ document.addEventListener("dragover",function(e){ e.preventDefault(); }); document.addEventListener("drop",function(e){ e.preventDefault(); }); }; preventFileDrop(); //////////////////////////////////////////////////////////////////// // end events function onEnd(el,callback,ename){ const func=function(e){ if(el==e.srcElement){ el.removeEventListener(ename,func); if(callback){callback(e);} } }; el.addEventListener(ename,func); }; function onTransitionEnd(el,callback){ onEnd(el,callback,"transitionend"); }; function onAnimationEnd(el,callback){ onEnd(el,callback,"animationend"); }; //////////////////////////////////////////////////////////////////// // createElementFromHTML function createElementFromHTML(html){ const el=document.createElement("div"); el.innerHTML=html; return el.firstElementChild; } //////////////////////////////////////////////////////////////////// // browser detection function isSafari(){ return (window.safari!==undefined); }; function isFireFox(){ return (navigator.userAgent.toLowerCase().indexOf('firefox')>-1); }; function isIE(){ var ua=window.navigator.userAgent; var msie=ua.indexOf("MSIE "); // Trident/7.0; rv:11.0 return ((msie>0)||!!ua.match(/Trident.*rv\:11\./)); }; //////////////////////////////////////////////////////////////////// // send enter & space to click function esToClick(el){ el.addEventListener("keydown",function(e){ if((e.key=="Enter")||(e.key==" ")){ e.preventDefault(); this.click(); } }); return el; }; "use strict"; function CUiControl(px){ var el_control=px.el_control; function enable(){ el_control.classList.remove("uic-disable"); }; function disable(){ el_control.classList.add("uic-disable"); }; function init(){ enable(); }; init(); return { enable:enable, disable:disable }; }; "use strict"; function CSBarControl(px){ // elements var el_control=px.el_control; var el_cursor=el_control.querySelector(".sbar-cursor"); // parameters var minval=(px.minval!==undefined)?px.minval:0; var maxval=(px.minval!==undefined)?px.maxval:0; var inival=(px.inival!==undefined)?px.inival:minval; // value var value=null; // variables var pos_curr=null; var bar_width=0; var b_moving=false; // debounce function to reduce # of the "pointermove" event function debounce(fn,time){ var timer=null; return function(e){ clearTimeout(timer); timer=setTimeout(function(){fn(e);},time); }; }; function calcBarWidth(){ bar_width=el_control.clientWidth; }; function normalizeVal(val){ return Math.min(maxval,Math.max(val,minval)); }; function normalizePos(pos){ return Math.min(bar_width,Math.max(pos,0)); }; function valToPos(val){ var val0=normalizeVal(val); return ((val0-minval)/(maxval-minval))*bar_width; }; function posToVal(pos){ return (pos/bar_width)*(maxval-minval)+minval; }; function posCursor(pos){ var pos_curr0=normalizePos(pos); if(pos_curr!==pos_curr0){ pos_curr=pos_curr0; el_cursor.style.left=pos_curr+"px"; return true; }else{ return false; } }; function setValCore(val){ var value0=normalizeVal(val); if(value!==value0){ value=value0; return true; }else{ return false; } }; function posCursorAndEvent(pos){ posCursor(pos); if(setValCore(posToVal(pos_curr))){ el_control.dispatchEvent(new CustomEvent( "change",{detail:value})); } }; function getValue(){ return value; }; function setValue(val){ setValCore(val); posCursor(valToPos(value)); }; function beginMove(e){ // calc bar width calcBarWidth(); // position cursor posCursorAndEvent(e.offsetX); // capture pointer el_control.setPointerCapture(e.pointerId); // set moving flag b_moving=true; }; function dragMove(e){ // position cursor posCursorAndEvent(e.offsetX); }; function endMove(e){ // release pointer capture el_control.releasePointerCapture(e.pointerId); // reset moving flag b_moving=false; }; function init(){ // calc bar width calcBarWidth(); // set inival setValue(inival); // pointerdown event (should be with "touch-action:none;") el_control.addEventListener("pointerdown",function(e){ e.preventDefault(); // [pointer capture] // style "touch-action:none;" is necessary for touch device // proceed only when e.which==1 (left button) if(e.which==1){ beginMove(e); } }); // pintermove event el_control.addEventListener("pointermove",debounce(function(e){ e.preventDefault(); if(b_moving){ dragMove(e); } },1)); // pointerup event el_control.addEventListener("pointerup",function(e){ e.preventDefault(); if(b_moving){ endMove(e); } }); // disable the context menu // to prevent the context menu from interfering // pointer capture & release el_control.addEventListener("contextmenu",function(e){ e.preventDefault(); }); // call base class CUiControl({ el_control:el_control }); }; init(); return { getValue:getValue, setValue:setValue }; }; "use strict"; function CHueBarControl(px){ // elements var el_control=px.el_control; // function closures var fcl_sbar; // parameteres px.minval=0; px.maxval=360; function setupBackground(){ var cx=[]; for(var i=0;i<=360;i++){ cx.push("hsl("+i+",100%,50%) "+(i*100/360).toFixed(2)+"%"); } var bg="linear-gradient(to right,"+cx.join(",")+")"; el_control.style.background=bg; }; function init(){ setupBackground(); fcl_sbar=CSBarControl(px); }; init(); return fcl_sbar; };