hex-to-css-filter
Version:
hex-to-css-filter - Easy way to generate colors from HEX to CSS Filters
1 lines • 5.8 kB
JavaScript
((t,e)=>{"object"==typeof exports&&"undefined"!=typeof module?e(exports):"function"==typeof define&&define.amd?define(["exports"],e):e((t="undefined"!=typeof globalThis?globalThis:t||self).HexToCSSFilter={})})(this,function(t){e.prototype.set=function(t,e,s){this.r=this.clamp(t),this.g=this.clamp(e),this.b=this.clamp(s)},e.prototype.hueRotate=function(t){t=(t=void 0===t?0:t)/180*Math.PI;var e=Math.sin(t),t=Math.cos(t);this.multiply([.213+.787*t-.213*e,.715-.715*t-.715*e,.072-.072*t+.928*e,.213-.213*t+.143*e,.715+.285*t+.14*e,.072-.072*t-.283*e,.213-.213*t-.787*e,.715-.715*t+.715*e,.072+.928*t+.072*e])},e.prototype.grayscale=function(t){this.multiply([.2126+.7874*(1-(t=void 0===t?1:t)),.7152-.7152*(1-t),.0722-.0722*(1-t),.2126-.2126*(1-t),.7152+.2848*(1-t),.0722-.0722*(1-t),.2126-.2126*(1-t),.7152-.7152*(1-t),.0722+.9278*(1-t)])},e.prototype.sepia=function(t){this.multiply([.393+.607*(1-(t=void 0===t?1:t)),.769-.769*(1-t),.189-.189*(1-t),.349-.349*(1-t),.686+.314*(1-t),.168-.168*(1-t),.272-.272*(1-t),.534-.534*(1-t),.131+.869*(1-t)])},e.prototype.saturate=function(t){this.multiply([.213+.787*(t=void 0===t?1:t),.715-.715*t,.072-.072*t,.213-.213*t,.715+.285*t,.072-.072*t,.213-.213*t,.715-.715*t,.072+.928*t])},e.prototype.multiply=function(t){var e=this.clamp(this.r*t[0]+this.g*t[1]+this.b*t[2]),s=this.clamp(this.r*t[3]+this.g*t[4]+this.b*t[5]),t=this.clamp(this.r*t[6]+this.g*t[7]+this.b*t[8]);this.r=e,this.g=s,this.b=t},e.prototype.brightness=function(t){this.linear(t=void 0===t?1:t)},e.prototype.contrast=function(t){this.linear(t=void 0===t?1:t,-.5*t+.5)},e.prototype.linear=function(t,e){this.r=this.clamp(this.r*(t=void 0===t?1:t)+255*(e=void 0===e?0:e)),this.g=this.clamp(this.g*t+255*e),this.b=this.clamp(this.b*t+255*e)},e.prototype.invert=function(t){this.r=this.clamp(255*((t=void 0===t?1:t)+this.r/255*(1-2*t))),this.g=this.clamp(255*(t+this.g/255*(1-2*t))),this.b=this.clamp(255*(t+this.b/255*(1-2*t)))},e.prototype.hsl=function(){var t,e=this.r/255,s=this.g/255,o=this.b/255,a=Math.max(e,s,o),r=Math.min(e,s,o),i=0,n=(a+r)/2;return a===r?{h:0,s:0,l:100*n}:(t=a-r,a===e?i=(s-o)/t+(s<o?6:0):a===s?i=(o-e)/t+2:a===o&&(i=(e-s)/t+4),{h:100*(i/=6),s:100*(.5<n?t/(2-a-r):t/(a+r)),l:100*n})},e.prototype.clamp=function(t){return Math.min(Math.max(t,0),255)};var c=e;function e(t,e,s){this.r=0,this.g=0,this.b=0,this.set(t,e,s)}s.prototype.solve=function(){var t=this.solveNarrow(this.solveWide());return{values:t.values,called:t.called,loss:t.loss,filter:this.css(t.values)}},s.prototype.solveWide=function(){for(var t=[60,180,18e3,600,1.2,1.2],e={loss:1/0},s=0;e.loss>this.options.acceptanceLossPercentage;){var o=this.spsa({A:5,a:t,c:15,values:[50,20,3750,50,100,100],maxTriesInLoop:1e3});if(o.loss<e.loss&&(e=o),(s+=1)>=this.options.maxChecks)break}return Object.assign({},e,{called:s})},s.prototype.solveNarrow=function(t){var e=t.loss,s=e+1;return this.spsa({A:e,a:[.25*s,.25*s,s,.25*s,.2*s,.2*s],c:2,values:t.values,maxTriesInLoop:500,called:t.called})},s.prototype.fixValueByFilterIDX=function(t,e){var s=100;return 2===e?s=7500:4!==e&&5!==e||(s=200),3===e?s<t?t%=s:t<0&&(t=s+t%s):t<0?t=0:s<t&&(t=s),t},s.prototype.spsa=function(t){for(var e=t.A,s=t.a,o=t.c,a=t.values,r=t.maxTriesInLoop,i=void 0===r?500:r,r=t.called,t=void 0===r?0:r,n=null,c=1/0,h=new Array(6),l=new Array(6),p=new Array(6),u=0;u<i;u++){for(var f=o/Math.pow(u+1,.16666666666666666),v=0;v<6;v++)h[v]=.5<Math.random()?1:-1,l[v]=a[v]+f*h[v],p[v]=a[v]-f*h[v];for(var d=this.loss(l)-this.loss(p),v=0;v<6;v++){var y=d/(2*f)*h[v],b=s[v]/Math.pow(e+u+1,1);a[v]=this.fixValueByFilterIDX(a[v]-b*y,v)}var g=this.loss(a);g<c&&(n=a.slice(0),c=g)}return{values:n,loss:c,called:t}},s.prototype.loss=function(t){var e=this.reusedColor,t=(e.set(0,0,0),e.invert(t[0]/100),e.sepia(t[1]/100),e.saturate(t[2]/100),e.hueRotate(3.6*t[3]),e.brightness(t[4]/100),e.contrast(t[5]/100),e.hsl());return Math.abs(e.r-this.target.r)+Math.abs(e.g-this.target.g)+Math.abs(e.b-this.target.b)+Math.abs(t.h-this.targetHSL.h)+Math.abs(t.s-this.targetHSL.s)+Math.abs(t.l-this.targetHSL.l)},s.prototype.css=function(s){function t(t,e){return void 0===e&&(e=1),Math.round(s[t]*e)}return["invert(".concat(t(0),"%)"),"sepia(".concat(t(1),"%)"),"saturate(".concat(t(2),"%)"),"hue-rotate(".concat(t(3,3.6),"deg)"),"brightness(".concat(t(4),"%)"),"contrast(".concat(t(5),"%)")].join(" ")};var h=s;function s(t,e){this.target=t,this.targetHSL=t.hsl(),this.options=Object.assign({},{acceptanceLossPercentage:5,maxChecks:15},e),this.reusedColor=new c(0,0,0)}function l(t){return!isNaN(parseFloat(t))&&isFinite(t)}var p={};t.clearCache=function(t){t?p[t]&&delete p[t]:p={}},t.hexToCSSFilter=function(t,e){var s,o,a,r,i;if(void 0===e&&(e={}),p[t]&&!e.forceFilterRecalculation)return Object.assign({},p[t],{cache:!0});try{if(s=(n=((t,e)=>{var s="function"==typeof Symbol&&t[Symbol.iterator];if(!s)return t;var o,a,r=s.call(t),i=[];try{for(;(void 0===e||0<e--)&&!(o=r.next()).done;)i.push(o.value)}catch(t){a={error:t}}finally{try{o&&!o.done&&(s=r.return)&&s.call(r)}finally{if(a)throw a.error}}return i})(4===(i=t).length?[parseInt("0x".concat(i[1]).concat(i[1])),parseInt("0x".concat(i[2]).concat(i[2])),parseInt("0x".concat(i[3]).concat(i[3]))]:7===i.length?[parseInt("0x".concat(i[1]).concat(i[2])),parseInt("0x".concat(i[3]).concat(i[4])),parseInt("0x".concat(i[5]).concat(i[6]))]:[],3))[0],o=n[1],a=n[2],!l(s)||!l(o)||!l(a))throw new Error("hextToRgb returned an invalid value for '".concat(t,"'"));r=new c(Number(s),Number(o),Number(a))}catch(t){throw new Error("Color value should be in HEX format. ".concat(t))}var n=new h(r,Object.assign({},{acceptanceLossPercentage:5,maxChecks:30,forceFilterRecalculation:!1},e));return p[t]=Object.assign({},n.solve(),{hex:t,rgb:[s,o,a],cache:!1})},Object.defineProperty(t,"__esModule",{value:!0})});