mirror of https://github.com/go-sonic/sonic.git
You cannot select more than 25 topics
Topics must start with a letter or number, can include dashes ('-') and can be up to 35 characters long.
12 lines
33 KiB
JavaScript
12 lines
33 KiB
JavaScript
"use strict";(self["webpackChunkhalo_admin"]=self["webpackChunkhalo_admin"]||[]).push([[154],{43154:function(e,t){
|
|
/**
|
|
* Verte v0.0.12
|
|
* (c) 2019 Baianat
|
|
* @license MIT
|
|
*/
|
|
/**
|
|
* color-fns v0.0.10
|
|
* (c) 2019 Baianat
|
|
* @license MIT
|
|
*/
|
|
function n(e){return n="function"===typeof Symbol&&"symbol"===typeof Symbol.iterator?function(e){return typeof e}:function(e){return e&&"function"===typeof Symbol&&e.constructor===Symbol&&e!==Symbol.prototype?"symbol":typeof e},n(e)}function r(e,t){if(!(e instanceof t))throw new TypeError("Cannot call a class as a function")}function i(e,t){for(var n=0;n<t.length;n++){var r=t[n];r.enumerable=r.enumerable||!1,r.configurable=!0,"value"in r&&(r.writable=!0),Object.defineProperty(e,r.key,r)}}function a(e,t,n){return t&&i(e.prototype,t),n&&i(e,n),e}function s(e,t){if("function"!==typeof t&&null!==t)throw new TypeError("Super expression must either be null or a function");e.prototype=Object.create(t&&t.prototype,{constructor:{value:e,writable:!0,configurable:!0}}),t&&l(e,t)}function o(e){return o=Object.setPrototypeOf?Object.getPrototypeOf:function(e){return e.__proto__||Object.getPrototypeOf(e)},o(e)}function l(e,t){return l=Object.setPrototypeOf||function(e,t){return e.__proto__=t,e},l(e,t)}function u(e){if(void 0===e)throw new ReferenceError("this hasn't been initialised - super() hasn't been called");return e}function c(e,t){return!t||"object"!==typeof t&&"function"!==typeof t?u(e):t}function h(e,t){while(!Object.prototype.hasOwnProperty.call(e,t))if(e=o(e),null===e)break;return e}function d(e,t,n){return d="undefined"!==typeof Reflect&&Reflect.get?Reflect.get:function(e,t,n){var r=h(e,t);if(r){var i=Object.getOwnPropertyDescriptor(r,t);return i.get?i.get.call(n):i.value}},d(e,t,n||e)}function f(e){return"object"===n(e)&&e.model?e.model:("#"!==e.slice(0,1)||4!==e.length&&7!==e.length)&&("#"!==e.slice(0,1)||6!==e.length&&9!==e.length)?"RGBA"===e.slice(0,4).toUpperCase()||"RGB"===e.slice(0,3).toUpperCase()?"rgb":("HSLA"===e.slice(0,4).toUpperCase()||"HSL"===e.slice(0,3).toUpperCase())&&"hsl":"hex"}function p(e){return isNaN(parseInt(e,16))?0:parseInt(e,16)}function m(e,t){return function(n){return n>=e&&n<=t}}function v(e,t){return Math.floor(Math.random()*(t-e+1)+e)}function g(e,t){var n=arguments.length>2&&void 0!==arguments[2]?arguments[2]:.5;return Number((e*(1-n)+t*n).toFixed(2))}function b(e){return!(void 0===e||isNaN(e)||e<0||e>1)}var y=function(){function e(t){var n=this;r(this,e),this.invalid=!this.validate(t),this.invalid||Object.keys(t).forEach((function(e){n[e]=t[e]})),this.init()}return a(e,[{key:"init",value:function(){}},{key:"validate",value:function(e){return!!e&&"object"===n(e)}}]),e}(),C=function(e){function t(){return r(this,t),c(this,o(t).apply(this,arguments))}return s(t,e),a(t,[{key:"validate",value:function(e){if(!d(o(t.prototype),"validate",this).call(this,e))return!1;var n=m(0,255);return n(e.red)&&n(e.green)&&n(e.blue)}},{key:"init",value:function(){this.model="rgb",this.alpha=b(this.alpha)?this.alpha:1}},{key:"toString",value:function(){return this.invalid?"Invalid Color":m(0,.999)(this.alpha)?"rgba(".concat(this.red,",").concat(this.green,",").concat(this.blue,",").concat(this.alpha,")"):"rgb(".concat(this.red,",").concat(this.green,",").concat(this.blue,")")}}]),t}(y),x=function(e){function t(){return r(this,t),c(this,o(t).apply(this,arguments))}return s(t,e),a(t,[{key:"validate",value:function(e){if(!d(o(t.prototype),"validate",this).call(this,e))return!1;var n=m(0,100);return m(0,360)(e.hue)&&n(e.lum)&&n(e.sat)}},{key:"init",value:function(){this.model="hsl",this.alpha=b(this.alpha)?this.alpha:1}},{key:"toString",value:function(){return this.invalid?"Invalid Color":m(0,.999)(this.alpha)?"hsla(".concat(this.hue,",").concat(this.sat,"%,").concat(this.lum,"%,").concat(this.alpha,")"):"hsl(".concat(this.hue,",").concat(this.sat,"%,").concat(this.lum,"%)")}}]),t}(y),_=function(e){function t(){return r(this,t),c(this,o(t).apply(this,arguments))}return s(t,e),a(t,[{key:"validate",value:function(e){return!!d(o(t.prototype),"validate",this).call(this,e)&&/(^#[0-9A-F]{6}$)|(^#[0-9A-F]{3}$)/i.test("#".concat(e.red).concat(e.green).concat(e.blue))}},{key:"init",value:function(){this.model="hex",this.alpha=void 0!==this.alpha?this.alpha:"ff"}},{key:"toString",value:function(){return this.invalid?"Invalid Color":m(0,.999)(p(this.alpha)/255)?"#".concat(this.red).concat(this.green).concat(this.blue).concat(this.alpha):"#".concat(this.red).concat(this.green).concat(this.blue)}}]),t}(y),w=Object.freeze({Color:y,RgbColor:C,HslColor:x,HexColor:_});function S(e){if("object"===n(e))return e;var t=e.match(/^rgba?\(\s*(\d+)\s*,\s*(\d+)\s*,\s*(\d+)\s*,*\s*(\d*(?:\.\d+)*)*\)/i);return!t||t.length<4?new C:new C({red:Number(t[1]),green:Number(t[2]),blue:Number(t[3]),alpha:Number(t[4])})}function k(e){var t=/^#([a-f\d])([a-f\d])([a-f\d])([a-f\d])*$/i;return 5!==e.length&&4!==e.length||!t.test(e)||(e=e.replace(t,(function(e,t,n,r,i){return"#".concat(t).concat(t).concat(n).concat(n).concat(r).concat(r).concat(i?"".concat(i).concat(i):"")}))),e}function M(e){if("object"===n(e))return e;var t=k(e),r=t.match(/^#?([a-f\d]{2})([a-f\d]{2})([a-f\d]{2})([a-f\d]{2})*/i);return!r||r.length<4?new _:new _({hex:t,red:r[1],green:r[2],blue:r[3],alpha:r[4]})}function L(e){if("object"===n(e))return e;var t=e.match(/^hsla?\(\s*(\d+)\s*,\s*(\d+)%\s*,\s*(\d+)%\s*,*\s*(\d*(?:\.\d+)*)*\)/i);return!t||t.length<4?new x:new x({hue:Number(t[1]),sat:Number(t[2]),lum:Number(t[3]),alpha:Number(t[4])})}function E(e){var t=f(e);return"rgb"===t?!S(e).invalid:"hex"===t?!M(e).invalid:"hsl"===t&&!L(e).invalid}function H(e){return e=Math.floor(e),isNaN(e)?"00":("0"+e.toString(16)).slice(-2)}function P(e){if(!e)return new _;e=S(e);var t=[H(e.red),H(e.green),H(e.blue),e.alpha?H(255*e.alpha):null],n=t[0],r=t[1],i=t[2],a=t[3];return new _({red:n,green:r,blue:i,alpha:a||"ff"})}function A(e){if(!e)return new x;e=S(e);var t=[e.red/255,e.green/255,e.blue/255,e.alpha],n=t[0],r=t[1],i=t[2],a=t[3],s=0,o=0,l=0,u=Math.min(n,r,i),c=Math.max(n,r,i);return l=(u+c)/2,u!==c&&(o=l>.5?(c-u)/(2-c-u):(c-u)/(c+u)),n>=c&&u!==c&&(s=(r-i)/(c-u)*60),r>=c&&u!==c&&(s=60*(2+(i-n)/(c-u))),i>=c&&u!==c&&(s=60*(4+(n-r)/(c-u))),s=s<0?Math.floor(s+360):Math.floor(s),o=Math.floor(100*o),l=Math.floor(100*l),new x({hue:s,sat:o,lum:l,alpha:a})}function N(e){if(!e)return new C;var t=M(e),n=t.red,r=t.green,i=t.blue,a=t.alpha;return new C({red:p(n),green:p(r),blue:p(i),alpha:void 0===a?1:Number((p(a)/255).toFixed(2))})}function R(e){return Math.min(Math.max(parseInt(e),0),255)}function $(e){if(!e)return new C;e=L(e);var t=[e.hue/360,e.sat/100,e.lum/100,e.alpha],n=t[0],r=t[1],i=t[2],a=t[3],s=0,o=0,l=0;if(0===r&&(s=o=l=R(255*i)),0!==r){var u=i>=50?i+r-i*r:i*(1+r),c=2*i-u,h=function(e){return e<0&&(e+=1),e>1&&(e-=1),e<1/6?c+6*(u-c)*e:e<.5?u:e<2/3?c+(u-c)*(2/3-e)*6:c};s=R(255*h(n+1/3)),o=R(255*h(n)),l=R(255*h(n-1/3))}return new C({red:s,green:o,blue:l,alpha:a})}function V(e){return e?A(N(e)):new x}function O(e){return e?P($(e)):new _}function B(e){var t=f(e);return"hex"===t?N(e):"hsl"===t?$(e):"rgb"===t&&"string"===typeof e?S(e):"rgb"===t&&"object"===n(e)?e:new C}function j(e){var t=f(e);return"hex"===t?V(e):"rgb"===t?A(e):"hsl"===t&&"string"===typeof e?L(e):"hsl"===t&&"object"===n(e)?e:new x}function I(e){var t=f(e);return"rgb"===t?P(e):"hsl"===t?O(e):"hex"===t&&"string"===typeof e?M(e):"hex"===t&&"object"===n(e)?e:new _}function q(){return"rgb(".concat(v(0,255),", ").concat(v(0,255),", ").concat(v(0,255),")")}function F(e,t,n){e=B(e),t=B(t);var r=Math.floor(g(e.red,t.red,n)),i=Math.floor(g(e.green,t.green,n)),a=Math.floor(g(e.blue,t.blue,n)),s=g(e.alpha,t.alpha,n);return new C({red:r,green:i,blue:a,alpha:s})}function T(e,t){for(var n=[],r=0;r<e;r++){var i="function"===typeof t?t():t;n.push(i)}return n}function D(e,t){var n;return void 0===t&&(t=!1),function(){var r=arguments,i=function(){n=null,t||e.apply(void 0,r)},a=t&&!n;window.cancelAnimationFrame(n),n=window.requestAnimationFrame(i),a&&e.apply(void 0,arguments)}}function U(e,t){while(e!==document&&null!==e){if(e===t)return!0;e=e.parentNode}return!1}function W(e,t){return e.reduce((function(e,n){return Math.abs(n-t)<Math.abs(e-t)?n:e}))}function z(e,t){return{r:Math.sqrt(e*e+t*t),theta:180*Math.atan2(t,e)/Math.PI}}function G(e,t){return{x:e*Math.cos(t*Math.PI*2),y:e*Math.sin(t*Math.PI*2)}}function X(e,t){return function(e){var n=-1!==t.indexOf(e);return n}}function Z(e){if(e.type.match(/^touch/i)){var t=e.touches[0];return{x:t.clientX,y:t.clientY}}return e.type.match(/^mouse/i)?{x:e.clientX,y:e.clientY}:{x:0,y:0}}var Y={name:"VerteSlider",props:{gradient:Array,classes:Array,colorCode:{type:Boolean,default:!1},editable:{type:Boolean,default:!0},reverse:{type:Boolean,default:!1},label:{type:Boolean,default:!1},trackSlide:{type:Boolean,default:!0},min:{type:Number,default:0},max:{type:Number,default:255},step:{type:Number,default:1},value:{type:Number,default:0},handlesValue:{type:Array,default:function(){return[0]}}},data:function(){return{fill:{translate:0,scale:0},multiple:!1,currentValue:0,handles:[],values:[]}},watch:{gradient:function(e){this.initGradient(e),this.reloadHandlesColor()},values:function(){this.multiple=this.values.length>1,this.fill=!this.multiple&&(this.fill||{})},value:function(e,t){e!==t&&e!==this.currentValue&&this.updateValue(this.value,!0)}},methods:{init:function(){var e=this;this.$emitInputEvent=D((function(){e.$emit("input",e.currentValue)})),this.multiple=this.values.length>1,this.values=this.handlesValue,this.handles=this.handlesValue.map((function(e,t){return{value:e,position:0,color:"#fff"}})),1===this.values.length&&(this.values[0]=Number(this.value)),this.values.sort(),this.initElements(),this.gradient&&this.initGradient(this.gradient),this.initEvents(),this.values.forEach((function(t,n){e.activeHandle=n,e.updateValue(t,!0)}))},initElements:function(){var e;this.wrapper=this.$refs.wrapper,this.track=this.$refs.track,this.fill=this.$refs.fill,this.wrapper.classList.toggle("slider--editable",this.editable),this.wrapper.classList.toggle("slider--reverse",this.reverse),this.classes&&(e=this.wrapper.classList).add.apply(e,this.classes)},initGradient:function(e){e.length>1?this.fill.style.backgroundImage="linear-gradient(90deg, "+e+")":(this.fill.style.backgroundImage="",this.fill.style.backgroundColor=e[0],this.handles.forEach((function(t){t.style.color=e[0]})))},handleResize:function(){this.updateWidth(),this.updateValue(this.currentValue,!0)},initEvents:function(){window.addEventListener("resize",this.handleResize)},select:function(e){if(e.preventDefault(),e.stopPropagation(),2!==e.buttons){this.updateWidth(),this.track.classList.add("slider--dragging"),this.ticking=!1;var t=this.getStepValue(e);if(this.multiple){var n=W(this.values,t);this.activeHandle=this.values.indexOf(n)}this.updateValue(t),this.tempDrag=this.dragging.bind(this),this.tempRelease=this.release.bind(this),document.addEventListener("mousemove",this.tempDrag),document.addEventListener("touchmove",this.tempDrag),document.addEventListener("touchend",this.tempRelease),document.addEventListener("mouseup",this.tempRelease)}},dragging:function(e){var t=this,n=this.getStepValue(e);this.ticking||(window.requestAnimationFrame((function(){t.updateValue(n),t.ticking=!1})),this.ticking=!0)},release:function(){this.track.classList.remove("slider--dragging"),document.removeEventListener("mousemove",this.tempDrag),document.removeEventListener("touchmove",this.tempDrag),document.removeEventListener("mouseup",this.tempRelease),document.removeEventListener("touchend",this.tempRelease)},getStepValue:function(e){var t=Z(e),n=t.x,r=n-this.currentX,i=parseInt(r/this.stepWidth+.5,10),a=i*this.step+this.min;return this.decimalsCount?Number(a.toFixed(this.decimalsCount)):a},updateWidth:function(){var e=this.track.getBoundingClientRect();this.currentX=e.left,this.width=e.width,this.stepWidth=this.width/(this.max-this.min)*this.step},getPositionPercentage:function(e){return((e-this.min)/(this.max-this.min)).toFixed(2)},normalizeValue:function(e){if(isNaN(Number(e)))return this.value;if(this.multiple){var t=this.values[this.activeHandle-1]||this.min,n=this.values[this.activeHandle+1]||this.max;e=Math.min(Math.max(Number(e),t),n)}return Math.min(Math.max(Number(e),this.min),this.max)},addHandle:function(e){var t=W(this.values,e),n=this.values.indexOf(t),r=this.values[n],i=r<=e?n+1:n;this.handles.splice(i,0,{value:e,position:0,color:"#fff"}),this.values.splice(i,0,e),this.activeHandle=i,this.currentValue=null,this.updateValue(e)},removeHandle:function(e){this.handles.splice(e,1),this.values.splice(e,1),this.activeHandle=0===e?e+1:e-1},getHandleColor:function(e){for(var t=this,n=this.gradient.length-1,r=e,i=1;i<=n;i++)if(r>=(i-1)/n&&r<=i/n){var a=(r-(i-1)/n)/(1/n);return F(t.gradient[i-1],t.gradient[i],a)}return"rgb(0, 0, 0)"},reloadHandlesColor:function(){var e=this;this.handles.forEach((function(t,n){var r=e.getPositionPercentage(t.value),i=e.getHandleColor(r);e.handles[n].color=i.toString()}))},updateValue:function(e,t){var n=this;void 0===t&&(t=!1),window.requestAnimationFrame((function(){var r=n.normalizeValue(e),i=n.getPositionPercentage(r);if(n.fill&&(n.fill.translate=i*n.width,n.fill.scale=1-i),n.values[n.activeHandle]=r,n.handles[n.activeHandle].value=r,n.handles[n.activeHandle].position=i*n.width,n.currentValue=r,n.$refs.input.value=n.currentValue,n.gradient){var a=n.getHandleColor(i);n.handles[n.activeHandle].color=a.toString(),n.colorCode&&(n.currentValue=a)}t||n.$emitInputEvent()}))}},created:function(){var e=this.step.toString().split(".")[1];this.currentValue=this.value,this.decimalsCount=e?e.length:0},mounted:function(){var e=this;this.init(),this.$nextTick((function(){e.updateWidth(),e.updateValue(void 0,!0)}))},destroyed:function(){window.removeEventListener("resize",this.handleResize)}},J=Y,K=function(){var e=this,t=e.$createElement,n=e._self._c||t;return n("div",{ref:"wrapper",staticClass:"slider"},[n("div",e._g({ref:"track",staticClass:"slider__track"},e.trackSlide?{mousedown:e.select,touchstart:e.select}:{}),[n("div",{ref:"fill",staticClass:"slider__fill"}),e._l(e.handles,(function(t){return n("div",{staticClass:"slider__handle",style:"transform: translate("+t.position+"px, 0); background-color: "+t.color+";",on:{mousedown:e.select,touchstart:e.select}},[e.label?n("div",{staticClass:"slider__label"},[e._v(e._s(t.value))]):e._e()])}))],2),n("input",{directives:[{name:"show",rawName:"v-show",value:e.editable,expression:"editable"}],ref:"input",staticClass:"slider__input",attrs:{type:e.colorCode?"text":"number"},on:{change:function(t){e.updateValue(t.target.value)}}})])},Q=[];K._withStripped=!0;var ee=void 0,te=void 0,ne=void 0,re=!1;function ie(e,t,n,r,i,a,s,o){var l=("function"===typeof n?n.options:n)||{};return l.__file="/mnt/c/Users/Abdelrahman/Projects/verte/src/components/Slider.vue",l.render||(l.render=e.render,l.staticRenderFns=e.staticRenderFns,l._compiled=!0,i&&(l.functional=!0)),l._scopeId=r,l}function ae(){var e=document.head||document.getElementsByTagName("head")[0],t=ae.styles||(ae.styles={}),n="undefined"!==typeof navigator&&/msie [6-9]\\b/.test(navigator.userAgent.toLowerCase());return function(r,i){if(!document.querySelector('style[data-vue-ssr-id~="'+r+'"]')){var a=n?i.media||"default":r,s=t[a]||(t[a]={ids:[],parts:[],element:void 0});if(!s.ids.includes(r)){var o=i.source,l=s.ids.length;if(s.ids.push(r),n&&(s.element=s.element||document.querySelector("style[data-group="+a+"]")),!s.element){var u=s.element=document.createElement("style");u.type="text/css",i.media&&u.setAttribute("media",i.media),n&&(u.setAttribute("data-group",a),u.setAttribute("data-next-index","0")),e.appendChild(u)}if(n&&(l=parseInt(s.element.getAttribute("data-next-index")),s.element.setAttribute("data-next-index",l+1)),s.element.styleSheet)s.parts.push(o),s.element.styleSheet.cssText=s.parts.filter(Boolean).join("\n");else{var c=document.createTextNode(o),h=s.element.childNodes;h[l]&&s.element.removeChild(h[l]),h.length?s.element.insertBefore(c,h[l]):s.element.appendChild(c)}}}}}var se=ie({render:K,staticRenderFns:Q},ee,J,te,re,ne,ae,void 0),oe={name:"VertePicker",components:{Slider:se},props:{mode:{type:String,default:"square"},edge:{type:Number,default:250},diameter:{type:Number,default:180},satSlider:{type:Boolean,default:!0},alpha:{type:Number,default:1},value:{type:String,default:"#fff"}},data:function(){return{currentHue:0,currentSat:0,currentColor:"",cursor:{},preventUpdating:!1,preventEcho:!1}},watch:{value:function(e){this.preventUpdating?this.preventUpdating=!1:this.handleValue(e,!0)},currentSat:function(){this.updateWheelColors(),this.updateColor()},currentHue:function(){this.updateSquareColors(),this.updateColor()}},methods:{initSquare:function(){var e=this.edge;this.$refs.canvas.width=e,this.$refs.canvas.height=e-100,this.ctx=this.$refs.canvas.getContext("2d"),this.updateSquareColors()},initWheel:function(){this.$refs.canvas.width=this.diameter,this.$refs.canvas.height=this.diameter,this.ctx=this.$refs.canvas.getContext("2d"),this.circle={path:new Path2D,xCords:this.diameter/2,yCords:this.diameter/2,radius:this.diameter/2},this.circle.path.moveTo(this.circle.xCords,this.circle.yCords),this.circle.path.arc(this.circle.xCords,this.circle.yCords,this.circle.radius,0,360),this.circle.path.closePath(),this.updateWheelColors()},handleValue:function(e,t){void 0===t&&(t=!1);var n=this.pickerRect,r=n.width,i=n.height;if(this.currentColor=j(e),this.preventEcho=!0,"wheel"===this.mode){var a=(100-this.currentColor.lum)*(this.diameter/200),s=this.diameter/2,o=G(a,this.currentColor.hue/360);this.cursor={x:o.x+s,y:o.y+s},this.currentSat=this.currentColor.sat}if("square"===this.mode){var l=this.currentColor.sat/100*r,u=(100-this.currentColor.lum)/100*i;this.cursor={x:l,y:u},this.currentHue=this.currentColor.hue}},updateCursorPosition:function(e){var t=e.x,n=e.y,r=this.pickerRect,i=r.left,a=r.top,s=r.width,o=r.height,l={x:Math.min(Math.max(t-i,0),s),y:Math.min(Math.max(n-a,0),o)};("wheel"!==this.mode||this.ctx.isPointInPath(this.circle.path,l.x,l.y))&&(this.cursor=l,this.updateColor())},updateColor:function(e){void 0===e&&(e=!1),this.preventEcho?this.preventEcho=!1:(this.currentColor=this.getCanvasColor(),this.preventUpdating=!0,this.$emit("change",this.currentColor),this.$emit("input",this.currentColor))},updateWheelColors:function(){var e=this;if(this.circle){var t=this.pickerRect,n=t.width,r=t.height,i=this.circle.xCords,a=this.circle.yCords,s=this.circle.radius,o=this.satSlider?this.currentSat:100;this.ctx.clearRect(0,0,n,r);for(var l=0;l<360;l+=1){var u=e.ctx.createRadialGradient(i,a,0,i,a,s),c=(l-2)*Math.PI/180,h=(l+2)*Math.PI/180;e.ctx.beginPath(),e.ctx.moveTo(i,a),e.ctx.arc(i,a,s,c,h),e.ctx.closePath(),u.addColorStop(0,"hsl("+l+", "+o+"%, 100%)"),u.addColorStop(.5,"hsl("+l+", "+o+"%, 50%)"),u.addColorStop(1,"hsl("+l+", "+o+"%, 0%)"),e.ctx.fillStyle=u,e.ctx.fill()}}},updateSquareColors:function(){var e=this.pickerRect,t=e.width,n=e.height;this.ctx.clearRect(0,0,t,n),this.ctx.fillStyle="hsl("+this.currentHue+", 100%, 50%)",this.ctx.fillRect(0,0,t,n);var r=this.ctx.createLinearGradient(0,0,t,0);r.addColorStop(0,"hsl(0, 0%, 50%)"),r.addColorStop(1,"hsla(0, 0%, 50%, 0)"),this.ctx.fillStyle=r,this.ctx.fillRect(0,0,t,n);var i=this.ctx.createLinearGradient(0,0,0,n);i.addColorStop(0,"hsl(0, 0%, 100%)"),i.addColorStop(.5,"hsla(0, 0%, 100%, 0)"),i.addColorStop(.5,"hsla(0, 0%, 0%, 0)"),i.addColorStop(1,"hsl(0, 0%, 0%) "),this.ctx.fillStyle=i,this.ctx.fillRect(0,0,t,n)},getCanvasColor:function(){var e=this.cursor,t=e.x,n=e.y,r=0,i=0,a=0;if("wheel"===this.mode){var s=this.diameter/2,o=t-s,l=-1*(n-s),u=z(o,l),c=u.r,h=u.theta;i=100*(s-c)/s,a=~Math.sign(h)?360-h:-h,r=this.currentSat}if("square"===this.mode){var d=this.pickerRect,f=d.width,p=d.height;r=100*t/f,i=100-100*n/p,a=this.currentHue}return new w.HslColor({alpha:this.alpha,hue:Math.round(a),sat:Math.round(r),lum:Math.round(i)})},handleSelect:function(e){var t=this;e.preventDefault(),this.pickerRect=this.$refs.canvas.getBoundingClientRect(),this.updateCursorPosition(Z(e));var n=function(e){window.requestAnimationFrame((function(){t.updateCursorPosition(Z(e))}))},r=function(){document.removeEventListener("mousemove",n),document.removeEventListener("touchmove",n),document.removeEventListener("mouseup",r),document.removeEventListener("touchend",r)};document.addEventListener("mousemove",n),document.addEventListener("touchmove",n),document.addEventListener("mouseup",r),document.addEventListener("touchend",r)}},mounted:function(){var e=this;this.pickerRect=this.$refs.canvas.getBoundingClientRect(),"wheel"===this.mode&&this.initWheel(),"square"===this.mode&&this.initSquare(),this.$nextTick((function(){e.handleValue(e.value)}))}},le=oe,ue=function(){var e=this,t=e.$createElement,n=e._self._c||t;return n("div",{ref:"picker",staticClass:"verte-picker",class:"verte-picker--"+e.mode},[n("div",{ref:"origin",staticClass:"verte-picker__origin"},[n("canvas",{ref:"canvas",staticClass:"verte-picker__canvas",on:{mousedown:e.handleSelect,touchstart:e.handleSelect}}),n("div",{ref:"cursor",staticClass:"verte-picker__cursor",style:"transform: translate3d("+e.cursor.x+"px, "+e.cursor.y+"px, 0)"})]),"square"===e.mode?n("slider",{staticClass:"verte-picker__slider",attrs:{gradient:["#f00","#ff0","#0f0","#0ff","#00f","#f0f","#f00"],editable:!1,max:360},model:{value:e.currentHue,callback:function(t){e.currentHue=t},expression:"currentHue"}}):e._e(),"wheel"===e.mode?n("slider",{staticClass:"verte-picker__slider",attrs:{gradient:["hsl("+e.currentColor.hue+",0%,"+e.currentColor.lum+"%)","hsl("+e.currentColor.hue+",100%,"+e.currentColor.lum+"%)"],editable:!1,max:100},model:{value:e.currentSat,callback:function(t){e.currentSat=t},expression:"currentSat"}}):e._e()],1)},ce=[];ue._withStripped=!0;var he=void 0,de=void 0,fe=void 0,pe=!1;function me(e,t,n,r,i,a,s,o){var l=("function"===typeof n?n.options:n)||{};return l.__file="/mnt/c/Users/Abdelrahman/Projects/verte/src/components/Picker.vue",l.render||(l.render=e.render,l.staticRenderFns=e.staticRenderFns,l._compiled=!0,i&&(l.functional=!0)),l._scopeId=r,l}function ve(){var e=document.head||document.getElementsByTagName("head")[0],t=ve.styles||(ve.styles={}),n="undefined"!==typeof navigator&&/msie [6-9]\\b/.test(navigator.userAgent.toLowerCase());return function(r,i){if(!document.querySelector('style[data-vue-ssr-id~="'+r+'"]')){var a=n?i.media||"default":r,s=t[a]||(t[a]={ids:[],parts:[],element:void 0});if(!s.ids.includes(r)){var o=i.source,l=s.ids.length;if(s.ids.push(r),n&&(s.element=s.element||document.querySelector("style[data-group="+a+"]")),!s.element){var u=s.element=document.createElement("style");u.type="text/css",i.media&&u.setAttribute("media",i.media),n&&(u.setAttribute("data-group",a),u.setAttribute("data-next-index","0")),e.appendChild(u)}if(n&&(l=parseInt(s.element.getAttribute("data-next-index")),s.element.setAttribute("data-next-index",l+1)),s.element.styleSheet)s.parts.push(o),s.element.styleSheet.cssText=s.parts.filter(Boolean).join("\n");else{var c=document.createTextNode(o),h=s.element.childNodes;h[l]&&s.element.removeChild(h[l]),h.length?s.element.insertBefore(c,h[l]):s.element.appendChild(c)}}}}}var ge,be,ye=me({render:ue,staticRenderFns:ce},he,le,de,pe,fe,ve,void 0),Ce=6;function xe(e,t){if(be)return be;t=t||{};var n=t.recentColors,r=t.onRecentColorsChange;return ge=e,be=new ge({data:function(){return{recentColors:n||T(6,q)}},methods:{addRecentColor:function(e){this.recentColors.includes(e)||(this.recentColors.length>=Ce&&this.recentColors.pop(),this.recentColors.unshift(e),r&&r(this.recentColors))}}}),be}var _e={name:"Verte",components:{Picker:ye,Slider:se},props:{picker:{type:String,default:"square",validator:X("picker",["wheel","square"])},value:{type:String,default:"#000"},model:{type:String,default:"hsl",validator:X("model",["rgb","hex","hsl"])},display:{type:String,default:"picker",validator:X("display",["picker","widget"])},menuPosition:{type:String,default:"bottom",validator:X("menuPosition",["top","bottom","left","right","center"])},showHistory:{type:Boolean,default:!0},colorHistory:{type:Array,default:null},enableAlpha:{type:Boolean,default:!0},rgbSliders:{type:Boolean,default:!1},draggable:{type:Boolean,default:!0}},data:function(){return{isMenuActive:!0,isLoading:!0,rgb:B("#000"),hex:I("#000"),hsl:j("#000"),delta:{x:0,y:0},currentModel:"",internalColorHistory:[]}},computed:{$_verteStore:function(){return xe()},historySource:function(){return this.colorHistory?this.internalColorHistory:this.$_verteStore.recentColors},currentColor:{get:function(){return this[this.model],this[this.model].toString()},set:function(e){this.selectColor(e)}},alpha:{get:function(){return this[this.model]?isNaN(this[this.model].alpha)?1:this[this.model].alpha:1},set:function(e){this[this.model].alpha=e,this.selectColor(this[this.model])}},menuOnly:function(){return"widget"===this.display}},watch:{value:function(e,t){e!==t&&e!==this.currentColor&&this.selectColor(e)},rgb:{handler:function(e){this.hex=I(e.toString()),this.$emit("input",this.currentColor)},deep:!0},colorHistory:function(e){this.internalColorHistory!==e&&(this.internalColorHistory=[].concat(e))}},beforeCreate:function(){xe(this.$options._base)},install:function(e,t){xe(e,t),e.component("Verte",this)},created:function(){this.colorHistory&&(this.internalColorHistory=[].concat(this.colorHistory)),this.selectColor(this.value||"#000",!0),this.currentModel=this.model},mounted:function(){var e=this;this.$nextTick((function(){e.isLoading=!1,e.menuOnly||(e.isMenuActive=!1)}))},methods:{selectColor:function(e,t){void 0===t&&(t=!1),E(e)&&(this.rgb=B(e),this.hex=I(e),this.hsl=j(e),t||this.$emit("input",this.currentColor))},switchModel:function(){var e=["hex","rgb","hsl"],t=e.indexOf(this.currentModel);this.currentModel=e[t+1]||e[0]},handleMenuDrag:function(e){var t=this;if(2!==e.button){e.preventDefault();var n=Object.assign({},this.delta),r=Z(e),i=function(e){window.requestAnimationFrame((function(){var i=Z(e);t.delta.x=n.x+i.x-r.x,t.delta.y=n.y+i.y-r.y}))},a=function(){document.removeEventListener("mousemove",i),document.removeEventListener("mouseup",a),document.removeEventListener("touchmove",i),document.removeEventListener("touchup",a)};document.addEventListener("mousemove",i),document.addEventListener("mouseup",a),document.addEventListener("touchmove",i),document.addEventListener("touchup",a)}},submit:function(){this.$emit("beforeSubmit",this.currentColor),this.addColorToHistory(this.currentColor),this.$emit("input",this.currentColor),this.$emit("submit",this.currentColor)},addColorToHistory:function(e){if(this.colorHistory)return this.internalColorHistory.length>=Ce&&this.internalColorHistory.pop(),this.internalColorHistory.unshift(e),void this.$emit("update:colorHistory",this.internalColorHistory);this.$_verteStore.addRecentColor(this.currentColor)},inputChanged:function(e,t){var n=e.target;if("hex"!==this.currentModel){var r=Math.min(Math.max(n.value,n.min),n.max);this[this.currentModel][t]=r,this.selectColor(this[this.currentModel])}else this.selectColor(n.value)},toggleMenu:function(){this.isMenuActive?this.closeMenu():this.openMenu()},closeMenu:function(){this.isMenuActive=!1,document.removeEventListener("mousedown",this.closeCallback),this.$emit("close",this.currentColor)},openMenu:function(){var e=this;this.isMenuActive=!0,this.closeCallback=function(t){U(t.target,e.$refs.menu)||U(t.target,e.$refs.guide)||e.closeMenu()},document.addEventListener("mousedown",this.closeCallback)}}},we=_e,Se=function(){var e=this,t=e.$createElement,n=e._self._c||t;return n("div",{staticClass:"verte",class:{"verte--loading":e.isLoading}},[e.menuOnly?e._e():n("button",{ref:"guide",staticClass:"verte__guide",style:"color: "+e.currentColor+"; fill: "+e.currentColor+";",attrs:{type:"button"},on:{click:e.toggleMenu}},[e._t("default",[n("svg",{staticClass:"verte__icon",attrs:{viewBox:"0 0 24 24"}},[n("pattern",{attrs:{id:"checkerboard",width:"6",height:"6",patternUnits:"userSpaceOnUse",fill:"FFF"}},[n("rect",{attrs:{fill:"#7080707f",x:"0",width:"3",height:"3",y:"0"}}),n("rect",{attrs:{fill:"#7080707f",x:"3",width:"3",height:"3",y:"3"}})]),n("circle",{attrs:{cx:"12",cy:"12",r:"12",fill:"url(#checkerboard)"}}),n("circle",{attrs:{cx:"12",cy:"12",r:"12"}})])])],2),n("div",{staticClass:"verte__menu-origin",class:["verte__menu-origin--"+e.menuPosition,{"verte__menu-origin--static":e.menuOnly,"verte__menu-origin--active":e.isMenuActive}]},[n("div",{ref:"menu",staticClass:"verte__menu",style:"transform: translate("+e.delta.x+"px, "+e.delta.y+"px)",attrs:{tabindex:"-1"}},[e.menuOnly?e._e():n("button",{staticClass:"verte__close",attrs:{type:"button"},on:{click:e.closeMenu}},[n("svg",{staticClass:"verte__icon verte__icon--small",attrs:{viewBox:"0 0 24 24"}},[n("title",[e._v("Close Icon")]),n("path",{attrs:{d:"M19,6.41L17.59,5L12,10.59L6.41,5L5,6.41L10.59,12L5,17.59L6.41,19L12,13.41L17.59,19L19,17.59L13.41,12L19,6.41Z"}})])]),e.draggable&&!e.menuOnly?n("div",{staticClass:"verte__draggable",on:{mousedown:e.handleMenuDrag,touchstart:e.handleMenuDrag}}):e._e(),n("Picker",{attrs:{mode:e.picker,alpha:e.alpha},model:{value:e.currentColor,callback:function(t){e.currentColor=t},expression:"currentColor"}}),n("div",{staticClass:"verte__controller"},[e.enableAlpha?n("Slider",{attrs:{gradient:["rgba("+e.rgb.red+", "+e.rgb.green+", "+e.rgb.blue+", 0)","rgba("+e.rgb.red+", "+e.rgb.green+", "+e.rgb.blue+", 1)"],min:0,max:1,step:.01,editable:!1},model:{value:e.alpha,callback:function(t){e.alpha=t},expression:"alpha"}}):e._e(),e.rgbSliders?[n("Slider",{attrs:{gradient:["rgb(0,"+e.rgb.green+","+e.rgb.blue+")","rgb(255,"+e.rgb.green+","+e.rgb.blue+")"]},model:{value:e.rgb.red,callback:function(t){e.$set(e.rgb,"red",t)},expression:"rgb.red"}}),n("Slider",{attrs:{gradient:["rgb("+e.rgb.red+",0,"+e.rgb.blue+")","rgb("+e.rgb.red+",255,"+e.rgb.blue+")"]},model:{value:e.rgb.green,callback:function(t){e.$set(e.rgb,"green",t)},expression:"rgb.green"}}),n("Slider",{attrs:{gradient:["rgb("+e.rgb.red+","+e.rgb.green+",0)","rgb("+e.rgb.red+","+e.rgb.green+",255)"]},model:{value:e.rgb.blue,callback:function(t){e.$set(e.rgb,"blue",t)},expression:"rgb.blue"}})]:e._e(),n("div",{staticClass:"verte__inputs"},[n("button",{staticClass:"verte__model",attrs:{type:"button"},on:{click:e.switchModel}},[e._v(e._s(e.currentModel))]),"hsl"===e.currentModel?[n("input",{staticClass:"verte__input",attrs:{type:"number",max:"360",min:"0"},domProps:{value:e.hsl.hue},on:{change:function(t){e.inputChanged(t,"hue")}}}),n("input",{staticClass:"verte__input",attrs:{type:"number",min:"0",max:"100"},domProps:{value:e.hsl.sat},on:{change:function(t){e.inputChanged(t,"sat")}}}),n("input",{staticClass:"verte__input",attrs:{type:"number",min:"0",max:"100"},domProps:{value:e.hsl.lum},on:{change:function(t){e.inputChanged(t,"lum")}}})]:e._e(),"rgb"===e.currentModel?[n("input",{staticClass:"verte__input",attrs:{type:"number",min:"0",max:"255"},domProps:{value:e.rgb.red},on:{change:function(t){e.inputChanged(t,"red")}}}),n("input",{staticClass:"verte__input",attrs:{type:"number",min:"0",max:"255"},domProps:{value:e.rgb.green},on:{change:function(t){e.inputChanged(t,"green")}}}),n("input",{staticClass:"verte__input",attrs:{type:"number",min:"0",max:"255"},domProps:{value:e.rgb.blue},on:{change:function(t){e.inputChanged(t,"blue")}}})]:e._e(),"hex"===e.currentModel?[n("input",{staticClass:"verte__input",attrs:{type:"text"},domProps:{value:e.hex},on:{change:function(t){e.inputChanged(t,"hex")}}})]:e._e(),n("button",{staticClass:"verte__submit",attrs:{type:"button"},on:{click:e.submit}},[n("title",[e._v("Submit Icon")]),n("svg",{staticClass:"verte__icon",attrs:{viewBox:"0 0 24 24"}},[n("path",{attrs:{d:"M21,7L9,19L3.5,13.5L4.91,12.09L9,16.17L19.59,5.59L21,7Z"}})])])],2),e.showHistory?n("div",{ref:"recent",staticClass:"verte__recent"},e._l(e.historySource,(function(t){return n("a",{staticClass:"verte__recent-color",style:"color: "+t,attrs:{role:"button",href:"#"},on:{click:function(n){n.preventDefault(),e.selectColor(t)}}})}))):e._e()],2)],1)])])},ke=[];Se._withStripped=!0;var Me=void 0,Le=void 0,Ee=void 0,He=!1;function Pe(e,t,n,r,i,a,s,o){var l=("function"===typeof n?n.options:n)||{};return l.__file="/mnt/c/Users/Abdelrahman/Projects/verte/src/components/Verte.vue",l.render||(l.render=e.render,l.staticRenderFns=e.staticRenderFns,l._compiled=!0,i&&(l.functional=!0)),l._scopeId=r,l}function Ae(){var e=document.head||document.getElementsByTagName("head")[0],t=Ae.styles||(Ae.styles={}),n="undefined"!==typeof navigator&&/msie [6-9]\\b/.test(navigator.userAgent.toLowerCase());return function(r,i){if(!document.querySelector('style[data-vue-ssr-id~="'+r+'"]')){var a=n?i.media||"default":r,s=t[a]||(t[a]={ids:[],parts:[],element:void 0});if(!s.ids.includes(r)){var o=i.source,l=s.ids.length;if(s.ids.push(r),n&&(s.element=s.element||document.querySelector("style[data-group="+a+"]")),!s.element){var u=s.element=document.createElement("style");u.type="text/css",i.media&&u.setAttribute("media",i.media),n&&(u.setAttribute("data-group",a),u.setAttribute("data-next-index","0")),e.appendChild(u)}if(n&&(l=parseInt(s.element.getAttribute("data-next-index")),s.element.setAttribute("data-next-index",l+1)),s.element.styleSheet)s.parts.push(o),s.element.styleSheet.cssText=s.parts.filter(Boolean).join("\n");else{var c=document.createTextNode(o),h=s.element.childNodes;h[l]&&s.element.removeChild(h[l]),h.length?s.element.insertBefore(c,h[l]):s.element.appendChild(c)}}}}}var Ne=Pe({render:Se,staticRenderFns:ke},Me,we,Le,He,Ee,Ae,void 0);t["Z"]=Ne}}]); |