/** * @copyright (C) 2019 Open Source Matters, Inc. <https://www.joomla.org> * @license GNU General Public License version 2 or later; see LICENSE.txt */(R=>{const d=/^#([a-z0-9]{1,2})([a-z0-9]{1,2})([a-z0-9]{1,2})$/i,p=/^rgba?\(([0-9]+)[\D]+([0-9]+)[\D]+([0-9]+)(?:[\D]+([0-9](?:.\d+)?))?\)$/i,f=/^hsla?\(([0-9]+)[\D]+([0-9]+)[\D]+([0-9]+)[\D]+([0-9](?:.\d+)?)?\)$/i,S=/^(([0-1])|(0\\.[0-9]+)|([0-9]{1,2})|(100))$/,y=/^[0-9]{1,3}$/;class ${constructor(t){this.messageSpan=t.querySelector(".form-control-feedback"),this.mainInput=t.querySelector(".color-input"),this.input=t.querySelector("#slider-input"),this.sliders=t.querySelectorAll(".color-slider"),this.hueSlider=t.querySelector("#hue-slider"),this.saturationSlider=t.querySelector("#saturation-slider"),this.lightSlider=t.querySelector("#light-slider"),this.alphaSlider=t.querySelector("#alpha-slider"),this.color=t.dataset.color||"",this.default=t.dataset.default||"",this.format=this.input.dataset.format||"hex",this.saveFormat=this.mainInput.dataset.format||"hex",this.preview=t.dataset.preview==="true",this.setAlpha=this.format==="hsla"||this.format==="rgba",this.hue=360,this.saturation=1,this.light=1,this.alpha=1,this.defaultHsl=[this.hue,this.saturation,this.light,this.alpha],this.setInitValue(),this.setBackground(),this.preview?this.setInputPattern():this.input.classList.add("hidden"),this.mainInput.classList.add("hidden"),Array.prototype.forEach.call(this.sliders,s=>{s.addEventListener("change",()=>this.updateValue(s))}),this.input.addEventListener("change",()=>this.changeInput(this.input))}updateValue(t){this.showError("");const s=this.getSliderValueAsHsl(t.value,t.dataset.type),e=this.hslToRgb(s);[this.hue,this.saturation,this.light,this.alpha]=s,this.input.style.border=`2px solid ${this.getRgbString(e)}`,this.setSliderValues(s,t.dataset.type),this.setInputValue(s),this.setBackground(t)}changeInput(t){let s=[this.hue,this.saturation,this.light,this.alpha];if(!t.value){this.mainInput.value="",this.showError("");return}if(!this.checkValue(t.value))this.showError("JFIELD_COLOR_ERROR_WRONG_FORMAT"),this.setInputValue(this.defaultHsl);else{switch(this.showError(""),this.format){case"hue":s[0]=t.value,this.hue=t.value;break;case"saturation":s[1]=t.value,this.saturation=t.value;break;case"light":s[2]=t.value,this.light=t.value;break;case"alpha":s[3]=t.value,this.alpha=t.value;break;default:s=this.getHsl(t.value)}this.setSliderValues(s),this.setInputValue(s,!0)}}checkValue(t,s){switch(s||this.format){case"hue":return t<=360&&y.test(t);case"saturation":case"light":case"alpha":return S.test(t);case"hsl":case"hsla":return f.test(t);case"hex":return d.test(t);case"rgb":case"rgba":return p.test(t);default:return!1}}setInputPattern(){let t;switch(this.format){case"hue":t=y.source.slice(1,-1);break;case"saturation":case"light":case"alpha":t=S.source.slice(1,-1);break;case"hsl":case"hsla":t=f.source.slice(1,-1);break;case"rgb":t=p.source.slice(1,-1);break;case"hex":default:t=d.source.slice(1,-1)}this.input.setAttribute("pattern",t)}setBackground(t){Array.prototype.forEach.call(this.sliders,s=>{if(t===s)return;let e=[],i=100;if(e.push(this.getSliderValueAsRgb(0,s.dataset.type)),s.dataset.type==="hue"){const a=Math.floor(18);i=360;for(let r=0;r<=360;r+=a)e.push(this.getSliderValueAsRgb(r,s.dataset.type))}else for(let a=0;a<=100;a+=10)e.push(this.getSliderValueAsRgb(a,s.dataset.type));e.push(this.getSliderValueAsRgb(i,s.dataset.type)),e=e.map(a=>this.getRgbString(a)),s.style.background=`linear-gradient(90deg, ${e.join(",")})`,s.style.webkitAppearance="none"})}setInitValue(){const t=window.getComputedStyle(this.input).getPropertyValue(this.default);if(this.default=t||this.default,this.color===""||typeof this.color>"u"){this.input.value="",this.mainInput.value="";return}const s=this.checkValue(this.color,this.saveFormat)?this.color:this.default;if(!s){this.showError("JFIELD_COLOR_ERROR_NO_COLOUR");return}let e=[];/^[0-9]+$/.test(s)?(e=this.default&&this.getHsl(this.default),this.format==="hue"&&(e[0]=s),this.format==="saturation"&&(e[1]=s>1?s/100:s),this.format==="light"&&(e[2]=s>1?s/100:s),this.format==="alpha"&&(e[3]=s>1?s/100:s)):e=this.getHsl(s),[this.hue,this.saturation,this.light]=e,this.alpha=e[4]||this.alpha,this.defaultHsl=this.default?this.getHsl(this.default):e,this.setSliderValues(e),this.setInputValue(e),this.input.style.border=`2px solid ${this.getRgbString(this.hslToRgb(e))}`}showError(t){this.messageSpan.innerText=t?Joomla.Text._(t):""}getHsl(t){let s=[];if(Array.isArray(t))s=t;else if(d.test(t))s=this.hexToHsl(t);else if(p.test(t))s=this.rgbToHsl(t);else if(f.test(t)){const i=t.match(f);s=[i[1],i[2],i[3],i[4]]}else return this.showError("JFIELD_COLOR_ERROR_CONVERT_HSL"),this.defaultHsl;let e;for(e=1;e<s.length;e+=1)s[e]=s[e]>1?s[e]/100:s[e];return s}getSliderValueAsHsl(t,s){let e=this.hue,i=this.saturation,a=this.light,r=this.alpha;switch(s){case"alpha":r=t;break;case"saturation":i=t;break;case"light":a=t;break;case"hue":default:e=t}return a>1&&(a/=100),i>1&&(i/=100),r>1&&(r/=100),[e,i,a,r]}getSliderValueAsRgb(t,s){return this.hslToRgb(this.getSliderValueAsHsl(t,s))}setSliderValues([t,s,e,i],a){this.hueSlider&&a!=="hue"&&(this.hueSlider.value=Math.round(t)),this.saturationSlider&&a!=="saturation"&&(this.saturationSlider.value=Math.round(s*100)),this.lightSlider&&a!=="light"&&(this.lightSlider.value=Math.round(e*100)),i&&this.alphaSlider&&a!=="alpha"&&(this.alphaSlider.value=Math.round(i*100))}setInputValue(t,s){const e=[this.mainInput];s||e.push(this.input),e.forEach(i=>{let a;switch(i.dataset.format){case"hsl":a=this.getHslString(t);break;case"hsla":a=this.getHslString(t,!0);break;case"rgb":a=this.getRgbString(this.hslToRgb(t));break;case"rgba":a=this.getRgbString(this.hslToRgb(t),!0);break;case"hex":a=this.rgbToHex(this.hslToRgb(t));break;case"alpha":a=Math.round(t[3]*100);break;case"saturation":a=Math.round(t[1]*100);break;case"light":a=Math.round(t[2]*100);break;case"hue":default:a=Math.round(t[0]);break}i.value=a})}getRgbString([t,s,e,i],a){if(a||this.setAlpha){const r=typeof i>"u"?this.alpha:i;return`rgba(${t}, ${s}, ${e}, ${r})`}return`rgb(${t}, ${s}, ${e})`}getHslString(t,s){let[e,i,a,r]=t;return i*=100,a*=100,[e,i,a]=[e,i,a].map(h=>Math.round(h)),s||this.setAlpha?(r=r||this.alpha,`hsla(${e}, ${i}%, ${a}%, ${r})`):`hsl(${e}, ${i}%, ${a}%)`}rgbToHex(t){let s=t[0].toString(16).toUpperCase(),e=t[1].toString(16).toUpperCase(),i=t[2].toString(16).toUpperCase();return s=s.length===1?`${s}${s}`:s,e=e.length===1?`${e}${e}`:e,i=i.length===1?`${i}${i}`:i,`#${s}${e}${i}`}rgbToHsl(t){let s=t;if(typeof t=="string"){const l=t.match(p);s=[l[1],l[2],l[3],l[4]]}const[e,i,a]=s.map(l=>l>1?l/255:l),r=Math.max(e,i,a),h=Math.min(e,i,a),n=(r+h)/2,c=r-h;let u=0,o=0,g=s[3]||t[3]||this.alpha;if(r!==h)switch(r===0?o=r:h===1?o=h:o=(r-n)/Math.min(n,1-n),r){case e:u=60*(i-a)/c;break;case i:u=60*(2+(a-e)/c);break;case a:default:u=60*(4+(e-i)/c);break}return u=u<0?u+360:u,g=g>1?g/100:g,[u,o,n,g]}hexToHsl(t){const s=t.match(d),e=s[1],i=s[2],a=s[3],r=[parseInt(e,16),parseInt(i,16),parseInt(a,16)];return this.rgbToHsl(r)}hslToRgb([t,s,e,i]){let a=1,r=1,h=1;const n=s>1?s/100:s,c=e>1?e/100:e,u=i>1?i/100:i;if(t<0||t>360||n<0||n>1||c<0||c>1)return this.showError("JFIELD_COLOR_ERROR_CONVERT_HSL"),this.hslToRgb(this.defaultHsl);const o=(1-Math.abs(2*c-1))*n,g=t/60,l=o*(1-Math.abs(g%2-1)),m=c-o/2;if(t>=0&&t<60)[a,r,h]=[o,l,0];else if(t>=60&&t<120)[a,r,h]=[l,o,0];else if(t>=120&&t<180)[a,r,h]=[0,o,l];else if(t>=180&&t<240)[a,r,h]=[0,l,o];else if(t>=240&&t<300)[a,r,h]=[l,0,o];else if(t>=300&&t<=360)[a,r,h]=[o,0,l];else return this.showError("JFIELD_COLOR_ERROR_CONVERT_HUE"),this.hslToRgb(this.defaultHsl);const k=[a,r,h].map(E=>Math.round((E+m)*255));return k.push(u),k}}R.addEventListener("DOMContentLoaded",()=>{const b=R.querySelectorAll(".color-slider-wrapper");b&&Array.prototype.forEach.call(b,t=>{new $(t)})})})(document);