@progress/kendo-ui
Version:
This package is part of the [Kendo UI for jQuery](http://www.telerik.com/kendo-ui) suite.
1 lines • 12.2 kB
JavaScript
module.exports=function(t){function e(n){if(a[n])return a[n].exports;var o=a[n]={exports:{},id:n,loaded:!1};return t[n].call(o.exports,o,o.exports,e),o.loaded=!0,o.exports}var a={};return e.m=t,e.c=a,e.p="",e(0)}({0:function(t,e,a){a(24),t.exports=a(24)},3:function(t,e){t.exports=function(){throw Error("define cannot be used indirect")}},20:function(t,e){t.exports=require("../kendo.core")},24:function(t,e,a){var n,o,s;!function(i,define){o=[a(20),a(25)],n=i,s="function"==typeof n?n.apply(e,o):n,!(void 0!==s&&(t.exports=s))}(function(){return function(t,e){function a(t){t.preventDefault()}function n(t,e){return function(){return t.apply(e,arguments)}}var o=window.kendo,s=o.ui,i=o.Observable,r=o.parseColor,l=t.extend,d=o.Color,c=o.keys,u="background-color",p="#ffffff",h="#000000",v=".kendoColorTools",g="keydown"+v,f=s.colorpicker.ColorSelector,_=s.colorpicker.contrastToolUtils,b=i.extend({init:function(t,e){var a=this;a.element=t,a.options=e,a._viewModel=o.observable({switchMode:a.switchMode.bind(a),keydown:a.keydown.bind(a),mode:function(t){return t===this.get("format")},format:e.format,formats:e.formats,rgb:null,hex:function(){return null!==this.get("rgb")&&this.get("rgb").toCss({alpha:e.opacity})}}),a._changeHandler=a.change.bind(a),a._viewModel.bind("change",a._changeHandler),a._render(),a.element.on(g,a.keydown.bind(a)),i.fn.init.call(a)},_template:o.template('# if (options.formats && options.formats.length > 1) { #<div class="k-vstack"><button class="k-colorgradient-toggle-mode k-button k-icon-button k-flat" data-#:ns#bind="click: switchMode" title="#: options.messages.toggleFormat #"><span class="k-button-icon k-icon k-i-arrows-kpi"></span></button></div># } ## if (options.formats && options.formats.indexOf("hex") >= 0) { #<div class="k-vstack k-flex-1" data-#:ns#bind="visible: mode(\'hex\')"><input type="text" data-#:ns#bind="value: hex" data-#:ns#role="textbox" tabindex="#:options.tabindex#" aria-label="#: options.messages.hex #"/><label class="k-colorgradient-input-label">HEX</label></div># } ## if (options.formats && options.formats.indexOf("rgb") >= 0) { #<div class="k-vstack" data-#:ns#bind="visible: mode(\'rgb\')"><input tabindex="#:options.tabindex#" data-#:ns#bind="value: rgb.r" data-#:ns#role="numerictextbox" data-#:ns#max="255" data-#:ns#min="0" data-#:ns#decimals="0" data-#:ns#spinners="false" data-#:ns#format="n0" aria-label="#: options.messages.red #" /><label class="k-colorgradient-input-label">R</label></div><div class="k-vstack" data-#:ns#bind="visible: mode(\'rgb\')"><input tabindex="#:options.tabindex#" data-#:ns#bind="value: rgb.g" data-#:ns#role="numerictextbox" data-#:ns#max="255" data-#:ns#min="0" data-#:ns#decimals="0" data-#:ns#spinners="false" data-#:ns#format="n0" aria-label="#: options.messages.green #" /><label class="k-colorgradient-input-label">G</label></div><div class="k-vstack" data-#:ns#bind="visible: mode(\'rgb\')"><input tabindex="#:options.tabindex#" data-#:ns#bind="value: rgb.b" data-#:ns#role="numerictextbox" data-#:ns#max="255" data-#:ns#min="0" data-#:ns#decimals="0" data-#:ns#spinners="false" data-#:ns#format="n0" aria-label="#: options.messages.blue #"/><label class="k-colorgradient-input-label">B</label></div>#if(options.opacity){#<div class="k-vstack" data-#:ns#bind="visible: mode(\'rgb\')"><input tabindex="#:options.tabindex#" data-#:ns#bind="value: rgb.a" data-#:ns#role="numerictextbox" data-#:ns#step="0.1" data-#:ns#max="1" data-#:ns#min="0" data-#:ns#decimals="1" data-#:ns#spinners="false" data-#:ns#format="n1" aria-label="#: options.messages.alpha #" /><label class="k-colorgradient-input-label">A</label></div># } ## } #'),destroy:function(){var t=this;t._viewModel.unbind("change",t._changeHandler),o.unbind(t.element),o.destroy(t.element),t.element.off(g),delete t._viewModel,delete t._changeHandler},_render:function(){var t=this;t.element.append(t._template({ns:o.ns,guid:o.guid(),options:t.options})).parent(),o.bind(t.element,t._viewModel),t.element.attr("data-"+o.ns+"stop","stop")},value:function(t){var e=this;e._color=t&&t.toBytes()||r(h),e._preventChangeEvent=!0,e._viewModel.set("rgb",e._color),delete e._preventChangeEvent},reset:function(){var t=this;t._preventChangeEvent=!0,t._viewModel.set("rgb",r(h)),delete t._preventChangeEvent},switchMode:function(){var t=this,e=t._viewModel,a=e.format,n=e.formats.indexOf(a)+1;n=n>=e.formats.length?0:n,t._preventChangeEvent=!0,t._viewModel.set("format",e.formats[n]),delete t._preventChangeEvent},change:function(t){var e=this;t.field.indexOf("rgb")>=0?(e._color=e._tryParseColor(e._viewModel.rgb.toCssRgba()),e._viewModel.set("hex",e._color.toCss({alpha:e.options.opacity}))):"hex"===t.field&&(e._color=e._tryParseColor(t.sender[t.field]),e._viewModel.set("rgb",e._color)),e._preventChangeEvent||e.trigger("change",{value:e._color})},_tryParseColor:function(t){var e=this;try{t=r(t)||e._color}catch(a){t=e._color}return t},keydown:function(e){var a=this,n=t(e.target).data("kendoTextBox");e.keyCode===c.ENTER&&(n&&n._focusout&&n._focusout(),a.trigger("change",{value:a._color}),a.trigger("select",{value:a._color}))}}),k=f.extend({init:function(e,a){var n,s=this;f.fn.init.call(s,e,a),a=s.options=o.deepExtend({},s.options,a),a.messages.previewInput&&(a.messages.hex=a.messages.previewInput),a.messages=a.messages?t.extend(s.options.messages,a.messages):s.options.messages,e=s.element,s.wrapper=e.addClass("k-colorgradient").append(s._template(a)),s._hueElements=t(".k-hsv-rectangle, .k-alpha-slider .k-slider-track",e),s._colorgradientInputs=t(".k-colorgradient-inputs",e),s._contrastTool=t(".k-colorgradient-color-contrast",e),s._sliders(),s._hsvArea(),n=s._value,s._colorgradientInputs.length&&(s._colorInput=new b(s._colorgradientInputs,l({},a,{tabindex:this._tabIndex})),s._colorInput.bind("change",function(t){s._updateUI(t.value,!0)}),s._colorInput.bind("select",function(t){var e=r(t.value);s._select(e),s.trigger("forceSelect",{value:s.value()})})),s._updateUI(n)},options:{name:"ColorGradient",opacity:!1,input:!0,format:"hex",formats:["rgb","hex"],contrastTool:!1,messages:{contrastRatio:"Contrast ratio:",fail:"Fail",pass:"Pass",hex:"HEX",toggleFormat:"Toggle format",red:"Red",green:"Green",blue:"Blue",alpha:"Alpha"}},_template:o.template('<div class="k-colorgradient-canvas k-hstack"><div class="k-hsv-rectangle"><div class="k-hsv-gradient"></div><div class="k-hsv-draghandle k-draghandle"></div></div><div class="k-hsv-controls k-hstack"><input class="k-hue-slider k-colorgradient-slider" /># if (opacity) { #<input class="k-alpha-slider k-colorgradient-slider" /># } #</div></div># if (input) { #<div class="k-colorgradient-inputs k-hstack"></div># } ## if (contrastTool) { #<div class="k-colorgradient-color-contrast k-vbox"></div># } #'),_onEnable:function(t){this._hueSlider.enable(t),this._opacitySlider&&this._opacitySlider.enable(t),this.wrapper.find("input").attr("disabled",!t);var e=this._hsvRect.find(".k-draghandle");t?e.attr("tabIndex",this._tabIndex):e.removeAttr("tabIndex")},_sliders:function(){function t(t){a._updateUI(a._getHSV(t.value,null,null,null))}function e(t){a._updateUI(a._getHSV(null,null,null,t.value/100))}var a=this,n=a.element,o=n.find(".k-hue-slider"),s=n.find(".k-alpha-slider");o.attr("aria-label","hue saturation"),a._hueSlider=o.kendoSlider({min:0,max:360,tickPlacement:"none",showButtons:!1,orientation:"vertical",slide:t,change:t}).data("kendoSlider"),s.attr("aria-label","opacity"),a._opacitySlider=s.kendoSlider({min:0,max:100,tickPlacement:"none",showButtons:!1,orientation:"vertical",slide:e,change:e}).data("kendoSlider")},_hsvArea:function(){function t(t,a){var n=this.offset,o=t-n.left,s=a-n.top,i=this.width,r=this.height;o=o<0?0:o>i?i:o,s=s<0?0:s>r?r:s,e._svChange(o/i,1-s/r)}var e=this,a=e.element,s=a.find(".k-hsv-rectangle"),i=s.find(".k-draghandle").attr("tabIndex",0).on(g,n(e._keydown,e));e._hsvEvents=new o.UserEvents(s,{global:!0,press:function(e){this.offset=o.getOffset(s),this.width=s.width(),this.height=s.height(),i.focus(),t.call(this,e.x.location,e.y.location)},start:function(){s.addClass("k-dragging"),i.focus()},move:function(e){e.preventDefault(),t.call(this,e.x.location,e.y.location)},end:function(){s.removeClass("k-dragging")}}),e._hsvRect=s,e._hsvHandle=i},setBackgroundColor:function(e){var a=this;a.options.contrastTool&&(a.options.contrastTool=t.isPlainObject(a.options.contrastTool)?l({},a.options.contrastTool,{backgroundColor:e}):{backgroundColor:e},a._updateColorContrast(a.color()||r(p)))},_updateUI:function(t,a){var n=this;return t?(!a&&n._colorInput&&n._colorInput.value(t),n._triggerSelect(t),n._updateHsv(t),n._contrastTool.length&&n._updateColorContrast(t),e):(n._reset(),e)},_reset:function(){var t=this;t._colorInput&&t._colorInput.reset(),t._resetHsv(),t._resetColorContrast()},_resetHsv:function(){var t=this,e=r(h);t._updateHsv(e)},_updateHsv:function(t){var e=this,a=e._hsvRect;t=t.toHSV(),e._hsvHandle.css({left:t.s*a.width()+"px",top:(1-t.v)*a.height()+"px"}),e._hueElements.css(u,d.fromHSV(t.h,1,1,1).toCss()),e._hueSlider.value(t.h),e._opacitySlider&&(e._opacitySlider.wrapper.find(".k-slider-track").css("background","linear-gradient(to top, transparent, "+d.fromHSV(t.h,1,1,1).toCss()),e._opacitySlider.value(100*t.a))},_resetColorContrast:function(){var t=this,e=t.options.contrastTool;t._contrastTool.length&&t._updateColorContrast(r(e.backgroundColor?e.backgroundColor:p))},_updateColorContrast:function(t){var e=this,a=e.options.contrastTool,n=r(a.backgroundColor?a.backgroundColor:p),s=_.getContrastFromTwoRGBAs(r(t.toCssRgba()),n),i=o.template('<div class="k-contrast-ratio"><span class="k-contrast-ratio-text">#:messages.contrastRatio# #:kendo.toString(ratio, "n2")#</span><span class="k-contrast-validation k-text-success">#if (ratio > 4.5) {#<span class="k-icon k-i-check"></span>#}##if (ratio > 7) {#<span class="k-icon k-i-check"></span>#}#</span></div>'),l=o.template('<div><span>#:level#: #:limit# </span>#if (ratio > limit) {#<span class="k-contrast-validation k-text-success">#:messages.pass# <span class="k-icon k-i-check"></span></span>#} else {#<span class="k-contrast-validation k-text-error">#:messages.fail# <span class="k-icon k-i-close"></span></span>#}#</div>'),d="";d+=i({messages:e.options.messages,ratio:s}),d+=l({messages:e.options.messages,ratio:s,limit:4.5,level:"AA"}),d+=l({messages:e.options.messages,ratio:s,limit:7,level:"AAA"}),e._contrastTool.find(".k-contrast-ratio, div").remove(),e._contrastTool.append(d),e._updateContrastSvg(n)},_updateContrastSvg:function(e){var a,n=this,o=n._hsvRect,s="k-color-contrast-svg",i={width:o.width(),height:o.height()};i.width&&i.height&&(a=t(_.renderSvgCurveLine(i,n._getHSV(),e)).addClass(s),o.find("."+s).remove(),o.append(a))},_keydown:function(t){function e(e,n){var s=o._getHSV();s[e]+=n*(t.shiftKey?.01:.05),s[e]<0&&(s[e]=0),s[e]>1&&(s[e]=1),o._updateUI(s),a(t)}function n(e){var n=o._getHSV();n.h+=e*(t.shiftKey?1:5),n.h<0&&(n.h=0),n.h>359&&(n.h=359),o._updateUI(n),a(t)}var o=this;switch(t.keyCode){case c.LEFT:t.ctrlKey?n(-1):e("s",-1);break;case c.RIGHT:t.ctrlKey?n(1):e("s",1);break;case c.UP:e(t.ctrlKey&&o._opacitySlider?"a":"v",1);break;case c.DOWN:e(t.ctrlKey&&o._opacitySlider?"a":"v",-1);break;case c.ENTER:o._select(o._getHSV());break;case c.F2:o._colorInput.element.find("input").trigger("focus").select();break;case c.ESC:o._cancel()}},focus:function(){this._hsvHandle.focus()},_getHSV:function(t,e,a,n){var o=this,s=o._hsvRect,i=s.width(),l=s.height(),c=this._hsvHandle.position();return i&&l?(null==t&&(t=o._hueSlider.value()),null==e&&(e=c.left/i),null==a&&(a=1-c.top/l),null==n&&(n=o._opacitySlider?o._opacitySlider.value()/100:1),d.fromHSV(t,e,a,n)):o.color()?o.color().toHSV():r(h)},_svChange:function(t,e){var a=this._getHSV(null,t,e,null);this._updateUI(a)},destroy:function(){this._hsvEvents.destroy(),this._hueSlider.destroy(),this._opacitySlider&&this._opacitySlider.destroy(),this._colorInput&&this._colorInput.destroy(),this._hueSlider=this._opacitySlider=this._hsvRect=this._hsvHandle=this._hueElements=this._selectedColor=this._colorAsText=this._contrastTool=null,f.fn.destroy.call(this)}});s.plugin(k)}(window.kendo.jQuery),window.kendo},a(3))},25:function(t,e){t.exports=require("./contrastToolUtils")}});