diff --git a/addons/web_flectra/static/lib/bootstrap.colorpicker/css/bootstrap-colorpicker.css b/addons/web_flectra/static/lib/bootstrap.colorpicker/css/bootstrap-colorpicker.css deleted file mode 100644 index 4d931affee..0000000000 --- a/addons/web_flectra/static/lib/bootstrap.colorpicker/css/bootstrap-colorpicker.css +++ /dev/null @@ -1,399 +0,0 @@ -/*! - * Bootstrap Colorpicker - Bootstrap Colorpicker is a modular color picker plugin for Bootstrap 4. - * @package bootstrap-colorpicker - * @version v3.2.0 - * @license MIT - * @link https://itsjavi.com/bootstrap-colorpicker/ - * @link https://github.com/itsjavi/bootstrap-colorpicker.git - */ -.colorpicker { - position: relative; - display: none; - font-size: inherit; - color: inherit; - text-align: left; - list-style: none; - background-color: #ffffff; - background-clip: padding-box; - border: 1px solid rgba(0, 0, 0, 0.2); - padding: .75rem .75rem; - width: 148px; - border-radius: 4px; - -webkit-box-sizing: content-box; - box-sizing: content-box; } - -.colorpicker.colorpicker-disabled, -.colorpicker.colorpicker-disabled * { - cursor: default !important; } - -.colorpicker div { - position: relative; } - -.colorpicker-popup { - position: absolute; - top: 100%; - left: 0; - float: left; - margin-top: 1px; - z-index: 1060; } - -.colorpicker-popup.colorpicker-bs-popover-content { - position: relative; - top: auto; - left: auto; - float: none; - margin: 0; - z-index: initial; - border: none; - padding: 0.25rem 0; - border-radius: 0; - background: none; - -webkit-box-shadow: none; - box-shadow: none; } - -.colorpicker:before, -.colorpicker:after { - content: ""; - display: table; - clear: both; - line-height: 0; } - -.colorpicker-clear { - clear: both; - display: block; } - -.colorpicker:before { - content: ''; - display: inline-block; - border-left: 7px solid transparent; - border-right: 7px solid transparent; - border-bottom: 7px solid #ccc; - border-bottom-color: rgba(0, 0, 0, 0.2); - position: absolute; - top: -7px; - left: auto; - right: 6px; } - -.colorpicker:after { - content: ''; - display: inline-block; - border-left: 6px solid transparent; - border-right: 6px solid transparent; - border-bottom: 6px solid #ffffff; - position: absolute; - top: -6px; - left: auto; - right: 7px; } - -.colorpicker.colorpicker-with-alpha { - width: 170px; } - -.colorpicker.colorpicker-with-alpha .colorpicker-alpha { - display: block; } - -.colorpicker-saturation { - position: relative; - width: 126px; - height: 126px; - /* FF3.6+ */ - /* Chrome,Safari4+ */ - /* Chrome10+,Safari5.1+ */ - /* Opera 11.10+ */ - /* IE10+ */ - background: -webkit-gradient(linear, left top, left bottom, from(transparent), to(black)), -webkit-gradient(linear, left top, right top, from(white), to(rgba(255, 255, 255, 0))); - background: linear-gradient(to bottom, transparent 0%, black 100%), linear-gradient(to right, white 0%, rgba(255, 255, 255, 0) 100%); - /* W3C */ - cursor: crosshair; - float: left; - -webkit-box-shadow: 0 0 0 1px rgba(0, 0, 0, 0.2); - box-shadow: 0 0 0 1px rgba(0, 0, 0, 0.2); - margin-bottom: 6px; } - .colorpicker-saturation .colorpicker-guide { - display: block; - height: 6px; - width: 6px; - border-radius: 6px; - border: 1px solid #000; - -webkit-box-shadow: 0 0 0 1px rgba(255, 255, 255, 0.8); - box-shadow: 0 0 0 1px rgba(255, 255, 255, 0.8); - position: absolute; - top: 0; - left: 0; - margin: -3px 0 0 -3px; } - -.colorpicker-hue, -.colorpicker-alpha { - position: relative; - width: 16px; - height: 126px; - float: left; - cursor: row-resize; - margin-left: 6px; - margin-bottom: 6px; } - -.colorpicker-alpha-color { - position: absolute; - top: 0; - left: 0; - width: 100%; - height: 100%; } - -.colorpicker-hue, -.colorpicker-alpha-color { - -webkit-box-shadow: 0 0 0 1px rgba(0, 0, 0, 0.2); - box-shadow: 0 0 0 1px rgba(0, 0, 0, 0.2); } - -.colorpicker-hue .colorpicker-guide, -.colorpicker-alpha .colorpicker-guide { - display: block; - height: 4px; - background: rgba(255, 255, 255, 0.8); - border: 1px solid rgba(0, 0, 0, 0.4); - position: absolute; - top: 0; - left: 0; - margin-left: -2px; - margin-top: -2px; - right: -2px; - z-index: 1; } - -.colorpicker-hue { - /* FF3.6+ */ - /* Chrome,Safari4+ */ - /* Chrome10+,Safari5.1+ */ - /* Opera 11.10+ */ - /* IE10+ */ - background: -webkit-gradient(linear, left bottom, left top, from(red), color-stop(8%, #ff8000), color-stop(17%, yellow), color-stop(25%, #80ff00), color-stop(33%, lime), color-stop(42%, #00ff80), color-stop(50%, cyan), color-stop(58%, #0080ff), color-stop(67%, blue), color-stop(75%, #8000ff), color-stop(83%, magenta), color-stop(92%, #ff0080), to(red)); - background: linear-gradient(to top, red 0%, #ff8000 8%, yellow 17%, #80ff00 25%, lime 33%, #00ff80 42%, cyan 50%, #0080ff 58%, blue 67%, #8000ff 75%, magenta 83%, #ff0080 92%, red 100%); - /* W3C */ } - -.colorpicker-alpha { - background: linear-gradient(45deg, rgba(0, 0, 0, 0.1) 25%, transparent 25%, transparent 75%, rgba(0, 0, 0, 0.1) 75%, rgba(0, 0, 0, 0.1) 0), linear-gradient(45deg, rgba(0, 0, 0, 0.1) 25%, transparent 25%, transparent 75%, rgba(0, 0, 0, 0.1) 75%, rgba(0, 0, 0, 0.1) 0), white; - background-size: 10px 10px; - background-position: 0 0, 5px 5px; - display: none; } - -.colorpicker-bar { - min-height: 16px; - margin: 6px 0 0 0; - clear: both; - text-align: center; - font-size: 10px; - line-height: normal; - max-width: 100%; - -webkit-box-shadow: 0 0 0 1px rgba(0, 0, 0, 0.2); - box-shadow: 0 0 0 1px rgba(0, 0, 0, 0.2); } - .colorpicker-bar:before { - content: ""; - display: table; - clear: both; } - -.colorpicker-bar.colorpicker-bar-horizontal { - height: 126px; - width: 16px; - margin: 0 0 6px 0; - float: left; } - -.colorpicker-input-addon { - position: relative; } - -.colorpicker-input-addon i { - display: inline-block; - cursor: pointer; - vertical-align: text-top; - height: 16px; - width: 16px; - position: relative; } - -.colorpicker-input-addon:before { - content: ""; - position: absolute; - width: 16px; - height: 16px; - display: inline-block; - vertical-align: text-top; - background: linear-gradient(45deg, rgba(0, 0, 0, 0.1) 25%, transparent 25%, transparent 75%, rgba(0, 0, 0, 0.1) 75%, rgba(0, 0, 0, 0.1) 0), linear-gradient(45deg, rgba(0, 0, 0, 0.1) 25%, transparent 25%, transparent 75%, rgba(0, 0, 0, 0.1) 75%, rgba(0, 0, 0, 0.1) 0), white; - background-size: 10px 10px; - background-position: 0 0, 5px 5px; } - -.colorpicker.colorpicker-inline { - position: relative; - display: inline-block; - float: none; - z-index: auto; - vertical-align: text-bottom; } - -.colorpicker.colorpicker-horizontal { - width: 126px; - height: auto; } - -.colorpicker.colorpicker-horizontal .colorpicker-bar { - width: 126px; } - -.colorpicker.colorpicker-horizontal .colorpicker-saturation { - float: none; - margin-bottom: 0; } - -.colorpicker.colorpicker-horizontal .colorpicker-hue, -.colorpicker.colorpicker-horizontal .colorpicker-alpha { - float: none; - width: 126px; - height: 16px; - cursor: col-resize; - margin-left: 0; - margin-top: 6px; - margin-bottom: 0; } - -.colorpicker.colorpicker-horizontal .colorpicker-hue .colorpicker-guide, -.colorpicker.colorpicker-horizontal .colorpicker-alpha .colorpicker-guide { - position: absolute; - display: block; - bottom: -2px; - left: 0; - right: auto; - height: auto; - width: 4px; } - -.colorpicker.colorpicker-horizontal .colorpicker-hue { - /* FF3.6+ */ - /* Chrome,Safari4+ */ - /* Chrome10+,Safari5.1+ */ - /* Opera 11.10+ */ - /* IE10+ */ - background: -webkit-gradient(linear, right top, left top, from(red), color-stop(8%, #ff8000), color-stop(17%, yellow), color-stop(25%, #80ff00), color-stop(33%, lime), color-stop(42%, #00ff80), color-stop(50%, cyan), color-stop(58%, #0080ff), color-stop(67%, blue), color-stop(75%, #8000ff), color-stop(83%, magenta), color-stop(92%, #ff0080), to(red)); - background: linear-gradient(to left, red 0%, #ff8000 8%, yellow 17%, #80ff00 25%, lime 33%, #00ff80 42%, cyan 50%, #0080ff 58%, blue 67%, #8000ff 75%, magenta 83%, #ff0080 92%, red 100%); - /* W3C */ } - -.colorpicker.colorpicker-horizontal .colorpicker-alpha { - background: linear-gradient(45deg, rgba(0, 0, 0, 0.1) 25%, transparent 25%, transparent 75%, rgba(0, 0, 0, 0.1) 75%, rgba(0, 0, 0, 0.1) 0), linear-gradient(45deg, rgba(0, 0, 0, 0.1) 25%, transparent 25%, transparent 75%, rgba(0, 0, 0, 0.1) 75%, rgba(0, 0, 0, 0.1) 0), white; - background-size: 10px 10px; - background-position: 0 0, 5px 5px; } - -.colorpicker-inline:before, -.colorpicker-no-arrow:before, -.colorpicker-popup.colorpicker-bs-popover-content:before { - content: none; - display: none; } - -.colorpicker-inline:after, -.colorpicker-no-arrow:after, -.colorpicker-popup.colorpicker-bs-popover-content:after { - content: none; - display: none; } - -.colorpicker-alpha, -.colorpicker-saturation, -.colorpicker-hue { - -webkit-user-select: none; - -moz-user-select: none; - -ms-user-select: none; - user-select: none; } - -.colorpicker.colorpicker-visible, -.colorpicker-alpha.colorpicker-visible, -.colorpicker-saturation.colorpicker-visible, -.colorpicker-hue.colorpicker-visible, -.colorpicker-bar.colorpicker-visible { - display: block; } - -.colorpicker.colorpicker-hidden, -.colorpicker-alpha.colorpicker-hidden, -.colorpicker-saturation.colorpicker-hidden, -.colorpicker-hue.colorpicker-hidden, -.colorpicker-bar.colorpicker-hidden { - display: none; } - -.colorpicker-inline.colorpicker-visible { - display: inline-block; } - -.colorpicker.colorpicker-disabled:after { - border: none; - content: ''; - display: block; - width: 100%; - height: 100%; - background: rgba(233, 236, 239, 0.33); - top: 0; - left: 0; - right: auto; - z-index: 2; - position: absolute; } - -.colorpicker.colorpicker-disabled .colorpicker-guide { - display: none; } - -/** EXTENSIONS **/ -.colorpicker-preview { - background: linear-gradient(45deg, rgba(0, 0, 0, 0.1) 25%, transparent 25%, transparent 75%, rgba(0, 0, 0, 0.1) 75%, rgba(0, 0, 0, 0.1) 0), linear-gradient(45deg, rgba(0, 0, 0, 0.1) 25%, transparent 25%, transparent 75%, rgba(0, 0, 0, 0.1) 75%, rgba(0, 0, 0, 0.1) 0), white; - background-size: 10px 10px; - background-position: 0 0, 5px 5px; } - -.colorpicker-preview > div { - position: absolute; - left: 0; - top: 0; - width: 100%; - height: 100%; } - -.colorpicker-bar.colorpicker-swatches { - -webkit-box-shadow: none; - box-shadow: none; - height: auto; } - -.colorpicker-swatches--inner { - clear: both; - margin-top: -6px; } - -.colorpicker-swatch { - position: relative; - cursor: pointer; - float: left; - height: 16px; - width: 16px; - margin-right: 6px; - margin-top: 6px; - margin-left: 0; - display: block; - -webkit-box-shadow: 0 0 0 1px rgba(0, 0, 0, 0.2); - box-shadow: 0 0 0 1px rgba(0, 0, 0, 0.2); - background: linear-gradient(45deg, rgba(0, 0, 0, 0.1) 25%, transparent 25%, transparent 75%, rgba(0, 0, 0, 0.1) 75%, rgba(0, 0, 0, 0.1) 0), linear-gradient(45deg, rgba(0, 0, 0, 0.1) 25%, transparent 25%, transparent 75%, rgba(0, 0, 0, 0.1) 75%, rgba(0, 0, 0, 0.1) 0), white; - background-size: 10px 10px; - background-position: 0 0, 5px 5px; } - -.colorpicker-swatch--inner { - position: absolute; - top: 0; - left: 0; - width: 100%; - height: 100%; } - -.colorpicker-swatch:nth-of-type(7n+0) { - margin-right: 0; } - -.colorpicker-with-alpha .colorpicker-swatch:nth-of-type(7n+0) { - margin-right: 6px; } - -.colorpicker-with-alpha .colorpicker-swatch:nth-of-type(8n+0) { - margin-right: 0; } - -.colorpicker-horizontal .colorpicker-swatch:nth-of-type(6n+0) { - margin-right: 0; } - -.colorpicker-horizontal .colorpicker-swatch:nth-of-type(7n+0) { - margin-right: 6px; } - -.colorpicker-horizontal .colorpicker-swatch:nth-of-type(8n+0) { - margin-right: 6px; } - -.colorpicker-swatch:last-of-type:after { - content: ""; - display: table; - clear: both; } - -*[dir='rtl'] .colorpicker-element input, -.colorpicker-element[dir='rtl'] input, -.colorpicker-element input[dir='rtl'] { - direction: ltr; - text-align: right; } - -/*# sourceMappingURL=bootstrap-colorpicker.css.map */ diff --git a/addons/web_flectra/static/lib/bootstrap.colorpicker/css/bootstrap-colorpicker.min.css b/addons/web_flectra/static/lib/bootstrap.colorpicker/css/bootstrap-colorpicker.min.css deleted file mode 100644 index 1b93194ca6..0000000000 --- a/addons/web_flectra/static/lib/bootstrap.colorpicker/css/bootstrap-colorpicker.min.css +++ /dev/null @@ -1,10 +0,0 @@ -/*! - * Bootstrap Colorpicker - Bootstrap Colorpicker is a modular color picker plugin for Bootstrap 4. - * @package bootstrap-colorpicker - * @version v3.2.0 - * @license MIT - * @link https://itsjavi.com/bootstrap-colorpicker/ - * @link https://github.com/itsjavi/bootstrap-colorpicker.git - */ -.colorpicker{position:relative;display:none;font-size:inherit;color:inherit;text-align:left;list-style:none;background-color:#fff;background-clip:padding-box;border:1px solid rgba(0,0,0,.2);padding:.75rem .75rem;width:148px;border-radius:4px;-webkit-box-sizing:content-box;box-sizing:content-box}.colorpicker.colorpicker-disabled,.colorpicker.colorpicker-disabled *{cursor:default!important}.colorpicker div{position:relative}.colorpicker-popup{position:absolute;top:100%;left:0;float:left;margin-top:1px;z-index:1060}.colorpicker-popup.colorpicker-bs-popover-content{position:relative;top:auto;left:auto;float:none;margin:0;z-index:initial;border:none;padding:.25rem 0;border-radius:0;background:0 0;-webkit-box-shadow:none;box-shadow:none}.colorpicker:after,.colorpicker:before{content:"";display:table;clear:both;line-height:0}.colorpicker-clear{clear:both;display:block}.colorpicker:before{content:'';display:inline-block;border-left:7px solid transparent;border-right:7px solid transparent;border-bottom:7px solid #ccc;border-bottom-color:rgba(0,0,0,.2);position:absolute;top:-7px;left:auto;right:6px}.colorpicker:after{content:'';display:inline-block;border-left:6px solid transparent;border-right:6px solid transparent;border-bottom:6px solid #fff;position:absolute;top:-6px;left:auto;right:7px}.colorpicker.colorpicker-with-alpha{width:170px}.colorpicker.colorpicker-with-alpha .colorpicker-alpha{display:block}.colorpicker-saturation{position:relative;width:126px;height:126px;background:-webkit-gradient(linear,left top,left bottom,from(transparent),to(black)),-webkit-gradient(linear,left top,right top,from(white),to(rgba(255,255,255,0)));background:linear-gradient(to bottom,transparent 0,#000 100%),linear-gradient(to right,#fff 0,rgba(255,255,255,0) 100%);cursor:crosshair;float:left;-webkit-box-shadow:0 0 0 1px rgba(0,0,0,.2);box-shadow:0 0 0 1px rgba(0,0,0,.2);margin-bottom:6px}.colorpicker-saturation .colorpicker-guide{display:block;height:6px;width:6px;border-radius:6px;border:1px solid #000;-webkit-box-shadow:0 0 0 1px rgba(255,255,255,.8);box-shadow:0 0 0 1px rgba(255,255,255,.8);position:absolute;top:0;left:0;margin:-3px 0 0 -3px}.colorpicker-alpha,.colorpicker-hue{position:relative;width:16px;height:126px;float:left;cursor:row-resize;margin-left:6px;margin-bottom:6px}.colorpicker-alpha-color{position:absolute;top:0;left:0;width:100%;height:100%}.colorpicker-alpha-color,.colorpicker-hue{-webkit-box-shadow:0 0 0 1px rgba(0,0,0,.2);box-shadow:0 0 0 1px rgba(0,0,0,.2)}.colorpicker-alpha .colorpicker-guide,.colorpicker-hue .colorpicker-guide{display:block;height:4px;background:rgba(255,255,255,.8);border:1px solid rgba(0,0,0,.4);position:absolute;top:0;left:0;margin-left:-2px;margin-top:-2px;right:-2px;z-index:1}.colorpicker-hue{background:-webkit-gradient(linear,left bottom,left top,from(red),color-stop(8%,#ff8000),color-stop(17%,#ff0),color-stop(25%,#80ff00),color-stop(33%,#0f0),color-stop(42%,#00ff80),color-stop(50%,#0ff),color-stop(58%,#0080ff),color-stop(67%,#00f),color-stop(75%,#8000ff),color-stop(83%,#ff00ff),color-stop(92%,#ff0080),to(red));background:linear-gradient(to top,red 0,#ff8000 8%,#ff0 17%,#80ff00 25%,#0f0 33%,#00ff80 42%,#0ff 50%,#0080ff 58%,#00f 67%,#8000ff 75%,#ff00ff 83%,#ff0080 92%,red 100%)}.colorpicker-alpha{background:linear-gradient(45deg,rgba(0,0,0,.1) 25%,transparent 25%,transparent 75%,rgba(0,0,0,.1) 75%,rgba(0,0,0,.1) 0),linear-gradient(45deg,rgba(0,0,0,.1) 25%,transparent 25%,transparent 75%,rgba(0,0,0,.1) 75%,rgba(0,0,0,.1) 0),#fff;background-size:10px 10px;background-position:0 0,5px 5px;display:none}.colorpicker-bar{min-height:16px;margin:6px 0 0 0;clear:both;text-align:center;font-size:10px;line-height:normal;max-width:100%;-webkit-box-shadow:0 0 0 1px rgba(0,0,0,.2);box-shadow:0 0 0 1px rgba(0,0,0,.2)}.colorpicker-bar:before{content:"";display:table;clear:both}.colorpicker-bar.colorpicker-bar-horizontal{height:126px;width:16px;margin:0 0 6px 0;float:left}.colorpicker-input-addon{position:relative}.colorpicker-input-addon i{display:inline-block;cursor:pointer;vertical-align:text-top;height:16px;width:16px;position:relative}.colorpicker-input-addon:before{content:"";position:absolute;width:16px;height:16px;display:inline-block;vertical-align:text-top;background:linear-gradient(45deg,rgba(0,0,0,.1) 25%,transparent 25%,transparent 75%,rgba(0,0,0,.1) 75%,rgba(0,0,0,.1) 0),linear-gradient(45deg,rgba(0,0,0,.1) 25%,transparent 25%,transparent 75%,rgba(0,0,0,.1) 75%,rgba(0,0,0,.1) 0),#fff;background-size:10px 10px;background-position:0 0,5px 5px}.colorpicker.colorpicker-inline{position:relative;display:inline-block;float:none;z-index:auto;vertical-align:text-bottom}.colorpicker.colorpicker-horizontal{width:126px;height:auto}.colorpicker.colorpicker-horizontal .colorpicker-bar{width:126px}.colorpicker.colorpicker-horizontal .colorpicker-saturation{float:none;margin-bottom:0}.colorpicker.colorpicker-horizontal .colorpicker-alpha,.colorpicker.colorpicker-horizontal .colorpicker-hue{float:none;width:126px;height:16px;cursor:col-resize;margin-left:0;margin-top:6px;margin-bottom:0}.colorpicker.colorpicker-horizontal .colorpicker-alpha .colorpicker-guide,.colorpicker.colorpicker-horizontal .colorpicker-hue .colorpicker-guide{position:absolute;display:block;bottom:-2px;left:0;right:auto;height:auto;width:4px}.colorpicker.colorpicker-horizontal .colorpicker-hue{background:-webkit-gradient(linear,right top,left top,from(red),color-stop(8%,#ff8000),color-stop(17%,#ff0),color-stop(25%,#80ff00),color-stop(33%,#0f0),color-stop(42%,#00ff80),color-stop(50%,#0ff),color-stop(58%,#0080ff),color-stop(67%,#00f),color-stop(75%,#8000ff),color-stop(83%,#ff00ff),color-stop(92%,#ff0080),to(red));background:linear-gradient(to left,red 0,#ff8000 8%,#ff0 17%,#80ff00 25%,#0f0 33%,#00ff80 42%,#0ff 50%,#0080ff 58%,#00f 67%,#8000ff 75%,#ff00ff 83%,#ff0080 92%,red 100%)}.colorpicker.colorpicker-horizontal .colorpicker-alpha{background:linear-gradient(45deg,rgba(0,0,0,.1) 25%,transparent 25%,transparent 75%,rgba(0,0,0,.1) 75%,rgba(0,0,0,.1) 0),linear-gradient(45deg,rgba(0,0,0,.1) 25%,transparent 25%,transparent 75%,rgba(0,0,0,.1) 75%,rgba(0,0,0,.1) 0),#fff;background-size:10px 10px;background-position:0 0,5px 5px}.colorpicker-inline:before,.colorpicker-no-arrow:before,.colorpicker-popup.colorpicker-bs-popover-content:before{content:none;display:none}.colorpicker-inline:after,.colorpicker-no-arrow:after,.colorpicker-popup.colorpicker-bs-popover-content:after{content:none;display:none}.colorpicker-alpha,.colorpicker-hue,.colorpicker-saturation{-webkit-user-select:none;-moz-user-select:none;-ms-user-select:none;user-select:none}.colorpicker-alpha.colorpicker-visible,.colorpicker-bar.colorpicker-visible,.colorpicker-hue.colorpicker-visible,.colorpicker-saturation.colorpicker-visible,.colorpicker.colorpicker-visible{display:block}.colorpicker-alpha.colorpicker-hidden,.colorpicker-bar.colorpicker-hidden,.colorpicker-hue.colorpicker-hidden,.colorpicker-saturation.colorpicker-hidden,.colorpicker.colorpicker-hidden{display:none}.colorpicker-inline.colorpicker-visible{display:inline-block}.colorpicker.colorpicker-disabled:after{border:none;content:'';display:block;width:100%;height:100%;background:rgba(233,236,239,.33);top:0;left:0;right:auto;z-index:2;position:absolute}.colorpicker.colorpicker-disabled .colorpicker-guide{display:none}.colorpicker-preview{background:linear-gradient(45deg,rgba(0,0,0,.1) 25%,transparent 25%,transparent 75%,rgba(0,0,0,.1) 75%,rgba(0,0,0,.1) 0),linear-gradient(45deg,rgba(0,0,0,.1) 25%,transparent 25%,transparent 75%,rgba(0,0,0,.1) 75%,rgba(0,0,0,.1) 0),#fff;background-size:10px 10px;background-position:0 0,5px 5px}.colorpicker-preview>div{position:absolute;left:0;top:0;width:100%;height:100%}.colorpicker-bar.colorpicker-swatches{-webkit-box-shadow:none;box-shadow:none;height:auto}.colorpicker-swatches--inner{clear:both;margin-top:-6px}.colorpicker-swatch{position:relative;cursor:pointer;float:left;height:16px;width:16px;margin-right:6px;margin-top:6px;margin-left:0;display:block;-webkit-box-shadow:0 0 0 1px rgba(0,0,0,.2);box-shadow:0 0 0 1px rgba(0,0,0,.2);background:linear-gradient(45deg,rgba(0,0,0,.1) 25%,transparent 25%,transparent 75%,rgba(0,0,0,.1) 75%,rgba(0,0,0,.1) 0),linear-gradient(45deg,rgba(0,0,0,.1) 25%,transparent 25%,transparent 75%,rgba(0,0,0,.1) 75%,rgba(0,0,0,.1) 0),#fff;background-size:10px 10px;background-position:0 0,5px 5px}.colorpicker-swatch--inner{position:absolute;top:0;left:0;width:100%;height:100%}.colorpicker-swatch:nth-of-type(7n+0){margin-right:0}.colorpicker-with-alpha .colorpicker-swatch:nth-of-type(7n+0){margin-right:6px}.colorpicker-with-alpha .colorpicker-swatch:nth-of-type(8n+0){margin-right:0}.colorpicker-horizontal .colorpicker-swatch:nth-of-type(6n+0){margin-right:0}.colorpicker-horizontal .colorpicker-swatch:nth-of-type(7n+0){margin-right:6px}.colorpicker-horizontal .colorpicker-swatch:nth-of-type(8n+0){margin-right:6px}.colorpicker-swatch:last-of-type:after{content:"";display:table;clear:both}.colorpicker-element input[dir=rtl],.colorpicker-element[dir=rtl] input,[dir=rtl] .colorpicker-element input{direction:ltr;text-align:right} -/*# sourceMappingURL=bootstrap-colorpicker.min.css.map */ diff --git a/addons/web_flectra/static/lib/bootstrap.colorpicker/js/bootstrap-colorpicker.js b/addons/web_flectra/static/lib/bootstrap.colorpicker/js/bootstrap-colorpicker.js deleted file mode 100644 index 4df8432018..0000000000 --- a/addons/web_flectra/static/lib/bootstrap.colorpicker/js/bootstrap-colorpicker.js +++ /dev/null @@ -1,6252 +0,0 @@ -/*! - * Bootstrap Colorpicker - Bootstrap Colorpicker is a modular color picker plugin for Bootstrap 4. - * @package bootstrap-colorpicker - * @version v3.2.0 - * @license MIT - * @link https://itsjavi.com/bootstrap-colorpicker/ - * @link https://github.com/itsjavi/bootstrap-colorpicker.git - */ -(function webpackUniversalModuleDefinition(root, factory) { - if(typeof exports === 'object' && typeof module === 'object') - module.exports = factory(require("jquery")); - else if(typeof define === 'function' && define.amd) - define("bootstrap-colorpicker", ["jquery"], factory); - else if(typeof exports === 'object') - exports["bootstrap-colorpicker"] = factory(require("jquery")); - else - root["bootstrap-colorpicker"] = factory(root["jQuery"]); -})(window, function(__WEBPACK_EXTERNAL_MODULE__0__) { -return /******/ (function(modules) { // webpackBootstrap -/******/ // The module cache -/******/ var installedModules = {}; -/******/ -/******/ // The require function -/******/ function __webpack_require__(moduleId) { -/******/ -/******/ // Check if module is in cache -/******/ if(installedModules[moduleId]) { -/******/ return installedModules[moduleId].exports; -/******/ } -/******/ // Create a new module (and put it into the cache) -/******/ var module = installedModules[moduleId] = { -/******/ i: moduleId, -/******/ l: false, -/******/ exports: {} -/******/ }; -/******/ -/******/ // Execute the module function -/******/ modules[moduleId].call(module.exports, module, module.exports, __webpack_require__); -/******/ -/******/ // Flag the module as loaded -/******/ module.l = true; -/******/ -/******/ // Return the exports of the module -/******/ return module.exports; -/******/ } -/******/ -/******/ -/******/ // expose the modules object (__webpack_modules__) -/******/ __webpack_require__.m = modules; -/******/ -/******/ // expose the module cache -/******/ __webpack_require__.c = installedModules; -/******/ -/******/ // define getter function for harmony exports -/******/ __webpack_require__.d = function(exports, name, getter) { -/******/ if(!__webpack_require__.o(exports, name)) { -/******/ Object.defineProperty(exports, name, { enumerable: true, get: getter }); -/******/ } -/******/ }; -/******/ -/******/ // define __esModule on exports -/******/ __webpack_require__.r = function(exports) { -/******/ if(typeof Symbol !== 'undefined' && Symbol.toStringTag) { -/******/ Object.defineProperty(exports, Symbol.toStringTag, { value: 'Module' }); -/******/ } -/******/ Object.defineProperty(exports, '__esModule', { value: true }); -/******/ }; -/******/ -/******/ // create a fake namespace object -/******/ // mode & 1: value is a module id, require it -/******/ // mode & 2: merge all properties of value into the ns -/******/ // mode & 4: return value when already ns object -/******/ // mode & 8|1: behave like require -/******/ __webpack_require__.t = function(value, mode) { -/******/ if(mode & 1) value = __webpack_require__(value); -/******/ if(mode & 8) return value; -/******/ if((mode & 4) && typeof value === 'object' && value && value.__esModule) return value; -/******/ var ns = Object.create(null); -/******/ __webpack_require__.r(ns); -/******/ Object.defineProperty(ns, 'default', { enumerable: true, value: value }); -/******/ if(mode & 2 && typeof value != 'string') for(var key in value) __webpack_require__.d(ns, key, function(key) { return value[key]; }.bind(null, key)); -/******/ return ns; -/******/ }; -/******/ -/******/ // getDefaultExport function for compatibility with non-harmony modules -/******/ __webpack_require__.n = function(module) { -/******/ var getter = module && module.__esModule ? -/******/ function getDefault() { return module['default']; } : -/******/ function getModuleExports() { return module; }; -/******/ __webpack_require__.d(getter, 'a', getter); -/******/ return getter; -/******/ }; -/******/ -/******/ // Object.prototype.hasOwnProperty.call -/******/ __webpack_require__.o = function(object, property) { return Object.prototype.hasOwnProperty.call(object, property); }; -/******/ -/******/ // __webpack_public_path__ -/******/ __webpack_require__.p = ""; -/******/ -/******/ -/******/ // Load entry module and return exports -/******/ return __webpack_require__(__webpack_require__.s = 7); -/******/ }) -/************************************************************************/ -/******/ ([ -/* 0 */ -/***/ (function(module, exports) { - -module.exports = __WEBPACK_EXTERNAL_MODULE__0__; - -/***/ }), -/* 1 */ -/***/ (function(module, exports, __webpack_require__) { - -"use strict"; - - -Object.defineProperty(exports, "__esModule", { - value: true -}); - -var _createClass = function () { function defineProperties(target, props) { for (var i = 0; i < props.length; i++) { var descriptor = props[i]; descriptor.enumerable = descriptor.enumerable || false; descriptor.configurable = true; if ("value" in descriptor) descriptor.writable = true; Object.defineProperty(target, descriptor.key, descriptor); } } return function (Constructor, protoProps, staticProps) { if (protoProps) defineProperties(Constructor.prototype, protoProps); if (staticProps) defineProperties(Constructor, staticProps); return Constructor; }; }(); - -var _jquery = __webpack_require__(0); - -var _jquery2 = _interopRequireDefault(_jquery); - -function _interopRequireDefault(obj) { return obj && obj.__esModule ? obj : { default: obj }; } - -function _classCallCheck(instance, Constructor) { if (!(instance instanceof Constructor)) { throw new TypeError("Cannot call a class as a function"); } } - -/** - * Colorpicker extension class. - */ -var Extension = function () { - /** - * @param {Colorpicker} colorpicker - * @param {Object} options - */ - function Extension(colorpicker) { - var options = arguments.length > 1 && arguments[1] !== undefined ? arguments[1] : {}; - - _classCallCheck(this, Extension); - - /** - * The colorpicker instance - * @type {Colorpicker} - */ - this.colorpicker = colorpicker; - /** - * Extension options - * - * @type {Object} - */ - this.options = options; - - if (!(this.colorpicker.element && this.colorpicker.element.length)) { - throw new Error('Extension: this.colorpicker.element is not valid'); - } - - this.colorpicker.element.on('colorpickerCreate.colorpicker-ext', _jquery2.default.proxy(this.onCreate, this)); - this.colorpicker.element.on('colorpickerDestroy.colorpicker-ext', _jquery2.default.proxy(this.onDestroy, this)); - this.colorpicker.element.on('colorpickerUpdate.colorpicker-ext', _jquery2.default.proxy(this.onUpdate, this)); - this.colorpicker.element.on('colorpickerChange.colorpicker-ext', _jquery2.default.proxy(this.onChange, this)); - this.colorpicker.element.on('colorpickerInvalid.colorpicker-ext', _jquery2.default.proxy(this.onInvalid, this)); - this.colorpicker.element.on('colorpickerShow.colorpicker-ext', _jquery2.default.proxy(this.onShow, this)); - this.colorpicker.element.on('colorpickerHide.colorpicker-ext', _jquery2.default.proxy(this.onHide, this)); - this.colorpicker.element.on('colorpickerEnable.colorpicker-ext', _jquery2.default.proxy(this.onEnable, this)); - this.colorpicker.element.on('colorpickerDisable.colorpicker-ext', _jquery2.default.proxy(this.onDisable, this)); - } - - /** - * Function called every time a new color needs to be created. - * Return false to skip this resolver and continue with other extensions' ones - * or return anything else to consider the color resolved. - * - * @param {ColorItem|String|*} color - * @param {boolean} realColor if true, the color should resolve into a real (not named) color code - * @return {ColorItem|String|*} - */ - - - _createClass(Extension, [{ - key: 'resolveColor', - value: function resolveColor(color) { - var realColor = arguments.length > 1 && arguments[1] !== undefined ? arguments[1] : true; - - return false; - } - - /** - * Method called after the colorpicker is created - * - * @listens Colorpicker#colorpickerCreate - * @param {Event} event - */ - - }, { - key: 'onCreate', - value: function onCreate(event) {} - // to be extended - - - /** - * Method called after the colorpicker is destroyed - * - * @listens Colorpicker#colorpickerDestroy - * @param {Event} event - */ - - }, { - key: 'onDestroy', - value: function onDestroy(event) { - this.colorpicker.element.off('.colorpicker-ext'); - } - - /** - * Method called after the colorpicker is updated - * - * @listens Colorpicker#colorpickerUpdate - * @param {Event} event - */ - - }, { - key: 'onUpdate', - value: function onUpdate(event) {} - // to be extended - - - /** - * Method called after the colorpicker color is changed - * - * @listens Colorpicker#colorpickerChange - * @param {Event} event - */ - - }, { - key: 'onChange', - value: function onChange(event) {} - // to be extended - - - /** - * Method called when the colorpicker color is invalid - * - * @listens Colorpicker#colorpickerInvalid - * @param {Event} event - */ - - }, { - key: 'onInvalid', - value: function onInvalid(event) {} - // to be extended - - - /** - * Method called after the colorpicker is hidden - * - * @listens Colorpicker#colorpickerHide - * @param {Event} event - */ - - }, { - key: 'onHide', - value: function onHide(event) {} - // to be extended - - - /** - * Method called after the colorpicker is shown - * - * @listens Colorpicker#colorpickerShow - * @param {Event} event - */ - - }, { - key: 'onShow', - value: function onShow(event) {} - // to be extended - - - /** - * Method called after the colorpicker is disabled - * - * @listens Colorpicker#colorpickerDisable - * @param {Event} event - */ - - }, { - key: 'onDisable', - value: function onDisable(event) {} - // to be extended - - - /** - * Method called after the colorpicker is enabled - * - * @listens Colorpicker#colorpickerEnable - * @param {Event} event - */ - - }, { - key: 'onEnable', - value: function onEnable(event) { - // to be extended - } - }]); - - return Extension; -}(); - -exports.default = Extension; -module.exports = exports.default; - -/***/ }), -/* 2 */ -/***/ (function(module, exports, __webpack_require__) { - -"use strict"; - - -Object.defineProperty(exports, "__esModule", { - value: true -}); -exports.ColorItem = exports.HSVAColor = undefined; - -var _createClass = function () { function defineProperties(target, props) { for (var i = 0; i < props.length; i++) { var descriptor = props[i]; descriptor.enumerable = descriptor.enumerable || false; descriptor.configurable = true; if ("value" in descriptor) descriptor.writable = true; Object.defineProperty(target, descriptor.key, descriptor); } } return function (Constructor, protoProps, staticProps) { if (protoProps) defineProperties(Constructor.prototype, protoProps); if (staticProps) defineProperties(Constructor, staticProps); return Constructor; }; }(); /** - * Color manipulation class, specific for Bootstrap Colorpicker - */ - - -var _color = __webpack_require__(16); - -var _color2 = _interopRequireDefault(_color); - -function _interopRequireDefault(obj) { return obj && obj.__esModule ? obj : { default: obj }; } - -function _classCallCheck(instance, Constructor) { if (!(instance instanceof Constructor)) { throw new TypeError("Cannot call a class as a function"); } } - -/** - * HSVA color data class, containing the hue, saturation, value and alpha - * information. - */ -var HSVAColor = function () { - /** - * @param {number|int} h - * @param {number|int} s - * @param {number|int} v - * @param {number|int} a - */ - function HSVAColor(h, s, v, a) { - _classCallCheck(this, HSVAColor); - - this.h = isNaN(h) ? 0 : h; - this.s = isNaN(s) ? 0 : s; - this.v = isNaN(v) ? 0 : v; - this.a = isNaN(h) ? 1 : a; - } - - _createClass(HSVAColor, [{ - key: 'toString', - value: function toString() { - return this.h + ', ' + this.s + '%, ' + this.v + '%, ' + this.a; - } - }]); - - return HSVAColor; -}(); - -/** - * HSVA color manipulation - */ - - -var ColorItem = function () { - _createClass(ColorItem, [{ - key: 'api', - - - /** - * Applies a method of the QixColor API and returns a new Color object or - * the return value of the method call. - * - * If no argument is provided, the internal QixColor object is returned. - * - * @param {String} fn QixColor function name - * @param args QixColor function arguments - * @example let darkerColor = color.api('darken', 0.25); - * @example let luminosity = color.api('luminosity'); - * @example color = color.api('negate'); - * @example let qColor = color.api().negate(); - * @returns {ColorItem|QixColor|*} - */ - value: function api(fn) { - for (var _len = arguments.length, args = Array(_len > 1 ? _len - 1 : 0), _key = 1; _key < _len; _key++) { - args[_key - 1] = arguments[_key]; - } - - if (arguments.length === 0) { - return this._color; - } - - var result = this._color[fn].apply(this._color, args); - - if (!(result instanceof _color2.default)) { - // return result of the method call - return result; - } - - return new ColorItem(result, this.format); - } - - /** - * Returns the original ColorItem constructor data, - * plus a 'valid' flag to know if it's valid or not. - * - * @returns {{color: *, format: String, valid: boolean}} - */ - - }, { - key: 'original', - get: function get() { - return this._original; - } - - /** - * @param {ColorItem|HSVAColor|QixColor|String|*|null} color Color data - * @param {String|null} format Color model to convert to by default. Supported: 'rgb', 'hsl', 'hex'. - */ - - }], [{ - key: 'HSVAColor', - - - /** - * Returns the HSVAColor class - * - * @static - * @example let colorData = new ColorItem.HSVAColor(360, 100, 100, 1); - * @returns {HSVAColor} - */ - get: function get() { - return HSVAColor; - } - }]); - - function ColorItem() { - var color = arguments.length > 0 && arguments[0] !== undefined ? arguments[0] : null; - var format = arguments.length > 1 && arguments[1] !== undefined ? arguments[1] : null; - - _classCallCheck(this, ColorItem); - - this.replace(color, format); - } - - /** - * Replaces the internal QixColor object with a new one. - * This also replaces the internal original color data. - * - * @param {ColorItem|HSVAColor|QixColor|String|*|null} color Color data to be parsed (if needed) - * @param {String|null} format Color model to convert to by default. Supported: 'rgb', 'hsl', 'hex'. - * @example color.replace('rgb(255,0,0)', 'hsl'); - * @example color.replace(hsvaColorData); - */ - - - _createClass(ColorItem, [{ - key: 'replace', - value: function replace(color) { - var format = arguments.length > 1 && arguments[1] !== undefined ? arguments[1] : null; - - format = ColorItem.sanitizeFormat(format); - - /** - * @type {{color: *, format: String}} - * @private - */ - this._original = { - color: color, - format: format, - valid: true - }; - /** - * @type {QixColor} - * @private - */ - this._color = ColorItem.parse(color); - - if (this._color === null) { - this._color = (0, _color2.default)(); - this._original.valid = false; - return; - } - - /** - * @type {*|string} - * @private - */ - this._format = format ? format : ColorItem.isHex(color) ? 'hex' : this._color.model; - } - - /** - * Parses the color returning a Qix Color object or null if cannot be - * parsed. - * - * @param {ColorItem|HSVAColor|QixColor|String|*|null} color Color data - * @example let qColor = ColorItem.parse('rgb(255,0,0)'); - * @static - * @returns {QixColor|null} - */ - - }, { - key: 'isValid', - - - /** - * Returns true if the color is valid, false if not. - * - * @returns {boolean} - */ - value: function isValid() { - return this._original.valid === true; - } - - /** - * Hue value from 0 to 360 - * - * @returns {int} - */ - - }, { - key: 'setHueRatio', - - - /** - * Sets the hue ratio, where 1.0 is 0, 0.5 is 180 and 0.0 is 360. - * - * @ignore - * @param {number} h Ratio from 1.0 to 0.0 - */ - value: function setHueRatio(h) { - this.hue = (1 - h) * 360; - } - - /** - * Sets the saturation value - * - * @param {int} value Integer from 0 to 100 - */ - - }, { - key: 'setSaturationRatio', - - - /** - * Sets the saturation ratio, where 1.0 is 100 and 0.0 is 0. - * - * @ignore - * @param {number} s Ratio from 0.0 to 1.0 - */ - value: function setSaturationRatio(s) { - this.saturation = s * 100; - } - - /** - * Sets the 'value' channel value - * - * @param {int} value Integer from 0 to 100 - */ - - }, { - key: 'setValueRatio', - - - /** - * Sets the value ratio, where 1.0 is 0 and 0.0 is 100. - * - * @ignore - * @param {number} v Ratio from 1.0 to 0.0 - */ - value: function setValueRatio(v) { - this.value = (1 - v) * 100; - } - - /** - * Sets the alpha value. It will be rounded to 2 decimals. - * - * @param {int} value Float from 0.0 to 1.0 - */ - - }, { - key: 'setAlphaRatio', - - - /** - * Sets the alpha ratio, where 1.0 is 0.0 and 0.0 is 1.0. - * - * @ignore - * @param {number} a Ratio from 1.0 to 0.0 - */ - value: function setAlphaRatio(a) { - this.alpha = 1 - a; - } - - /** - * Sets the default color format - * - * @param {String} value Supported: 'rgb', 'hsl', 'hex' - */ - - }, { - key: 'isDesaturated', - - - /** - * Returns true if the saturation value is zero, false otherwise - * - * @returns {boolean} - */ - value: function isDesaturated() { - return this.saturation === 0; - } - - /** - * Returns true if the alpha value is zero, false otherwise - * - * @returns {boolean} - */ - - }, { - key: 'isTransparent', - value: function isTransparent() { - return this.alpha === 0; - } - - /** - * Returns true if the alpha value is numeric and less than 1, false otherwise - * - * @returns {boolean} - */ - - }, { - key: 'hasTransparency', - value: function hasTransparency() { - return this.hasAlpha() && this.alpha < 1; - } - - /** - * Returns true if the alpha value is numeric, false otherwise - * - * @returns {boolean} - */ - - }, { - key: 'hasAlpha', - value: function hasAlpha() { - return !isNaN(this.alpha); - } - - /** - * Returns a new HSVAColor object, based on the current color - * - * @returns {HSVAColor} - */ - - }, { - key: 'toObject', - value: function toObject() { - return new HSVAColor(this.hue, this.saturation, this.value, this.alpha); - } - - /** - * Alias of toObject() - * - * @returns {HSVAColor} - */ - - }, { - key: 'toHsva', - value: function toHsva() { - return this.toObject(); - } - - /** - * Returns a new HSVAColor object with the ratio values (from 0.0 to 1.0), - * based on the current color. - * - * @ignore - * @returns {HSVAColor} - */ - - }, { - key: 'toHsvaRatio', - value: function toHsvaRatio() { - return new HSVAColor(this.hue / 360, this.saturation / 100, this.value / 100, this.alpha); - } - - /** - * Converts the current color to its string representation, - * using the internal format of this instance. - * - * @returns {String} - */ - - }, { - key: 'toString', - value: function toString() { - return this.string(); - } - - /** - * Converts the current color to its string representation, - * using the given format. - * - * @param {String|null} format Format to convert to. If empty or null, the internal format will be used. - * @returns {String} - */ - - }, { - key: 'string', - value: function string() { - var format = arguments.length > 0 && arguments[0] !== undefined ? arguments[0] : null; - - format = ColorItem.sanitizeFormat(format ? format : this.format); - - if (!format) { - return this._color.round().string(); - } - - if (this._color[format] === undefined) { - throw new Error('Unsupported color format: \'' + format + '\''); - } - - var str = this._color[format](); - - return str.round ? str.round().string() : str; - } - - /** - * Returns true if the given color values equals this one, false otherwise. - * The format is not compared. - * If any of the colors is invalid, the result will be false. - * - * @param {ColorItem|HSVAColor|QixColor|String|*|null} color Color data - * - * @returns {boolean} - */ - - }, { - key: 'equals', - value: function equals(color) { - color = color instanceof ColorItem ? color : new ColorItem(color); - - if (!color.isValid() || !this.isValid()) { - return false; - } - - return this.hue === color.hue && this.saturation === color.saturation && this.value === color.value && this.alpha === color.alpha; - } - - /** - * Creates a copy of this instance - * - * @returns {ColorItem} - */ - - }, { - key: 'getClone', - value: function getClone() { - return new ColorItem(this._color, this.format); - } - - /** - * Creates a copy of this instance, only copying the hue value, - * and setting the others to its max value. - * - * @returns {ColorItem} - */ - - }, { - key: 'getCloneHueOnly', - value: function getCloneHueOnly() { - return new ColorItem([this.hue, 100, 100, 1], this.format); - } - - /** - * Creates a copy of this instance setting the alpha to the max. - * - * @returns {ColorItem} - */ - - }, { - key: 'getCloneOpaque', - value: function getCloneOpaque() { - return new ColorItem(this._color.alpha(1), this.format); - } - - /** - * Converts the color to a RGB string - * - * @returns {String} - */ - - }, { - key: 'toRgbString', - value: function toRgbString() { - return this.string('rgb'); - } - - /** - * Converts the color to a Hexadecimal string - * - * @returns {String} - */ - - }, { - key: 'toHexString', - value: function toHexString() { - return this.string('hex'); - } - - /** - * Converts the color to a HSL string - * - * @returns {String} - */ - - }, { - key: 'toHslString', - value: function toHslString() { - return this.string('hsl'); - } - - /** - * Returns true if the color is dark, false otherwhise. - * This is useful to decide a text color. - * - * @returns {boolean} - */ - - }, { - key: 'isDark', - value: function isDark() { - return this._color.isDark(); - } - - /** - * Returns true if the color is light, false otherwhise. - * This is useful to decide a text color. - * - * @returns {boolean} - */ - - }, { - key: 'isLight', - value: function isLight() { - return this._color.isLight(); - } - - /** - * Generates a list of colors using the given hue-based formula or the given array of hue values. - * Hue formulas can be extended using ColorItem.colorFormulas static property. - * - * @param {String|Number[]} formula Examples: 'complementary', 'triad', 'tetrad', 'splitcomplement', [180, 270] - * @example let colors = color.generate('triad'); - * @example let colors = color.generate([45, 80, 112, 200]); - * @returns {ColorItem[]} - */ - - }, { - key: 'generate', - value: function generate(formula) { - var hues = []; - - if (Array.isArray(formula)) { - hues = formula; - } else if (!ColorItem.colorFormulas.hasOwnProperty(formula)) { - throw new Error('No color formula found with the name \'' + formula + '\'.'); - } else { - hues = ColorItem.colorFormulas[formula]; - } - - var colors = [], - mainColor = this._color, - format = this.format; - - hues.forEach(function (hue) { - var levels = [hue ? (mainColor.hue() + hue) % 360 : mainColor.hue(), mainColor.saturationv(), mainColor.value(), mainColor.alpha()]; - - colors.push(new ColorItem(levels, format)); - }); - - return colors; - } - }, { - key: 'hue', - get: function get() { - return this._color.hue(); - } - - /** - * Saturation value from 0 to 100 - * - * @returns {int} - */ - , - - - /** - * Sets the hue value - * - * @param {int} value Integer from 0 to 360 - */ - set: function set(value) { - this._color = this._color.hue(value); - } - }, { - key: 'saturation', - get: function get() { - return this._color.saturationv(); - } - - /** - * Value channel value from 0 to 100 - * - * @returns {int} - */ - , - set: function set(value) { - this._color = this._color.saturationv(value); - } - }, { - key: 'value', - get: function get() { - return this._color.value(); - } - - /** - * Alpha value from 0.0 to 1.0 - * - * @returns {number} - */ - , - set: function set(value) { - this._color = this._color.value(value); - } - }, { - key: 'alpha', - get: function get() { - var a = this._color.alpha(); - - return isNaN(a) ? 1 : a; - } - - /** - * Default color format to convert to when calling toString() or string() - * - * @returns {String} 'rgb', 'hsl', 'hex' or '' - */ - , - set: function set(value) { - // 2 decimals max - this._color = this._color.alpha(Math.round(value * 100) / 100); - } - }, { - key: 'format', - get: function get() { - return this._format ? this._format : this._color.model; - }, - set: function set(value) { - this._format = ColorItem.sanitizeFormat(value); - } - }], [{ - key: 'parse', - value: function parse(color) { - if (color instanceof _color2.default) { - return color; - } - - if (color instanceof ColorItem) { - return color._color; - } - - var format = null; - - if (color instanceof HSVAColor) { - color = [color.h, color.s, color.v, isNaN(color.a) ? 1 : color.a]; - } else { - color = ColorItem.sanitizeString(color); - } - - if (color === null) { - return null; - } - - if (Array.isArray(color)) { - format = 'hsv'; - } - - try { - return (0, _color2.default)(color, format); - } catch (e) { - return null; - } - } - - /** - * Sanitizes a color string, adding missing hash to hexadecimal colors - * and converting 'transparent' to a color code. - * - * @param {String|*} str Color string - * @example let colorStr = ColorItem.sanitizeString('ffaa00'); - * @static - * @returns {String|*} - */ - - }, { - key: 'sanitizeString', - value: function sanitizeString(str) { - if (!(typeof str === 'string' || str instanceof String)) { - return str; - } - - if (str.match(/^[0-9a-f]{2,}$/i)) { - return '#' + str; - } - - if (str.toLowerCase() === 'transparent') { - return '#FFFFFF00'; - } - - return str; - } - - /** - * Detects if a value is a string and a color in hexadecimal format (in any variant). - * - * @param {String} str - * @example ColorItem.isHex('rgba(0,0,0)'); // false - * @example ColorItem.isHex('ffaa00'); // true - * @example ColorItem.isHex('#ffaa00'); // true - * @static - * @returns {boolean} - */ - - }, { - key: 'isHex', - value: function isHex(str) { - if (!(typeof str === 'string' || str instanceof String)) { - return false; - } - - return !!str.match(/^#?[0-9a-f]{2,}$/i); - } - - /** - * Sanitizes a color format to one supported by web browsers. - * Returns an empty string of the format can't be recognised. - * - * @param {String|*} format - * @example ColorItem.sanitizeFormat('rgba'); // 'rgb' - * @example ColorItem.isHex('hex8'); // 'hex' - * @example ColorItem.isHex('invalid'); // '' - * @static - * @returns {String} 'rgb', 'hsl', 'hex' or ''. - */ - - }, { - key: 'sanitizeFormat', - value: function sanitizeFormat(format) { - switch (format) { - case 'hex': - case 'hex3': - case 'hex4': - case 'hex6': - case 'hex8': - return 'hex'; - case 'rgb': - case 'rgba': - case 'keyword': - case 'name': - return 'rgb'; - case 'hsl': - case 'hsla': - case 'hsv': - case 'hsva': - case 'hwb': // HWB this is supported by Qix Color, but not by browsers - case 'hwba': - return 'hsl'; - default: - return ''; - } - } - }]); - - return ColorItem; -}(); - -/** - * List of hue-based color formulas used by ColorItem.prototype.generate() - * - * @static - * @type {{complementary: number[], triad: number[], tetrad: number[], splitcomplement: number[]}} - */ - - -ColorItem.colorFormulas = { - complementary: [180], - triad: [0, 120, 240], - tetrad: [0, 90, 180, 270], - splitcomplement: [0, 72, 216] -}; - -exports.default = ColorItem; -exports.HSVAColor = HSVAColor; -exports.ColorItem = ColorItem; - -/***/ }), -/* 3 */ -/***/ (function(module, exports, __webpack_require__) { - -"use strict"; - -/** - * @module - */ - -// adjust these values accordingly to the sass vars - -Object.defineProperty(exports, "__esModule", { - value: true -}); -var sassVars = { - 'bar_size_short': 16, - 'base_margin': 6, - 'columns': 6 -}; - -var sliderSize = sassVars.bar_size_short * sassVars.columns + sassVars.base_margin * (sassVars.columns - 1); - -/** - * Colorpicker default options - */ -exports.default = { - /** - * Custom class to be added to the `.colorpicker-element` element - * - * @type {String|null} - * @default null - */ - customClass: null, - /** - * Sets a initial color, ignoring the one from the element/input value or the data-color attribute. - * - * @type {(String|ColorItem|boolean)} - * @default false - */ - color: false, - /** - * Fallback color to use when the given color is invalid. - * If false, the latest valid color will be used as a fallback. - * - * @type {String|ColorItem|boolean} - * @default false - */ - fallbackColor: false, - /** - * Forces an specific color format. If 'auto', it will be automatically detected the first time only, - * but if null it will be always recalculated. - * - * Note that the ending 'a' of the format meaning "alpha" has currently no effect, meaning that rgb is the same as - * rgba excepting if the alpha channel is disabled (see useAlpha). - * - * @type {('rgb'|'hex'|'hsl'|'auto'|null)} - * @default 'auto' - */ - format: 'auto', - /** - * Horizontal mode layout. - * - * If true, the hue and alpha channel bars will be rendered horizontally, above the saturation selector. - * - * @type {boolean} - * @default false - */ - horizontal: false, - /** - * Forces to show the colorpicker as an inline element. - * - * Note that if there is no container specified, the inline element - * will be added to the body, so you may want to set the container option. - * - * @type {boolean} - * @default false - */ - inline: false, - /** - * Container where the colorpicker is appended to in the DOM. - * - * If is a string (CSS selector), the colorpicker will be placed inside this container. - * If true, the `.colorpicker-element` element itself will be used as the container. - * If false, the document body is used as the container, unless it is a popover (in this case it is appended to the - * popover body instead). - * - * @type {String|boolean} - * @default false - */ - container: false, - /** - * Bootstrap Popover options. - * The trigger, content and html options are always ignored. - * - * @type {boolean} - * @default Object - */ - popover: { - animation: true, - placement: 'bottom', - fallbackPlacement: 'flip' - }, - /** - * If true, loads the 'debugger' extension automatically, which logs the events in the console - * @type {boolean} - * @default false - */ - debug: false, - /** - * Child CSS selector for the colorpicker input. - * - * @type {String} - * @default 'input' - */ - input: 'input', - /** - * Child CSS selector for the colorpicker addon. - * If it exists, the child element background will be changed on color change. - * - * @type {String} - * @default '.colorpicker-trigger, .colorpicker-input-addon' - */ - addon: '.colorpicker-input-addon', - /** - * If true, the input content will be replaced always with a valid color, - * if false, the invalid color will be left in the input, - * while the internal color object will still resolve into a valid one. - * - * @type {boolean} - * @default true - */ - autoInputFallback: true, - /** - * If true a hash will be prepended to hexadecimal colors. - * If false, the hash will be removed. - * This only affects the input values in hexadecimal format. - * - * @type {boolean} - * @default true - */ - useHashPrefix: true, - /** - * If true, the alpha channel bar will be displayed no matter what. - * - * If false, it will be always hidden and alpha channel will be disabled also programmatically, meaning that - * the selected or typed color will be always opaque. - * - * If null, the alpha channel will be automatically disabled/enabled depending if the initial color format supports - * alpha or not. - * - * @type {boolean} - * @default true - */ - useAlpha: true, - /** - * Colorpicker widget template - * @type {String} - * @example - * - *
- *
- *
- *
- *
- * - *
- *
- */ - template: '
\n
\n
\n
\n
\n \n
\n
', - /** - * - * Associative object with the extension class name and its config. - * Colorpicker comes with many bundled extensions: debugger, palette, preview and swatches (a superset of palette). - * - * @type {Object[]} - * @example - * extensions: [ - * { - * name: 'swatches' - * options: { - * colors: { - * 'primary': '#337ab7', - * 'success': '#5cb85c', - * 'info': '#5bc0de', - * 'warning': '#f0ad4e', - * 'danger': '#d9534f' - * }, - * namesAsValues: true - * } - * } - * ] - */ - extensions: [{ - name: 'preview', - options: { - showText: true - } - }], - /** - * Vertical sliders configuration - * @type {Object} - */ - sliders: { - saturation: { - selector: '.colorpicker-saturation', - maxLeft: sliderSize, - maxTop: sliderSize, - callLeft: 'setSaturationRatio', - callTop: 'setValueRatio' - }, - hue: { - selector: '.colorpicker-hue', - maxLeft: 0, - maxTop: sliderSize, - callLeft: false, - callTop: 'setHueRatio' - }, - alpha: { - selector: '.colorpicker-alpha', - childSelector: '.colorpicker-alpha-color', - maxLeft: 0, - maxTop: sliderSize, - callLeft: false, - callTop: 'setAlphaRatio' - } - }, - /** - * Horizontal sliders configuration - * @type {Object} - */ - slidersHorz: { - saturation: { - selector: '.colorpicker-saturation', - maxLeft: sliderSize, - maxTop: sliderSize, - callLeft: 'setSaturationRatio', - callTop: 'setValueRatio' - }, - hue: { - selector: '.colorpicker-hue', - maxLeft: sliderSize, - maxTop: 0, - callLeft: 'setHueRatio', - callTop: false - }, - alpha: { - selector: '.colorpicker-alpha', - childSelector: '.colorpicker-alpha-color', - maxLeft: sliderSize, - maxTop: 0, - callLeft: 'setAlphaRatio', - callTop: false - } - } -}; -module.exports = exports.default; - -/***/ }), -/* 4 */ -/***/ (function(module, exports, __webpack_require__) { - -"use strict"; - - -Object.defineProperty(exports, "__esModule", { - value: true -}); - -var _typeof = typeof Symbol === "function" && typeof Symbol.iterator === "symbol" ? function (obj) { return typeof obj; } : function (obj) { return obj && typeof Symbol === "function" && obj.constructor === Symbol && obj !== Symbol.prototype ? "symbol" : typeof obj; }; - -var _createClass = function () { function defineProperties(target, props) { for (var i = 0; i < props.length; i++) { var descriptor = props[i]; descriptor.enumerable = descriptor.enumerable || false; descriptor.configurable = true; if ("value" in descriptor) descriptor.writable = true; Object.defineProperty(target, descriptor.key, descriptor); } } return function (Constructor, protoProps, staticProps) { if (protoProps) defineProperties(Constructor.prototype, protoProps); if (staticProps) defineProperties(Constructor, staticProps); return Constructor; }; }(); - -var _Extension2 = __webpack_require__(1); - -var _Extension3 = _interopRequireDefault(_Extension2); - -var _jquery = __webpack_require__(0); - -var _jquery2 = _interopRequireDefault(_jquery); - -function _interopRequireDefault(obj) { return obj && obj.__esModule ? obj : { default: obj }; } - -function _classCallCheck(instance, Constructor) { if (!(instance instanceof Constructor)) { throw new TypeError("Cannot call a class as a function"); } } - -function _possibleConstructorReturn(self, call) { if (!self) { throw new ReferenceError("this hasn't been initialised - super() hasn't been called"); } return call && (typeof call === "object" || typeof call === "function") ? call : self; } - -function _inherits(subClass, superClass) { if (typeof superClass !== "function" && superClass !== null) { throw new TypeError("Super expression must either be null or a function, not " + typeof superClass); } subClass.prototype = Object.create(superClass && superClass.prototype, { constructor: { value: subClass, enumerable: false, writable: true, configurable: true } }); if (superClass) Object.setPrototypeOf ? Object.setPrototypeOf(subClass, superClass) : subClass.__proto__ = superClass; } - -var defaults = { - /** - * Key-value pairs defining a color alias and its CSS color representation. - * - * They can also be just an array of values. In that case, no special names are used, only the real colors. - * - * @type {Object|Array} - * @default null - * @example - * { - * 'black': '#000000', - * 'white': '#ffffff', - * 'red': '#FF0000', - * 'default': '#777777', - * 'primary': '#337ab7', - * 'success': '#5cb85c', - * 'info': '#5bc0de', - * 'warning': '#f0ad4e', - * 'danger': '#d9534f' - * } - * - * @example ['#f0ad4e', '#337ab7', '#5cb85c'] - */ - colors: null, - /** - * If true, when a color swatch is selected the name (alias) will be used as input value, - * otherwise the swatch real color value will be used. - * - * @type {boolean} - * @default true - */ - namesAsValues: true -}; - -/** - * Palette extension - * @ignore - */ - -var Palette = function (_Extension) { - _inherits(Palette, _Extension); - - _createClass(Palette, [{ - key: 'colors', - - - /** - * @returns {Object|Array} - */ - get: function get() { - return this.options.colors; - } - }]); - - function Palette(colorpicker) { - var options = arguments.length > 1 && arguments[1] !== undefined ? arguments[1] : {}; - - _classCallCheck(this, Palette); - - var _this = _possibleConstructorReturn(this, (Palette.__proto__ || Object.getPrototypeOf(Palette)).call(this, colorpicker, _jquery2.default.extend(true, {}, defaults, options))); - - if (!Array.isArray(_this.options.colors) && _typeof(_this.options.colors) !== 'object') { - _this.options.colors = null; - } - return _this; - } - - /** - * @returns {int} - */ - - - _createClass(Palette, [{ - key: 'getLength', - value: function getLength() { - if (!this.options.colors) { - return 0; - } - - if (Array.isArray(this.options.colors)) { - return this.options.colors.length; - } - - if (_typeof(this.options.colors) === 'object') { - return Object.keys(this.options.colors).length; - } - - return 0; - } - }, { - key: 'resolveColor', - value: function resolveColor(color) { - var realColor = arguments.length > 1 && arguments[1] !== undefined ? arguments[1] : true; - - if (this.getLength() <= 0) { - return false; - } - - // Array of colors - if (Array.isArray(this.options.colors)) { - if (this.options.colors.indexOf(color) >= 0) { - return color; - } - if (this.options.colors.indexOf(color.toUpperCase()) >= 0) { - return color.toUpperCase(); - } - if (this.options.colors.indexOf(color.toLowerCase()) >= 0) { - return color.toLowerCase(); - } - return false; - } - - if (_typeof(this.options.colors) !== 'object') { - return false; - } - - // Map of objects - if (!this.options.namesAsValues || realColor) { - return this.getValue(color, false); - } - return this.getName(color, this.getName('#' + color)); - } - - /** - * Given a color value, returns the corresponding color name or defaultValue. - * - * @param {String} value - * @param {*} defaultValue - * @returns {*} - */ - - }, { - key: 'getName', - value: function getName(value) { - var defaultValue = arguments.length > 1 && arguments[1] !== undefined ? arguments[1] : false; - - if (!(typeof value === 'string') || !this.options.colors) { - return defaultValue; - } - for (var name in this.options.colors) { - if (!this.options.colors.hasOwnProperty(name)) { - continue; - } - if (this.options.colors[name].toLowerCase() === value.toLowerCase()) { - return name; - } - } - return defaultValue; - } - - /** - * Given a color name, returns the corresponding color value or defaultValue. - * - * @param {String} name - * @param {*} defaultValue - * @returns {*} - */ - - }, { - key: 'getValue', - value: function getValue(name) { - var defaultValue = arguments.length > 1 && arguments[1] !== undefined ? arguments[1] : false; - - if (!(typeof name === 'string') || !this.options.colors) { - return defaultValue; - } - if (this.options.colors.hasOwnProperty(name)) { - return this.options.colors[name]; - } - return defaultValue; - } - }]); - - return Palette; -}(_Extension3.default); - -exports.default = Palette; -module.exports = exports.default; - -/***/ }), -/* 5 */ -/***/ (function(module, exports, __webpack_require__) { - -"use strict"; - - -module.exports = { - "aliceblue": [240, 248, 255], - "antiquewhite": [250, 235, 215], - "aqua": [0, 255, 255], - "aquamarine": [127, 255, 212], - "azure": [240, 255, 255], - "beige": [245, 245, 220], - "bisque": [255, 228, 196], - "black": [0, 0, 0], - "blanchedalmond": [255, 235, 205], - "blue": [0, 0, 255], - "blueviolet": [138, 43, 226], - "brown": [165, 42, 42], - "burlywood": [222, 184, 135], - "cadetblue": [95, 158, 160], - "chartreuse": [127, 255, 0], - "chocolate": [210, 105, 30], - "coral": [255, 127, 80], - "cornflowerblue": [100, 149, 237], - "cornsilk": [255, 248, 220], - "crimson": [220, 20, 60], - "cyan": [0, 255, 255], - "darkblue": [0, 0, 139], - "darkcyan": [0, 139, 139], - "darkgoldenrod": [184, 134, 11], - "darkgray": [169, 169, 169], - "darkgreen": [0, 100, 0], - "darkgrey": [169, 169, 169], - "darkkhaki": [189, 183, 107], - "darkmagenta": [139, 0, 139], - "darkolivegreen": [85, 107, 47], - "darkorange": [255, 140, 0], - "darkorchid": [153, 50, 204], - "darkred": [139, 0, 0], - "darksalmon": [233, 150, 122], - "darkseagreen": [143, 188, 143], - "darkslateblue": [72, 61, 139], - "darkslategray": [47, 79, 79], - "darkslategrey": [47, 79, 79], - "darkturquoise": [0, 206, 209], - "darkviolet": [148, 0, 211], - "deeppink": [255, 20, 147], - "deepskyblue": [0, 191, 255], - "dimgray": [105, 105, 105], - "dimgrey": [105, 105, 105], - "dodgerblue": [30, 144, 255], - "firebrick": [178, 34, 34], - "floralwhite": [255, 250, 240], - "forestgreen": [34, 139, 34], - "fuchsia": [255, 0, 255], - "gainsboro": [220, 220, 220], - "ghostwhite": [248, 248, 255], - "gold": [255, 215, 0], - "goldenrod": [218, 165, 32], - "gray": [128, 128, 128], - "green": [0, 128, 0], - "greenyellow": [173, 255, 47], - "grey": [128, 128, 128], - "honeydew": [240, 255, 240], - "hotpink": [255, 105, 180], - "indianred": [205, 92, 92], - "indigo": [75, 0, 130], - "ivory": [255, 255, 240], - "khaki": [240, 230, 140], - "lavender": [230, 230, 250], - "lavenderblush": [255, 240, 245], - "lawngreen": [124, 252, 0], - "lemonchiffon": [255, 250, 205], - "lightblue": [173, 216, 230], - "lightcoral": [240, 128, 128], - "lightcyan": [224, 255, 255], - "lightgoldenrodyellow": [250, 250, 210], - "lightgray": [211, 211, 211], - "lightgreen": [144, 238, 144], - "lightgrey": [211, 211, 211], - "lightpink": [255, 182, 193], - "lightsalmon": [255, 160, 122], - "lightseagreen": [32, 178, 170], - "lightskyblue": [135, 206, 250], - "lightslategray": [119, 136, 153], - "lightslategrey": [119, 136, 153], - "lightsteelblue": [176, 196, 222], - "lightyellow": [255, 255, 224], - "lime": [0, 255, 0], - "limegreen": [50, 205, 50], - "linen": [250, 240, 230], - "magenta": [255, 0, 255], - "maroon": [128, 0, 0], - "mediumaquamarine": [102, 205, 170], - "mediumblue": [0, 0, 205], - "mediumorchid": [186, 85, 211], - "mediumpurple": [147, 112, 219], - "mediumseagreen": [60, 179, 113], - "mediumslateblue": [123, 104, 238], - "mediumspringgreen": [0, 250, 154], - "mediumturquoise": [72, 209, 204], - "mediumvioletred": [199, 21, 133], - "midnightblue": [25, 25, 112], - "mintcream": [245, 255, 250], - "mistyrose": [255, 228, 225], - "moccasin": [255, 228, 181], - "navajowhite": [255, 222, 173], - "navy": [0, 0, 128], - "oldlace": [253, 245, 230], - "olive": [128, 128, 0], - "olivedrab": [107, 142, 35], - "orange": [255, 165, 0], - "orangered": [255, 69, 0], - "orchid": [218, 112, 214], - "palegoldenrod": [238, 232, 170], - "palegreen": [152, 251, 152], - "paleturquoise": [175, 238, 238], - "palevioletred": [219, 112, 147], - "papayawhip": [255, 239, 213], - "peachpuff": [255, 218, 185], - "peru": [205, 133, 63], - "pink": [255, 192, 203], - "plum": [221, 160, 221], - "powderblue": [176, 224, 230], - "purple": [128, 0, 128], - "rebeccapurple": [102, 51, 153], - "red": [255, 0, 0], - "rosybrown": [188, 143, 143], - "royalblue": [65, 105, 225], - "saddlebrown": [139, 69, 19], - "salmon": [250, 128, 114], - "sandybrown": [244, 164, 96], - "seagreen": [46, 139, 87], - "seashell": [255, 245, 238], - "sienna": [160, 82, 45], - "silver": [192, 192, 192], - "skyblue": [135, 206, 235], - "slateblue": [106, 90, 205], - "slategray": [112, 128, 144], - "slategrey": [112, 128, 144], - "snow": [255, 250, 250], - "springgreen": [0, 255, 127], - "steelblue": [70, 130, 180], - "tan": [210, 180, 140], - "teal": [0, 128, 128], - "thistle": [216, 191, 216], - "tomato": [255, 99, 71], - "turquoise": [64, 224, 208], - "violet": [238, 130, 238], - "wheat": [245, 222, 179], - "white": [255, 255, 255], - "whitesmoke": [245, 245, 245], - "yellow": [255, 255, 0], - "yellowgreen": [154, 205, 50] -}; - - -/***/ }), -/* 6 */ -/***/ (function(module, exports, __webpack_require__) { - -/* MIT license */ -var cssKeywords = __webpack_require__(5); - -// NOTE: conversions should only return primitive values (i.e. arrays, or -// values that give correct `typeof` results). -// do not use box values types (i.e. Number(), String(), etc.) - -var reverseKeywords = {}; -for (var key in cssKeywords) { - if (cssKeywords.hasOwnProperty(key)) { - reverseKeywords[cssKeywords[key]] = key; - } -} - -var convert = module.exports = { - rgb: {channels: 3, labels: 'rgb'}, - hsl: {channels: 3, labels: 'hsl'}, - hsv: {channels: 3, labels: 'hsv'}, - hwb: {channels: 3, labels: 'hwb'}, - cmyk: {channels: 4, labels: 'cmyk'}, - xyz: {channels: 3, labels: 'xyz'}, - lab: {channels: 3, labels: 'lab'}, - lch: {channels: 3, labels: 'lch'}, - hex: {channels: 1, labels: ['hex']}, - keyword: {channels: 1, labels: ['keyword']}, - ansi16: {channels: 1, labels: ['ansi16']}, - ansi256: {channels: 1, labels: ['ansi256']}, - hcg: {channels: 3, labels: ['h', 'c', 'g']}, - apple: {channels: 3, labels: ['r16', 'g16', 'b16']}, - gray: {channels: 1, labels: ['gray']} -}; - -// hide .channels and .labels properties -for (var model in convert) { - if (convert.hasOwnProperty(model)) { - if (!('channels' in convert[model])) { - throw new Error('missing channels property: ' + model); - } - - if (!('labels' in convert[model])) { - throw new Error('missing channel labels property: ' + model); - } - - if (convert[model].labels.length !== convert[model].channels) { - throw new Error('channel and label counts mismatch: ' + model); - } - - var channels = convert[model].channels; - var labels = convert[model].labels; - delete convert[model].channels; - delete convert[model].labels; - Object.defineProperty(convert[model], 'channels', {value: channels}); - Object.defineProperty(convert[model], 'labels', {value: labels}); - } -} - -convert.rgb.hsl = function (rgb) { - var r = rgb[0] / 255; - var g = rgb[1] / 255; - var b = rgb[2] / 255; - var min = Math.min(r, g, b); - var max = Math.max(r, g, b); - var delta = max - min; - var h; - var s; - var l; - - if (max === min) { - h = 0; - } else if (r === max) { - h = (g - b) / delta; - } else if (g === max) { - h = 2 + (b - r) / delta; - } else if (b === max) { - h = 4 + (r - g) / delta; - } - - h = Math.min(h * 60, 360); - - if (h < 0) { - h += 360; - } - - l = (min + max) / 2; - - if (max === min) { - s = 0; - } else if (l <= 0.5) { - s = delta / (max + min); - } else { - s = delta / (2 - max - min); - } - - return [h, s * 100, l * 100]; -}; - -convert.rgb.hsv = function (rgb) { - var rdif; - var gdif; - var bdif; - var h; - var s; - - var r = rgb[0] / 255; - var g = rgb[1] / 255; - var b = rgb[2] / 255; - var v = Math.max(r, g, b); - var diff = v - Math.min(r, g, b); - var diffc = function (c) { - return (v - c) / 6 / diff + 1 / 2; - }; - - if (diff === 0) { - h = s = 0; - } else { - s = diff / v; - rdif = diffc(r); - gdif = diffc(g); - bdif = diffc(b); - - if (r === v) { - h = bdif - gdif; - } else if (g === v) { - h = (1 / 3) + rdif - bdif; - } else if (b === v) { - h = (2 / 3) + gdif - rdif; - } - if (h < 0) { - h += 1; - } else if (h > 1) { - h -= 1; - } - } - - return [ - h * 360, - s * 100, - v * 100 - ]; -}; - -convert.rgb.hwb = function (rgb) { - var r = rgb[0]; - var g = rgb[1]; - var b = rgb[2]; - var h = convert.rgb.hsl(rgb)[0]; - var w = 1 / 255 * Math.min(r, Math.min(g, b)); - - b = 1 - 1 / 255 * Math.max(r, Math.max(g, b)); - - return [h, w * 100, b * 100]; -}; - -convert.rgb.cmyk = function (rgb) { - var r = rgb[0] / 255; - var g = rgb[1] / 255; - var b = rgb[2] / 255; - var c; - var m; - var y; - var k; - - k = Math.min(1 - r, 1 - g, 1 - b); - c = (1 - r - k) / (1 - k) || 0; - m = (1 - g - k) / (1 - k) || 0; - y = (1 - b - k) / (1 - k) || 0; - - return [c * 100, m * 100, y * 100, k * 100]; -}; - -/** - * See https://en.m.wikipedia.org/wiki/Euclidean_distance#Squared_Euclidean_distance - * */ -function comparativeDistance(x, y) { - return ( - Math.pow(x[0] - y[0], 2) + - Math.pow(x[1] - y[1], 2) + - Math.pow(x[2] - y[2], 2) - ); -} - -convert.rgb.keyword = function (rgb) { - var reversed = reverseKeywords[rgb]; - if (reversed) { - return reversed; - } - - var currentClosestDistance = Infinity; - var currentClosestKeyword; - - for (var keyword in cssKeywords) { - if (cssKeywords.hasOwnProperty(keyword)) { - var value = cssKeywords[keyword]; - - // Compute comparative distance - var distance = comparativeDistance(rgb, value); - - // Check if its less, if so set as closest - if (distance < currentClosestDistance) { - currentClosestDistance = distance; - currentClosestKeyword = keyword; - } - } - } - - return currentClosestKeyword; -}; - -convert.keyword.rgb = function (keyword) { - return cssKeywords[keyword]; -}; - -convert.rgb.xyz = function (rgb) { - var r = rgb[0] / 255; - var g = rgb[1] / 255; - var b = rgb[2] / 255; - - // assume sRGB - r = r > 0.04045 ? Math.pow(((r + 0.055) / 1.055), 2.4) : (r / 12.92); - g = g > 0.04045 ? Math.pow(((g + 0.055) / 1.055), 2.4) : (g / 12.92); - b = b > 0.04045 ? Math.pow(((b + 0.055) / 1.055), 2.4) : (b / 12.92); - - var x = (r * 0.4124) + (g * 0.3576) + (b * 0.1805); - var y = (r * 0.2126) + (g * 0.7152) + (b * 0.0722); - var z = (r * 0.0193) + (g * 0.1192) + (b * 0.9505); - - return [x * 100, y * 100, z * 100]; -}; - -convert.rgb.lab = function (rgb) { - var xyz = convert.rgb.xyz(rgb); - var x = xyz[0]; - var y = xyz[1]; - var z = xyz[2]; - var l; - var a; - var b; - - x /= 95.047; - y /= 100; - z /= 108.883; - - x = x > 0.008856 ? Math.pow(x, 1 / 3) : (7.787 * x) + (16 / 116); - y = y > 0.008856 ? Math.pow(y, 1 / 3) : (7.787 * y) + (16 / 116); - z = z > 0.008856 ? Math.pow(z, 1 / 3) : (7.787 * z) + (16 / 116); - - l = (116 * y) - 16; - a = 500 * (x - y); - b = 200 * (y - z); - - return [l, a, b]; -}; - -convert.hsl.rgb = function (hsl) { - var h = hsl[0] / 360; - var s = hsl[1] / 100; - var l = hsl[2] / 100; - var t1; - var t2; - var t3; - var rgb; - var val; - - if (s === 0) { - val = l * 255; - return [val, val, val]; - } - - if (l < 0.5) { - t2 = l * (1 + s); - } else { - t2 = l + s - l * s; - } - - t1 = 2 * l - t2; - - rgb = [0, 0, 0]; - for (var i = 0; i < 3; i++) { - t3 = h + 1 / 3 * -(i - 1); - if (t3 < 0) { - t3++; - } - if (t3 > 1) { - t3--; - } - - if (6 * t3 < 1) { - val = t1 + (t2 - t1) * 6 * t3; - } else if (2 * t3 < 1) { - val = t2; - } else if (3 * t3 < 2) { - val = t1 + (t2 - t1) * (2 / 3 - t3) * 6; - } else { - val = t1; - } - - rgb[i] = val * 255; - } - - return rgb; -}; - -convert.hsl.hsv = function (hsl) { - var h = hsl[0]; - var s = hsl[1] / 100; - var l = hsl[2] / 100; - var smin = s; - var lmin = Math.max(l, 0.01); - var sv; - var v; - - l *= 2; - s *= (l <= 1) ? l : 2 - l; - smin *= lmin <= 1 ? lmin : 2 - lmin; - v = (l + s) / 2; - sv = l === 0 ? (2 * smin) / (lmin + smin) : (2 * s) / (l + s); - - return [h, sv * 100, v * 100]; -}; - -convert.hsv.rgb = function (hsv) { - var h = hsv[0] / 60; - var s = hsv[1] / 100; - var v = hsv[2] / 100; - var hi = Math.floor(h) % 6; - - var f = h - Math.floor(h); - var p = 255 * v * (1 - s); - var q = 255 * v * (1 - (s * f)); - var t = 255 * v * (1 - (s * (1 - f))); - v *= 255; - - switch (hi) { - case 0: - return [v, t, p]; - case 1: - return [q, v, p]; - case 2: - return [p, v, t]; - case 3: - return [p, q, v]; - case 4: - return [t, p, v]; - case 5: - return [v, p, q]; - } -}; - -convert.hsv.hsl = function (hsv) { - var h = hsv[0]; - var s = hsv[1] / 100; - var v = hsv[2] / 100; - var vmin = Math.max(v, 0.01); - var lmin; - var sl; - var l; - - l = (2 - s) * v; - lmin = (2 - s) * vmin; - sl = s * vmin; - sl /= (lmin <= 1) ? lmin : 2 - lmin; - sl = sl || 0; - l /= 2; - - return [h, sl * 100, l * 100]; -}; - -// http://dev.w3.org/csswg/css-color/#hwb-to-rgb -convert.hwb.rgb = function (hwb) { - var h = hwb[0] / 360; - var wh = hwb[1] / 100; - var bl = hwb[2] / 100; - var ratio = wh + bl; - var i; - var v; - var f; - var n; - - // wh + bl cant be > 1 - if (ratio > 1) { - wh /= ratio; - bl /= ratio; - } - - i = Math.floor(6 * h); - v = 1 - bl; - f = 6 * h - i; - - if ((i & 0x01) !== 0) { - f = 1 - f; - } - - n = wh + f * (v - wh); // linear interpolation - - var r; - var g; - var b; - switch (i) { - default: - case 6: - case 0: r = v; g = n; b = wh; break; - case 1: r = n; g = v; b = wh; break; - case 2: r = wh; g = v; b = n; break; - case 3: r = wh; g = n; b = v; break; - case 4: r = n; g = wh; b = v; break; - case 5: r = v; g = wh; b = n; break; - } - - return [r * 255, g * 255, b * 255]; -}; - -convert.cmyk.rgb = function (cmyk) { - var c = cmyk[0] / 100; - var m = cmyk[1] / 100; - var y = cmyk[2] / 100; - var k = cmyk[3] / 100; - var r; - var g; - var b; - - r = 1 - Math.min(1, c * (1 - k) + k); - g = 1 - Math.min(1, m * (1 - k) + k); - b = 1 - Math.min(1, y * (1 - k) + k); - - return [r * 255, g * 255, b * 255]; -}; - -convert.xyz.rgb = function (xyz) { - var x = xyz[0] / 100; - var y = xyz[1] / 100; - var z = xyz[2] / 100; - var r; - var g; - var b; - - r = (x * 3.2406) + (y * -1.5372) + (z * -0.4986); - g = (x * -0.9689) + (y * 1.8758) + (z * 0.0415); - b = (x * 0.0557) + (y * -0.2040) + (z * 1.0570); - - // assume sRGB - r = r > 0.0031308 - ? ((1.055 * Math.pow(r, 1.0 / 2.4)) - 0.055) - : r * 12.92; - - g = g > 0.0031308 - ? ((1.055 * Math.pow(g, 1.0 / 2.4)) - 0.055) - : g * 12.92; - - b = b > 0.0031308 - ? ((1.055 * Math.pow(b, 1.0 / 2.4)) - 0.055) - : b * 12.92; - - r = Math.min(Math.max(0, r), 1); - g = Math.min(Math.max(0, g), 1); - b = Math.min(Math.max(0, b), 1); - - return [r * 255, g * 255, b * 255]; -}; - -convert.xyz.lab = function (xyz) { - var x = xyz[0]; - var y = xyz[1]; - var z = xyz[2]; - var l; - var a; - var b; - - x /= 95.047; - y /= 100; - z /= 108.883; - - x = x > 0.008856 ? Math.pow(x, 1 / 3) : (7.787 * x) + (16 / 116); - y = y > 0.008856 ? Math.pow(y, 1 / 3) : (7.787 * y) + (16 / 116); - z = z > 0.008856 ? Math.pow(z, 1 / 3) : (7.787 * z) + (16 / 116); - - l = (116 * y) - 16; - a = 500 * (x - y); - b = 200 * (y - z); - - return [l, a, b]; -}; - -convert.lab.xyz = function (lab) { - var l = lab[0]; - var a = lab[1]; - var b = lab[2]; - var x; - var y; - var z; - - y = (l + 16) / 116; - x = a / 500 + y; - z = y - b / 200; - - var y2 = Math.pow(y, 3); - var x2 = Math.pow(x, 3); - var z2 = Math.pow(z, 3); - y = y2 > 0.008856 ? y2 : (y - 16 / 116) / 7.787; - x = x2 > 0.008856 ? x2 : (x - 16 / 116) / 7.787; - z = z2 > 0.008856 ? z2 : (z - 16 / 116) / 7.787; - - x *= 95.047; - y *= 100; - z *= 108.883; - - return [x, y, z]; -}; - -convert.lab.lch = function (lab) { - var l = lab[0]; - var a = lab[1]; - var b = lab[2]; - var hr; - var h; - var c; - - hr = Math.atan2(b, a); - h = hr * 360 / 2 / Math.PI; - - if (h < 0) { - h += 360; - } - - c = Math.sqrt(a * a + b * b); - - return [l, c, h]; -}; - -convert.lch.lab = function (lch) { - var l = lch[0]; - var c = lch[1]; - var h = lch[2]; - var a; - var b; - var hr; - - hr = h / 360 * 2 * Math.PI; - a = c * Math.cos(hr); - b = c * Math.sin(hr); - - return [l, a, b]; -}; - -convert.rgb.ansi16 = function (args) { - var r = args[0]; - var g = args[1]; - var b = args[2]; - var value = 1 in arguments ? arguments[1] : convert.rgb.hsv(args)[2]; // hsv -> ansi16 optimization - - value = Math.round(value / 50); - - if (value === 0) { - return 30; - } - - var ansi = 30 - + ((Math.round(b / 255) << 2) - | (Math.round(g / 255) << 1) - | Math.round(r / 255)); - - if (value === 2) { - ansi += 60; - } - - return ansi; -}; - -convert.hsv.ansi16 = function (args) { - // optimization here; we already know the value and don't need to get - // it converted for us. - return convert.rgb.ansi16(convert.hsv.rgb(args), args[2]); -}; - -convert.rgb.ansi256 = function (args) { - var r = args[0]; - var g = args[1]; - var b = args[2]; - - // we use the extended greyscale palette here, with the exception of - // black and white. normal palette only has 4 greyscale shades. - if (r === g && g === b) { - if (r < 8) { - return 16; - } - - if (r > 248) { - return 231; - } - - return Math.round(((r - 8) / 247) * 24) + 232; - } - - var ansi = 16 - + (36 * Math.round(r / 255 * 5)) - + (6 * Math.round(g / 255 * 5)) - + Math.round(b / 255 * 5); - - return ansi; -}; - -convert.ansi16.rgb = function (args) { - var color = args % 10; - - // handle greyscale - if (color === 0 || color === 7) { - if (args > 50) { - color += 3.5; - } - - color = color / 10.5 * 255; - - return [color, color, color]; - } - - var mult = (~~(args > 50) + 1) * 0.5; - var r = ((color & 1) * mult) * 255; - var g = (((color >> 1) & 1) * mult) * 255; - var b = (((color >> 2) & 1) * mult) * 255; - - return [r, g, b]; -}; - -convert.ansi256.rgb = function (args) { - // handle greyscale - if (args >= 232) { - var c = (args - 232) * 10 + 8; - return [c, c, c]; - } - - args -= 16; - - var rem; - var r = Math.floor(args / 36) / 5 * 255; - var g = Math.floor((rem = args % 36) / 6) / 5 * 255; - var b = (rem % 6) / 5 * 255; - - return [r, g, b]; -}; - -convert.rgb.hex = function (args) { - var integer = ((Math.round(args[0]) & 0xFF) << 16) - + ((Math.round(args[1]) & 0xFF) << 8) - + (Math.round(args[2]) & 0xFF); - - var string = integer.toString(16).toUpperCase(); - return '000000'.substring(string.length) + string; -}; - -convert.hex.rgb = function (args) { - var match = args.toString(16).match(/[a-f0-9]{6}|[a-f0-9]{3}/i); - if (!match) { - return [0, 0, 0]; - } - - var colorString = match[0]; - - if (match[0].length === 3) { - colorString = colorString.split('').map(function (char) { - return char + char; - }).join(''); - } - - var integer = parseInt(colorString, 16); - var r = (integer >> 16) & 0xFF; - var g = (integer >> 8) & 0xFF; - var b = integer & 0xFF; - - return [r, g, b]; -}; - -convert.rgb.hcg = function (rgb) { - var r = rgb[0] / 255; - var g = rgb[1] / 255; - var b = rgb[2] / 255; - var max = Math.max(Math.max(r, g), b); - var min = Math.min(Math.min(r, g), b); - var chroma = (max - min); - var grayscale; - var hue; - - if (chroma < 1) { - grayscale = min / (1 - chroma); - } else { - grayscale = 0; - } - - if (chroma <= 0) { - hue = 0; - } else - if (max === r) { - hue = ((g - b) / chroma) % 6; - } else - if (max === g) { - hue = 2 + (b - r) / chroma; - } else { - hue = 4 + (r - g) / chroma + 4; - } - - hue /= 6; - hue %= 1; - - return [hue * 360, chroma * 100, grayscale * 100]; -}; - -convert.hsl.hcg = function (hsl) { - var s = hsl[1] / 100; - var l = hsl[2] / 100; - var c = 1; - var f = 0; - - if (l < 0.5) { - c = 2.0 * s * l; - } else { - c = 2.0 * s * (1.0 - l); - } - - if (c < 1.0) { - f = (l - 0.5 * c) / (1.0 - c); - } - - return [hsl[0], c * 100, f * 100]; -}; - -convert.hsv.hcg = function (hsv) { - var s = hsv[1] / 100; - var v = hsv[2] / 100; - - var c = s * v; - var f = 0; - - if (c < 1.0) { - f = (v - c) / (1 - c); - } - - return [hsv[0], c * 100, f * 100]; -}; - -convert.hcg.rgb = function (hcg) { - var h = hcg[0] / 360; - var c = hcg[1] / 100; - var g = hcg[2] / 100; - - if (c === 0.0) { - return [g * 255, g * 255, g * 255]; - } - - var pure = [0, 0, 0]; - var hi = (h % 1) * 6; - var v = hi % 1; - var w = 1 - v; - var mg = 0; - - switch (Math.floor(hi)) { - case 0: - pure[0] = 1; pure[1] = v; pure[2] = 0; break; - case 1: - pure[0] = w; pure[1] = 1; pure[2] = 0; break; - case 2: - pure[0] = 0; pure[1] = 1; pure[2] = v; break; - case 3: - pure[0] = 0; pure[1] = w; pure[2] = 1; break; - case 4: - pure[0] = v; pure[1] = 0; pure[2] = 1; break; - default: - pure[0] = 1; pure[1] = 0; pure[2] = w; - } - - mg = (1.0 - c) * g; - - return [ - (c * pure[0] + mg) * 255, - (c * pure[1] + mg) * 255, - (c * pure[2] + mg) * 255 - ]; -}; - -convert.hcg.hsv = function (hcg) { - var c = hcg[1] / 100; - var g = hcg[2] / 100; - - var v = c + g * (1.0 - c); - var f = 0; - - if (v > 0.0) { - f = c / v; - } - - return [hcg[0], f * 100, v * 100]; -}; - -convert.hcg.hsl = function (hcg) { - var c = hcg[1] / 100; - var g = hcg[2] / 100; - - var l = g * (1.0 - c) + 0.5 * c; - var s = 0; - - if (l > 0.0 && l < 0.5) { - s = c / (2 * l); - } else - if (l >= 0.5 && l < 1.0) { - s = c / (2 * (1 - l)); - } - - return [hcg[0], s * 100, l * 100]; -}; - -convert.hcg.hwb = function (hcg) { - var c = hcg[1] / 100; - var g = hcg[2] / 100; - var v = c + g * (1.0 - c); - return [hcg[0], (v - c) * 100, (1 - v) * 100]; -}; - -convert.hwb.hcg = function (hwb) { - var w = hwb[1] / 100; - var b = hwb[2] / 100; - var v = 1 - b; - var c = v - w; - var g = 0; - - if (c < 1) { - g = (v - c) / (1 - c); - } - - return [hwb[0], c * 100, g * 100]; -}; - -convert.apple.rgb = function (apple) { - return [(apple[0] / 65535) * 255, (apple[1] / 65535) * 255, (apple[2] / 65535) * 255]; -}; - -convert.rgb.apple = function (rgb) { - return [(rgb[0] / 255) * 65535, (rgb[1] / 255) * 65535, (rgb[2] / 255) * 65535]; -}; - -convert.gray.rgb = function (args) { - return [args[0] / 100 * 255, args[0] / 100 * 255, args[0] / 100 * 255]; -}; - -convert.gray.hsl = convert.gray.hsv = function (args) { - return [0, 0, args[0]]; -}; - -convert.gray.hwb = function (gray) { - return [0, 100, gray[0]]; -}; - -convert.gray.cmyk = function (gray) { - return [0, 0, 0, gray[0]]; -}; - -convert.gray.lab = function (gray) { - return [gray[0], 0, 0]; -}; - -convert.gray.hex = function (gray) { - var val = Math.round(gray[0] / 100 * 255) & 0xFF; - var integer = (val << 16) + (val << 8) + val; - - var string = integer.toString(16).toUpperCase(); - return '000000'.substring(string.length) + string; -}; - -convert.rgb.gray = function (rgb) { - var val = (rgb[0] + rgb[1] + rgb[2]) / 3; - return [val / 255 * 100]; -}; - - -/***/ }), -/* 7 */ -/***/ (function(module, exports, __webpack_require__) { - -"use strict"; - - -var _typeof = typeof Symbol === "function" && typeof Symbol.iterator === "symbol" ? function (obj) { return typeof obj; } : function (obj) { return obj && typeof Symbol === "function" && obj.constructor === Symbol && obj !== Symbol.prototype ? "symbol" : typeof obj; }; - -var _Colorpicker = __webpack_require__(8); - -var _Colorpicker2 = _interopRequireDefault(_Colorpicker); - -var _jquery = __webpack_require__(0); - -var _jquery2 = _interopRequireDefault(_jquery); - -function _interopRequireDefault(obj) { return obj && obj.__esModule ? obj : { default: obj }; } - -var plugin = 'colorpicker'; - -_jquery2.default[plugin] = _Colorpicker2.default; - -// Colorpicker jQuery Plugin API -_jquery2.default.fn[plugin] = function (option) { - var fnArgs = Array.prototype.slice.call(arguments, 1), - isSingleElement = this.length === 1, - returnValue = null; - - var $elements = this.each(function () { - var $this = (0, _jquery2.default)(this), - inst = $this.data(plugin), - options = (typeof option === 'undefined' ? 'undefined' : _typeof(option)) === 'object' ? option : {}; - - // Create instance if does not exist - if (!inst) { - inst = new _Colorpicker2.default(this, options); - $this.data(plugin, inst); - } - - if (!isSingleElement) { - return; - } - - returnValue = $this; - - if (typeof option === 'string') { - if (option === 'colorpicker') { - // Return colorpicker instance: e.g. .colorpicker('colorpicker') - returnValue = inst; - } else if (_jquery2.default.isFunction(inst[option])) { - // Return method call return value: e.g. .colorpicker('isEnabled') - returnValue = inst[option].apply(inst, fnArgs); - } else { - // Return property value: e.g. .colorpicker('element') - returnValue = inst[option]; - } - } - }); - - return isSingleElement ? returnValue : $elements; -}; - -_jquery2.default.fn[plugin].constructor = _Colorpicker2.default; - -/***/ }), -/* 8 */ -/***/ (function(module, exports, __webpack_require__) { - -"use strict"; - - -Object.defineProperty(exports, "__esModule", { - value: true -}); - -var _createClass = function () { function defineProperties(target, props) { for (var i = 0; i < props.length; i++) { var descriptor = props[i]; descriptor.enumerable = descriptor.enumerable || false; descriptor.configurable = true; if ("value" in descriptor) descriptor.writable = true; Object.defineProperty(target, descriptor.key, descriptor); } } return function (Constructor, protoProps, staticProps) { if (protoProps) defineProperties(Constructor.prototype, protoProps); if (staticProps) defineProperties(Constructor, staticProps); return Constructor; }; }(); - -var _Extension = __webpack_require__(1); - -var _Extension2 = _interopRequireDefault(_Extension); - -var _options = __webpack_require__(3); - -var _options2 = _interopRequireDefault(_options); - -var _extensions = __webpack_require__(9); - -var _extensions2 = _interopRequireDefault(_extensions); - -var _jquery = __webpack_require__(0); - -var _jquery2 = _interopRequireDefault(_jquery); - -var _SliderHandler = __webpack_require__(13); - -var _SliderHandler2 = _interopRequireDefault(_SliderHandler); - -var _PopupHandler = __webpack_require__(14); - -var _PopupHandler2 = _interopRequireDefault(_PopupHandler); - -var _InputHandler = __webpack_require__(15); - -var _InputHandler2 = _interopRequireDefault(_InputHandler); - -var _ColorHandler = __webpack_require__(22); - -var _ColorHandler2 = _interopRequireDefault(_ColorHandler); - -var _PickerHandler = __webpack_require__(23); - -var _PickerHandler2 = _interopRequireDefault(_PickerHandler); - -var _AddonHandler = __webpack_require__(24); - -var _AddonHandler2 = _interopRequireDefault(_AddonHandler); - -var _ColorItem = __webpack_require__(2); - -var _ColorItem2 = _interopRequireDefault(_ColorItem); - -function _interopRequireDefault(obj) { return obj && obj.__esModule ? obj : { default: obj }; } - -function _classCallCheck(instance, Constructor) { if (!(instance instanceof Constructor)) { throw new TypeError("Cannot call a class as a function"); } } - -var colorPickerIdCounter = 0; - -var root = typeof self !== 'undefined' ? self : undefined; // window - -/** - * Colorpicker widget class - */ - -var Colorpicker = function () { - _createClass(Colorpicker, [{ - key: 'color', - - - /** - * Internal color object - * - * @type {Color|null} - */ - get: function get() { - return this.colorHandler.color; - } - - /** - * Internal color format - * - * @type {String|null} - */ - - }, { - key: 'format', - get: function get() { - return this.colorHandler.format; - } - - /** - * Getter of the picker element - * - * @returns {jQuery|HTMLElement} - */ - - }, { - key: 'picker', - get: function get() { - return this.pickerHandler.picker; - } - - /** - * @fires Colorpicker#colorpickerCreate - * @param {Object|String} element - * @param {Object} options - * @constructor - */ - - }], [{ - key: 'Color', - - /** - * Color class - * - * @static - * @type {Color} - */ - get: function get() { - return _ColorItem2.default; - } - - /** - * Extension class - * - * @static - * @type {Extension} - */ - - }, { - key: 'Extension', - get: function get() { - return _Extension2.default; - } - }]); - - function Colorpicker(element, options) { - _classCallCheck(this, Colorpicker); - - colorPickerIdCounter += 1; - /** - * The colorpicker instance number - * @type {number} - */ - this.id = colorPickerIdCounter; - - /** - * Latest colorpicker event - * - * @type {{name: String, e: *}} - */ - this.lastEvent = { - alias: null, - e: null - }; - - /** - * The element that the colorpicker is bound to - * - * @type {*|jQuery} - */ - this.element = (0, _jquery2.default)(element).addClass('colorpicker-element').attr('data-colorpicker-id', this.id); - - /** - * @type {defaults} - */ - this.options = _jquery2.default.extend(true, {}, _options2.default, options, this.element.data()); - - /** - * @type {boolean} - * @private - */ - this.disabled = false; - - /** - * Extensions added to this instance - * - * @type {Extension[]} - */ - this.extensions = []; - - /** - * The element where the - * @type {*|jQuery} - */ - this.container = this.options.container === true || this.options.container !== true && this.options.inline === true ? this.element : this.options.container; - - this.container = this.container !== false ? (0, _jquery2.default)(this.container) : false; - - /** - * @type {InputHandler} - */ - this.inputHandler = new _InputHandler2.default(this); - /** - * @type {ColorHandler} - */ - this.colorHandler = new _ColorHandler2.default(this); - /** - * @type {SliderHandler} - */ - this.sliderHandler = new _SliderHandler2.default(this); - /** - * @type {PopupHandler} - */ - this.popupHandler = new _PopupHandler2.default(this, root); - /** - * @type {PickerHandler} - */ - this.pickerHandler = new _PickerHandler2.default(this); - /** - * @type {AddonHandler} - */ - this.addonHandler = new _AddonHandler2.default(this); - - this.init(); - - // Emit a create event - (0, _jquery2.default)(_jquery2.default.proxy(function () { - /** - * (Colorpicker) When the Colorpicker instance has been created and the DOM is ready. - * - * @event Colorpicker#colorpickerCreate - */ - this.trigger('colorpickerCreate'); - }, this)); - } - - /** - * Initializes the plugin - * @private - */ - - - _createClass(Colorpicker, [{ - key: 'init', - value: function init() { - // Init addon - this.addonHandler.bind(); - - // Init input - this.inputHandler.bind(); - - // Init extensions (before initializing the color) - this.initExtensions(); - - // Init color - this.colorHandler.bind(); - - // Init picker - this.pickerHandler.bind(); - - // Init sliders and popup - this.sliderHandler.bind(); - this.popupHandler.bind(); - - // Inject into the DOM (this may make it visible) - this.pickerHandler.attach(); - - // Update all components - this.update(); - - if (this.inputHandler.isDisabled()) { - this.disable(); - } - } - - /** - * Initializes the plugin extensions - * @private - */ - - }, { - key: 'initExtensions', - value: function initExtensions() { - var _this = this; - - if (!Array.isArray(this.options.extensions)) { - this.options.extensions = []; - } - - if (this.options.debug) { - this.options.extensions.push({ name: 'debugger' }); - } - - // Register and instantiate extensions - this.options.extensions.forEach(function (ext) { - _this.registerExtension(Colorpicker.extensions[ext.name.toLowerCase()], ext.options || {}); - }); - } - - /** - * Creates and registers the given extension - * - * @param {Extension} ExtensionClass The extension class to instantiate - * @param {Object} [config] Extension configuration - * @returns {Extension} - */ - - }, { - key: 'registerExtension', - value: function registerExtension(ExtensionClass) { - var config = arguments.length > 1 && arguments[1] !== undefined ? arguments[1] : {}; - - var ext = new ExtensionClass(this, config); - - this.extensions.push(ext); - return ext; - } - - /** - * Destroys the current instance - * - * @fires Colorpicker#colorpickerDestroy - */ - - }, { - key: 'destroy', - value: function destroy() { - var color = this.color; - - this.sliderHandler.unbind(); - this.inputHandler.unbind(); - this.popupHandler.unbind(); - this.colorHandler.unbind(); - this.addonHandler.unbind(); - this.pickerHandler.unbind(); - - this.element.removeClass('colorpicker-element').removeData('colorpicker', 'color').off('.colorpicker'); - - /** - * (Colorpicker) When the instance is destroyed with all events unbound. - * - * @event Colorpicker#colorpickerDestroy - */ - this.trigger('colorpickerDestroy', color); - } - - /** - * Shows the colorpicker widget if hidden. - * If the colorpicker is disabled this call will be ignored. - * - * @fires Colorpicker#colorpickerShow - * @param {Event} [e] - */ - - }, { - key: 'show', - value: function show(e) { - this.popupHandler.show(e); - } - - /** - * Hides the colorpicker widget. - * - * @fires Colorpicker#colorpickerHide - * @param {Event} [e] - */ - - }, { - key: 'hide', - value: function hide(e) { - this.popupHandler.hide(e); - } - - /** - * Toggles the colorpicker between visible and hidden. - * - * @fires Colorpicker#colorpickerShow - * @fires Colorpicker#colorpickerHide - * @param {Event} [e] - */ - - }, { - key: 'toggle', - value: function toggle(e) { - this.popupHandler.toggle(e); - } - - /** - * Returns the current color value as string - * - * @param {String|*} [defaultValue] - * @returns {String|*} - */ - - }, { - key: 'getValue', - value: function getValue() { - var defaultValue = arguments.length > 0 && arguments[0] !== undefined ? arguments[0] : null; - - var val = this.colorHandler.color; - - val = val instanceof _ColorItem2.default ? val : defaultValue; - - if (val instanceof _ColorItem2.default) { - return val.string(this.format); - } - - return val; - } - - /** - * Sets the color manually - * - * @fires Colorpicker#colorpickerChange - * @param {String|Color} val - */ - - }, { - key: 'setValue', - value: function setValue(val) { - if (this.isDisabled()) { - return; - } - var ch = this.colorHandler; - - if (ch.hasColor() && !!val && ch.color.equals(val) || !ch.hasColor() && !val) { - // same color or still empty - return; - } - - ch.color = val ? ch.createColor(val, this.options.autoInputFallback) : null; - - /** - * (Colorpicker) When the color is set programmatically with setValue(). - * - * @event Colorpicker#colorpickerChange - */ - this.trigger('colorpickerChange', ch.color, val); - - // force update if color has changed to empty - this.update(); - } - - /** - * Updates the UI and the input color according to the internal color. - * - * @fires Colorpicker#colorpickerUpdate - */ - - }, { - key: 'update', - value: function update() { - if (this.colorHandler.hasColor()) { - this.inputHandler.update(); - } else { - this.colorHandler.assureColor(); - } - - this.addonHandler.update(); - this.pickerHandler.update(); - - /** - * (Colorpicker) Fired when the widget is updated. - * - * @event Colorpicker#colorpickerUpdate - */ - this.trigger('colorpickerUpdate'); - } - - /** - * Enables the widget and the input if any - * - * @fires Colorpicker#colorpickerEnable - * @returns {boolean} - */ - - }, { - key: 'enable', - value: function enable() { - this.inputHandler.enable(); - this.disabled = false; - this.picker.removeClass('colorpicker-disabled'); - - /** - * (Colorpicker) When the widget has been enabled. - * - * @event Colorpicker#colorpickerEnable - */ - this.trigger('colorpickerEnable'); - return true; - } - - /** - * Disables the widget and the input if any - * - * @fires Colorpicker#colorpickerDisable - * @returns {boolean} - */ - - }, { - key: 'disable', - value: function disable() { - this.inputHandler.disable(); - this.disabled = true; - this.picker.addClass('colorpicker-disabled'); - - /** - * (Colorpicker) When the widget has been disabled. - * - * @event Colorpicker#colorpickerDisable - */ - this.trigger('colorpickerDisable'); - return true; - } - - /** - * Returns true if this instance is enabled - * @returns {boolean} - */ - - }, { - key: 'isEnabled', - value: function isEnabled() { - return !this.isDisabled(); - } - - /** - * Returns true if this instance is disabled - * @returns {boolean} - */ - - }, { - key: 'isDisabled', - value: function isDisabled() { - return this.disabled === true; - } - - /** - * Triggers a Colorpicker event. - * - * @param eventName - * @param color - * @param value - */ - - }, { - key: 'trigger', - value: function trigger(eventName) { - var color = arguments.length > 1 && arguments[1] !== undefined ? arguments[1] : null; - var value = arguments.length > 2 && arguments[2] !== undefined ? arguments[2] : null; - - this.element.trigger({ - type: eventName, - colorpicker: this, - color: color ? color : this.color, - value: value ? value : this.getValue() - }); - } - }]); - - return Colorpicker; -}(); - -/** - * Colorpicker extension classes, indexed by extension name - * - * @static - * @type {Object} a map between the extension name and its class - */ - - -Colorpicker.extensions = _extensions2.default; - -exports.default = Colorpicker; -module.exports = exports.default; - -/***/ }), -/* 9 */ -/***/ (function(module, exports, __webpack_require__) { - -"use strict"; - - -Object.defineProperty(exports, "__esModule", { - value: true -}); -exports.Palette = exports.Swatches = exports.Preview = exports.Debugger = undefined; - -var _Debugger = __webpack_require__(10); - -var _Debugger2 = _interopRequireDefault(_Debugger); - -var _Preview = __webpack_require__(11); - -var _Preview2 = _interopRequireDefault(_Preview); - -var _Swatches = __webpack_require__(12); - -var _Swatches2 = _interopRequireDefault(_Swatches); - -var _Palette = __webpack_require__(4); - -var _Palette2 = _interopRequireDefault(_Palette); - -function _interopRequireDefault(obj) { return obj && obj.__esModule ? obj : { default: obj }; } - -exports.Debugger = _Debugger2.default; -exports.Preview = _Preview2.default; -exports.Swatches = _Swatches2.default; -exports.Palette = _Palette2.default; -exports.default = { - 'debugger': _Debugger2.default, - 'preview': _Preview2.default, - 'swatches': _Swatches2.default, - 'palette': _Palette2.default -}; - -/***/ }), -/* 10 */ -/***/ (function(module, exports, __webpack_require__) { - -"use strict"; - - -Object.defineProperty(exports, "__esModule", { - value: true -}); - -var _createClass = function () { function defineProperties(target, props) { for (var i = 0; i < props.length; i++) { var descriptor = props[i]; descriptor.enumerable = descriptor.enumerable || false; descriptor.configurable = true; if ("value" in descriptor) descriptor.writable = true; Object.defineProperty(target, descriptor.key, descriptor); } } return function (Constructor, protoProps, staticProps) { if (protoProps) defineProperties(Constructor.prototype, protoProps); if (staticProps) defineProperties(Constructor, staticProps); return Constructor; }; }(); - -var _get = function get(object, property, receiver) { if (object === null) object = Function.prototype; var desc = Object.getOwnPropertyDescriptor(object, property); if (desc === undefined) { var parent = Object.getPrototypeOf(object); if (parent === null) { return undefined; } else { return get(parent, property, receiver); } } else if ("value" in desc) { return desc.value; } else { var getter = desc.get; if (getter === undefined) { return undefined; } return getter.call(receiver); } }; - -var _Extension2 = __webpack_require__(1); - -var _Extension3 = _interopRequireDefault(_Extension2); - -var _jquery = __webpack_require__(0); - -var _jquery2 = _interopRequireDefault(_jquery); - -function _interopRequireDefault(obj) { return obj && obj.__esModule ? obj : { default: obj }; } - -function _classCallCheck(instance, Constructor) { if (!(instance instanceof Constructor)) { throw new TypeError("Cannot call a class as a function"); } } - -function _possibleConstructorReturn(self, call) { if (!self) { throw new ReferenceError("this hasn't been initialised - super() hasn't been called"); } return call && (typeof call === "object" || typeof call === "function") ? call : self; } - -function _inherits(subClass, superClass) { if (typeof superClass !== "function" && superClass !== null) { throw new TypeError("Super expression must either be null or a function, not " + typeof superClass); } subClass.prototype = Object.create(superClass && superClass.prototype, { constructor: { value: subClass, enumerable: false, writable: true, configurable: true } }); if (superClass) Object.setPrototypeOf ? Object.setPrototypeOf(subClass, superClass) : subClass.__proto__ = superClass; } - -/** - * Debugger extension class - * @alias DebuggerExtension - * @ignore - */ -var Debugger = function (_Extension) { - _inherits(Debugger, _Extension); - - function Debugger(colorpicker) { - var options = arguments.length > 1 && arguments[1] !== undefined ? arguments[1] : {}; - - _classCallCheck(this, Debugger); - - /** - * @type {number} - */ - var _this = _possibleConstructorReturn(this, (Debugger.__proto__ || Object.getPrototypeOf(Debugger)).call(this, colorpicker, options)); - - _this.eventCounter = 0; - if (_this.colorpicker.inputHandler.hasInput()) { - _this.colorpicker.inputHandler.input.on('change.colorpicker-ext', _jquery2.default.proxy(_this.onChangeInput, _this)); - } - return _this; - } - - /** - * @fires DebuggerExtension#colorpickerDebug - * @param {string} eventName - * @param {*} args - */ - - - _createClass(Debugger, [{ - key: 'log', - value: function log(eventName) { - var _console; - - for (var _len = arguments.length, args = Array(_len > 1 ? _len - 1 : 0), _key = 1; _key < _len; _key++) { - args[_key - 1] = arguments[_key]; - } - - this.eventCounter += 1; - - var logMessage = '#' + this.eventCounter + ': Colorpicker#' + this.colorpicker.id + ' [' + eventName + ']'; - - (_console = console).debug.apply(_console, [logMessage].concat(args)); - - /** - * Whenever the debugger logs an event, this other event is emitted. - * - * @event DebuggerExtension#colorpickerDebug - * @type {object} The event object - * @property {Colorpicker} colorpicker The Colorpicker instance - * @property {ColorItem} color The color instance - * @property {{debugger: DebuggerExtension, eventName: String, logArgs: Array, logMessage: String}} debug - * The debug info - */ - this.colorpicker.element.trigger({ - type: 'colorpickerDebug', - colorpicker: this.colorpicker, - color: this.color, - value: null, - debug: { - debugger: this, - eventName: eventName, - logArgs: args, - logMessage: logMessage - } - }); - } - }, { - key: 'resolveColor', - value: function resolveColor(color) { - var realColor = arguments.length > 1 && arguments[1] !== undefined ? arguments[1] : true; - - this.log('resolveColor()', color, realColor); - return false; - } - }, { - key: 'onCreate', - value: function onCreate(event) { - this.log('colorpickerCreate'); - return _get(Debugger.prototype.__proto__ || Object.getPrototypeOf(Debugger.prototype), 'onCreate', this).call(this, event); - } - }, { - key: 'onDestroy', - value: function onDestroy(event) { - this.log('colorpickerDestroy'); - this.eventCounter = 0; - - if (this.colorpicker.inputHandler.hasInput()) { - this.colorpicker.inputHandler.input.off('.colorpicker-ext'); - } - - return _get(Debugger.prototype.__proto__ || Object.getPrototypeOf(Debugger.prototype), 'onDestroy', this).call(this, event); - } - }, { - key: 'onUpdate', - value: function onUpdate(event) { - this.log('colorpickerUpdate'); - } - - /** - * @listens Colorpicker#change - * @param {Event} event - */ - - }, { - key: 'onChangeInput', - value: function onChangeInput(event) { - this.log('input:change.colorpicker', event.value, event.color); - } - }, { - key: 'onChange', - value: function onChange(event) { - this.log('colorpickerChange', event.value, event.color); - } - }, { - key: 'onInvalid', - value: function onInvalid(event) { - this.log('colorpickerInvalid', event.value, event.color); - } - }, { - key: 'onHide', - value: function onHide(event) { - this.log('colorpickerHide'); - this.eventCounter = 0; - } - }, { - key: 'onShow', - value: function onShow(event) { - this.log('colorpickerShow'); - } - }, { - key: 'onDisable', - value: function onDisable(event) { - this.log('colorpickerDisable'); - } - }, { - key: 'onEnable', - value: function onEnable(event) { - this.log('colorpickerEnable'); - } - }]); - - return Debugger; -}(_Extension3.default); - -exports.default = Debugger; -module.exports = exports.default; - -/***/ }), -/* 11 */ -/***/ (function(module, exports, __webpack_require__) { - -"use strict"; - - -Object.defineProperty(exports, "__esModule", { - value: true -}); - -var _createClass = function () { function defineProperties(target, props) { for (var i = 0; i < props.length; i++) { var descriptor = props[i]; descriptor.enumerable = descriptor.enumerable || false; descriptor.configurable = true; if ("value" in descriptor) descriptor.writable = true; Object.defineProperty(target, descriptor.key, descriptor); } } return function (Constructor, protoProps, staticProps) { if (protoProps) defineProperties(Constructor.prototype, protoProps); if (staticProps) defineProperties(Constructor, staticProps); return Constructor; }; }(); - -var _get = function get(object, property, receiver) { if (object === null) object = Function.prototype; var desc = Object.getOwnPropertyDescriptor(object, property); if (desc === undefined) { var parent = Object.getPrototypeOf(object); if (parent === null) { return undefined; } else { return get(parent, property, receiver); } } else if ("value" in desc) { return desc.value; } else { var getter = desc.get; if (getter === undefined) { return undefined; } return getter.call(receiver); } }; - -var _Extension2 = __webpack_require__(1); - -var _Extension3 = _interopRequireDefault(_Extension2); - -var _jquery = __webpack_require__(0); - -var _jquery2 = _interopRequireDefault(_jquery); - -function _interopRequireDefault(obj) { return obj && obj.__esModule ? obj : { default: obj }; } - -function _classCallCheck(instance, Constructor) { if (!(instance instanceof Constructor)) { throw new TypeError("Cannot call a class as a function"); } } - -function _possibleConstructorReturn(self, call) { if (!self) { throw new ReferenceError("this hasn't been initialised - super() hasn't been called"); } return call && (typeof call === "object" || typeof call === "function") ? call : self; } - -function _inherits(subClass, superClass) { if (typeof superClass !== "function" && superClass !== null) { throw new TypeError("Super expression must either be null or a function, not " + typeof superClass); } subClass.prototype = Object.create(superClass && superClass.prototype, { constructor: { value: subClass, enumerable: false, writable: true, configurable: true } }); if (superClass) Object.setPrototypeOf ? Object.setPrototypeOf(subClass, superClass) : subClass.__proto__ = superClass; } - -/** - * Color preview extension - * @ignore - */ -var Preview = function (_Extension) { - _inherits(Preview, _Extension); - - function Preview(colorpicker) { - var options = arguments.length > 1 && arguments[1] !== undefined ? arguments[1] : {}; - - _classCallCheck(this, Preview); - - var _this = _possibleConstructorReturn(this, (Preview.__proto__ || Object.getPrototypeOf(Preview)).call(this, colorpicker, _jquery2.default.extend(true, {}, { - template: '
', - showText: true, - format: colorpicker.format - }, options))); - - _this.element = (0, _jquery2.default)(_this.options.template); - _this.elementInner = _this.element.find('div'); - return _this; - } - - _createClass(Preview, [{ - key: 'onCreate', - value: function onCreate(event) { - _get(Preview.prototype.__proto__ || Object.getPrototypeOf(Preview.prototype), 'onCreate', this).call(this, event); - this.colorpicker.picker.append(this.element); - } - }, { - key: 'onUpdate', - value: function onUpdate(event) { - _get(Preview.prototype.__proto__ || Object.getPrototypeOf(Preview.prototype), 'onUpdate', this).call(this, event); - - if (!event.color) { - this.elementInner.css('backgroundColor', null).css('color', null).html(''); - return; - } - - this.elementInner.css('backgroundColor', event.color.toRgbString()); - - if (this.options.showText) { - this.elementInner.html(event.color.string(this.options.format || this.colorpicker.format)); - - if (event.color.isDark() && event.color.alpha > 0.5) { - this.elementInner.css('color', 'white'); - } else { - this.elementInner.css('color', 'black'); - } - } - } - }]); - - return Preview; -}(_Extension3.default); - -exports.default = Preview; -module.exports = exports.default; - -/***/ }), -/* 12 */ -/***/ (function(module, exports, __webpack_require__) { - -"use strict"; - - -Object.defineProperty(exports, "__esModule", { - value: true -}); - -var _createClass = function () { function defineProperties(target, props) { for (var i = 0; i < props.length; i++) { var descriptor = props[i]; descriptor.enumerable = descriptor.enumerable || false; descriptor.configurable = true; if ("value" in descriptor) descriptor.writable = true; Object.defineProperty(target, descriptor.key, descriptor); } } return function (Constructor, protoProps, staticProps) { if (protoProps) defineProperties(Constructor.prototype, protoProps); if (staticProps) defineProperties(Constructor, staticProps); return Constructor; }; }(); - -var _get = function get(object, property, receiver) { if (object === null) object = Function.prototype; var desc = Object.getOwnPropertyDescriptor(object, property); if (desc === undefined) { var parent = Object.getPrototypeOf(object); if (parent === null) { return undefined; } else { return get(parent, property, receiver); } } else if ("value" in desc) { return desc.value; } else { var getter = desc.get; if (getter === undefined) { return undefined; } return getter.call(receiver); } }; - -var _Palette2 = __webpack_require__(4); - -var _Palette3 = _interopRequireDefault(_Palette2); - -var _jquery = __webpack_require__(0); - -var _jquery2 = _interopRequireDefault(_jquery); - -function _interopRequireDefault(obj) { return obj && obj.__esModule ? obj : { default: obj }; } - -function _classCallCheck(instance, Constructor) { if (!(instance instanceof Constructor)) { throw new TypeError("Cannot call a class as a function"); } } - -function _possibleConstructorReturn(self, call) { if (!self) { throw new ReferenceError("this hasn't been initialised - super() hasn't been called"); } return call && (typeof call === "object" || typeof call === "function") ? call : self; } - -function _inherits(subClass, superClass) { if (typeof superClass !== "function" && superClass !== null) { throw new TypeError("Super expression must either be null or a function, not " + typeof superClass); } subClass.prototype = Object.create(superClass && superClass.prototype, { constructor: { value: subClass, enumerable: false, writable: true, configurable: true } }); if (superClass) Object.setPrototypeOf ? Object.setPrototypeOf(subClass, superClass) : subClass.__proto__ = superClass; } - -var defaults = { - barTemplate: '
\n
\n
', - swatchTemplate: '' -}; - -/** - * Color swatches extension - * @ignore - */ - -var Swatches = function (_Palette) { - _inherits(Swatches, _Palette); - - function Swatches(colorpicker) { - var options = arguments.length > 1 && arguments[1] !== undefined ? arguments[1] : {}; - - _classCallCheck(this, Swatches); - - var _this = _possibleConstructorReturn(this, (Swatches.__proto__ || Object.getPrototypeOf(Swatches)).call(this, colorpicker, _jquery2.default.extend(true, {}, defaults, options))); - - _this.element = null; - return _this; - } - - _createClass(Swatches, [{ - key: 'isEnabled', - value: function isEnabled() { - return this.getLength() > 0; - } - }, { - key: 'onCreate', - value: function onCreate(event) { - _get(Swatches.prototype.__proto__ || Object.getPrototypeOf(Swatches.prototype), 'onCreate', this).call(this, event); - - if (!this.isEnabled()) { - return; - } - - this.element = (0, _jquery2.default)(this.options.barTemplate); - this.load(); - this.colorpicker.picker.append(this.element); - } - }, { - key: 'load', - value: function load() { - var _this2 = this; - - var colorpicker = this.colorpicker, - swatchContainer = this.element.find('.colorpicker-swatches--inner'), - isAliased = this.options.namesAsValues === true && !Array.isArray(this.colors); - - swatchContainer.empty(); - - _jquery2.default.each(this.colors, function (name, value) { - var $swatch = (0, _jquery2.default)(_this2.options.swatchTemplate).attr('data-name', name).attr('data-value', value).attr('title', isAliased ? name + ': ' + value : value).on('mousedown.colorpicker touchstart.colorpicker', function (e) { - var $sw = (0, _jquery2.default)(this); - - // e.preventDefault(); - - colorpicker.setValue(isAliased ? $sw.attr('data-name') : $sw.attr('data-value')); - }); - - $swatch.find('.colorpicker-swatch--inner').css('background-color', value); - - swatchContainer.append($swatch); - }); - - swatchContainer.append((0, _jquery2.default)('')); - } - }]); - - return Swatches; -}(_Palette3.default); - -exports.default = Swatches; -module.exports = exports.default; - -/***/ }), -/* 13 */ -/***/ (function(module, exports, __webpack_require__) { - -"use strict"; - - -Object.defineProperty(exports, "__esModule", { - value: true -}); - -var _createClass = function () { function defineProperties(target, props) { for (var i = 0; i < props.length; i++) { var descriptor = props[i]; descriptor.enumerable = descriptor.enumerable || false; descriptor.configurable = true; if ("value" in descriptor) descriptor.writable = true; Object.defineProperty(target, descriptor.key, descriptor); } } return function (Constructor, protoProps, staticProps) { if (protoProps) defineProperties(Constructor.prototype, protoProps); if (staticProps) defineProperties(Constructor, staticProps); return Constructor; }; }(); - -var _jquery = __webpack_require__(0); - -var _jquery2 = _interopRequireDefault(_jquery); - -function _interopRequireDefault(obj) { return obj && obj.__esModule ? obj : { default: obj }; } - -function _classCallCheck(instance, Constructor) { if (!(instance instanceof Constructor)) { throw new TypeError("Cannot call a class as a function"); } } - -/** - * Class that handles all configured sliders on mouse or touch events. - * @ignore - */ -var SliderHandler = function () { - /** - * @param {Colorpicker} colorpicker - */ - function SliderHandler(colorpicker) { - _classCallCheck(this, SliderHandler); - - /** - * @type {Colorpicker} - */ - this.colorpicker = colorpicker; - /** - * @type {*|String} - * @private - */ - this.currentSlider = null; - /** - * @type {{left: number, top: number}} - * @private - */ - this.mousePointer = { - left: 0, - top: 0 - }; - - /** - * @type {Function} - */ - this.onMove = _jquery2.default.proxy(this.defaultOnMove, this); - } - - /** - * This function is called every time a slider guide is moved - * The scope of "this" is the SliderHandler object. - * - * @param {int} top - * @param {int} left - */ - - - _createClass(SliderHandler, [{ - key: 'defaultOnMove', - value: function defaultOnMove(top, left) { - if (!this.currentSlider) { - return; - } - - var slider = this.currentSlider, - cp = this.colorpicker, - ch = cp.colorHandler; - - // Create a color object - var color = !ch.hasColor() ? ch.getFallbackColor() : ch.color.getClone(); - - // Adjust the guide position - slider.guideStyle.left = left + 'px'; - slider.guideStyle.top = top + 'px'; - - // Adjust the color - if (slider.callLeft) { - color[slider.callLeft](left / slider.maxLeft); - } - if (slider.callTop) { - color[slider.callTop](top / slider.maxTop); - } - - // Set the new color - cp.setValue(color); - cp.popupHandler.focus(); - } - - /** - * Binds the colorpicker sliders to the mouse/touch events - */ - - }, { - key: 'bind', - value: function bind() { - var sliders = this.colorpicker.options.horizontal ? this.colorpicker.options.slidersHorz : this.colorpicker.options.sliders; - - var sliderClasses = []; - - for (var sliderName in sliders) { - if (!sliders.hasOwnProperty(sliderName)) { - continue; - } - - sliderClasses.push(sliders[sliderName].selector); - } - - this.colorpicker.picker.find(sliderClasses.join(', ')).on('mousedown.colorpicker touchstart.colorpicker', _jquery2.default.proxy(this.pressed, this)); - } - - /** - * Unbinds any event bound by this handler - */ - - }, { - key: 'unbind', - value: function unbind() { - (0, _jquery2.default)(this.colorpicker.picker).off({ - 'mousemove.colorpicker': _jquery2.default.proxy(this.moved, this), - 'touchmove.colorpicker': _jquery2.default.proxy(this.moved, this), - 'mouseup.colorpicker': _jquery2.default.proxy(this.released, this), - 'touchend.colorpicker': _jquery2.default.proxy(this.released, this) - }); - } - - /** - * Function triggered when clicking in one of the color adjustment bars - * - * @private - * @fires Colorpicker#mousemove - * @param {Event} e - */ - - }, { - key: 'pressed', - value: function pressed(e) { - if (this.colorpicker.isDisabled()) { - return; - } - this.colorpicker.lastEvent.alias = 'pressed'; - this.colorpicker.lastEvent.e = e; - - if (!e.pageX && !e.pageY && e.originalEvent && e.originalEvent.touches) { - e.pageX = e.originalEvent.touches[0].pageX; - e.pageY = e.originalEvent.touches[0].pageY; - } - // e.stopPropagation(); - // e.preventDefault(); - - var target = (0, _jquery2.default)(e.target); - - // detect the slider and set the limits and callbacks - var zone = target.closest('div'); - - var sliders = this.colorpicker.options.horizontal ? this.colorpicker.options.slidersHorz : this.colorpicker.options.sliders; - - if (zone.is('.colorpicker')) { - return; - } - - this.currentSlider = null; - - for (var sliderName in sliders) { - if (!sliders.hasOwnProperty(sliderName)) { - continue; - } - - var slider = sliders[sliderName]; - - if (zone.is(slider.selector)) { - this.currentSlider = _jquery2.default.extend({}, slider, { name: sliderName }); - break; - } else if (slider.childSelector !== undefined && zone.is(slider.childSelector)) { - this.currentSlider = _jquery2.default.extend({}, slider, { name: sliderName }); - zone = zone.parent(); // zone.parents(slider.selector).first() ? - break; - } - } - - var guide = zone.find('.colorpicker-guide').get(0); - - if (this.currentSlider === null || guide === null) { - return; - } - - var offset = zone.offset(); - - // reference to guide's style - this.currentSlider.guideStyle = guide.style; - this.currentSlider.left = e.pageX - offset.left; - this.currentSlider.top = e.pageY - offset.top; - this.mousePointer = { - left: e.pageX, - top: e.pageY - }; - - // TODO: fix moving outside the picker makes the guides to keep moving. The event needs to be bound to the window. - /** - * (window.document) Triggered on mousedown for the document object, - * so the color adjustment guide is moved to the clicked position. - * - * @event Colorpicker#mousemove - */ - (0, _jquery2.default)(this.colorpicker.picker).on({ - 'mousemove.colorpicker': _jquery2.default.proxy(this.moved, this), - 'touchmove.colorpicker': _jquery2.default.proxy(this.moved, this), - 'mouseup.colorpicker': _jquery2.default.proxy(this.released, this), - 'touchend.colorpicker': _jquery2.default.proxy(this.released, this) - }).trigger('mousemove'); - } - - /** - * Function triggered when dragging a guide inside one of the color adjustment bars. - * - * @private - * @param {Event} e - */ - - }, { - key: 'moved', - value: function moved(e) { - this.colorpicker.lastEvent.alias = 'moved'; - this.colorpicker.lastEvent.e = e; - - if (!e.pageX && !e.pageY && e.originalEvent && e.originalEvent.touches) { - e.pageX = e.originalEvent.touches[0].pageX; - e.pageY = e.originalEvent.touches[0].pageY; - } - - // e.stopPropagation(); - e.preventDefault(); // prevents scrolling on mobile - - var left = Math.max(0, Math.min(this.currentSlider.maxLeft, this.currentSlider.left + ((e.pageX || this.mousePointer.left) - this.mousePointer.left))); - - var top = Math.max(0, Math.min(this.currentSlider.maxTop, this.currentSlider.top + ((e.pageY || this.mousePointer.top) - this.mousePointer.top))); - - this.onMove(top, left); - } - - /** - * Function triggered when releasing the click in one of the color adjustment bars. - * - * @private - * @param {Event} e - */ - - }, { - key: 'released', - value: function released(e) { - this.colorpicker.lastEvent.alias = 'released'; - this.colorpicker.lastEvent.e = e; - - // e.stopPropagation(); - // e.preventDefault(); - - (0, _jquery2.default)(this.colorpicker.picker).off({ - 'mousemove.colorpicker': this.moved, - 'touchmove.colorpicker': this.moved, - 'mouseup.colorpicker': this.released, - 'touchend.colorpicker': this.released - }); - } - }]); - - return SliderHandler; -}(); - -exports.default = SliderHandler; -module.exports = exports.default; - -/***/ }), -/* 14 */ -/***/ (function(module, exports, __webpack_require__) { - -"use strict"; - - -Object.defineProperty(exports, "__esModule", { - value: true -}); - -var _createClass = function () { function defineProperties(target, props) { for (var i = 0; i < props.length; i++) { var descriptor = props[i]; descriptor.enumerable = descriptor.enumerable || false; descriptor.configurable = true; if ("value" in descriptor) descriptor.writable = true; Object.defineProperty(target, descriptor.key, descriptor); } } return function (Constructor, protoProps, staticProps) { if (protoProps) defineProperties(Constructor.prototype, protoProps); if (staticProps) defineProperties(Constructor, staticProps); return Constructor; }; }(); - -var _jquery = __webpack_require__(0); - -var _jquery2 = _interopRequireDefault(_jquery); - -var _options = __webpack_require__(3); - -var _options2 = _interopRequireDefault(_options); - -function _interopRequireDefault(obj) { return obj && obj.__esModule ? obj : { default: obj }; } - -function _classCallCheck(instance, Constructor) { if (!(instance instanceof Constructor)) { throw new TypeError("Cannot call a class as a function"); } } - -/** - * Handles everything related to the UI of the colorpicker popup: show, hide, position,... - * @ignore - */ -var PopupHandler = function () { - /** - * @param {Colorpicker} colorpicker - * @param {Window} root - */ - function PopupHandler(colorpicker, root) { - _classCallCheck(this, PopupHandler); - - /** - * @type {Window} - */ - this.root = root; - /** - * @type {Colorpicker} - */ - this.colorpicker = colorpicker; - /** - * @type {jQuery} - */ - this.popoverTarget = null; - /** - * @type {jQuery} - */ - this.popoverTip = null; - - /** - * If true, the latest click was inside the popover - * @type {boolean} - */ - this.clicking = false; - /** - * @type {boolean} - */ - this.hidding = false; - /** - * @type {boolean} - */ - this.showing = false; - } - - /** - * @private - * @returns {jQuery|false} - */ - - - _createClass(PopupHandler, [{ - key: 'bind', - - - /** - * Binds the different colorpicker elements to the focus/mouse/touch events so it reacts in order to show or - * hide the colorpicker popup accordingly. It also adds the proper classes. - */ - value: function bind() { - var cp = this.colorpicker; - - if (cp.options.inline) { - cp.picker.addClass('colorpicker-inline colorpicker-visible'); - return; // no need to bind show/hide events for inline elements - } - - cp.picker.addClass('colorpicker-popup colorpicker-hidden'); - - // there is no input or addon - if (!this.hasInput && !this.hasAddon) { - return; - } - - // create Bootstrap 4 popover - if (cp.options.popover) { - this.createPopover(); - } - - // bind addon show/hide events - if (this.hasAddon) { - // enable focus on addons - if (!this.addon.attr('tabindex')) { - this.addon.attr('tabindex', 0); - } - - this.addon.on({ - 'mousedown.colorpicker touchstart.colorpicker': _jquery2.default.proxy(this.toggle, this) - }); - - this.addon.on({ - 'focus.colorpicker': _jquery2.default.proxy(this.show, this) - }); - - this.addon.on({ - 'focusout.colorpicker': _jquery2.default.proxy(this.hide, this) - }); - } - - // bind input show/hide events - if (this.hasInput && !this.hasAddon) { - this.input.on({ - 'mousedown.colorpicker touchstart.colorpicker': _jquery2.default.proxy(this.show, this), - 'focus.colorpicker': _jquery2.default.proxy(this.show, this) - }); - - this.input.on({ - 'focusout.colorpicker': _jquery2.default.proxy(this.hide, this) - }); - } - - // reposition popup on window resize - (0, _jquery2.default)(this.root).on('resize.colorpicker', _jquery2.default.proxy(this.reposition, this)); - } - - /** - * Unbinds any event bound by this handler - */ - - }, { - key: 'unbind', - value: function unbind() { - if (this.hasInput) { - this.input.off({ - 'mousedown.colorpicker touchstart.colorpicker': _jquery2.default.proxy(this.show, this), - 'focus.colorpicker': _jquery2.default.proxy(this.show, this) - }); - this.input.off({ - 'focusout.colorpicker': _jquery2.default.proxy(this.hide, this) - }); - } - - if (this.hasAddon) { - this.addon.off({ - 'mousedown.colorpicker touchstart.colorpicker': _jquery2.default.proxy(this.toggle, this) - }); - this.addon.off({ - 'focus.colorpicker': _jquery2.default.proxy(this.show, this) - }); - this.addon.off({ - 'focusout.colorpicker': _jquery2.default.proxy(this.hide, this) - }); - } - - if (this.popoverTarget) { - this.popoverTarget.popover('dispose'); - } - - (0, _jquery2.default)(this.root).off('resize.colorpicker', _jquery2.default.proxy(this.reposition, this)); - (0, _jquery2.default)(this.root.document).off('mousedown.colorpicker touchstart.colorpicker', _jquery2.default.proxy(this.hide, this)); - (0, _jquery2.default)(this.root.document).off('mousedown.colorpicker touchstart.colorpicker', _jquery2.default.proxy(this.onClickingInside, this)); - } - }, { - key: 'isClickingInside', - value: function isClickingInside(e) { - if (!e) { - return false; - } - - return this.isOrIsInside(this.popoverTip, e.currentTarget) || this.isOrIsInside(this.popoverTip, e.target) || this.isOrIsInside(this.colorpicker.picker, e.currentTarget) || this.isOrIsInside(this.colorpicker.picker, e.target); - } - }, { - key: 'isOrIsInside', - value: function isOrIsInside(container, element) { - if (!container || !element) { - return false; - } - - element = (0, _jquery2.default)(element); - - return element.is(container) || container.find(element).length > 0; - } - }, { - key: 'onClickingInside', - value: function onClickingInside(e) { - this.clicking = this.isClickingInside(e); - } - }, { - key: 'createPopover', - value: function createPopover() { - var cp = this.colorpicker; - - this.popoverTarget = this.hasAddon ? this.addon : this.input; - - cp.picker.addClass('colorpicker-bs-popover-content'); - - this.popoverTarget.popover(_jquery2.default.extend(true, {}, _options2.default.popover, cp.options.popover, { trigger: 'manual', content: cp.picker, html: true })); - - this.popoverTip = (0, _jquery2.default)(this.popoverTarget.popover('getTipElement').data('bs.popover').tip); - this.popoverTip.addClass('colorpicker-bs-popover'); - - this.popoverTarget.on('shown.bs.popover', _jquery2.default.proxy(this.fireShow, this)); - this.popoverTarget.on('hidden.bs.popover', _jquery2.default.proxy(this.fireHide, this)); - } - - /** - * If the widget is not inside a container or inline, rearranges its position relative to its element offset. - * - * @param {Event} [e] - * @private - */ - - }, { - key: 'reposition', - value: function reposition(e) { - if (this.popoverTarget && this.isVisible()) { - this.popoverTarget.popover('update'); - } - } - - /** - * Toggles the colorpicker between visible or hidden - * - * @fires Colorpicker#colorpickerShow - * @fires Colorpicker#colorpickerHide - * @param {Event} [e] - */ - - }, { - key: 'toggle', - value: function toggle(e) { - if (this.isVisible()) { - this.hide(e); - } else { - this.show(e); - } - } - - /** - * Shows the colorpicker widget if hidden. - * - * @fires Colorpicker#colorpickerShow - * @param {Event} [e] - */ - - }, { - key: 'show', - value: function show(e) { - if (this.isVisible() || this.showing || this.hidding) { - return; - } - - this.showing = true; - this.hidding = false; - this.clicking = false; - - var cp = this.colorpicker; - - cp.lastEvent.alias = 'show'; - cp.lastEvent.e = e; - - // Prevent showing browser native HTML5 colorpicker - if (e && (!this.hasInput || this.input.attr('type') === 'color') && e && e.preventDefault) { - e.stopPropagation(); - e.preventDefault(); - } - - // If it's a popover, add event to the document to hide the picker when clicking outside of it - if (this.isPopover) { - (0, _jquery2.default)(this.root).on('resize.colorpicker', _jquery2.default.proxy(this.reposition, this)); - } - - // add visible class before popover is shown - cp.picker.addClass('colorpicker-visible').removeClass('colorpicker-hidden'); - - if (this.popoverTarget) { - this.popoverTarget.popover('show'); - } else { - this.fireShow(); - } - } - }, { - key: 'fireShow', - value: function fireShow() { - this.hidding = false; - this.showing = false; - - if (this.isPopover) { - // Add event to hide on outside click - (0, _jquery2.default)(this.root.document).on('mousedown.colorpicker touchstart.colorpicker', _jquery2.default.proxy(this.hide, this)); - (0, _jquery2.default)(this.root.document).on('mousedown.colorpicker touchstart.colorpicker', _jquery2.default.proxy(this.onClickingInside, this)); - } - - /** - * (Colorpicker) When show() is called and the widget can be shown. - * - * @event Colorpicker#colorpickerShow - */ - this.colorpicker.trigger('colorpickerShow'); - } - - /** - * Hides the colorpicker widget. - * Hide is prevented when it is triggered by an event whose target element has been clicked/touched. - * - * @fires Colorpicker#colorpickerHide - * @param {Event} [e] - */ - - }, { - key: 'hide', - value: function hide(e) { - if (this.isHidden() || this.showing || this.hidding) { - return; - } - - var cp = this.colorpicker, - clicking = this.clicking || this.isClickingInside(e); - - this.hidding = true; - this.showing = false; - this.clicking = false; - - cp.lastEvent.alias = 'hide'; - cp.lastEvent.e = e; - - // TODO: fix having to click twice outside when losing focus and last 2 clicks where inside the colorpicker - - // Prevent hide if triggered by an event and an element inside the colorpicker has been clicked/touched - if (clicking) { - this.hidding = false; - return; - } - - if (this.popoverTarget) { - this.popoverTarget.popover('hide'); - } else { - this.fireHide(); - } - } - }, { - key: 'fireHide', - value: function fireHide() { - this.hidding = false; - this.showing = false; - - var cp = this.colorpicker; - - // add hidden class after popover is hidden - cp.picker.addClass('colorpicker-hidden').removeClass('colorpicker-visible'); - - // Unbind window and document events, since there is no need to keep them while the popup is hidden - (0, _jquery2.default)(this.root).off('resize.colorpicker', _jquery2.default.proxy(this.reposition, this)); - (0, _jquery2.default)(this.root.document).off('mousedown.colorpicker touchstart.colorpicker', _jquery2.default.proxy(this.hide, this)); - (0, _jquery2.default)(this.root.document).off('mousedown.colorpicker touchstart.colorpicker', _jquery2.default.proxy(this.onClickingInside, this)); - - /** - * (Colorpicker) When hide() is called and the widget can be hidden. - * - * @event Colorpicker#colorpickerHide - */ - cp.trigger('colorpickerHide'); - } - }, { - key: 'focus', - value: function focus() { - if (this.hasAddon) { - return this.addon.focus(); - } - if (this.hasInput) { - return this.input.focus(); - } - return false; - } - - /** - * Returns true if the colorpicker element has the colorpicker-visible class and not the colorpicker-hidden one. - * False otherwise. - * - * @returns {boolean} - */ - - }, { - key: 'isVisible', - value: function isVisible() { - return this.colorpicker.picker.hasClass('colorpicker-visible') && !this.colorpicker.picker.hasClass('colorpicker-hidden'); - } - - /** - * Returns true if the colorpicker element has the colorpicker-hidden class and not the colorpicker-visible one. - * False otherwise. - * - * @returns {boolean} - */ - - }, { - key: 'isHidden', - value: function isHidden() { - return this.colorpicker.picker.hasClass('colorpicker-hidden') && !this.colorpicker.picker.hasClass('colorpicker-visible'); - } - }, { - key: 'input', - get: function get() { - return this.colorpicker.inputHandler.input; - } - - /** - * @private - * @returns {boolean} - */ - - }, { - key: 'hasInput', - get: function get() { - return this.colorpicker.inputHandler.hasInput(); - } - - /** - * @private - * @returns {jQuery|false} - */ - - }, { - key: 'addon', - get: function get() { - return this.colorpicker.addonHandler.addon; - } - - /** - * @private - * @returns {boolean} - */ - - }, { - key: 'hasAddon', - get: function get() { - return this.colorpicker.addonHandler.hasAddon(); - } - - /** - * @private - * @returns {boolean} - */ - - }, { - key: 'isPopover', - get: function get() { - return !this.colorpicker.options.inline && !!this.popoverTip; - } - }]); - - return PopupHandler; -}(); - -exports.default = PopupHandler; -module.exports = exports.default; - -/***/ }), -/* 15 */ -/***/ (function(module, exports, __webpack_require__) { - -"use strict"; - - -Object.defineProperty(exports, "__esModule", { - value: true -}); - -var _createClass = function () { function defineProperties(target, props) { for (var i = 0; i < props.length; i++) { var descriptor = props[i]; descriptor.enumerable = descriptor.enumerable || false; descriptor.configurable = true; if ("value" in descriptor) descriptor.writable = true; Object.defineProperty(target, descriptor.key, descriptor); } } return function (Constructor, protoProps, staticProps) { if (protoProps) defineProperties(Constructor.prototype, protoProps); if (staticProps) defineProperties(Constructor, staticProps); return Constructor; }; }(); - -var _jquery = __webpack_require__(0); - -var _jquery2 = _interopRequireDefault(_jquery); - -var _ColorItem = __webpack_require__(2); - -var _ColorItem2 = _interopRequireDefault(_ColorItem); - -function _interopRequireDefault(obj) { return obj && obj.__esModule ? obj : { default: obj }; } - -function _classCallCheck(instance, Constructor) { if (!(instance instanceof Constructor)) { throw new TypeError("Cannot call a class as a function"); } } - -/** - * Handles everything related to the colorpicker input - * @ignore - */ -var InputHandler = function () { - /** - * @param {Colorpicker} colorpicker - */ - function InputHandler(colorpicker) { - _classCallCheck(this, InputHandler); - - /** - * @type {Colorpicker} - */ - this.colorpicker = colorpicker; - /** - * @type {jQuery|false} - */ - this.input = this.colorpicker.element.is('input') ? this.colorpicker.element : this.colorpicker.options.input ? this.colorpicker.element.find(this.colorpicker.options.input) : false; - - if (this.input && this.input.length === 0) { - this.input = false; - } - - this._initValue(); - } - - _createClass(InputHandler, [{ - key: 'bind', - value: function bind() { - if (!this.hasInput()) { - return; - } - this.input.on({ - 'keyup.colorpicker': _jquery2.default.proxy(this.onkeyup, this) - }); - this.input.on({ - 'change.colorpicker': _jquery2.default.proxy(this.onchange, this) - }); - } - }, { - key: 'unbind', - value: function unbind() { - if (!this.hasInput()) { - return; - } - this.input.off('.colorpicker'); - } - }, { - key: '_initValue', - value: function _initValue() { - if (!this.hasInput()) { - return; - } - - var val = ''; - - [ - // candidates: - this.input.val(), this.input.data('color'), this.input.attr('data-color')].map(function (item) { - if (item && val === '') { - val = item; - } - }); - - if (val instanceof _ColorItem2.default) { - val = this.getFormattedColor(val.string(this.colorpicker.format)); - } else if (!(typeof val === 'string' || val instanceof String)) { - val = ''; - } - - this.input.prop('value', val); - } - - /** - * Returns the color string from the input value. - * If there is no input the return value is false. - * - * @returns {String|boolean} - */ - - }, { - key: 'getValue', - value: function getValue() { - if (!this.hasInput()) { - return false; - } - - return this.input.val(); - } - - /** - * If the input element is present, it updates the value with the current color object color string. - * If the value is changed, this method fires a "change" event on the input element. - * - * @param {String} val - * - * @fires Colorpicker#change - */ - - }, { - key: 'setValue', - value: function setValue(val) { - if (!this.hasInput()) { - return; - } - - var inputVal = this.input.prop('value'); - - val = val ? val : ''; - - if (val === (inputVal ? inputVal : '')) { - // No need to set value or trigger any event if nothing changed - return; - } - - this.input.prop('value', val); - - /** - * (Input) Triggered on the input element when a new color is selected. - * - * @event Colorpicker#change - */ - this.input.trigger({ - type: 'change', - colorpicker: this.colorpicker, - color: this.colorpicker.color, - value: val - }); - } - - /** - * Returns the formatted color string, with the formatting options applied - * (e.g. useHashPrefix) - * - * @param {String|null} val - * - * @returns {String} - */ - - }, { - key: 'getFormattedColor', - value: function getFormattedColor() { - var val = arguments.length > 0 && arguments[0] !== undefined ? arguments[0] : null; - - val = val ? val : this.colorpicker.colorHandler.getColorString(); - - if (!val) { - return ''; - } - - val = this.colorpicker.colorHandler.resolveColorDelegate(val, false); - - if (this.colorpicker.options.useHashPrefix === false) { - val = val.replace(/^#/g, ''); - } - - return val; - } - - /** - * Returns true if the widget has an associated input element, false otherwise - * @returns {boolean} - */ - - }, { - key: 'hasInput', - value: function hasInput() { - return this.input !== false; - } - - /** - * Returns true if the input exists and is disabled - * @returns {boolean} - */ - - }, { - key: 'isEnabled', - value: function isEnabled() { - return this.hasInput() && !this.isDisabled(); - } - - /** - * Returns true if the input exists and is disabled - * @returns {boolean} - */ - - }, { - key: 'isDisabled', - value: function isDisabled() { - return this.hasInput() && this.input.prop('disabled') === true; - } - - /** - * Disables the input if any - * - * @fires Colorpicker#colorpickerDisable - * @returns {boolean} - */ - - }, { - key: 'disable', - value: function disable() { - if (this.hasInput()) { - this.input.prop('disabled', true); - } - } - - /** - * Enables the input if any - * - * @fires Colorpicker#colorpickerEnable - * @returns {boolean} - */ - - }, { - key: 'enable', - value: function enable() { - if (this.hasInput()) { - this.input.prop('disabled', false); - } - } - - /** - * Calls setValue with the current internal color value - * - * @fires Colorpicker#change - */ - - }, { - key: 'update', - value: function update() { - if (!this.hasInput()) { - return; - } - - if (this.colorpicker.options.autoInputFallback === false && this.colorpicker.colorHandler.isInvalidColor()) { - // prevent update if color is invalid, autoInputFallback is disabled and the last event is keyup. - return; - } - - this.setValue(this.getFormattedColor()); - } - - /** - * Function triggered when the input has changed, so the colorpicker gets updated. - * - * @private - * @param {Event} e - * @returns {boolean} - */ - - }, { - key: 'onchange', - value: function onchange(e) { - this.colorpicker.lastEvent.alias = 'input.change'; - this.colorpicker.lastEvent.e = e; - - var val = this.getValue(); - - if (val !== e.value) { - this.colorpicker.setValue(val); - } - } - - /** - * Function triggered after a keyboard key has been released. - * - * @private - * @param {Event} e - * @returns {boolean} - */ - - }, { - key: 'onkeyup', - value: function onkeyup(e) { - this.colorpicker.lastEvent.alias = 'input.keyup'; - this.colorpicker.lastEvent.e = e; - - var val = this.getValue(); - - if (val !== e.value) { - this.colorpicker.setValue(val); - } - } - }]); - - return InputHandler; -}(); - -exports.default = InputHandler; -module.exports = exports.default; - -/***/ }), -/* 16 */ -/***/ (function(module, exports, __webpack_require__) { - -"use strict"; - - -var colorString = __webpack_require__(17); -var convert = __webpack_require__(20); - -var _slice = [].slice; - -var skippedModels = [ - // to be honest, I don't really feel like keyword belongs in color convert, but eh. - 'keyword', - - // gray conflicts with some method names, and has its own method defined. - 'gray', - - // shouldn't really be in color-convert either... - 'hex' -]; - -var hashedModelKeys = {}; -Object.keys(convert).forEach(function (model) { - hashedModelKeys[_slice.call(convert[model].labels).sort().join('')] = model; -}); - -var limiters = {}; - -function Color(obj, model) { - if (!(this instanceof Color)) { - return new Color(obj, model); - } - - if (model && model in skippedModels) { - model = null; - } - - if (model && !(model in convert)) { - throw new Error('Unknown model: ' + model); - } - - var i; - var channels; - - if (obj == null) { // eslint-disable-line no-eq-null,eqeqeq - this.model = 'rgb'; - this.color = [0, 0, 0]; - this.valpha = 1; - } else if (obj instanceof Color) { - this.model = obj.model; - this.color = obj.color.slice(); - this.valpha = obj.valpha; - } else if (typeof obj === 'string') { - var result = colorString.get(obj); - if (result === null) { - throw new Error('Unable to parse color from string: ' + obj); - } - - this.model = result.model; - channels = convert[this.model].channels; - this.color = result.value.slice(0, channels); - this.valpha = typeof result.value[channels] === 'number' ? result.value[channels] : 1; - } else if (obj.length) { - this.model = model || 'rgb'; - channels = convert[this.model].channels; - var newArr = _slice.call(obj, 0, channels); - this.color = zeroArray(newArr, channels); - this.valpha = typeof obj[channels] === 'number' ? obj[channels] : 1; - } else if (typeof obj === 'number') { - // this is always RGB - can be converted later on. - obj &= 0xFFFFFF; - this.model = 'rgb'; - this.color = [ - (obj >> 16) & 0xFF, - (obj >> 8) & 0xFF, - obj & 0xFF - ]; - this.valpha = 1; - } else { - this.valpha = 1; - - var keys = Object.keys(obj); - if ('alpha' in obj) { - keys.splice(keys.indexOf('alpha'), 1); - this.valpha = typeof obj.alpha === 'number' ? obj.alpha : 0; - } - - var hashedKeys = keys.sort().join(''); - if (!(hashedKeys in hashedModelKeys)) { - throw new Error('Unable to parse color from object: ' + JSON.stringify(obj)); - } - - this.model = hashedModelKeys[hashedKeys]; - - var labels = convert[this.model].labels; - var color = []; - for (i = 0; i < labels.length; i++) { - color.push(obj[labels[i]]); - } - - this.color = zeroArray(color); - } - - // perform limitations (clamping, etc.) - if (limiters[this.model]) { - channels = convert[this.model].channels; - for (i = 0; i < channels; i++) { - var limit = limiters[this.model][i]; - if (limit) { - this.color[i] = limit(this.color[i]); - } - } - } - - this.valpha = Math.max(0, Math.min(1, this.valpha)); - - if (Object.freeze) { - Object.freeze(this); - } -} - -Color.prototype = { - toString: function () { - return this.string(); - }, - - toJSON: function () { - return this[this.model](); - }, - - string: function (places) { - var self = this.model in colorString.to ? this : this.rgb(); - self = self.round(typeof places === 'number' ? places : 1); - var args = self.valpha === 1 ? self.color : self.color.concat(this.valpha); - return colorString.to[self.model](args); - }, - - percentString: function (places) { - var self = this.rgb().round(typeof places === 'number' ? places : 1); - var args = self.valpha === 1 ? self.color : self.color.concat(this.valpha); - return colorString.to.rgb.percent(args); - }, - - array: function () { - return this.valpha === 1 ? this.color.slice() : this.color.concat(this.valpha); - }, - - object: function () { - var result = {}; - var channels = convert[this.model].channels; - var labels = convert[this.model].labels; - - for (var i = 0; i < channels; i++) { - result[labels[i]] = this.color[i]; - } - - if (this.valpha !== 1) { - result.alpha = this.valpha; - } - - return result; - }, - - unitArray: function () { - var rgb = this.rgb().color; - rgb[0] /= 255; - rgb[1] /= 255; - rgb[2] /= 255; - - if (this.valpha !== 1) { - rgb.push(this.valpha); - } - - return rgb; - }, - - unitObject: function () { - var rgb = this.rgb().object(); - rgb.r /= 255; - rgb.g /= 255; - rgb.b /= 255; - - if (this.valpha !== 1) { - rgb.alpha = this.valpha; - } - - return rgb; - }, - - round: function (places) { - places = Math.max(places || 0, 0); - return new Color(this.color.map(roundToPlace(places)).concat(this.valpha), this.model); - }, - - alpha: function (val) { - if (arguments.length) { - return new Color(this.color.concat(Math.max(0, Math.min(1, val))), this.model); - } - - return this.valpha; - }, - - // rgb - red: getset('rgb', 0, maxfn(255)), - green: getset('rgb', 1, maxfn(255)), - blue: getset('rgb', 2, maxfn(255)), - - hue: getset(['hsl', 'hsv', 'hsl', 'hwb', 'hcg'], 0, function (val) { return ((val % 360) + 360) % 360; }), // eslint-disable-line brace-style - - saturationl: getset('hsl', 1, maxfn(100)), - lightness: getset('hsl', 2, maxfn(100)), - - saturationv: getset('hsv', 1, maxfn(100)), - value: getset('hsv', 2, maxfn(100)), - - chroma: getset('hcg', 1, maxfn(100)), - gray: getset('hcg', 2, maxfn(100)), - - white: getset('hwb', 1, maxfn(100)), - wblack: getset('hwb', 2, maxfn(100)), - - cyan: getset('cmyk', 0, maxfn(100)), - magenta: getset('cmyk', 1, maxfn(100)), - yellow: getset('cmyk', 2, maxfn(100)), - black: getset('cmyk', 3, maxfn(100)), - - x: getset('xyz', 0, maxfn(100)), - y: getset('xyz', 1, maxfn(100)), - z: getset('xyz', 2, maxfn(100)), - - l: getset('lab', 0, maxfn(100)), - a: getset('lab', 1), - b: getset('lab', 2), - - keyword: function (val) { - if (arguments.length) { - return new Color(val); - } - - return convert[this.model].keyword(this.color); - }, - - hex: function (val) { - if (arguments.length) { - return new Color(val); - } - - return colorString.to.hex(this.rgb().round().color); - }, - - rgbNumber: function () { - var rgb = this.rgb().color; - return ((rgb[0] & 0xFF) << 16) | ((rgb[1] & 0xFF) << 8) | (rgb[2] & 0xFF); - }, - - luminosity: function () { - // http://www.w3.org/TR/WCAG20/#relativeluminancedef - var rgb = this.rgb().color; - - var lum = []; - for (var i = 0; i < rgb.length; i++) { - var chan = rgb[i] / 255; - lum[i] = (chan <= 0.03928) ? chan / 12.92 : Math.pow(((chan + 0.055) / 1.055), 2.4); - } - - return 0.2126 * lum[0] + 0.7152 * lum[1] + 0.0722 * lum[2]; - }, - - contrast: function (color2) { - // http://www.w3.org/TR/WCAG20/#contrast-ratiodef - var lum1 = this.luminosity(); - var lum2 = color2.luminosity(); - - if (lum1 > lum2) { - return (lum1 + 0.05) / (lum2 + 0.05); - } - - return (lum2 + 0.05) / (lum1 + 0.05); - }, - - level: function (color2) { - var contrastRatio = this.contrast(color2); - if (contrastRatio >= 7.1) { - return 'AAA'; - } - - return (contrastRatio >= 4.5) ? 'AA' : ''; - }, - - isDark: function () { - // YIQ equation from http://24ways.org/2010/calculating-color-contrast - var rgb = this.rgb().color; - var yiq = (rgb[0] * 299 + rgb[1] * 587 + rgb[2] * 114) / 1000; - return yiq < 128; - }, - - isLight: function () { - return !this.isDark(); - }, - - negate: function () { - var rgb = this.rgb(); - for (var i = 0; i < 3; i++) { - rgb.color[i] = 255 - rgb.color[i]; - } - return rgb; - }, - - lighten: function (ratio) { - var hsl = this.hsl(); - hsl.color[2] += hsl.color[2] * ratio; - return hsl; - }, - - darken: function (ratio) { - var hsl = this.hsl(); - hsl.color[2] -= hsl.color[2] * ratio; - return hsl; - }, - - saturate: function (ratio) { - var hsl = this.hsl(); - hsl.color[1] += hsl.color[1] * ratio; - return hsl; - }, - - desaturate: function (ratio) { - var hsl = this.hsl(); - hsl.color[1] -= hsl.color[1] * ratio; - return hsl; - }, - - whiten: function (ratio) { - var hwb = this.hwb(); - hwb.color[1] += hwb.color[1] * ratio; - return hwb; - }, - - blacken: function (ratio) { - var hwb = this.hwb(); - hwb.color[2] += hwb.color[2] * ratio; - return hwb; - }, - - grayscale: function () { - // http://en.wikipedia.org/wiki/Grayscale#Converting_color_to_grayscale - var rgb = this.rgb().color; - var val = rgb[0] * 0.3 + rgb[1] * 0.59 + rgb[2] * 0.11; - return Color.rgb(val, val, val); - }, - - fade: function (ratio) { - return this.alpha(this.valpha - (this.valpha * ratio)); - }, - - opaquer: function (ratio) { - return this.alpha(this.valpha + (this.valpha * ratio)); - }, - - rotate: function (degrees) { - var hsl = this.hsl(); - var hue = hsl.color[0]; - hue = (hue + degrees) % 360; - hue = hue < 0 ? 360 + hue : hue; - hsl.color[0] = hue; - return hsl; - }, - - mix: function (mixinColor, weight) { - // ported from sass implementation in C - // https://github.com/sass/libsass/blob/0e6b4a2850092356aa3ece07c6b249f0221caced/functions.cpp#L209 - if (!mixinColor || !mixinColor.rgb) { - throw new Error('Argument to "mix" was not a Color instance, but rather an instance of ' + typeof mixinColor); - } - var color1 = mixinColor.rgb(); - var color2 = this.rgb(); - var p = weight === undefined ? 0.5 : weight; - - var w = 2 * p - 1; - var a = color1.alpha() - color2.alpha(); - - var w1 = (((w * a === -1) ? w : (w + a) / (1 + w * a)) + 1) / 2.0; - var w2 = 1 - w1; - - return Color.rgb( - w1 * color1.red() + w2 * color2.red(), - w1 * color1.green() + w2 * color2.green(), - w1 * color1.blue() + w2 * color2.blue(), - color1.alpha() * p + color2.alpha() * (1 - p)); - } -}; - -// model conversion methods and static constructors -Object.keys(convert).forEach(function (model) { - if (skippedModels.indexOf(model) !== -1) { - return; - } - - var channels = convert[model].channels; - - // conversion methods - Color.prototype[model] = function () { - if (this.model === model) { - return new Color(this); - } - - if (arguments.length) { - return new Color(arguments, model); - } - - var newAlpha = typeof arguments[channels] === 'number' ? channels : this.valpha; - return new Color(assertArray(convert[this.model][model].raw(this.color)).concat(newAlpha), model); - }; - - // 'static' construction methods - Color[model] = function (color) { - if (typeof color === 'number') { - color = zeroArray(_slice.call(arguments), channels); - } - return new Color(color, model); - }; -}); - -function roundTo(num, places) { - return Number(num.toFixed(places)); -} - -function roundToPlace(places) { - return function (num) { - return roundTo(num, places); - }; -} - -function getset(model, channel, modifier) { - model = Array.isArray(model) ? model : [model]; - - model.forEach(function (m) { - (limiters[m] || (limiters[m] = []))[channel] = modifier; - }); - - model = model[0]; - - return function (val) { - var result; - - if (arguments.length) { - if (modifier) { - val = modifier(val); - } - - result = this[model](); - result.color[channel] = val; - return result; - } - - result = this[model]().color[channel]; - if (modifier) { - result = modifier(result); - } - - return result; - }; -} - -function maxfn(max) { - return function (v) { - return Math.max(0, Math.min(max, v)); - }; -} - -function assertArray(val) { - return Array.isArray(val) ? val : [val]; -} - -function zeroArray(arr, length) { - for (var i = 0; i < length; i++) { - if (typeof arr[i] !== 'number') { - arr[i] = 0; - } - } - - return arr; -} - -module.exports = Color; - - -/***/ }), -/* 17 */ -/***/ (function(module, exports, __webpack_require__) { - -/* MIT license */ -var colorNames = __webpack_require__(5); -var swizzle = __webpack_require__(18); - -var reverseNames = {}; - -// create a list of reverse color names -for (var name in colorNames) { - if (colorNames.hasOwnProperty(name)) { - reverseNames[colorNames[name]] = name; - } -} - -var cs = module.exports = { - to: {}, - get: {} -}; - -cs.get = function (string) { - var prefix = string.substring(0, 3).toLowerCase(); - var val; - var model; - switch (prefix) { - case 'hsl': - val = cs.get.hsl(string); - model = 'hsl'; - break; - case 'hwb': - val = cs.get.hwb(string); - model = 'hwb'; - break; - default: - val = cs.get.rgb(string); - model = 'rgb'; - break; - } - - if (!val) { - return null; - } - - return {model: model, value: val}; -}; - -cs.get.rgb = function (string) { - if (!string) { - return null; - } - - var abbr = /^#([a-f0-9]{3,4})$/i; - var hex = /^#([a-f0-9]{6})([a-f0-9]{2})?$/i; - var rgba = /^rgba?\(\s*([+-]?\d+)\s*,\s*([+-]?\d+)\s*,\s*([+-]?\d+)\s*(?:,\s*([+-]?[\d\.]+)\s*)?\)$/; - var per = /^rgba?\(\s*([+-]?[\d\.]+)\%\s*,\s*([+-]?[\d\.]+)\%\s*,\s*([+-]?[\d\.]+)\%\s*(?:,\s*([+-]?[\d\.]+)\s*)?\)$/; - var keyword = /(\D+)/; - - var rgb = [0, 0, 0, 1]; - var match; - var i; - var hexAlpha; - - if (match = string.match(hex)) { - hexAlpha = match[2]; - match = match[1]; - - for (i = 0; i < 3; i++) { - // https://jsperf.com/slice-vs-substr-vs-substring-methods-long-string/19 - var i2 = i * 2; - rgb[i] = parseInt(match.slice(i2, i2 + 2), 16); - } - - if (hexAlpha) { - rgb[3] = Math.round((parseInt(hexAlpha, 16) / 255) * 100) / 100; - } - } else if (match = string.match(abbr)) { - match = match[1]; - hexAlpha = match[3]; - - for (i = 0; i < 3; i++) { - rgb[i] = parseInt(match[i] + match[i], 16); - } - - if (hexAlpha) { - rgb[3] = Math.round((parseInt(hexAlpha + hexAlpha, 16) / 255) * 100) / 100; - } - } else if (match = string.match(rgba)) { - for (i = 0; i < 3; i++) { - rgb[i] = parseInt(match[i + 1], 0); - } - - if (match[4]) { - rgb[3] = parseFloat(match[4]); - } - } else if (match = string.match(per)) { - for (i = 0; i < 3; i++) { - rgb[i] = Math.round(parseFloat(match[i + 1]) * 2.55); - } - - if (match[4]) { - rgb[3] = parseFloat(match[4]); - } - } else if (match = string.match(keyword)) { - if (match[1] === 'transparent') { - return [0, 0, 0, 0]; - } - - rgb = colorNames[match[1]]; - - if (!rgb) { - return null; - } - - rgb[3] = 1; - - return rgb; - } else { - return null; - } - - for (i = 0; i < 3; i++) { - rgb[i] = clamp(rgb[i], 0, 255); - } - rgb[3] = clamp(rgb[3], 0, 1); - - return rgb; -}; - -cs.get.hsl = function (string) { - if (!string) { - return null; - } - - var hsl = /^hsla?\(\s*([+-]?(?:\d*\.)?\d+)(?:deg)?\s*,\s*([+-]?[\d\.]+)%\s*,\s*([+-]?[\d\.]+)%\s*(?:,\s*([+-]?[\d\.]+)\s*)?\)$/; - var match = string.match(hsl); - - if (match) { - var alpha = parseFloat(match[4]); - var h = (parseFloat(match[1]) + 360) % 360; - var s = clamp(parseFloat(match[2]), 0, 100); - var l = clamp(parseFloat(match[3]), 0, 100); - var a = clamp(isNaN(alpha) ? 1 : alpha, 0, 1); - - return [h, s, l, a]; - } - - return null; -}; - -cs.get.hwb = function (string) { - if (!string) { - return null; - } - - var hwb = /^hwb\(\s*([+-]?\d*[\.]?\d+)(?:deg)?\s*,\s*([+-]?[\d\.]+)%\s*,\s*([+-]?[\d\.]+)%\s*(?:,\s*([+-]?[\d\.]+)\s*)?\)$/; - var match = string.match(hwb); - - if (match) { - var alpha = parseFloat(match[4]); - var h = ((parseFloat(match[1]) % 360) + 360) % 360; - var w = clamp(parseFloat(match[2]), 0, 100); - var b = clamp(parseFloat(match[3]), 0, 100); - var a = clamp(isNaN(alpha) ? 1 : alpha, 0, 1); - return [h, w, b, a]; - } - - return null; -}; - -cs.to.hex = function () { - var rgba = swizzle(arguments); - - return ( - '#' + - hexDouble(rgba[0]) + - hexDouble(rgba[1]) + - hexDouble(rgba[2]) + - (rgba[3] < 1 - ? (hexDouble(Math.round(rgba[3] * 255))) - : '') - ); -}; - -cs.to.rgb = function () { - var rgba = swizzle(arguments); - - return rgba.length < 4 || rgba[3] === 1 - ? 'rgb(' + Math.round(rgba[0]) + ', ' + Math.round(rgba[1]) + ', ' + Math.round(rgba[2]) + ')' - : 'rgba(' + Math.round(rgba[0]) + ', ' + Math.round(rgba[1]) + ', ' + Math.round(rgba[2]) + ', ' + rgba[3] + ')'; -}; - -cs.to.rgb.percent = function () { - var rgba = swizzle(arguments); - - var r = Math.round(rgba[0] / 255 * 100); - var g = Math.round(rgba[1] / 255 * 100); - var b = Math.round(rgba[2] / 255 * 100); - - return rgba.length < 4 || rgba[3] === 1 - ? 'rgb(' + r + '%, ' + g + '%, ' + b + '%)' - : 'rgba(' + r + '%, ' + g + '%, ' + b + '%, ' + rgba[3] + ')'; -}; - -cs.to.hsl = function () { - var hsla = swizzle(arguments); - return hsla.length < 4 || hsla[3] === 1 - ? 'hsl(' + hsla[0] + ', ' + hsla[1] + '%, ' + hsla[2] + '%)' - : 'hsla(' + hsla[0] + ', ' + hsla[1] + '%, ' + hsla[2] + '%, ' + hsla[3] + ')'; -}; - -// hwb is a bit different than rgb(a) & hsl(a) since there is no alpha specific syntax -// (hwb have alpha optional & 1 is default value) -cs.to.hwb = function () { - var hwba = swizzle(arguments); - - var a = ''; - if (hwba.length >= 4 && hwba[3] !== 1) { - a = ', ' + hwba[3]; - } - - return 'hwb(' + hwba[0] + ', ' + hwba[1] + '%, ' + hwba[2] + '%' + a + ')'; -}; - -cs.to.keyword = function (rgb) { - return reverseNames[rgb.slice(0, 3)]; -}; - -// helpers -function clamp(num, min, max) { - return Math.min(Math.max(min, num), max); -} - -function hexDouble(num) { - var str = num.toString(16).toUpperCase(); - return (str.length < 2) ? '0' + str : str; -} - - -/***/ }), -/* 18 */ -/***/ (function(module, exports, __webpack_require__) { - -"use strict"; - - -var isArrayish = __webpack_require__(19); - -var concat = Array.prototype.concat; -var slice = Array.prototype.slice; - -var swizzle = module.exports = function swizzle(args) { - var results = []; - - for (var i = 0, len = args.length; i < len; i++) { - var arg = args[i]; - - if (isArrayish(arg)) { - // http://jsperf.com/javascript-array-concat-vs-push/98 - results = concat.call(results, slice.call(arg)); - } else { - results.push(arg); - } - } - - return results; -}; - -swizzle.wrap = function (fn) { - return function () { - return fn(swizzle(arguments)); - }; -}; - - -/***/ }), -/* 19 */ -/***/ (function(module, exports, __webpack_require__) { - -"use strict"; - - -module.exports = function isArrayish(obj) { - if (!obj) { - return false; - } - - return obj instanceof Array || Array.isArray(obj) || - (obj.length >= 0 && obj.splice instanceof Function); -}; - - -/***/ }), -/* 20 */ -/***/ (function(module, exports, __webpack_require__) { - -var conversions = __webpack_require__(6); -var route = __webpack_require__(21); - -var convert = {}; - -var models = Object.keys(conversions); - -function wrapRaw(fn) { - var wrappedFn = function (args) { - if (args === undefined || args === null) { - return args; - } - - if (arguments.length > 1) { - args = Array.prototype.slice.call(arguments); - } - - return fn(args); - }; - - // preserve .conversion property if there is one - if ('conversion' in fn) { - wrappedFn.conversion = fn.conversion; - } - - return wrappedFn; -} - -function wrapRounded(fn) { - var wrappedFn = function (args) { - if (args === undefined || args === null) { - return args; - } - - if (arguments.length > 1) { - args = Array.prototype.slice.call(arguments); - } - - var result = fn(args); - - // we're assuming the result is an array here. - // see notice in conversions.js; don't use box types - // in conversion functions. - if (typeof result === 'object') { - for (var len = result.length, i = 0; i < len; i++) { - result[i] = Math.round(result[i]); - } - } - - return result; - }; - - // preserve .conversion property if there is one - if ('conversion' in fn) { - wrappedFn.conversion = fn.conversion; - } - - return wrappedFn; -} - -models.forEach(function (fromModel) { - convert[fromModel] = {}; - - Object.defineProperty(convert[fromModel], 'channels', {value: conversions[fromModel].channels}); - Object.defineProperty(convert[fromModel], 'labels', {value: conversions[fromModel].labels}); - - var routes = route(fromModel); - var routeModels = Object.keys(routes); - - routeModels.forEach(function (toModel) { - var fn = routes[toModel]; - - convert[fromModel][toModel] = wrapRounded(fn); - convert[fromModel][toModel].raw = wrapRaw(fn); - }); -}); - -module.exports = convert; - - -/***/ }), -/* 21 */ -/***/ (function(module, exports, __webpack_require__) { - -var conversions = __webpack_require__(6); - -/* - this function routes a model to all other models. - - all functions that are routed have a property `.conversion` attached - to the returned synthetic function. This property is an array - of strings, each with the steps in between the 'from' and 'to' - color models (inclusive). - - conversions that are not possible simply are not included. -*/ - -function buildGraph() { - var graph = {}; - // https://jsperf.com/object-keys-vs-for-in-with-closure/3 - var models = Object.keys(conversions); - - for (var len = models.length, i = 0; i < len; i++) { - graph[models[i]] = { - // http://jsperf.com/1-vs-infinity - // micro-opt, but this is simple. - distance: -1, - parent: null - }; - } - - return graph; -} - -// https://en.wikipedia.org/wiki/Breadth-first_search -function deriveBFS(fromModel) { - var graph = buildGraph(); - var queue = [fromModel]; // unshift -> queue -> pop - - graph[fromModel].distance = 0; - - while (queue.length) { - var current = queue.pop(); - var adjacents = Object.keys(conversions[current]); - - for (var len = adjacents.length, i = 0; i < len; i++) { - var adjacent = adjacents[i]; - var node = graph[adjacent]; - - if (node.distance === -1) { - node.distance = graph[current].distance + 1; - node.parent = current; - queue.unshift(adjacent); - } - } - } - - return graph; -} - -function link(from, to) { - return function (args) { - return to(from(args)); - }; -} - -function wrapConversion(toModel, graph) { - var path = [graph[toModel].parent, toModel]; - var fn = conversions[graph[toModel].parent][toModel]; - - var cur = graph[toModel].parent; - while (graph[cur].parent) { - path.unshift(graph[cur].parent); - fn = link(conversions[graph[cur].parent][cur], fn); - cur = graph[cur].parent; - } - - fn.conversion = path; - return fn; -} - -module.exports = function (fromModel) { - var graph = deriveBFS(fromModel); - var conversion = {}; - - var models = Object.keys(graph); - for (var len = models.length, i = 0; i < len; i++) { - var toModel = models[i]; - var node = graph[toModel]; - - if (node.parent === null) { - // no possible conversion, or this node is the source model. - continue; - } - - conversion[toModel] = wrapConversion(toModel, graph); - } - - return conversion; -}; - - - -/***/ }), -/* 22 */ -/***/ (function(module, exports, __webpack_require__) { - -"use strict"; - - -Object.defineProperty(exports, "__esModule", { - value: true -}); - -var _createClass = function () { function defineProperties(target, props) { for (var i = 0; i < props.length; i++) { var descriptor = props[i]; descriptor.enumerable = descriptor.enumerable || false; descriptor.configurable = true; if ("value" in descriptor) descriptor.writable = true; Object.defineProperty(target, descriptor.key, descriptor); } } return function (Constructor, protoProps, staticProps) { if (protoProps) defineProperties(Constructor.prototype, protoProps); if (staticProps) defineProperties(Constructor, staticProps); return Constructor; }; }(); - -var _jquery = __webpack_require__(0); - -var _jquery2 = _interopRequireDefault(_jquery); - -var _ColorItem = __webpack_require__(2); - -var _ColorItem2 = _interopRequireDefault(_ColorItem); - -function _interopRequireDefault(obj) { return obj && obj.__esModule ? obj : { default: obj }; } - -function _classCallCheck(instance, Constructor) { if (!(instance instanceof Constructor)) { throw new TypeError("Cannot call a class as a function"); } } - -/** - * Handles everything related to the colorpicker color - * @ignore - */ -var ColorHandler = function () { - /** - * @param {Colorpicker} colorpicker - */ - function ColorHandler(colorpicker) { - _classCallCheck(this, ColorHandler); - - /** - * @type {Colorpicker} - */ - this.colorpicker = colorpicker; - } - - /** - * @returns {*|String|ColorItem} - */ - - - _createClass(ColorHandler, [{ - key: 'bind', - value: function bind() { - // if the color option is set - if (this.colorpicker.options.color) { - this.color = this.createColor(this.colorpicker.options.color); - return; - } - - // if element[color] is empty and the input has a value - if (!this.color && !!this.colorpicker.inputHandler.getValue()) { - this.color = this.createColor(this.colorpicker.inputHandler.getValue(), this.colorpicker.options.autoInputFallback); - } - } - }, { - key: 'unbind', - value: function unbind() { - this.colorpicker.element.removeData('color'); - } - - /** - * Returns the color string from the input value or the 'data-color' attribute of the input or element. - * If empty, it returns the defaultValue parameter. - * - * @returns {String|*} - */ - - }, { - key: 'getColorString', - value: function getColorString() { - if (!this.hasColor()) { - return ''; - } - - return this.color.string(this.format); - } - - /** - * Sets the color value - * - * @param {String|ColorItem} val - */ - - }, { - key: 'setColorString', - value: function setColorString(val) { - var color = val ? this.createColor(val) : null; - - this.color = color ? color : null; - } - - /** - * Creates a new color using the widget instance options (fallbackColor, format). - * - * @fires Colorpicker#colorpickerInvalid - * @param {*} val - * @param {boolean} fallbackOnInvalid - * @returns {ColorItem} - */ - - }, { - key: 'createColor', - value: function createColor(val) { - var fallbackOnInvalid = arguments.length > 1 && arguments[1] !== undefined ? arguments[1] : true; - - var color = new _ColorItem2.default(this.resolveColorDelegate(val), this.format); - - if (!color.isValid()) { - if (fallbackOnInvalid) { - color = this.getFallbackColor(); - } - - /** - * (Colorpicker) Fired when the color is invalid and the fallback color is going to be used. - * - * @event Colorpicker#colorpickerInvalid - */ - this.colorpicker.trigger('colorpickerInvalid', color, val); - } - - if (!this.isAlphaEnabled()) { - // Alpha is disabled - color.alpha = 1; - } - - return color; - } - }, { - key: 'getFallbackColor', - value: function getFallbackColor() { - if (this.fallback && this.fallback === this.color) { - return this.color; - } - - var fallback = this.resolveColorDelegate(this.fallback); - - var color = new _ColorItem2.default(fallback, this.format); - - if (!color.isValid()) { - console.warn('The fallback color is invalid. Falling back to the previous color or black if any.'); - return this.color ? this.color : new _ColorItem2.default('#000000', this.format); - } - - return color; - } - - /** - * @returns {ColorItem} - */ - - }, { - key: 'assureColor', - value: function assureColor() { - if (!this.hasColor()) { - this.color = this.getFallbackColor(); - } - - return this.color; - } - - /** - * Delegates the color resolution to the colorpicker extensions. - * - * @param {String|*} color - * @param {boolean} realColor if true, the color should resolve into a real (not named) color code - * @returns {ColorItem|String|*|null} - */ - - }, { - key: 'resolveColorDelegate', - value: function resolveColorDelegate(color) { - var realColor = arguments.length > 1 && arguments[1] !== undefined ? arguments[1] : true; - - var extResolvedColor = false; - - _jquery2.default.each(this.colorpicker.extensions, function (name, ext) { - if (extResolvedColor !== false) { - // skip if resolved - return; - } - extResolvedColor = ext.resolveColor(color, realColor); - }); - - return extResolvedColor ? extResolvedColor : color; - } - - /** - * Checks if there is a color object, that it is valid and it is not a fallback - * @returns {boolean} - */ - - }, { - key: 'isInvalidColor', - value: function isInvalidColor() { - return !this.hasColor() || !this.color.isValid(); - } - - /** - * Returns true if the useAlpha option is exactly true, false otherwise - * @returns {boolean} - */ - - }, { - key: 'isAlphaEnabled', - value: function isAlphaEnabled() { - return this.colorpicker.options.useAlpha !== false; - } - - /** - * Returns true if the current color object is an instance of Color, false otherwise. - * @returns {boolean} - */ - - }, { - key: 'hasColor', - value: function hasColor() { - return this.color instanceof _ColorItem2.default; - } - }, { - key: 'fallback', - get: function get() { - return this.colorpicker.options.fallbackColor ? this.colorpicker.options.fallbackColor : this.hasColor() ? this.color : null; - } - - /** - * @returns {String|null} - */ - - }, { - key: 'format', - get: function get() { - if (this.colorpicker.options.format) { - return this.colorpicker.options.format; - } - - if (this.hasColor() && this.color.hasTransparency() && this.color.format.match(/^hex/)) { - return this.isAlphaEnabled() ? 'rgba' : 'hex'; - } - - if (this.hasColor()) { - return this.color.format; - } - - return 'rgb'; - } - - /** - * Internal color getter - * - * @type {ColorItem|null} - */ - - }, { - key: 'color', - get: function get() { - return this.colorpicker.element.data('color'); - } - - /** - * Internal color setter - * - * @ignore - * @param {ColorItem|null} value - */ - , - set: function set(value) { - this.colorpicker.element.data('color', value); - - if (value instanceof _ColorItem2.default && this.colorpicker.options.format === 'auto') { - // If format is 'auto', use the first parsed one from now on - this.colorpicker.options.format = this.color.format; - } - } - }]); - - return ColorHandler; -}(); - -exports.default = ColorHandler; -module.exports = exports.default; - -/***/ }), -/* 23 */ -/***/ (function(module, exports, __webpack_require__) { - -"use strict"; - - -Object.defineProperty(exports, "__esModule", { - value: true -}); - -var _createClass = function () { function defineProperties(target, props) { for (var i = 0; i < props.length; i++) { var descriptor = props[i]; descriptor.enumerable = descriptor.enumerable || false; descriptor.configurable = true; if ("value" in descriptor) descriptor.writable = true; Object.defineProperty(target, descriptor.key, descriptor); } } return function (Constructor, protoProps, staticProps) { if (protoProps) defineProperties(Constructor.prototype, protoProps); if (staticProps) defineProperties(Constructor, staticProps); return Constructor; }; }(); - -var _jquery = __webpack_require__(0); - -var _jquery2 = _interopRequireDefault(_jquery); - -function _interopRequireDefault(obj) { return obj && obj.__esModule ? obj : { default: obj }; } - -function _classCallCheck(instance, Constructor) { if (!(instance instanceof Constructor)) { throw new TypeError("Cannot call a class as a function"); } } - -/** - * Handles everything related to the colorpicker UI - * @ignore - */ -var PickerHandler = function () { - /** - * @param {Colorpicker} colorpicker - */ - function PickerHandler(colorpicker) { - _classCallCheck(this, PickerHandler); - - /** - * @type {Colorpicker} - */ - this.colorpicker = colorpicker; - /** - * @type {jQuery} - */ - this.picker = null; - } - - _createClass(PickerHandler, [{ - key: 'bind', - value: function bind() { - /** - * @type {jQuery|HTMLElement} - */ - var picker = this.picker = (0, _jquery2.default)(this.options.template); - - if (this.options.customClass) { - picker.addClass(this.options.customClass); - } - - if (this.options.horizontal) { - picker.addClass('colorpicker-horizontal'); - } - - if (this._supportsAlphaBar()) { - this.options.useAlpha = true; - picker.addClass('colorpicker-with-alpha'); - } else { - this.options.useAlpha = false; - } - } - }, { - key: 'attach', - value: function attach() { - // Inject the colorpicker element into the DOM - var pickerParent = this.colorpicker.container ? this.colorpicker.container : null; - - if (pickerParent) { - this.picker.appendTo(pickerParent); - } - } - }, { - key: 'unbind', - value: function unbind() { - this.picker.remove(); - } - }, { - key: '_supportsAlphaBar', - value: function _supportsAlphaBar() { - return (this.options.useAlpha || this.colorpicker.colorHandler.hasColor() && this.color.hasTransparency()) && this.options.useAlpha !== false && (!this.options.format || this.options.format && !this.options.format.match(/^hex([36])?$/i)); - } - - /** - * Changes the color adjustment bars using the current color object information. - */ - - }, { - key: 'update', - value: function update() { - if (!this.colorpicker.colorHandler.hasColor()) { - return; - } - - var vertical = this.options.horizontal !== true, - slider = vertical ? this.options.sliders : this.options.slidersHorz; - - var saturationGuide = this.picker.find('.colorpicker-saturation .colorpicker-guide'), - hueGuide = this.picker.find('.colorpicker-hue .colorpicker-guide'), - alphaGuide = this.picker.find('.colorpicker-alpha .colorpicker-guide'); - - var hsva = this.color.toHsvaRatio(); - - // Set guides position - if (hueGuide.length) { - hueGuide.css(vertical ? 'top' : 'left', (vertical ? slider.hue.maxTop : slider.hue.maxLeft) * (1 - hsva.h)); - } - if (alphaGuide.length) { - alphaGuide.css(vertical ? 'top' : 'left', (vertical ? slider.alpha.maxTop : slider.alpha.maxLeft) * (1 - hsva.a)); - } - if (saturationGuide.length) { - saturationGuide.css({ - 'top': slider.saturation.maxTop - hsva.v * slider.saturation.maxTop, - 'left': hsva.s * slider.saturation.maxLeft - }); - } - - // Set saturation hue background - this.picker.find('.colorpicker-saturation').css('backgroundColor', this.color.getCloneHueOnly().toHexString()); // we only need hue - - // Set alpha color gradient - var hexColor = this.color.toHexString(); - - var alphaBg = ''; - - if (this.options.horizontal) { - alphaBg = 'linear-gradient(to right, ' + hexColor + ' 0%, transparent 100%)'; - } else { - alphaBg = 'linear-gradient(to bottom, ' + hexColor + ' 0%, transparent 100%)'; - } - - this.picker.find('.colorpicker-alpha-color').css('background', alphaBg); - } - }, { - key: 'options', - get: function get() { - return this.colorpicker.options; - } - }, { - key: 'color', - get: function get() { - return this.colorpicker.colorHandler.color; - } - }]); - - return PickerHandler; -}(); - -exports.default = PickerHandler; -module.exports = exports.default; - -/***/ }), -/* 24 */ -/***/ (function(module, exports, __webpack_require__) { - -"use strict"; - - -/** - * Handles everything related to the colorpicker addon - * @ignore - */ - -Object.defineProperty(exports, "__esModule", { - value: true -}); - -var _createClass = function () { function defineProperties(target, props) { for (var i = 0; i < props.length; i++) { var descriptor = props[i]; descriptor.enumerable = descriptor.enumerable || false; descriptor.configurable = true; if ("value" in descriptor) descriptor.writable = true; Object.defineProperty(target, descriptor.key, descriptor); } } return function (Constructor, protoProps, staticProps) { if (protoProps) defineProperties(Constructor.prototype, protoProps); if (staticProps) defineProperties(Constructor, staticProps); return Constructor; }; }(); - -function _classCallCheck(instance, Constructor) { if (!(instance instanceof Constructor)) { throw new TypeError("Cannot call a class as a function"); } } - -var AddonHandler = function () { - /** - * @param {Colorpicker} colorpicker - */ - function AddonHandler(colorpicker) { - _classCallCheck(this, AddonHandler); - - /** - * @type {Colorpicker} - */ - this.colorpicker = colorpicker; - /** - * @type {jQuery} - */ - this.addon = null; - } - - _createClass(AddonHandler, [{ - key: 'hasAddon', - value: function hasAddon() { - return !!this.addon; - } - }, { - key: 'bind', - value: function bind() { - /** - * @type {*|jQuery} - */ - this.addon = this.colorpicker.options.addon ? this.colorpicker.element.find(this.colorpicker.options.addon) : null; - - if (this.addon && this.addon.length === 0) { - // not found - this.addon = null; - } - } - }, { - key: 'unbind', - value: function unbind() { - if (this.hasAddon()) { - this.addon.off('.colorpicker'); - } - } - - /** - * If the addon element is present, its background color is updated - */ - - }, { - key: 'update', - value: function update() { - if (!this.colorpicker.colorHandler.hasColor() || !this.hasAddon()) { - return; - } - - var colorStr = this.colorpicker.colorHandler.getColorString(); - - var styles = { 'background': colorStr }; - - var icn = this.addon.find('i').eq(0); - - if (icn.length > 0) { - icn.css(styles); - } else { - this.addon.css(styles); - } - } - }]); - - return AddonHandler; -}(); - -exports.default = AddonHandler; -module.exports = exports.default; - -/***/ }) -/******/ ]); -}); -//# sourceMappingURL=bootstrap-colorpicker.js.map \ No newline at end of file diff --git a/addons/web_flectra/static/lib/bootstrap.colorpicker/js/bootstrap-colorpicker.min.js b/addons/web_flectra/static/lib/bootstrap.colorpicker/js/bootstrap-colorpicker.min.js deleted file mode 100644 index bfdbed0cba..0000000000 --- a/addons/web_flectra/static/lib/bootstrap.colorpicker/js/bootstrap-colorpicker.min.js +++ /dev/null @@ -1,10 +0,0 @@ -/*! - * Bootstrap Colorpicker - Bootstrap Colorpicker is a modular color picker plugin for Bootstrap 4. - * @package bootstrap-colorpicker - * @version v3.2.0 - * @license MIT - * @link https://itsjavi.com/bootstrap-colorpicker/ - * @link https://github.com/itsjavi/bootstrap-colorpicker.git - */ -(function webpackUniversalModuleDefinition(root,factory){if(typeof exports==="object"&&typeof module==="object")module.exports=factory(require("jquery"));else if(typeof define==="function"&&define.amd)define("bootstrap-colorpicker",["jquery"],factory);else if(typeof exports==="object")exports["bootstrap-colorpicker"]=factory(require("jquery"));else root["bootstrap-colorpicker"]=factory(root["jQuery"])})(window,function(__WEBPACK_EXTERNAL_MODULE__0__){return function(modules){var installedModules={};function __webpack_require__(moduleId){if(installedModules[moduleId]){return installedModules[moduleId].exports}var module=installedModules[moduleId]={i:moduleId,l:false,exports:{}};modules[moduleId].call(module.exports,module,module.exports,__webpack_require__);module.l=true;return module.exports}__webpack_require__.m=modules;__webpack_require__.c=installedModules;__webpack_require__.d=function(exports,name,getter){if(!__webpack_require__.o(exports,name)){Object.defineProperty(exports,name,{enumerable:true,get:getter})}};__webpack_require__.r=function(exports){if(typeof Symbol!=="undefined"&&Symbol.toStringTag){Object.defineProperty(exports,Symbol.toStringTag,{value:"Module"})}Object.defineProperty(exports,"__esModule",{value:true})};__webpack_require__.t=function(value,mode){if(mode&1)value=__webpack_require__(value);if(mode&8)return value;if(mode&4&&typeof value==="object"&&value&&value.__esModule)return value;var ns=Object.create(null);__webpack_require__.r(ns);Object.defineProperty(ns,"default",{enumerable:true,value});if(mode&2&&typeof value!="string")for(var key in value)__webpack_require__.d(ns,key,function(key){return value[key]}.bind(null,key));return ns};__webpack_require__.n=function(module){var getter=module&&module.__esModule?function getDefault(){return module["default"]}:function getModuleExports(){return module};__webpack_require__.d(getter,"a",getter);return getter};__webpack_require__.o=function(object,property){return Object.prototype.hasOwnProperty.call(object,property)};__webpack_require__.p="";return __webpack_require__(__webpack_require__.s=7)}([function(module,exports){module.exports=__WEBPACK_EXTERNAL_MODULE__0__},function(module,exports,__webpack_require__){"use strict";Object.defineProperty(exports,"__esModule",{value:true});var _createClass=function(){function defineProperties(target,props){for(var i=0;i1&&arguments[1]!==undefined?arguments[1]:{};_classCallCheck(this,Extension);this.colorpicker=colorpicker;this.options=options;if(!(this.colorpicker.element&&this.colorpicker.element.length)){throw new Error("Extension: this.colorpicker.element is not valid")}this.colorpicker.element.on("colorpickerCreate.colorpicker-ext",_jquery2.default.proxy(this.onCreate,this));this.colorpicker.element.on("colorpickerDestroy.colorpicker-ext",_jquery2.default.proxy(this.onDestroy,this));this.colorpicker.element.on("colorpickerUpdate.colorpicker-ext",_jquery2.default.proxy(this.onUpdate,this));this.colorpicker.element.on("colorpickerChange.colorpicker-ext",_jquery2.default.proxy(this.onChange,this));this.colorpicker.element.on("colorpickerInvalid.colorpicker-ext",_jquery2.default.proxy(this.onInvalid,this));this.colorpicker.element.on("colorpickerShow.colorpicker-ext",_jquery2.default.proxy(this.onShow,this));this.colorpicker.element.on("colorpickerHide.colorpicker-ext",_jquery2.default.proxy(this.onHide,this));this.colorpicker.element.on("colorpickerEnable.colorpicker-ext",_jquery2.default.proxy(this.onEnable,this));this.colorpicker.element.on("colorpickerDisable.colorpicker-ext",_jquery2.default.proxy(this.onDisable,this))}_createClass(Extension,[{key:"resolveColor",value:function resolveColor(color){var realColor=arguments.length>1&&arguments[1]!==undefined?arguments[1]:true;return false}},{key:"onCreate",value:function onCreate(event){}},{key:"onDestroy",value:function onDestroy(event){this.colorpicker.element.off(".colorpicker-ext")}},{key:"onUpdate",value:function onUpdate(event){}},{key:"onChange",value:function onChange(event){}},{key:"onInvalid",value:function onInvalid(event){}},{key:"onHide",value:function onHide(event){}},{key:"onShow",value:function onShow(event){}},{key:"onDisable",value:function onDisable(event){}},{key:"onEnable",value:function onEnable(event){}}]);return Extension}();exports.default=Extension;module.exports=exports.default},function(module,exports,__webpack_require__){"use strict";Object.defineProperty(exports,"__esModule",{value:true});exports.ColorItem=exports.HSVAColor=undefined;var _createClass=function(){function defineProperties(target,props){for(var i=0;i1?_len-1:0),_key=1;_key<_len;_key++){args[_key-1]=arguments[_key]}if(arguments.length===0){return this._color}var result=this._color[fn].apply(this._color,args);if(!(result instanceof _color2.default)){return result}return new ColorItem(result,this.format)}},{key:"original",get:function get(){return this._original}}],[{key:"HSVAColor",get:function get(){return HSVAColor}}]);function ColorItem(){var color=arguments.length>0&&arguments[0]!==undefined?arguments[0]:null;var format=arguments.length>1&&arguments[1]!==undefined?arguments[1]:null;_classCallCheck(this,ColorItem);this.replace(color,format)}_createClass(ColorItem,[{key:"replace",value:function replace(color){var format=arguments.length>1&&arguments[1]!==undefined?arguments[1]:null;format=ColorItem.sanitizeFormat(format);this._original={color,format,valid:true};this._color=ColorItem.parse(color);if(this._color===null){this._color=(0,_color2.default)();this._original.valid=false;return}this._format=format?format:ColorItem.isHex(color)?"hex":this._color.model}},{key:"isValid",value:function isValid(){return this._original.valid===true}},{key:"setHueRatio",value:function setHueRatio(h){this.hue=(1-h)*360}},{key:"setSaturationRatio",value:function setSaturationRatio(s){this.saturation=s*100}},{key:"setValueRatio",value:function setValueRatio(v){this.value=(1-v)*100}},{key:"setAlphaRatio",value:function setAlphaRatio(a){this.alpha=1-a}},{key:"isDesaturated",value:function isDesaturated(){return this.saturation===0}},{key:"isTransparent",value:function isTransparent(){return this.alpha===0}},{key:"hasTransparency",value:function hasTransparency(){return this.hasAlpha()&&this.alpha<1}},{key:"hasAlpha",value:function hasAlpha(){return!isNaN(this.alpha)}},{key:"toObject",value:function toObject(){return new HSVAColor(this.hue,this.saturation,this.value,this.alpha)}},{key:"toHsva",value:function toHsva(){return this.toObject()}},{key:"toHsvaRatio",value:function toHsvaRatio(){return new HSVAColor(this.hue/360,this.saturation/100,this.value/100,this.alpha)}},{key:"toString",value:function toString(){return this.string()}},{key:"string",value:function string(){var format=arguments.length>0&&arguments[0]!==undefined?arguments[0]:null;format=ColorItem.sanitizeFormat(format?format:this.format);if(!format){return this._color.round().string()}if(this._color[format]===undefined){throw new Error("Unsupported color format: '"+format+"'")}var str=this._color[format]();return str.round?str.round().string():str}},{key:"equals",value:function equals(color){color=color instanceof ColorItem?color:new ColorItem(color);if(!color.isValid()||!this.isValid()){return false}return this.hue===color.hue&&this.saturation===color.saturation&&this.value===color.value&&this.alpha===color.alpha}},{key:"getClone",value:function getClone(){return new ColorItem(this._color,this.format)}},{key:"getCloneHueOnly",value:function getCloneHueOnly(){return new ColorItem([this.hue,100,100,1],this.format)}},{key:"getCloneOpaque",value:function getCloneOpaque(){return new ColorItem(this._color.alpha(1),this.format)}},{key:"toRgbString",value:function toRgbString(){return this.string("rgb")}},{key:"toHexString",value:function toHexString(){return this.string("hex")}},{key:"toHslString",value:function toHslString(){return this.string("hsl")}},{key:"isDark",value:function isDark(){return this._color.isDark()}},{key:"isLight",value:function isLight(){return this._color.isLight()}},{key:"generate",value:function generate(formula){var hues=[];if(Array.isArray(formula)){hues=formula}else if(!ColorItem.colorFormulas.hasOwnProperty(formula)){throw new Error("No color formula found with the name '"+formula+"'.")}else{hues=ColorItem.colorFormulas[formula]}var colors=[],mainColor=this._color,format=this.format;hues.forEach(function(hue){var levels=[hue?(mainColor.hue()+hue)%360:mainColor.hue(),mainColor.saturationv(),mainColor.value(),mainColor.alpha()];colors.push(new ColorItem(levels,format))});return colors}},{key:"hue",get:function get(){return this._color.hue()},set:function set(value){this._color=this._color.hue(value)}},{key:"saturation",get:function get(){return this._color.saturationv()},set:function set(value){this._color=this._color.saturationv(value)}},{key:"value",get:function get(){return this._color.value()},set:function set(value){this._color=this._color.value(value)}},{key:"alpha",get:function get(){var a=this._color.alpha();return isNaN(a)?1:a},set:function set(value){this._color=this._color.alpha(Math.round(value*100)/100)}},{key:"format",get:function get(){return this._format?this._format:this._color.model},set:function set(value){this._format=ColorItem.sanitizeFormat(value)}}],[{key:"parse",value:function parse(color){if(color instanceof _color2.default){return color}if(color instanceof ColorItem){return color._color}var format=null;if(color instanceof HSVAColor){color=[color.h,color.s,color.v,isNaN(color.a)?1:color.a]}else{color=ColorItem.sanitizeString(color)}if(color===null){return null}if(Array.isArray(color)){format="hsv"}try{return(0,_color2.default)(color,format)}catch(e){return null}}},{key:"sanitizeString",value:function sanitizeString(str){if(!(typeof str==="string"||str instanceof String)){return str}if(str.match(/^[0-9a-f]{2,}$/i)){return"#"+str}if(str.toLowerCase()==="transparent"){return"#FFFFFF00"}return str}},{key:"isHex",value:function isHex(str){if(!(typeof str==="string"||str instanceof String)){return false}return!!str.match(/^#?[0-9a-f]{2,}$/i)}},{key:"sanitizeFormat",value:function sanitizeFormat(format){switch(format){case"hex":case"hex3":case"hex4":case"hex6":case"hex8":return"hex";case"rgb":case"rgba":case"keyword":case"name":return"rgb";case"hsl":case"hsla":case"hsv":case"hsva":case"hwb":case"hwba":return"hsl";default:return""}}}]);return ColorItem}();ColorItem.colorFormulas={complementary:[180],triad:[0,120,240],tetrad:[0,90,180,270],splitcomplement:[0,72,216]};exports.default=ColorItem;exports.HSVAColor=HSVAColor;exports.ColorItem=ColorItem},function(module,exports,__webpack_require__){"use strict";Object.defineProperty(exports,"__esModule",{value:true});var sassVars={bar_size_short:16,base_margin:6,columns:6};var sliderSize=sassVars.bar_size_short*sassVars.columns+sassVars.base_margin*(sassVars.columns-1);exports.default={customClass:null,color:false,fallbackColor:false,format:"auto",horizontal:false,inline:false,container:false,popover:{animation:true,placement:"bottom",fallbackPlacement:"flip"},debug:false,input:"input",addon:".colorpicker-input-addon",autoInputFallback:true,useHashPrefix:true,useAlpha:true,template:'
\n
\n
\n
\n
\n \n
\n
',extensions:[{name:"preview",options:{showText:true}}],sliders:{saturation:{selector:".colorpicker-saturation",maxLeft:sliderSize,maxTop:sliderSize,callLeft:"setSaturationRatio",callTop:"setValueRatio"},hue:{selector:".colorpicker-hue",maxLeft:0,maxTop:sliderSize,callLeft:false,callTop:"setHueRatio"},alpha:{selector:".colorpicker-alpha",childSelector:".colorpicker-alpha-color",maxLeft:0,maxTop:sliderSize,callLeft:false,callTop:"setAlphaRatio"}},slidersHorz:{saturation:{selector:".colorpicker-saturation",maxLeft:sliderSize,maxTop:sliderSize,callLeft:"setSaturationRatio",callTop:"setValueRatio"},hue:{selector:".colorpicker-hue",maxLeft:sliderSize,maxTop:0,callLeft:"setHueRatio",callTop:false},alpha:{selector:".colorpicker-alpha",childSelector:".colorpicker-alpha-color",maxLeft:sliderSize,maxTop:0,callLeft:"setAlphaRatio",callTop:false}}};module.exports=exports.default},function(module,exports,__webpack_require__){"use strict";Object.defineProperty(exports,"__esModule",{value:true});var _typeof=typeof Symbol==="function"&&typeof Symbol.iterator==="symbol"?function(obj){return typeof obj}:function(obj){return obj&&typeof Symbol==="function"&&obj.constructor===Symbol&&obj!==Symbol.prototype?"symbol":typeof obj};var _createClass=function(){function defineProperties(target,props){for(var i=0;i1&&arguments[1]!==undefined?arguments[1]:{};_classCallCheck(this,Palette);var _this=_possibleConstructorReturn(this,(Palette.__proto__||Object.getPrototypeOf(Palette)).call(this,colorpicker,_jquery2.default.extend(true,{},defaults,options)));if(!Array.isArray(_this.options.colors)&&_typeof(_this.options.colors)!=="object"){_this.options.colors=null}return _this}_createClass(Palette,[{key:"getLength",value:function getLength(){if(!this.options.colors){return 0}if(Array.isArray(this.options.colors)){return this.options.colors.length}if(_typeof(this.options.colors)==="object"){return Object.keys(this.options.colors).length}return 0}},{key:"resolveColor",value:function resolveColor(color){var realColor=arguments.length>1&&arguments[1]!==undefined?arguments[1]:true;if(this.getLength()<=0){return false}if(Array.isArray(this.options.colors)){if(this.options.colors.indexOf(color)>=0){return color}if(this.options.colors.indexOf(color.toUpperCase())>=0){return color.toUpperCase()}if(this.options.colors.indexOf(color.toLowerCase())>=0){return color.toLowerCase()}return false}if(_typeof(this.options.colors)!=="object"){return false}if(!this.options.namesAsValues||realColor){return this.getValue(color,false)}return this.getName(color,this.getName("#"+color))}},{key:"getName",value:function getName(value){var defaultValue=arguments.length>1&&arguments[1]!==undefined?arguments[1]:false;if(!(typeof value==="string")||!this.options.colors){return defaultValue}for(var name in this.options.colors){if(!this.options.colors.hasOwnProperty(name)){continue}if(this.options.colors[name].toLowerCase()===value.toLowerCase()){return name}}return defaultValue}},{key:"getValue",value:function getValue(name){var defaultValue=arguments.length>1&&arguments[1]!==undefined?arguments[1]:false;if(!(typeof name==="string")||!this.options.colors){return defaultValue}if(this.options.colors.hasOwnProperty(name)){return this.options.colors[name]}return defaultValue}}]);return Palette}(_Extension3.default);exports.default=Palette;module.exports=exports.default},function(module,exports,__webpack_require__){"use strict";module.exports={aliceblue:[240,248,255],antiquewhite:[250,235,215],aqua:[0,255,255],aquamarine:[127,255,212],azure:[240,255,255],beige:[245,245,220],bisque:[255,228,196],black:[0,0,0],blanchedalmond:[255,235,205],blue:[0,0,255],blueviolet:[138,43,226],brown:[165,42,42],burlywood:[222,184,135],cadetblue:[95,158,160],chartreuse:[127,255,0],chocolate:[210,105,30],coral:[255,127,80],cornflowerblue:[100,149,237],cornsilk:[255,248,220],crimson:[220,20,60],cyan:[0,255,255],darkblue:[0,0,139],darkcyan:[0,139,139],darkgoldenrod:[184,134,11],darkgray:[169,169,169],darkgreen:[0,100,0],darkgrey:[169,169,169],darkkhaki:[189,183,107],darkmagenta:[139,0,139],darkolivegreen:[85,107,47],darkorange:[255,140,0],darkorchid:[153,50,204],darkred:[139,0,0],darksalmon:[233,150,122],darkseagreen:[143,188,143],darkslateblue:[72,61,139],darkslategray:[47,79,79],darkslategrey:[47,79,79],darkturquoise:[0,206,209],darkviolet:[148,0,211],deeppink:[255,20,147],deepskyblue:[0,191,255],dimgray:[105,105,105],dimgrey:[105,105,105],dodgerblue:[30,144,255],firebrick:[178,34,34],floralwhite:[255,250,240],forestgreen:[34,139,34],fuchsia:[255,0,255],gainsboro:[220,220,220],ghostwhite:[248,248,255],gold:[255,215,0],goldenrod:[218,165,32],gray:[128,128,128],green:[0,128,0],greenyellow:[173,255,47],grey:[128,128,128],honeydew:[240,255,240],hotpink:[255,105,180],indianred:[205,92,92],indigo:[75,0,130],ivory:[255,255,240],khaki:[240,230,140],lavender:[230,230,250],lavenderblush:[255,240,245],lawngreen:[124,252,0],lemonchiffon:[255,250,205],lightblue:[173,216,230],lightcoral:[240,128,128],lightcyan:[224,255,255],lightgoldenrodyellow:[250,250,210],lightgray:[211,211,211],lightgreen:[144,238,144],lightgrey:[211,211,211],lightpink:[255,182,193],lightsalmon:[255,160,122],lightseagreen:[32,178,170],lightskyblue:[135,206,250],lightslategray:[119,136,153],lightslategrey:[119,136,153],lightsteelblue:[176,196,222],lightyellow:[255,255,224],lime:[0,255,0],limegreen:[50,205,50],linen:[250,240,230],magenta:[255,0,255],maroon:[128,0,0],mediumaquamarine:[102,205,170],mediumblue:[0,0,205],mediumorchid:[186,85,211],mediumpurple:[147,112,219],mediumseagreen:[60,179,113],mediumslateblue:[123,104,238],mediumspringgreen:[0,250,154],mediumturquoise:[72,209,204],mediumvioletred:[199,21,133],midnightblue:[25,25,112],mintcream:[245,255,250],mistyrose:[255,228,225],moccasin:[255,228,181],navajowhite:[255,222,173],navy:[0,0,128],oldlace:[253,245,230],olive:[128,128,0],olivedrab:[107,142,35],orange:[255,165,0],orangered:[255,69,0],orchid:[218,112,214],palegoldenrod:[238,232,170],palegreen:[152,251,152],paleturquoise:[175,238,238],palevioletred:[219,112,147],papayawhip:[255,239,213],peachpuff:[255,218,185],peru:[205,133,63],pink:[255,192,203],plum:[221,160,221],powderblue:[176,224,230],purple:[128,0,128],rebeccapurple:[102,51,153],red:[255,0,0],rosybrown:[188,143,143],royalblue:[65,105,225],saddlebrown:[139,69,19],salmon:[250,128,114],sandybrown:[244,164,96],seagreen:[46,139,87],seashell:[255,245,238],sienna:[160,82,45],silver:[192,192,192],skyblue:[135,206,235],slateblue:[106,90,205],slategray:[112,128,144],slategrey:[112,128,144],snow:[255,250,250],springgreen:[0,255,127],steelblue:[70,130,180],tan:[210,180,140],teal:[0,128,128],thistle:[216,191,216],tomato:[255,99,71],turquoise:[64,224,208],violet:[238,130,238],wheat:[245,222,179],white:[255,255,255],whitesmoke:[245,245,245],yellow:[255,255,0],yellowgreen:[154,205,50]}},function(module,exports,__webpack_require__){var cssKeywords=__webpack_require__(5);var reverseKeywords={};for(var key in cssKeywords){if(cssKeywords.hasOwnProperty(key)){reverseKeywords[cssKeywords[key]]=key}}var convert=module.exports={rgb:{channels:3,labels:"rgb"},hsl:{channels:3,labels:"hsl"},hsv:{channels:3,labels:"hsv"},hwb:{channels:3,labels:"hwb"},cmyk:{channels:4,labels:"cmyk"},xyz:{channels:3,labels:"xyz"},lab:{channels:3,labels:"lab"},lch:{channels:3,labels:"lch"},hex:{channels:1,labels:["hex"]},keyword:{channels:1,labels:["keyword"]},ansi16:{channels:1,labels:["ansi16"]},ansi256:{channels:1,labels:["ansi256"]},hcg:{channels:3,labels:["h","c","g"]},apple:{channels:3,labels:["r16","g16","b16"]},gray:{channels:1,labels:["gray"]}};for(var model in convert){if(convert.hasOwnProperty(model)){if(!("channels"in convert[model])){throw new Error("missing channels property: "+model)}if(!("labels"in convert[model])){throw new Error("missing channel labels property: "+model)}if(convert[model].labels.length!==convert[model].channels){throw new Error("channel and label counts mismatch: "+model)}var channels=convert[model].channels;var labels=convert[model].labels;delete convert[model].channels;delete convert[model].labels;Object.defineProperty(convert[model],"channels",{value:channels});Object.defineProperty(convert[model],"labels",{value:labels})}}convert.rgb.hsl=function(rgb){var r=rgb[0]/255;var g=rgb[1]/255;var b=rgb[2]/255;var min=Math.min(r,g,b);var max=Math.max(r,g,b);var delta=max-min;var h;var s;var l;if(max===min){h=0}else if(r===max){h=(g-b)/delta}else if(g===max){h=2+(b-r)/delta}else if(b===max){h=4+(r-g)/delta}h=Math.min(h*60,360);if(h<0){h+=360}l=(min+max)/2;if(max===min){s=0}else if(l<=.5){s=delta/(max+min)}else{s=delta/(2-max-min)}return[h,s*100,l*100]};convert.rgb.hsv=function(rgb){var rdif;var gdif;var bdif;var h;var s;var r=rgb[0]/255;var g=rgb[1]/255;var b=rgb[2]/255;var v=Math.max(r,g,b);var diff=v-Math.min(r,g,b);var diffc=function(c){return(v-c)/6/diff+1/2};if(diff===0){h=s=0}else{s=diff/v;rdif=diffc(r);gdif=diffc(g);bdif=diffc(b);if(r===v){h=bdif-gdif}else if(g===v){h=1/3+rdif-bdif}else if(b===v){h=2/3+gdif-rdif}if(h<0){h+=1}else if(h>1){h-=1}}return[h*360,s*100,v*100]};convert.rgb.hwb=function(rgb){var r=rgb[0];var g=rgb[1];var b=rgb[2];var h=convert.rgb.hsl(rgb)[0];var w=1/255*Math.min(r,Math.min(g,b));b=1-1/255*Math.max(r,Math.max(g,b));return[h,w*100,b*100]};convert.rgb.cmyk=function(rgb){var r=rgb[0]/255;var g=rgb[1]/255;var b=rgb[2]/255;var c;var m;var y;var k;k=Math.min(1-r,1-g,1-b);c=(1-r-k)/(1-k)||0;m=(1-g-k)/(1-k)||0;y=(1-b-k)/(1-k)||0;return[c*100,m*100,y*100,k*100]};function comparativeDistance(x,y){return Math.pow(x[0]-y[0],2)+Math.pow(x[1]-y[1],2)+Math.pow(x[2]-y[2],2)}convert.rgb.keyword=function(rgb){var reversed=reverseKeywords[rgb];if(reversed){return reversed}var currentClosestDistance=Infinity;var currentClosestKeyword;for(var keyword in cssKeywords){if(cssKeywords.hasOwnProperty(keyword)){var value=cssKeywords[keyword];var distance=comparativeDistance(rgb,value);if(distance.04045?Math.pow((r+.055)/1.055,2.4):r/12.92;g=g>.04045?Math.pow((g+.055)/1.055,2.4):g/12.92;b=b>.04045?Math.pow((b+.055)/1.055,2.4):b/12.92;var x=r*.4124+g*.3576+b*.1805;var y=r*.2126+g*.7152+b*.0722;var z=r*.0193+g*.1192+b*.9505;return[x*100,y*100,z*100]};convert.rgb.lab=function(rgb){var xyz=convert.rgb.xyz(rgb);var x=xyz[0];var y=xyz[1];var z=xyz[2];var l;var a;var b;x/=95.047;y/=100;z/=108.883;x=x>.008856?Math.pow(x,1/3):7.787*x+16/116;y=y>.008856?Math.pow(y,1/3):7.787*y+16/116;z=z>.008856?Math.pow(z,1/3):7.787*z+16/116;l=116*y-16;a=500*(x-y);b=200*(y-z);return[l,a,b]};convert.hsl.rgb=function(hsl){var h=hsl[0]/360;var s=hsl[1]/100;var l=hsl[2]/100;var t1;var t2;var t3;var rgb;var val;if(s===0){val=l*255;return[val,val,val]}if(l<.5){t2=l*(1+s)}else{t2=l+s-l*s}t1=2*l-t2;rgb=[0,0,0];for(var i=0;i<3;i++){t3=h+1/3*-(i-1);if(t3<0){t3++}if(t3>1){t3--}if(6*t3<1){val=t1+(t2-t1)*6*t3}else if(2*t3<1){val=t2}else if(3*t3<2){val=t1+(t2-t1)*(2/3-t3)*6}else{val=t1}rgb[i]=val*255}return rgb};convert.hsl.hsv=function(hsl){var h=hsl[0];var s=hsl[1]/100;var l=hsl[2]/100;var smin=s;var lmin=Math.max(l,.01);var sv;var v;l*=2;s*=l<=1?l:2-l;smin*=lmin<=1?lmin:2-lmin;v=(l+s)/2;sv=l===0?2*smin/(lmin+smin):2*s/(l+s);return[h,sv*100,v*100]};convert.hsv.rgb=function(hsv){var h=hsv[0]/60;var s=hsv[1]/100;var v=hsv[2]/100;var hi=Math.floor(h)%6;var f=h-Math.floor(h);var p=255*v*(1-s);var q=255*v*(1-s*f);var t=255*v*(1-s*(1-f));v*=255;switch(hi){case 0:return[v,t,p];case 1:return[q,v,p];case 2:return[p,v,t];case 3:return[p,q,v];case 4:return[t,p,v];case 5:return[v,p,q]}};convert.hsv.hsl=function(hsv){var h=hsv[0];var s=hsv[1]/100;var v=hsv[2]/100;var vmin=Math.max(v,.01);var lmin;var sl;var l;l=(2-s)*v;lmin=(2-s)*vmin;sl=s*vmin;sl/=lmin<=1?lmin:2-lmin;sl=sl||0;l/=2;return[h,sl*100,l*100]};convert.hwb.rgb=function(hwb){var h=hwb[0]/360;var wh=hwb[1]/100;var bl=hwb[2]/100;var ratio=wh+bl;var i;var v;var f;var n;if(ratio>1){wh/=ratio;bl/=ratio}i=Math.floor(6*h);v=1-bl;f=6*h-i;if((i&1)!==0){f=1-f}n=wh+f*(v-wh);var r;var g;var b;switch(i){default:case 6:case 0:r=v;g=n;b=wh;break;case 1:r=n;g=v;b=wh;break;case 2:r=wh;g=v;b=n;break;case 3:r=wh;g=n;b=v;break;case 4:r=n;g=wh;b=v;break;case 5:r=v;g=wh;b=n;break}return[r*255,g*255,b*255]};convert.cmyk.rgb=function(cmyk){var c=cmyk[0]/100;var m=cmyk[1]/100;var y=cmyk[2]/100;var k=cmyk[3]/100;var r;var g;var b;r=1-Math.min(1,c*(1-k)+k);g=1-Math.min(1,m*(1-k)+k);b=1-Math.min(1,y*(1-k)+k);return[r*255,g*255,b*255]};convert.xyz.rgb=function(xyz){var x=xyz[0]/100;var y=xyz[1]/100;var z=xyz[2]/100;var r;var g;var b;r=x*3.2406+y*-1.5372+z*-.4986;g=x*-.9689+y*1.8758+z*.0415;b=x*.0557+y*-.204+z*1.057;r=r>.0031308?1.055*Math.pow(r,1/2.4)-.055:r*12.92;g=g>.0031308?1.055*Math.pow(g,1/2.4)-.055:g*12.92;b=b>.0031308?1.055*Math.pow(b,1/2.4)-.055:b*12.92;r=Math.min(Math.max(0,r),1);g=Math.min(Math.max(0,g),1);b=Math.min(Math.max(0,b),1);return[r*255,g*255,b*255]};convert.xyz.lab=function(xyz){var x=xyz[0];var y=xyz[1];var z=xyz[2];var l;var a;var b;x/=95.047;y/=100;z/=108.883;x=x>.008856?Math.pow(x,1/3):7.787*x+16/116;y=y>.008856?Math.pow(y,1/3):7.787*y+16/116;z=z>.008856?Math.pow(z,1/3):7.787*z+16/116;l=116*y-16;a=500*(x-y);b=200*(y-z);return[l,a,b]};convert.lab.xyz=function(lab){var l=lab[0];var a=lab[1];var b=lab[2];var x;var y;var z;y=(l+16)/116;x=a/500+y;z=y-b/200;var y2=Math.pow(y,3);var x2=Math.pow(x,3);var z2=Math.pow(z,3);y=y2>.008856?y2:(y-16/116)/7.787;x=x2>.008856?x2:(x-16/116)/7.787;z=z2>.008856?z2:(z-16/116)/7.787;x*=95.047;y*=100;z*=108.883;return[x,y,z]};convert.lab.lch=function(lab){var l=lab[0];var a=lab[1];var b=lab[2];var hr;var h;var c;hr=Math.atan2(b,a);h=hr*360/2/Math.PI;if(h<0){h+=360}c=Math.sqrt(a*a+b*b);return[l,c,h]};convert.lch.lab=function(lch){var l=lch[0];var c=lch[1];var h=lch[2];var a;var b;var hr;hr=h/360*2*Math.PI;a=c*Math.cos(hr);b=c*Math.sin(hr);return[l,a,b]};convert.rgb.ansi16=function(args){var r=args[0];var g=args[1];var b=args[2];var value=1 in arguments?arguments[1]:convert.rgb.hsv(args)[2];value=Math.round(value/50);if(value===0){return 30}var ansi=30+(Math.round(b/255)<<2|Math.round(g/255)<<1|Math.round(r/255));if(value===2){ansi+=60}return ansi};convert.hsv.ansi16=function(args){return convert.rgb.ansi16(convert.hsv.rgb(args),args[2])};convert.rgb.ansi256=function(args){var r=args[0];var g=args[1];var b=args[2];if(r===g&&g===b){if(r<8){return 16}if(r>248){return 231}return Math.round((r-8)/247*24)+232}var ansi=16+36*Math.round(r/255*5)+6*Math.round(g/255*5)+Math.round(b/255*5);return ansi};convert.ansi16.rgb=function(args){var color=args%10;if(color===0||color===7){if(args>50){color+=3.5}color=color/10.5*255;return[color,color,color]}var mult=(~~(args>50)+1)*.5;var r=(color&1)*mult*255;var g=(color>>1&1)*mult*255;var b=(color>>2&1)*mult*255;return[r,g,b]};convert.ansi256.rgb=function(args){if(args>=232){var c=(args-232)*10+8;return[c,c,c]}args-=16;var rem;var r=Math.floor(args/36)/5*255;var g=Math.floor((rem=args%36)/6)/5*255;var b=rem%6/5*255;return[r,g,b]};convert.rgb.hex=function(args){var integer=((Math.round(args[0])&255)<<16)+((Math.round(args[1])&255)<<8)+(Math.round(args[2])&255);var string=integer.toString(16).toUpperCase();return"000000".substring(string.length)+string};convert.hex.rgb=function(args){var match=args.toString(16).match(/[a-f0-9]{6}|[a-f0-9]{3}/i);if(!match){return[0,0,0]}var colorString=match[0];if(match[0].length===3){colorString=colorString.split("").map(function(char){return char+char}).join("")}var integer=parseInt(colorString,16);var r=integer>>16&255;var g=integer>>8&255;var b=integer&255;return[r,g,b]};convert.rgb.hcg=function(rgb){var r=rgb[0]/255;var g=rgb[1]/255;var b=rgb[2]/255;var max=Math.max(Math.max(r,g),b);var min=Math.min(Math.min(r,g),b);var chroma=max-min;var grayscale;var hue;if(chroma<1){grayscale=min/(1-chroma)}else{grayscale=0}if(chroma<=0){hue=0}else if(max===r){hue=(g-b)/chroma%6}else if(max===g){hue=2+(b-r)/chroma}else{hue=4+(r-g)/chroma+4}hue/=6;hue%=1;return[hue*360,chroma*100,grayscale*100]};convert.hsl.hcg=function(hsl){var s=hsl[1]/100;var l=hsl[2]/100;var c=1;var f=0;if(l<.5){c=2*s*l}else{c=2*s*(1-l)}if(c<1){f=(l-.5*c)/(1-c)}return[hsl[0],c*100,f*100]};convert.hsv.hcg=function(hsv){var s=hsv[1]/100;var v=hsv[2]/100;var c=s*v;var f=0;if(c<1){f=(v-c)/(1-c)}return[hsv[0],c*100,f*100]};convert.hcg.rgb=function(hcg){var h=hcg[0]/360;var c=hcg[1]/100;var g=hcg[2]/100;if(c===0){return[g*255,g*255,g*255]}var pure=[0,0,0];var hi=h%1*6;var v=hi%1;var w=1-v;var mg=0;switch(Math.floor(hi)){case 0:pure[0]=1;pure[1]=v;pure[2]=0;break;case 1:pure[0]=w;pure[1]=1;pure[2]=0;break;case 2:pure[0]=0;pure[1]=1;pure[2]=v;break;case 3:pure[0]=0;pure[1]=w;pure[2]=1;break;case 4:pure[0]=v;pure[1]=0;pure[2]=1;break;default:pure[0]=1;pure[1]=0;pure[2]=w}mg=(1-c)*g;return[(c*pure[0]+mg)*255,(c*pure[1]+mg)*255,(c*pure[2]+mg)*255]};convert.hcg.hsv=function(hcg){var c=hcg[1]/100;var g=hcg[2]/100;var v=c+g*(1-c);var f=0;if(v>0){f=c/v}return[hcg[0],f*100,v*100]};convert.hcg.hsl=function(hcg){var c=hcg[1]/100;var g=hcg[2]/100;var l=g*(1-c)+.5*c;var s=0;if(l>0&&l<.5){s=c/(2*l)}else if(l>=.5&&l<1){s=c/(2*(1-l))}return[hcg[0],s*100,l*100]};convert.hcg.hwb=function(hcg){var c=hcg[1]/100;var g=hcg[2]/100;var v=c+g*(1-c);return[hcg[0],(v-c)*100,(1-v)*100]};convert.hwb.hcg=function(hwb){var w=hwb[1]/100;var b=hwb[2]/100;var v=1-b;var c=v-w;var g=0;if(c<1){g=(v-c)/(1-c)}return[hwb[0],c*100,g*100]};convert.apple.rgb=function(apple){return[apple[0]/65535*255,apple[1]/65535*255,apple[2]/65535*255]};convert.rgb.apple=function(rgb){return[rgb[0]/255*65535,rgb[1]/255*65535,rgb[2]/255*65535]};convert.gray.rgb=function(args){return[args[0]/100*255,args[0]/100*255,args[0]/100*255]};convert.gray.hsl=convert.gray.hsv=function(args){return[0,0,args[0]]};convert.gray.hwb=function(gray){return[0,100,gray[0]]};convert.gray.cmyk=function(gray){return[0,0,0,gray[0]]};convert.gray.lab=function(gray){return[gray[0],0,0]};convert.gray.hex=function(gray){var val=Math.round(gray[0]/100*255)&255;var integer=(val<<16)+(val<<8)+val;var string=integer.toString(16).toUpperCase();return"000000".substring(string.length)+string};convert.rgb.gray=function(rgb){var val=(rgb[0]+rgb[1]+rgb[2])/3;return[val/255*100]}},function(module,exports,__webpack_require__){"use strict";var _typeof=typeof Symbol==="function"&&typeof Symbol.iterator==="symbol"?function(obj){return typeof obj}:function(obj){return obj&&typeof Symbol==="function"&&obj.constructor===Symbol&&obj!==Symbol.prototype?"symbol":typeof obj};var _Colorpicker=__webpack_require__(8);var _Colorpicker2=_interopRequireDefault(_Colorpicker);var _jquery=__webpack_require__(0);var _jquery2=_interopRequireDefault(_jquery);function _interopRequireDefault(obj){return obj&&obj.__esModule?obj:{default:obj}}var plugin="colorpicker";_jquery2.default[plugin]=_Colorpicker2.default;_jquery2.default.fn[plugin]=function(option){var fnArgs=Array.prototype.slice.call(arguments,1),isSingleElement=this.length===1,returnValue=null;var $elements=this.each(function(){var $this=(0,_jquery2.default)(this),inst=$this.data(plugin),options=(typeof option==="undefined"?"undefined":_typeof(option))==="object"?option:{};if(!inst){inst=new _Colorpicker2.default(this,options);$this.data(plugin,inst)}if(!isSingleElement){return}returnValue=$this;if(typeof option==="string"){if(option==="colorpicker"){returnValue=inst}else if(_jquery2.default.isFunction(inst[option])){returnValue=inst[option].apply(inst,fnArgs)}else{returnValue=inst[option]}}});return isSingleElement?returnValue:$elements};_jquery2.default.fn[plugin].constructor=_Colorpicker2.default},function(module,exports,__webpack_require__){"use strict";Object.defineProperty(exports,"__esModule",{value:true});var _createClass=function(){function defineProperties(target,props){for(var i=0;i1&&arguments[1]!==undefined?arguments[1]:{};var ext=new ExtensionClass(this,config);this.extensions.push(ext);return ext}},{key:"destroy",value:function destroy(){var color=this.color;this.sliderHandler.unbind();this.inputHandler.unbind();this.popupHandler.unbind();this.colorHandler.unbind();this.addonHandler.unbind();this.pickerHandler.unbind();this.element.removeClass("colorpicker-element").removeData("colorpicker","color").off(".colorpicker");this.trigger("colorpickerDestroy",color)}},{key:"show",value:function show(e){this.popupHandler.show(e)}},{key:"hide",value:function hide(e){this.popupHandler.hide(e)}},{key:"toggle",value:function toggle(e){this.popupHandler.toggle(e)}},{key:"getValue",value:function getValue(){var defaultValue=arguments.length>0&&arguments[0]!==undefined?arguments[0]:null;var val=this.colorHandler.color;val=val instanceof _ColorItem2.default?val:defaultValue;if(val instanceof _ColorItem2.default){return val.string(this.format)}return val}},{key:"setValue",value:function setValue(val){if(this.isDisabled()){return}var ch=this.colorHandler;if(ch.hasColor()&&!!val&&ch.color.equals(val)||!ch.hasColor()&&!val){return}ch.color=val?ch.createColor(val,this.options.autoInputFallback):null;this.trigger("colorpickerChange",ch.color,val);this.update()}},{key:"update",value:function update(){if(this.colorHandler.hasColor()){this.inputHandler.update()}else{this.colorHandler.assureColor()}this.addonHandler.update();this.pickerHandler.update();this.trigger("colorpickerUpdate")}},{key:"enable",value:function enable(){this.inputHandler.enable();this.disabled=false;this.picker.removeClass("colorpicker-disabled");this.trigger("colorpickerEnable");return true}},{key:"disable",value:function disable(){this.inputHandler.disable();this.disabled=true;this.picker.addClass("colorpicker-disabled");this.trigger("colorpickerDisable");return true}},{key:"isEnabled",value:function isEnabled(){return!this.isDisabled()}},{key:"isDisabled",value:function isDisabled(){return this.disabled===true}},{key:"trigger",value:function trigger(eventName){var color=arguments.length>1&&arguments[1]!==undefined?arguments[1]:null;var value=arguments.length>2&&arguments[2]!==undefined?arguments[2]:null;this.element.trigger({type:eventName,colorpicker:this,color:color?color:this.color,value:value?value:this.getValue()})}}]);return Colorpicker}();Colorpicker.extensions=_extensions2.default;exports.default=Colorpicker;module.exports=exports.default},function(module,exports,__webpack_require__){"use strict";Object.defineProperty(exports,"__esModule",{value:true});exports.Palette=exports.Swatches=exports.Preview=exports.Debugger=undefined;var _Debugger=__webpack_require__(10);var _Debugger2=_interopRequireDefault(_Debugger);var _Preview=__webpack_require__(11);var _Preview2=_interopRequireDefault(_Preview);var _Swatches=__webpack_require__(12);var _Swatches2=_interopRequireDefault(_Swatches);var _Palette=__webpack_require__(4);var _Palette2=_interopRequireDefault(_Palette);function _interopRequireDefault(obj){return obj&&obj.__esModule?obj:{default:obj}}exports.Debugger=_Debugger2.default;exports.Preview=_Preview2.default;exports.Swatches=_Swatches2.default;exports.Palette=_Palette2.default;exports.default={debugger:_Debugger2.default,preview:_Preview2.default,swatches:_Swatches2.default,palette:_Palette2.default}},function(module,exports,__webpack_require__){"use strict";Object.defineProperty(exports,"__esModule",{value:true});var _createClass=function(){function defineProperties(target,props){for(var i=0;i1&&arguments[1]!==undefined?arguments[1]:{};_classCallCheck(this,Debugger);var _this=_possibleConstructorReturn(this,(Debugger.__proto__||Object.getPrototypeOf(Debugger)).call(this,colorpicker,options));_this.eventCounter=0;if(_this.colorpicker.inputHandler.hasInput()){_this.colorpicker.inputHandler.input.on("change.colorpicker-ext",_jquery2.default.proxy(_this.onChangeInput,_this))}return _this}_createClass(Debugger,[{key:"log",value:function log(eventName){var _console;for(var _len=arguments.length,args=Array(_len>1?_len-1:0),_key=1;_key<_len;_key++){args[_key-1]=arguments[_key]}this.eventCounter+=1;var logMessage="#"+this.eventCounter+": Colorpicker#"+this.colorpicker.id+" ["+eventName+"]";(_console=console).debug.apply(_console,[logMessage].concat(args));this.colorpicker.element.trigger({type:"colorpickerDebug",colorpicker:this.colorpicker,color:this.color,value:null,debug:{debugger:this,eventName,logArgs:args,logMessage}})}},{key:"resolveColor",value:function resolveColor(color){var realColor=arguments.length>1&&arguments[1]!==undefined?arguments[1]:true;this.log("resolveColor()",color,realColor);return false}},{key:"onCreate",value:function onCreate(event){this.log("colorpickerCreate");return _get(Debugger.prototype.__proto__||Object.getPrototypeOf(Debugger.prototype),"onCreate",this).call(this,event)}},{key:"onDestroy",value:function onDestroy(event){this.log("colorpickerDestroy");this.eventCounter=0;if(this.colorpicker.inputHandler.hasInput()){this.colorpicker.inputHandler.input.off(".colorpicker-ext")}return _get(Debugger.prototype.__proto__||Object.getPrototypeOf(Debugger.prototype),"onDestroy",this).call(this,event)}},{key:"onUpdate",value:function onUpdate(event){this.log("colorpickerUpdate")}},{key:"onChangeInput",value:function onChangeInput(event){this.log("input:change.colorpicker",event.value,event.color)}},{key:"onChange",value:function onChange(event){this.log("colorpickerChange",event.value,event.color)}},{key:"onInvalid",value:function onInvalid(event){this.log("colorpickerInvalid",event.value,event.color)}},{key:"onHide",value:function onHide(event){this.log("colorpickerHide");this.eventCounter=0}},{key:"onShow",value:function onShow(event){this.log("colorpickerShow")}},{key:"onDisable",value:function onDisable(event){this.log("colorpickerDisable")}},{key:"onEnable",value:function onEnable(event){this.log("colorpickerEnable")}}]);return Debugger}(_Extension3.default);exports.default=Debugger;module.exports=exports.default},function(module,exports,__webpack_require__){"use strict";Object.defineProperty(exports,"__esModule",{value:true});var _createClass=function(){function defineProperties(target,props){for(var i=0;i1&&arguments[1]!==undefined?arguments[1]:{};_classCallCheck(this,Preview);var _this=_possibleConstructorReturn(this,(Preview.__proto__||Object.getPrototypeOf(Preview)).call(this,colorpicker,_jquery2.default.extend(true,{},{template:'
',showText:true,format:colorpicker.format},options)));_this.element=(0,_jquery2.default)(_this.options.template);_this.elementInner=_this.element.find("div");return _this}_createClass(Preview,[{key:"onCreate",value:function onCreate(event){_get(Preview.prototype.__proto__||Object.getPrototypeOf(Preview.prototype),"onCreate",this).call(this,event);this.colorpicker.picker.append(this.element)}},{key:"onUpdate",value:function onUpdate(event){_get(Preview.prototype.__proto__||Object.getPrototypeOf(Preview.prototype),"onUpdate",this).call(this,event);if(!event.color){this.elementInner.css("backgroundColor",null).css("color",null).html("");return}this.elementInner.css("backgroundColor",event.color.toRgbString());if(this.options.showText){this.elementInner.html(event.color.string(this.options.format||this.colorpicker.format));if(event.color.isDark()&&event.color.alpha>.5){this.elementInner.css("color","white")}else{this.elementInner.css("color","black")}}}}]);return Preview}(_Extension3.default);exports.default=Preview;module.exports=exports.default},function(module,exports,__webpack_require__){"use strict";Object.defineProperty(exports,"__esModule",{value:true});var _createClass=function(){function defineProperties(target,props){for(var i=0;i\n
\n
',swatchTemplate:''};var Swatches=function(_Palette){_inherits(Swatches,_Palette);function Swatches(colorpicker){var options=arguments.length>1&&arguments[1]!==undefined?arguments[1]:{};_classCallCheck(this,Swatches);var _this=_possibleConstructorReturn(this,(Swatches.__proto__||Object.getPrototypeOf(Swatches)).call(this,colorpicker,_jquery2.default.extend(true,{},defaults,options)));_this.element=null;return _this}_createClass(Swatches,[{key:"isEnabled",value:function isEnabled(){return this.getLength()>0}},{key:"onCreate",value:function onCreate(event){_get(Swatches.prototype.__proto__||Object.getPrototypeOf(Swatches.prototype),"onCreate",this).call(this,event);if(!this.isEnabled()){return}this.element=(0,_jquery2.default)(this.options.barTemplate);this.load();this.colorpicker.picker.append(this.element)}},{key:"load",value:function load(){var _this2=this;var colorpicker=this.colorpicker,swatchContainer=this.element.find(".colorpicker-swatches--inner"),isAliased=this.options.namesAsValues===true&&!Array.isArray(this.colors);swatchContainer.empty();_jquery2.default.each(this.colors,function(name,value){var $swatch=(0,_jquery2.default)(_this2.options.swatchTemplate).attr("data-name",name).attr("data-value",value).attr("title",isAliased?name+": "+value:value).on("mousedown.colorpicker touchstart.colorpicker",function(e){var $sw=(0,_jquery2.default)(this);colorpicker.setValue(isAliased?$sw.attr("data-name"):$sw.attr("data-value"))});$swatch.find(".colorpicker-swatch--inner").css("background-color",value);swatchContainer.append($swatch)});swatchContainer.append((0,_jquery2.default)(''))}}]);return Swatches}(_Palette3.default);exports.default=Swatches;module.exports=exports.default},function(module,exports,__webpack_require__){"use strict";Object.defineProperty(exports,"__esModule",{value:true});var _createClass=function(){function defineProperties(target,props){for(var i=0;i0}},{key:"onClickingInside",value:function onClickingInside(e){this.clicking=this.isClickingInside(e)}},{key:"createPopover",value:function createPopover(){var cp=this.colorpicker;this.popoverTarget=this.hasAddon?this.addon:this.input;cp.picker.addClass("colorpicker-bs-popover-content");this.popoverTarget.popover(_jquery2.default.extend(true,{},_options2.default.popover,cp.options.popover,{trigger:"manual",content:cp.picker,html:true}));this.popoverTip=(0,_jquery2.default)(this.popoverTarget.popover("getTipElement").data("bs.popover").tip);this.popoverTip.addClass("colorpicker-bs-popover");this.popoverTarget.on("shown.bs.popover",_jquery2.default.proxy(this.fireShow,this));this.popoverTarget.on("hidden.bs.popover",_jquery2.default.proxy(this.fireHide,this))}},{key:"reposition",value:function reposition(e){if(this.popoverTarget&&this.isVisible()){this.popoverTarget.popover("update")}}},{key:"toggle",value:function toggle(e){if(this.isVisible()){this.hide(e)}else{this.show(e)}}},{key:"show",value:function show(e){if(this.isVisible()||this.showing||this.hidding){return}this.showing=true;this.hidding=false;this.clicking=false;var cp=this.colorpicker;cp.lastEvent.alias="show";cp.lastEvent.e=e;if(e&&(!this.hasInput||this.input.attr("type")==="color")&&e&&e.preventDefault){e.stopPropagation();e.preventDefault()}if(this.isPopover){(0,_jquery2.default)(this.root).on("resize.colorpicker",_jquery2.default.proxy(this.reposition,this))}cp.picker.addClass("colorpicker-visible").removeClass("colorpicker-hidden");if(this.popoverTarget){this.popoverTarget.popover("show")}else{this.fireShow()}}},{key:"fireShow",value:function fireShow(){this.hidding=false;this.showing=false;if(this.isPopover){(0,_jquery2.default)(this.root.document).on("mousedown.colorpicker touchstart.colorpicker",_jquery2.default.proxy(this.hide,this));(0,_jquery2.default)(this.root.document).on("mousedown.colorpicker touchstart.colorpicker",_jquery2.default.proxy(this.onClickingInside,this))}this.colorpicker.trigger("colorpickerShow")}},{key:"hide",value:function hide(e){if(this.isHidden()||this.showing||this.hidding){return}var cp=this.colorpicker,clicking=this.clicking||this.isClickingInside(e);this.hidding=true;this.showing=false;this.clicking=false;cp.lastEvent.alias="hide";cp.lastEvent.e=e;if(clicking){this.hidding=false;return}if(this.popoverTarget){this.popoverTarget.popover("hide")}else{this.fireHide()}}},{key:"fireHide",value:function fireHide(){this.hidding=false;this.showing=false;var cp=this.colorpicker;cp.picker.addClass("colorpicker-hidden").removeClass("colorpicker-visible");(0,_jquery2.default)(this.root).off("resize.colorpicker",_jquery2.default.proxy(this.reposition,this));(0,_jquery2.default)(this.root.document).off("mousedown.colorpicker touchstart.colorpicker",_jquery2.default.proxy(this.hide,this));(0,_jquery2.default)(this.root.document).off("mousedown.colorpicker touchstart.colorpicker",_jquery2.default.proxy(this.onClickingInside,this));cp.trigger("colorpickerHide")}},{key:"focus",value:function focus(){if(this.hasAddon){return this.addon.focus()}if(this.hasInput){return this.input.focus()}return false}},{key:"isVisible",value:function isVisible(){return this.colorpicker.picker.hasClass("colorpicker-visible")&&!this.colorpicker.picker.hasClass("colorpicker-hidden")}},{key:"isHidden",value:function isHidden(){return this.colorpicker.picker.hasClass("colorpicker-hidden")&&!this.colorpicker.picker.hasClass("colorpicker-visible")}},{key:"input",get:function get(){return this.colorpicker.inputHandler.input}},{key:"hasInput",get:function get(){return this.colorpicker.inputHandler.hasInput()}},{key:"addon",get:function get(){return this.colorpicker.addonHandler.addon}},{key:"hasAddon",get:function get(){return this.colorpicker.addonHandler.hasAddon()}},{key:"isPopover",get:function get(){return!this.colorpicker.options.inline&&!!this.popoverTip}}]);return PopupHandler}();exports.default=PopupHandler;module.exports=exports.default},function(module,exports,__webpack_require__){"use strict";Object.defineProperty(exports,"__esModule",{value:true});var _createClass=function(){function defineProperties(target,props){for(var i=0;i0&&arguments[0]!==undefined?arguments[0]:null;val=val?val:this.colorpicker.colorHandler.getColorString();if(!val){return""}val=this.colorpicker.colorHandler.resolveColorDelegate(val,false);if(this.colorpicker.options.useHashPrefix===false){val=val.replace(/^#/g,"")}return val}},{key:"hasInput",value:function hasInput(){return this.input!==false}},{key:"isEnabled",value:function isEnabled(){return this.hasInput()&&!this.isDisabled()}},{key:"isDisabled",value:function isDisabled(){return this.hasInput()&&this.input.prop("disabled")===true}},{key:"disable",value:function disable(){if(this.hasInput()){this.input.prop("disabled",true)}}},{key:"enable",value:function enable(){if(this.hasInput()){this.input.prop("disabled",false)}}},{key:"update",value:function update(){if(!this.hasInput()){return}if(this.colorpicker.options.autoInputFallback===false&&this.colorpicker.colorHandler.isInvalidColor()){return}this.setValue(this.getFormattedColor())}},{key:"onchange",value:function onchange(e){this.colorpicker.lastEvent.alias="input.change";this.colorpicker.lastEvent.e=e;var val=this.getValue();if(val!==e.value){this.colorpicker.setValue(val)}}},{key:"onkeyup",value:function onkeyup(e){this.colorpicker.lastEvent.alias="input.keyup";this.colorpicker.lastEvent.e=e;var val=this.getValue();if(val!==e.value){this.colorpicker.setValue(val)}}}]);return InputHandler}();exports.default=InputHandler;module.exports=exports.default},function(module,exports,__webpack_require__){"use strict";var colorString=__webpack_require__(17);var convert=__webpack_require__(20);var _slice=[].slice;var skippedModels=["keyword","gray","hex"];var hashedModelKeys={};Object.keys(convert).forEach(function(model){hashedModelKeys[_slice.call(convert[model].labels).sort().join("")]=model});var limiters={};function Color(obj,model){if(!(this instanceof Color)){return new Color(obj,model)}if(model&&model in skippedModels){model=null}if(model&&!(model in convert)){throw new Error("Unknown model: "+model)}var i;var channels;if(obj==null){this.model="rgb";this.color=[0,0,0];this.valpha=1}else if(obj instanceof Color){this.model=obj.model;this.color=obj.color.slice();this.valpha=obj.valpha}else if(typeof obj==="string"){var result=colorString.get(obj);if(result===null){throw new Error("Unable to parse color from string: "+obj)}this.model=result.model;channels=convert[this.model].channels;this.color=result.value.slice(0,channels);this.valpha=typeof result.value[channels]==="number"?result.value[channels]:1}else if(obj.length){this.model=model||"rgb";channels=convert[this.model].channels;var newArr=_slice.call(obj,0,channels);this.color=zeroArray(newArr,channels);this.valpha=typeof obj[channels]==="number"?obj[channels]:1}else if(typeof obj==="number"){obj&=16777215;this.model="rgb";this.color=[obj>>16&255,obj>>8&255,obj&255];this.valpha=1}else{this.valpha=1;var keys=Object.keys(obj);if("alpha"in obj){keys.splice(keys.indexOf("alpha"),1);this.valpha=typeof obj.alpha==="number"?obj.alpha:0}var hashedKeys=keys.sort().join("");if(!(hashedKeys in hashedModelKeys)){throw new Error("Unable to parse color from object: "+JSON.stringify(obj))}this.model=hashedModelKeys[hashedKeys];var labels=convert[this.model].labels;var color=[];for(i=0;ilum2){return(lum1+.05)/(lum2+.05)}return(lum2+.05)/(lum1+.05)},level:function(color2){var contrastRatio=this.contrast(color2);if(contrastRatio>=7.1){return"AAA"}return contrastRatio>=4.5?"AA":""},isDark:function(){var rgb=this.rgb().color;var yiq=(rgb[0]*299+rgb[1]*587+rgb[2]*114)/1e3;return yiq<128},isLight:function(){return!this.isDark()},negate:function(){var rgb=this.rgb();for(var i=0;i<3;i++){rgb.color[i]=255-rgb.color[i]}return rgb},lighten:function(ratio){var hsl=this.hsl();hsl.color[2]+=hsl.color[2]*ratio;return hsl},darken:function(ratio){var hsl=this.hsl();hsl.color[2]-=hsl.color[2]*ratio;return hsl},saturate:function(ratio){var hsl=this.hsl();hsl.color[1]+=hsl.color[1]*ratio;return hsl},desaturate:function(ratio){var hsl=this.hsl();hsl.color[1]-=hsl.color[1]*ratio;return hsl},whiten:function(ratio){var hwb=this.hwb();hwb.color[1]+=hwb.color[1]*ratio;return hwb},blacken:function(ratio){var hwb=this.hwb();hwb.color[2]+=hwb.color[2]*ratio;return hwb},grayscale:function(){var rgb=this.rgb().color;var val=rgb[0]*.3+rgb[1]*.59+rgb[2]*.11;return Color.rgb(val,val,val)},fade:function(ratio){return this.alpha(this.valpha-this.valpha*ratio)},opaquer:function(ratio){return this.alpha(this.valpha+this.valpha*ratio)},rotate:function(degrees){var hsl=this.hsl();var hue=hsl.color[0];hue=(hue+degrees)%360;hue=hue<0?360+hue:hue;hsl.color[0]=hue;return hsl},mix:function(mixinColor,weight){if(!mixinColor||!mixinColor.rgb){throw new Error('Argument to "mix" was not a Color instance, but rather an instance of '+typeof mixinColor)}var color1=mixinColor.rgb();var color2=this.rgb();var p=weight===undefined?.5:weight;var w=2*p-1;var a=color1.alpha()-color2.alpha();var w1=((w*a===-1?w:(w+a)/(1+w*a))+1)/2;var w2=1-w1;return Color.rgb(w1*color1.red()+w2*color2.red(),w1*color1.green()+w2*color2.green(),w1*color1.blue()+w2*color2.blue(),color1.alpha()*p+color2.alpha()*(1-p))}};Object.keys(convert).forEach(function(model){if(skippedModels.indexOf(model)!==-1){return}var channels=convert[model].channels;Color.prototype[model]=function(){if(this.model===model){return new Color(this)}if(arguments.length){return new Color(arguments,model)}var newAlpha=typeof arguments[channels]==="number"?channels:this.valpha;return new Color(assertArray(convert[this.model][model].raw(this.color)).concat(newAlpha),model)};Color[model]=function(color){if(typeof color==="number"){color=zeroArray(_slice.call(arguments),channels)}return new Color(color,model)}});function roundTo(num,places){return Number(num.toFixed(places))}function roundToPlace(places){return function(num){return roundTo(num,places)}}function getset(model,channel,modifier){model=Array.isArray(model)?model:[model];model.forEach(function(m){(limiters[m]||(limiters[m]=[]))[channel]=modifier});model=model[0];return function(val){var result;if(arguments.length){if(modifier){val=modifier(val)}result=this[model]();result.color[channel]=val;return result}result=this[model]().color[channel];if(modifier){result=modifier(result)}return result}}function maxfn(max){return function(v){return Math.max(0,Math.min(max,v))}}function assertArray(val){return Array.isArray(val)?val:[val]}function zeroArray(arr,length){for(var i=0;i=4&&hwba[3]!==1){a=", "+hwba[3]}return"hwb("+hwba[0]+", "+hwba[1]+"%, "+hwba[2]+"%"+a+")"};cs.to.keyword=function(rgb){return reverseNames[rgb.slice(0,3)]};function clamp(num,min,max){return Math.min(Math.max(min,num),max)}function hexDouble(num){var str=num.toString(16).toUpperCase();return str.length<2?"0"+str:str}},function(module,exports,__webpack_require__){"use strict";var isArrayish=__webpack_require__(19);var concat=Array.prototype.concat;var slice=Array.prototype.slice;var swizzle=module.exports=function swizzle(args){var results=[];for(var i=0,len=args.length;i=0&&obj.splice instanceof Function}},function(module,exports,__webpack_require__){var conversions=__webpack_require__(6);var route=__webpack_require__(21);var convert={};var models=Object.keys(conversions);function wrapRaw(fn){var wrappedFn=function(args){if(args===undefined||args===null){return args}if(arguments.length>1){args=Array.prototype.slice.call(arguments)}return fn(args)};if("conversion"in fn){wrappedFn.conversion=fn.conversion}return wrappedFn}function wrapRounded(fn){var wrappedFn=function(args){if(args===undefined||args===null){return args}if(arguments.length>1){args=Array.prototype.slice.call(arguments)}var result=fn(args);if(typeof result==="object"){for(var len=result.length,i=0;i1&&arguments[1]!==undefined?arguments[1]:true;var color=new _ColorItem2.default(this.resolveColorDelegate(val),this.format);if(!color.isValid()){if(fallbackOnInvalid){color=this.getFallbackColor()}this.colorpicker.trigger("colorpickerInvalid",color,val)}if(!this.isAlphaEnabled()){color.alpha=1}return color}},{key:"getFallbackColor",value:function getFallbackColor(){if(this.fallback&&this.fallback===this.color){return this.color}var fallback=this.resolveColorDelegate(this.fallback);var color=new _ColorItem2.default(fallback,this.format);if(!color.isValid()){console.warn("The fallback color is invalid. Falling back to the previous color or black if any.");return this.color?this.color:new _ColorItem2.default("#000000",this.format)}return color}},{key:"assureColor",value:function assureColor(){if(!this.hasColor()){this.color=this.getFallbackColor()}return this.color}},{key:"resolveColorDelegate",value:function resolveColorDelegate(color){var realColor=arguments.length>1&&arguments[1]!==undefined?arguments[1]:true;var extResolvedColor=false;_jquery2.default.each(this.colorpicker.extensions,function(name,ext){if(extResolvedColor!==false){return}extResolvedColor=ext.resolveColor(color,realColor)});return extResolvedColor?extResolvedColor:color}},{key:"isInvalidColor",value:function isInvalidColor(){return!this.hasColor()||!this.color.isValid()}},{key:"isAlphaEnabled",value:function isAlphaEnabled(){return this.colorpicker.options.useAlpha!==false}},{key:"hasColor",value:function hasColor(){return this.color instanceof _ColorItem2.default}},{key:"fallback",get:function get(){return this.colorpicker.options.fallbackColor?this.colorpicker.options.fallbackColor:this.hasColor()?this.color:null}},{key:"format",get:function get(){if(this.colorpicker.options.format){return this.colorpicker.options.format}if(this.hasColor()&&this.color.hasTransparency()&&this.color.format.match(/^hex/)){return this.isAlphaEnabled()?"rgba":"hex"}if(this.hasColor()){return this.color.format}return"rgb"}},{key:"color",get:function get(){return this.colorpicker.element.data("color")},set:function set(value){this.colorpicker.element.data("color",value);if(value instanceof _ColorItem2.default&&this.colorpicker.options.format==="auto"){this.colorpicker.options.format=this.color.format}}}]);return ColorHandler}();exports.default=ColorHandler;module.exports=exports.default},function(module,exports,__webpack_require__){"use strict";Object.defineProperty(exports,"__esModule",{value:true});var _createClass=function(){function defineProperties(target,props){for(var i=0;i0){icn.css(styles)}else{this.addon.css(styles)}}}]);return AddonHandler}();exports.default=AddonHandler;module.exports=exports.default}])}); -//# sourceMappingURL=bootstrap-colorpicker.min.js.map \ No newline at end of file diff --git a/addons/web_flectra/static/lib/spectrum/css/spectrum.css b/addons/web_flectra/static/lib/spectrum/css/spectrum.css new file mode 100644 index 0000000000..a8ad9e4f82 --- /dev/null +++ b/addons/web_flectra/static/lib/spectrum/css/spectrum.css @@ -0,0 +1,507 @@ +/*** +Spectrum Colorpicker v1.8.0 +https://github.com/bgrins/spectrum +Author: Brian Grinstead +License: MIT +***/ + +.sp-container { + position:absolute; + top:0; + left:0; + display:inline-block; + *display: inline; + *zoom: 1; + /* https://github.com/bgrins/spectrum/issues/40 */ + z-index: 9999994; + overflow: hidden; +} +.sp-container.sp-flat { + position: relative; +} + +/* Fix for * { box-sizing: border-box; } */ +.sp-container, +.sp-container * { + -webkit-box-sizing: content-box; + -moz-box-sizing: content-box; + box-sizing: content-box; +} + +/* http://ansciath.tumblr.com/post/7347495869/css-aspect-ratio */ +.sp-top { + position:relative; + width: 100%; + display:inline-block; +} +.sp-top-inner { + position:absolute; + top:0; + left:0; + bottom:0; + right:0; +} +.sp-color { + position: absolute; + top:0; + left:0; + bottom:0; + right:20%; +} +.sp-hue { + position: absolute; + top:0; + right:0; + bottom:0; + left:84%; + height: 100%; +} + +.sp-clear-enabled .sp-hue { + top:33px; + height: 77.5%; +} + +.sp-fill { + padding-top: 80%; +} +.sp-sat, .sp-val { + position: absolute; + top:0; + left:0; + right:0; + bottom:0; +} + +.sp-alpha-enabled .sp-top { + margin-bottom: 18px; +} +.sp-alpha-enabled .sp-alpha { + display: block; +} +.sp-alpha-handle { + position:absolute; + top:-4px; + bottom: -4px; + width: 6px; + left: 50%; + cursor: pointer; + border: 1px solid black; + background: white; + opacity: .8; +} +.sp-alpha { + display: none; + position: absolute; + bottom: -14px; + right: 0; + left: 0; + height: 8px; +} +.sp-alpha-inner { + border: solid 1px #333; +} + +.sp-clear { + display: none; +} + +.sp-clear.sp-clear-display { + background-position: center; +} + +.sp-clear-enabled .sp-clear { + display: block; + position:absolute; + top:0px; + right:0; + bottom:0; + left:84%; + height: 28px; +} + +/* Don't allow text selection */ +.sp-container, .sp-replacer, .sp-preview, .sp-dragger, .sp-slider, .sp-alpha, .sp-clear, .sp-alpha-handle, .sp-container.sp-dragging .sp-input, .sp-container button { + -webkit-user-select:none; + -moz-user-select: -moz-none; + -o-user-select:none; + user-select: none; +} + +.sp-container.sp-input-disabled .sp-input-container { + display: none; +} +.sp-container.sp-buttons-disabled .sp-button-container { + display: none; +} +.sp-container.sp-palette-buttons-disabled .sp-palette-button-container { + display: none; +} +.sp-palette-only .sp-picker-container { + display: none; +} +.sp-palette-disabled .sp-palette-container { + display: none; +} + +.sp-initial-disabled .sp-initial { + display: none; +} + + +/* Gradients for hue, saturation and value instead of images. Not pretty... but it works */ +.sp-sat { + background-image: -webkit-gradient(linear, 0 0, 100% 0, from(#FFF), to(rgba(204, 154, 129, 0))); + background-image: -webkit-linear-gradient(left, #FFF, rgba(204, 154, 129, 0)); + background-image: -moz-linear-gradient(left, #fff, rgba(204, 154, 129, 0)); + background-image: -o-linear-gradient(left, #fff, rgba(204, 154, 129, 0)); + background-image: -ms-linear-gradient(left, #fff, rgba(204, 154, 129, 0)); + background-image: linear-gradient(to right, #fff, rgba(204, 154, 129, 0)); + -ms-filter: "progid:DXImageTransform.Microsoft.gradient(GradientType = 1, startColorstr=#FFFFFFFF, endColorstr=#00CC9A81)"; + filter : progid:DXImageTransform.Microsoft.gradient(GradientType = 1, startColorstr='#FFFFFFFF', endColorstr='#00CC9A81'); +} +.sp-val { + background-image: -webkit-gradient(linear, 0 100%, 0 0, from(#000000), to(rgba(204, 154, 129, 0))); + background-image: -webkit-linear-gradient(bottom, #000000, rgba(204, 154, 129, 0)); + background-image: -moz-linear-gradient(bottom, #000, rgba(204, 154, 129, 0)); + background-image: -o-linear-gradient(bottom, #000, rgba(204, 154, 129, 0)); + background-image: -ms-linear-gradient(bottom, #000, rgba(204, 154, 129, 0)); + background-image: linear-gradient(to top, #000, rgba(204, 154, 129, 0)); + -ms-filter: "progid:DXImageTransform.Microsoft.gradient(startColorstr=#00CC9A81, endColorstr=#FF000000)"; + filter : progid:DXImageTransform.Microsoft.gradient(startColorstr='#00CC9A81', endColorstr='#FF000000'); +} + +.sp-hue { + background: -moz-linear-gradient(top, #ff0000 0%, #ffff00 17%, #00ff00 33%, #00ffff 50%, #0000ff 67%, #ff00ff 83%, #ff0000 100%); + background: -ms-linear-gradient(top, #ff0000 0%, #ffff00 17%, #00ff00 33%, #00ffff 50%, #0000ff 67%, #ff00ff 83%, #ff0000 100%); + background: -o-linear-gradient(top, #ff0000 0%, #ffff00 17%, #00ff00 33%, #00ffff 50%, #0000ff 67%, #ff00ff 83%, #ff0000 100%); + background: -webkit-gradient(linear, left top, left bottom, from(#ff0000), color-stop(0.17, #ffff00), color-stop(0.33, #00ff00), color-stop(0.5, #00ffff), color-stop(0.67, #0000ff), color-stop(0.83, #ff00ff), to(#ff0000)); + background: -webkit-linear-gradient(top, #ff0000 0%, #ffff00 17%, #00ff00 33%, #00ffff 50%, #0000ff 67%, #ff00ff 83%, #ff0000 100%); + background: linear-gradient(to bottom, #ff0000 0%, #ffff00 17%, #00ff00 33%, #00ffff 50%, #0000ff 67%, #ff00ff 83%, #ff0000 100%); +} + +/* IE filters do not support multiple color stops. + Generate 6 divs, line them up, and do two color gradients for each. + Yes, really. + */ +.sp-1 { + height:17%; + filter: progid:DXImageTransform.Microsoft.gradient(startColorstr='#ff0000', endColorstr='#ffff00'); +} +.sp-2 { + height:16%; + filter: progid:DXImageTransform.Microsoft.gradient(startColorstr='#ffff00', endColorstr='#00ff00'); +} +.sp-3 { + height:17%; + filter: progid:DXImageTransform.Microsoft.gradient(startColorstr='#00ff00', endColorstr='#00ffff'); +} +.sp-4 { + height:17%; + filter: progid:DXImageTransform.Microsoft.gradient(startColorstr='#00ffff', endColorstr='#0000ff'); +} +.sp-5 { + height:16%; + filter: progid:DXImageTransform.Microsoft.gradient(startColorstr='#0000ff', endColorstr='#ff00ff'); +} +.sp-6 { + height:17%; + filter: progid:DXImageTransform.Microsoft.gradient(startColorstr='#ff00ff', endColorstr='#ff0000'); +} + +.sp-hidden { + display: none !important; +} + +/* Clearfix hack */ +.sp-cf:before, .sp-cf:after { content: ""; display: table; } +.sp-cf:after { clear: both; } +.sp-cf { *zoom: 1; } + +/* Mobile devices, make hue slider bigger so it is easier to slide */ +@media (max-device-width: 480px) { + .sp-color { right: 40%; } + .sp-hue { left: 63%; } + .sp-fill { padding-top: 60%; } +} +.sp-dragger { + border-radius: 5px; + height: 5px; + width: 5px; + border: 1px solid #fff; + background: #000; + cursor: pointer; + position:absolute; + top:0; + left: 0; +} +.sp-slider { + position: absolute; + top:0; + cursor:pointer; + height: 3px; + left: -1px; + right: -1px; + border: 1px solid #000; + background: white; + opacity: .8; +} + +/* +Theme authors: +Here are the basic themeable display options (colors, fonts, global widths). +See http://bgrins.github.io/spectrum/themes/ for instructions. +*/ + +.sp-container { + border-radius: 0; + background-color: #ECECEC; + border: solid 1px #f0c49B; + padding: 0; +} +.sp-container, .sp-container button, .sp-container input, .sp-color, .sp-hue, .sp-clear { + font: normal 12px "Lucida Grande", "Lucida Sans Unicode", "Lucida Sans", Geneva, Verdana, sans-serif; + -webkit-box-sizing: border-box; + -moz-box-sizing: border-box; + -ms-box-sizing: border-box; + box-sizing: border-box; +} +.sp-top { + margin-bottom: 3px; +} +.sp-color, .sp-hue, .sp-clear { + border: solid 1px #666; +} + +/* Input */ +.sp-input-container { + float:right; + width: 100px; + margin-bottom: 4px; +} +.sp-initial-disabled .sp-input-container { + width: 100%; +} +.sp-input { + font-size: 12px !important; + border: 1px inset; + padding: 4px 5px; + margin: 0; + width: 100%; + background:transparent; + border-radius: 3px; + color: #222; +} +.sp-input:focus { + border: 1px solid orange; +} +.sp-input.sp-validation-error { + border: 1px solid red; + background: #fdd; +} +.sp-picker-container , .sp-palette-container { + float:left; + position: relative; + padding: 10px; + padding-bottom: 300px; + margin-bottom: -290px; +} +.sp-picker-container { + width: 172px; + border-left: solid 1px #fff; +} + +/* Palettes */ +.sp-palette-container { + border-right: solid 1px #ccc; +} + +.sp-palette-only .sp-palette-container { + border: 0; +} + +.sp-palette .sp-thumb-el { + display: block; + position:relative; + float:left; + width: 24px; + height: 15px; + margin: 3px; + cursor: pointer; + border:solid 2px transparent; +} +.sp-palette .sp-thumb-el:hover, .sp-palette .sp-thumb-el.sp-thumb-active { + border-color: orange; +} +.sp-thumb-el { + position:relative; +} + +/* Initial */ +.sp-initial { + float: left; + border: solid 1px #333; +} +.sp-initial span { + width: 30px; + height: 25px; + border:none; + display:block; + float:left; + margin:0; +} + +.sp-initial .sp-clear-display { + background-position: center; +} + +/* Buttons */ +.sp-palette-button-container, +.sp-button-container { + float: right; +} + +/* Replacer (the little preview div that shows up instead of the ) */ +.sp-replacer { + margin:0; + overflow:hidden; + cursor:pointer; + padding: 4px; + display:inline-block; + *zoom: 1; + *display: inline; + border: solid 1px #91765d; + background: #eee; + color: #333; + vertical-align: middle; +} +.sp-replacer:hover, .sp-replacer.sp-active { + border-color: #F0C49B; + color: #111; +} +.sp-replacer.sp-disabled { + cursor:default; + border-color: silver; + color: silver; +} +.sp-dd { + padding: 2px 0; + height: 16px; + line-height: 16px; + float:left; + font-size:10px; +} +.sp-preview { + position:relative; + width:25px; + height: 20px; + border: solid 1px #222; + margin-right: 5px; + float:left; + z-index: 0; +} + +.sp-palette { + *width: 220px; + max-width: 220px; +} +.sp-palette .sp-thumb-el { + width:16px; + height: 16px; + margin:2px 1px; + border: solid 1px #d0d0d0; +} + +.sp-container { + padding-bottom:0; +} + + +/* Buttons: http://hellohappy.org/css3-buttons/ */ +.sp-container button { + background-color: #eeeeee; + background-image: -webkit-linear-gradient(top, #eeeeee, #cccccc); + background-image: -moz-linear-gradient(top, #eeeeee, #cccccc); + background-image: -ms-linear-gradient(top, #eeeeee, #cccccc); + background-image: -o-linear-gradient(top, #eeeeee, #cccccc); + background-image: linear-gradient(to bottom, #eeeeee, #cccccc); + border: 1px solid #ccc; + border-bottom: 1px solid #bbb; + border-radius: 3px; + color: #333; + font-size: 14px; + line-height: 1; + padding: 5px 4px; + text-align: center; + text-shadow: 0 1px 0 #eee; + vertical-align: middle; +} +.sp-container button:hover { + background-color: #dddddd; + background-image: -webkit-linear-gradient(top, #dddddd, #bbbbbb); + background-image: -moz-linear-gradient(top, #dddddd, #bbbbbb); + background-image: -ms-linear-gradient(top, #dddddd, #bbbbbb); + background-image: -o-linear-gradient(top, #dddddd, #bbbbbb); + background-image: linear-gradient(to bottom, #dddddd, #bbbbbb); + border: 1px solid #bbb; + border-bottom: 1px solid #999; + cursor: pointer; + text-shadow: 0 1px 0 #ddd; +} +.sp-container button:active { + border: 1px solid #aaa; + border-bottom: 1px solid #888; + -webkit-box-shadow: inset 0 0 5px 2px #aaaaaa, 0 1px 0 0 #eeeeee; + -moz-box-shadow: inset 0 0 5px 2px #aaaaaa, 0 1px 0 0 #eeeeee; + -ms-box-shadow: inset 0 0 5px 2px #aaaaaa, 0 1px 0 0 #eeeeee; + -o-box-shadow: inset 0 0 5px 2px #aaaaaa, 0 1px 0 0 #eeeeee; + box-shadow: inset 0 0 5px 2px #aaaaaa, 0 1px 0 0 #eeeeee; +} +.sp-cancel { + font-size: 11px; + color: #d93f3f !important; + margin:0; + padding:2px; + margin-right: 5px; + vertical-align: middle; + text-decoration:none; + +} +.sp-cancel:hover { + color: #d93f3f !important; + text-decoration: underline; +} + + +.sp-palette span:hover, .sp-palette span.sp-thumb-active { + border-color: #000; +} + +.sp-preview, .sp-alpha, .sp-thumb-el { + position:relative; + background-image: url(data:image/png;base64,iVBORw0KGgoAAAANSUhEUgAAAAwAAAAMCAIAAADZF8uwAAAAGUlEQVQYV2M4gwH+YwCGIasIUwhT25BVBADtzYNYrHvv4gAAAABJRU5ErkJggg==); +} +.sp-preview-inner, .sp-alpha-inner, .sp-thumb-inner { + display:block; + position:absolute; + top:0;left:0;bottom:0;right:0; +} + +.sp-palette .sp-thumb-inner { + background-position: 50% 50%; + background-repeat: no-repeat; +} + +.sp-palette .sp-thumb-light.sp-thumb-active .sp-thumb-inner { + background-image: url(data:image/png;base64,iVBORw0KGgoAAAANSUhEUgAAABIAAAASCAYAAABWzo5XAAAAGXRFWHRTb2Z0d2FyZQBBZG9iZSBJbWFnZVJlYWR5ccllPAAAAIVJREFUeNpiYBhsgJFMffxAXABlN5JruT4Q3wfi/0DsT64h8UD8HmpIPCWG/KemIfOJCUB+Aoacx6EGBZyHBqI+WsDCwuQ9mhxeg2A210Ntfo8klk9sOMijaURm7yc1UP2RNCMbKE9ODK1HM6iegYLkfx8pligC9lCD7KmRof0ZhjQACDAAceovrtpVBRkAAAAASUVORK5CYII=); +} + +.sp-palette .sp-thumb-dark.sp-thumb-active .sp-thumb-inner { + background-image: url(data:image/png;base64,iVBORw0KGgoAAAANSUhEUgAAABIAAAASCAYAAABWzo5XAAAAAXNSR0IArs4c6QAAAARnQU1BAACxjwv8YQUAAAAJcEhZcwAADsMAAA7DAcdvqGQAAAAadEVYdFNvZnR3YXJlAFBhaW50Lk5FVCB2My41LjEwMPRyoQAAAMdJREFUOE+tkgsNwzAMRMugEAahEAahEAZhEAqlEAZhEAohEAYh81X2dIm8fKpEspLGvudPOsUYpxE2BIJCroJmEW9qJ+MKaBFhEMNabSy9oIcIPwrB+afvAUFoK4H0tMaQ3XtlrggDhOVVMuT4E5MMG0FBbCEYzjYT7OxLEvIHQLY2zWwQ3D+9luyOQTfKDiFD3iUIfPk8VqrKjgAiSfGFPecrg6HN6m/iBcwiDAo7WiBeawa+Kwh7tZoSCGLMqwlSAzVDhoK+6vH4G0P5wdkAAAAASUVORK5CYII=); +} + +.sp-clear-display { + background-repeat:no-repeat; + background-position: center; + background-image: url(data:image/gif;base64,R0lGODlhFAAUAPcAAAAAAJmZmZ2dnZ6enqKioqOjo6SkpKWlpaampqenp6ioqKmpqaqqqqurq/Hx8fLy8vT09PX19ff39/j4+Pn5+fr6+vv7+wAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAACH5BAEAAP8ALAAAAAAUABQAAAihAP9FoPCvoMGDBy08+EdhQAIJCCMybCDAAYUEARBAlFiQQoMABQhKUJBxY0SPICEYHBnggEmDKAuoPMjS5cGYMxHW3IiT478JJA8M/CjTZ0GgLRekNGpwAsYABHIypcAgQMsITDtWJYBR6NSqMico9cqR6tKfY7GeBCuVwlipDNmefAtTrkSzB1RaIAoXodsABiZAEFB06gIBWC1mLVgBa0AAOw==); +} diff --git a/addons/web_flectra/static/lib/spectrum/js/spectrum.js b/addons/web_flectra/static/lib/spectrum/js/spectrum.js new file mode 100644 index 0000000000..e129e18409 --- /dev/null +++ b/addons/web_flectra/static/lib/spectrum/js/spectrum.js @@ -0,0 +1,2341 @@ +// Spectrum Colorpicker v1.8.0 +// https://github.com/bgrins/spectrum +// Author: Brian Grinstead +// License: MIT + +(function (factory) { + "use strict"; + + if (typeof define === 'function' && define.amd) { // AMD + define(['jquery'], factory); + } + else if (typeof exports == "object" && typeof module == "object") { // CommonJS + module.exports = factory(require('jquery')); + } + else { // Browser + factory(jQuery); + } +})(function($, undefined) { + "use strict"; + + var defaultOpts = { + + // Callbacks + beforeShow: noop, + move: noop, + change: noop, + show: noop, + hide: noop, + + // Options + color: false, + flat: false, + showInput: false, + allowEmpty: false, + showButtons: true, + clickoutFiresChange: true, + showInitial: false, + showPalette: false, + showPaletteOnly: false, + hideAfterPaletteSelect: false, + togglePaletteOnly: false, + showSelectionPalette: true, + localStorageKey: false, + appendTo: "body", + maxSelectionSize: 7, + cancelText: "cancel", + chooseText: "choose", + togglePaletteMoreText: "more", + togglePaletteLessText: "less", + clearText: "Clear Color Selection", + noColorSelectedText: "No Color Selected", + preferredFormat: false, + className: "", // Deprecated - use containerClassName and replacerClassName instead. + containerClassName: "", + replacerClassName: "", + showAlpha: false, + theme: "sp-light", + palette: [["#ffffff", "#000000", "#ff0000", "#ff8000", "#ffff00", "#008000", "#0000ff", "#4b0082", "#9400d3"]], + selectionPalette: [], + disabled: false, + offset: null + }, + spectrums = [], + IE = !!/msie/i.exec( window.navigator.userAgent ), + rgbaSupport = (function() { + function contains( str, substr ) { + return !!~('' + str).indexOf(substr); + } + + var elem = document.createElement('div'); + var style = elem.style; + style.cssText = 'background-color:rgba(0,0,0,.5)'; + return contains(style.backgroundColor, 'rgba') || contains(style.backgroundColor, 'hsla'); + })(), + replaceInput = [ + "
", + "
", + "
▼
", + "
" + ].join(''), + markup = (function () { + + // IE does not support gradients with multiple stops, so we need to simulate + // that for the rainbow slider with 8 divs that each have a single gradient + var gradientFix = ""; + if (IE) { + for (var i = 1; i <= 6; i++) { + gradientFix += "
"; + } + } + + return [ + "
", + "
", + "
", + "
", + "", + "
", + "
", + "
", + "
", + "
", + "
", + "
", + "
", + "
", + "
", + "
", + "
", + "
", + "
", + "
", + "
", + "
", + gradientFix, + "
", + "
", + "
", + "
", + "
", + "", + "
", + "
", + "
", + "", + "", + "
", + "
", + "
" + ].join(""); + })(); + + function paletteTemplate (p, color, className, opts) { + var html = []; + for (var i = 0; i < p.length; i++) { + var current = p[i]; + if(current) { + var tiny = tinycolor(current); + var c = tiny.toHsl().l < 0.5 ? "sp-thumb-el sp-thumb-dark" : "sp-thumb-el sp-thumb-light"; + c += (tinycolor.equals(color, current)) ? " sp-thumb-active" : ""; + var formattedString = tiny.toString(opts.preferredFormat || "rgb"); + var swatchStyle = rgbaSupport ? ("background-color:" + tiny.toRgbString()) : "filter:" + tiny.toFilter(); + html.push(''); + } else { + var cls = 'sp-clear-display'; + html.push($('
') + .append($('') + .attr('title', opts.noColorSelectedText) + ) + .html() + ); + } + } + return "
" + html.join('') + "
"; + } + + function hideAll() { + for (var i = 0; i < spectrums.length; i++) { + if (spectrums[i]) { + spectrums[i].hide(); + } + } + } + + function instanceOptions(o, callbackContext) { + var opts = $.extend({}, defaultOpts, o); + opts.callbacks = { + 'move': bind(opts.move, callbackContext), + 'change': bind(opts.change, callbackContext), + 'show': bind(opts.show, callbackContext), + 'hide': bind(opts.hide, callbackContext), + 'beforeShow': bind(opts.beforeShow, callbackContext) + }; + + return opts; + } + + function spectrum(element, o) { + + var opts = instanceOptions(o, element), + flat = opts.flat, + showSelectionPalette = opts.showSelectionPalette, + localStorageKey = opts.localStorageKey, + theme = opts.theme, + callbacks = opts.callbacks, + resize = throttle(reflow, 10), + visible = false, + isDragging = false, + dragWidth = 0, + dragHeight = 0, + dragHelperHeight = 0, + slideHeight = 0, + slideWidth = 0, + alphaWidth = 0, + alphaSlideHelperWidth = 0, + slideHelperHeight = 0, + currentHue = 0, + currentSaturation = 0, + currentValue = 0, + currentAlpha = 1, + palette = [], + paletteArray = [], + paletteLookup = {}, + selectionPalette = opts.selectionPalette.slice(0), + maxSelectionSize = opts.maxSelectionSize, + draggingClass = "sp-dragging", + shiftMovementDirection = null; + + var doc = element.ownerDocument, + body = doc.body, + boundElement = $(element), + disabled = false, + container = $(markup, doc).addClass(theme), + pickerContainer = container.find(".sp-picker-container"), + dragger = container.find(".sp-color"), + dragHelper = container.find(".sp-dragger"), + slider = container.find(".sp-hue"), + slideHelper = container.find(".sp-slider"), + alphaSliderInner = container.find(".sp-alpha-inner"), + alphaSlider = container.find(".sp-alpha"), + alphaSlideHelper = container.find(".sp-alpha-handle"), + textInput = container.find(".sp-input"), + paletteContainer = container.find(".sp-palette"), + initialColorContainer = container.find(".sp-initial"), + cancelButton = container.find(".sp-cancel"), + clearButton = container.find(".sp-clear"), + chooseButton = container.find(".sp-choose"), + toggleButton = container.find(".sp-palette-toggle"), + isInput = boundElement.is("input"), + isInputTypeColor = isInput && boundElement.attr("type") === "color" && inputTypeColorSupport(), + shouldReplace = isInput && !flat, + replacer = (shouldReplace) ? $(replaceInput).addClass(theme).addClass(opts.className).addClass(opts.replacerClassName) : $([]), + offsetElement = (shouldReplace) ? replacer : boundElement, + previewElement = replacer.find(".sp-preview-inner"), + initialColor = opts.color || (isInput && boundElement.val()), + colorOnShow = false, + currentPreferredFormat = opts.preferredFormat, + clickoutFiresChange = !opts.showButtons || opts.clickoutFiresChange, + isEmpty = !initialColor, + allowEmpty = opts.allowEmpty && !isInputTypeColor; + + function applyOptions() { + + if (opts.showPaletteOnly) { + opts.showPalette = true; + } + + toggleButton.text(opts.showPaletteOnly ? opts.togglePaletteMoreText : opts.togglePaletteLessText); + + if (opts.palette) { + palette = opts.palette.slice(0); + paletteArray = $.isArray(palette[0]) ? palette : [palette]; + paletteLookup = {}; + for (var i = 0; i < paletteArray.length; i++) { + for (var j = 0; j < paletteArray[i].length; j++) { + var rgb = tinycolor(paletteArray[i][j]).toRgbString(); + paletteLookup[rgb] = true; + } + } + } + + container.toggleClass("sp-flat", flat); + container.toggleClass("sp-input-disabled", !opts.showInput); + container.toggleClass("sp-alpha-enabled", opts.showAlpha); + container.toggleClass("sp-clear-enabled", allowEmpty); + container.toggleClass("sp-buttons-disabled", !opts.showButtons); + container.toggleClass("sp-palette-buttons-disabled", !opts.togglePaletteOnly); + container.toggleClass("sp-palette-disabled", !opts.showPalette); + container.toggleClass("sp-palette-only", opts.showPaletteOnly); + container.toggleClass("sp-initial-disabled", !opts.showInitial); + container.addClass(opts.className).addClass(opts.containerClassName); + + reflow(); + } + + function initialize() { + + if (IE) { + container.find("*:not(input)").attr("unselectable", "on"); + } + + applyOptions(); + + if (shouldReplace) { + boundElement.after(replacer).hide(); + } + + if (!allowEmpty) { + clearButton.hide(); + } + + if (flat) { + boundElement.after(container).hide(); + } + else { + + var appendTo = opts.appendTo === "parent" ? boundElement.parent() : $(opts.appendTo); + if (appendTo.length !== 1) { + appendTo = $("body"); + } + + appendTo.append(container); + } + + updateSelectionPaletteFromStorage(); + + offsetElement.on("click.spectrum touchstart.spectrum", function (e) { + if (!disabled) { + toggle(); + } + + e.stopPropagation(); + + if (!$(e.target).is("input")) { + e.preventDefault(); + } + }); + + if(boundElement.is(":disabled") || (opts.disabled === true)) { + disable(); + } + + // Prevent clicks from bubbling up to document. This would cause it to be hidden. + container.click(stopPropagation); + + // Handle user typed input + textInput.change(setFromTextInput); + textInput.on("paste", function () { + setTimeout(setFromTextInput, 1); + }); + textInput.keydown(function (e) { if (e.keyCode == 13) { setFromTextInput(); } }); + + cancelButton.text(opts.cancelText); + cancelButton.on("click.spectrum", function (e) { + e.stopPropagation(); + e.preventDefault(); + revert(); + hide(); + }); + + clearButton.attr("title", opts.clearText); + clearButton.on("click.spectrum", function (e) { + e.stopPropagation(); + e.preventDefault(); + isEmpty = true; + move(); + + if(flat) { + //for the flat style, this is a change event + updateOriginalInput(true); + } + }); + + chooseButton.text(opts.chooseText); + chooseButton.on("click.spectrum", function (e) { + e.stopPropagation(); + e.preventDefault(); + + if (IE && textInput.is(":focus")) { + textInput.trigger('change'); + } + + if (isValid()) { + updateOriginalInput(true); + hide(); + } + }); + + toggleButton.text(opts.showPaletteOnly ? opts.togglePaletteMoreText : opts.togglePaletteLessText); + toggleButton.on("click.spectrum", function (e) { + e.stopPropagation(); + e.preventDefault(); + + opts.showPaletteOnly = !opts.showPaletteOnly; + + // To make sure the Picker area is drawn on the right, next to the + // Palette area (and not below the palette), first move the Palette + // to the left to make space for the picker, plus 5px extra. + // The 'applyOptions' function puts the whole container back into place + // and takes care of the button-text and the sp-palette-only CSS class. + if (!opts.showPaletteOnly && !flat) { + container.css('left', '-=' + (pickerContainer.outerWidth(true) + 5)); + } + applyOptions(); + }); + + draggable(alphaSlider, function (dragX, dragY, e) { + currentAlpha = (dragX / alphaWidth); + isEmpty = false; + if (e.shiftKey) { + currentAlpha = Math.round(currentAlpha * 10) / 10; + } + + move(); + }, dragStart, dragStop); + + draggable(slider, function (dragX, dragY) { + currentHue = parseFloat(dragY / slideHeight); + isEmpty = false; + if (!opts.showAlpha) { + currentAlpha = 1; + } + move(); + }, dragStart, dragStop); + + draggable(dragger, function (dragX, dragY, e) { + + // shift+drag should snap the movement to either the x or y axis. + if (!e.shiftKey) { + shiftMovementDirection = null; + } + else if (!shiftMovementDirection) { + var oldDragX = currentSaturation * dragWidth; + var oldDragY = dragHeight - (currentValue * dragHeight); + var furtherFromX = Math.abs(dragX - oldDragX) > Math.abs(dragY - oldDragY); + + shiftMovementDirection = furtherFromX ? "x" : "y"; + } + + var setSaturation = !shiftMovementDirection || shiftMovementDirection === "x"; + var setValue = !shiftMovementDirection || shiftMovementDirection === "y"; + + if (setSaturation) { + currentSaturation = parseFloat(dragX / dragWidth); + } + if (setValue) { + currentValue = parseFloat((dragHeight - dragY) / dragHeight); + } + + isEmpty = false; + if (!opts.showAlpha) { + currentAlpha = 1; + } + + move(); + + }, dragStart, dragStop); + + if (!!initialColor) { + set(initialColor); + + // In case color was black - update the preview UI and set the format + // since the set function will not run (default color is black). + updateUI(); + currentPreferredFormat = opts.preferredFormat || tinycolor(initialColor).format; + + addColorToSelectionPalette(initialColor); + } + else { + updateUI(); + } + + if (flat) { + show(); + } + + function paletteElementClick(e) { + if (e.data && e.data.ignore) { + set($(e.target).closest(".sp-thumb-el").data("color")); + move(); + } + else { + set($(e.target).closest(".sp-thumb-el").data("color")); + move(); + + // If the picker is going to close immediately, a palette selection + // is a change. Otherwise, it's a move only. + if (opts.hideAfterPaletteSelect) { + updateOriginalInput(true); + hide(); + } else { + updateOriginalInput(); + } + } + + return false; + } + + var paletteEvent = IE ? "mousedown.spectrum" : "click.spectrum touchstart.spectrum"; + paletteContainer.on(paletteEvent, ".sp-thumb-el", paletteElementClick); + initialColorContainer.on(paletteEvent, ".sp-thumb-el:nth-child(1)", { ignore: true }, paletteElementClick); + } + + function updateSelectionPaletteFromStorage() { + + if (localStorageKey && window.localStorage) { + + // Migrate old palettes over to new format. May want to remove this eventually. + try { + var oldPalette = window.localStorage[localStorageKey].split(",#"); + if (oldPalette.length > 1) { + delete window.localStorage[localStorageKey]; + $.each(oldPalette, function(i, c) { + addColorToSelectionPalette(c); + }); + } + } + catch(e) { } + + try { + selectionPalette = window.localStorage[localStorageKey].split(";"); + } + catch (e) { } + } + } + + function addColorToSelectionPalette(color) { + if (showSelectionPalette) { + var rgb = tinycolor(color).toRgbString(); + if (!paletteLookup[rgb] && $.inArray(rgb, selectionPalette) === -1) { + selectionPalette.push(rgb); + while(selectionPalette.length > maxSelectionSize) { + selectionPalette.shift(); + } + } + + if (localStorageKey && window.localStorage) { + try { + window.localStorage[localStorageKey] = selectionPalette.join(";"); + } + catch(e) { } + } + } + } + + function getUniqueSelectionPalette() { + var unique = []; + if (opts.showPalette) { + for (var i = 0; i < selectionPalette.length; i++) { + var rgb = tinycolor(selectionPalette[i]).toRgbString(); + + if (!paletteLookup[rgb]) { + unique.push(selectionPalette[i]); + } + } + } + + return unique.reverse().slice(0, opts.maxSelectionSize); + } + + function drawPalette() { + + var currentColor = get(); + + var html = $.map(paletteArray, function (palette, i) { + return paletteTemplate(palette, currentColor, "sp-palette-row sp-palette-row-" + i, opts); + }); + + updateSelectionPaletteFromStorage(); + + if (selectionPalette) { + html.push(paletteTemplate(getUniqueSelectionPalette(), currentColor, "sp-palette-row sp-palette-row-selection", opts)); + } + + paletteContainer.html(html.join("")); + } + + function drawInitial() { + if (opts.showInitial) { + var initial = colorOnShow; + var current = get(); + initialColorContainer.html(paletteTemplate([initial, current], current, "sp-palette-row-initial", opts)); + } + } + + function dragStart() { + if (dragHeight <= 0 || dragWidth <= 0 || slideHeight <= 0) { + reflow(); + } + isDragging = true; + container.addClass(draggingClass); + shiftMovementDirection = null; + boundElement.trigger('dragstart.spectrum', [ get() ]); + } + + function dragStop() { + isDragging = false; + container.removeClass(draggingClass); + boundElement.trigger('dragstop.spectrum', [ get() ]); + } + + function setFromTextInput() { + + var value = textInput.val(); + + if ((value === null || value === "") && allowEmpty) { + set(null); + move(); + updateOriginalInput(); + } + else { + var tiny = tinycolor(value); + if (tiny.isValid()) { + set(tiny); + move(); + updateOriginalInput(); + } + else { + textInput.addClass("sp-validation-error"); + } + } + } + + function toggle() { + if (visible) { + hide(); + } + else { + show(); + } + } + + function show() { + var event = $.Event('beforeShow.spectrum'); + + if (visible) { + reflow(); + return; + } + + boundElement.trigger(event, [ get() ]); + + if (callbacks.beforeShow(get()) === false || event.isDefaultPrevented()) { + return; + } + + hideAll(); + visible = true; + + $(doc).on("keydown.spectrum", onkeydown); + $(doc).on("click.spectrum", clickout); + $(window).on("resize.spectrum", resize); + replacer.addClass("sp-active"); + container.removeClass("sp-hidden"); + + reflow(); + updateUI(); + + colorOnShow = get(); + + drawInitial(); + callbacks.show(colorOnShow); + boundElement.trigger('show.spectrum', [ colorOnShow ]); + } + + function onkeydown(e) { + // Close on ESC + if (e.keyCode === 27) { + hide(); + } + } + + function clickout(e) { + // Return on right click. + if (e.button == 2) { return; } + + // If a drag event was happening during the mouseup, don't hide + // on click. + if (isDragging) { return; } + + if (clickoutFiresChange) { + updateOriginalInput(true); + } + else { + revert(); + } + hide(); + } + + function hide() { + // Return if hiding is unnecessary + if (!visible || flat) { return; } + visible = false; + + $(doc).off("keydown.spectrum", onkeydown); + $(doc).off("click.spectrum", clickout); + $(window).off("resize.spectrum", resize); + + replacer.removeClass("sp-active"); + container.addClass("sp-hidden"); + + callbacks.hide(get()); + boundElement.trigger('hide.spectrum', [ get() ]); + } + + function revert() { + set(colorOnShow, true); + updateOriginalInput(true); + } + + function set(color, ignoreFormatChange) { + if (tinycolor.equals(color, get())) { + // Update UI just in case a validation error needs + // to be cleared. + updateUI(); + return; + } + + var newColor, newHsv; + if (!color && allowEmpty) { + isEmpty = true; + } else { + isEmpty = false; + newColor = tinycolor(color); + newHsv = newColor.toHsv(); + + currentHue = (newHsv.h % 360) / 360; + currentSaturation = newHsv.s; + currentValue = newHsv.v; + currentAlpha = newHsv.a; + } + updateUI(); + + if (newColor && newColor.isValid() && !ignoreFormatChange) { + currentPreferredFormat = opts.preferredFormat || newColor.getFormat(); + } + } + + function get(opts) { + opts = opts || { }; + + if (allowEmpty && isEmpty) { + return null; + } + + return tinycolor.fromRatio({ + h: currentHue, + s: currentSaturation, + v: currentValue, + a: Math.round(currentAlpha * 1000) / 1000 + }, { format: opts.format || currentPreferredFormat }); + } + + function isValid() { + return !textInput.hasClass("sp-validation-error"); + } + + function move() { + updateUI(); + + callbacks.move(get()); + boundElement.trigger('move.spectrum', [ get() ]); + } + + function updateUI() { + + textInput.removeClass("sp-validation-error"); + + updateHelperLocations(); + + // Update dragger background color (gradients take care of saturation and value). + var flatColor = tinycolor.fromRatio({ h: currentHue, s: 1, v: 1 }); + dragger.css("background-color", flatColor.toHexString()); + + // Get a format that alpha will be included in (hex and names ignore alpha) + var format = currentPreferredFormat; + if (currentAlpha < 1 && !(currentAlpha === 0 && format === "name")) { + if (format === "hex" || format === "hex3" || format === "hex6" || format === "name") { + format = "rgb"; + } + } + + var realColor = get({ format: format }), + displayColor = ''; + + //reset background info for preview element + previewElement.removeClass("sp-clear-display"); + previewElement.css('background-color', 'transparent'); + + if (!realColor && allowEmpty) { + // Update the replaced elements background with icon indicating no color selection + previewElement.addClass("sp-clear-display"); + } + else { + var realHex = realColor.toHexString(), + realRgb = realColor.toRgbString(); + + // Update the replaced elements background color (with actual selected color) + if (rgbaSupport || realColor.alpha === 1) { + previewElement.css("background-color", realRgb); + } + else { + previewElement.css("background-color", "transparent"); + previewElement.css("filter", realColor.toFilter()); + } + + if (opts.showAlpha) { + var rgb = realColor.toRgb(); + rgb.a = 0; + var realAlpha = tinycolor(rgb).toRgbString(); + var gradient = "linear-gradient(left, " + realAlpha + ", " + realHex + ")"; + + if (IE) { + alphaSliderInner.css("filter", tinycolor(realAlpha).toFilter({ gradientType: 1 }, realHex)); + } + else { + alphaSliderInner.css("background", "-webkit-" + gradient); + alphaSliderInner.css("background", "-moz-" + gradient); + alphaSliderInner.css("background", "-ms-" + gradient); + // Use current syntax gradient on unprefixed property. + alphaSliderInner.css("background", + "linear-gradient(to right, " + realAlpha + ", " + realHex + ")"); + } + } + + displayColor = realColor.toString(format); + } + + // Update the text entry input as it changes happen + if (opts.showInput) { + textInput.val(displayColor); + } + + if (opts.showPalette) { + drawPalette(); + } + + drawInitial(); + } + + function updateHelperLocations() { + var s = currentSaturation; + var v = currentValue; + + if(allowEmpty && isEmpty) { + //if selected color is empty, hide the helpers + alphaSlideHelper.hide(); + slideHelper.hide(); + dragHelper.hide(); + } + else { + //make sure helpers are visible + alphaSlideHelper.show(); + slideHelper.show(); + dragHelper.show(); + + // Where to show the little circle in that displays your current selected color + var dragX = s * dragWidth; + var dragY = dragHeight - (v * dragHeight); + dragX = Math.max( + -dragHelperHeight, + Math.min(dragWidth - dragHelperHeight, dragX - dragHelperHeight) + ); + dragY = Math.max( + -dragHelperHeight, + Math.min(dragHeight - dragHelperHeight, dragY - dragHelperHeight) + ); + dragHelper.css({ + "top": dragY + "px", + "left": dragX + "px" + }); + + var alphaX = currentAlpha * alphaWidth; + alphaSlideHelper.css({ + "left": (alphaX - (alphaSlideHelperWidth / 2)) + "px" + }); + + // Where to show the bar that displays your current selected hue + var slideY = (currentHue) * slideHeight; + slideHelper.css({ + "top": (slideY - slideHelperHeight) + "px" + }); + } + } + + function updateOriginalInput(fireCallback) { + var color = get(), + displayColor = '', + hasChanged = !tinycolor.equals(color, colorOnShow); + + if (color) { + displayColor = color.toString(currentPreferredFormat); + // Update the selection palette with the current color + addColorToSelectionPalette(color); + } + + if (isInput) { + boundElement.val(displayColor); + } + + if (fireCallback && hasChanged) { + callbacks.change(color); + boundElement.trigger('change', [ color ]); + } + } + + function reflow() { + if (!visible) { + return; // Calculations would be useless and wouldn't be reliable anyways + } + dragWidth = dragger.width(); + dragHeight = dragger.height(); + dragHelperHeight = dragHelper.height(); + slideWidth = slider.width(); + slideHeight = slider.height(); + slideHelperHeight = slideHelper.height(); + alphaWidth = alphaSlider.width(); + alphaSlideHelperWidth = alphaSlideHelper.width(); + + if (!flat) { + container.css("position", "absolute"); + if (opts.offset) { + container.offset(opts.offset); + } else { + container.offset(getOffset(container, offsetElement)); + } + } + + updateHelperLocations(); + + if (opts.showPalette) { + drawPalette(); + } + + boundElement.trigger('reflow.spectrum'); + } + + function destroy() { + boundElement.show(); + offsetElement.off("click.spectrum touchstart.spectrum"); + container.remove(); + replacer.remove(); + spectrums[spect.id] = null; + } + + function option(optionName, optionValue) { + if (optionName === undefined) { + return $.extend({}, opts); + } + if (optionValue === undefined) { + return opts[optionName]; + } + + opts[optionName] = optionValue; + + if (optionName === "preferredFormat") { + currentPreferredFormat = opts.preferredFormat; + } + applyOptions(); + } + + function enable() { + disabled = false; + boundElement.attr("disabled", false); + offsetElement.removeClass("sp-disabled"); + } + + function disable() { + hide(); + disabled = true; + boundElement.attr("disabled", true); + offsetElement.addClass("sp-disabled"); + } + + function setOffset(coord) { + opts.offset = coord; + reflow(); + } + + initialize(); + + var spect = { + show: show, + hide: hide, + toggle: toggle, + reflow: reflow, + option: option, + enable: enable, + disable: disable, + offset: setOffset, + set: function (c) { + set(c); + updateOriginalInput(); + }, + get: get, + destroy: destroy, + container: container + }; + + spect.id = spectrums.push(spect) - 1; + + return spect; + } + + /** + * checkOffset - get the offset below/above and left/right element depending on screen position + * Thanks https://github.com/jquery/jquery-ui/blob/master/ui/jquery.ui.datepicker.js + */ + function getOffset(picker, input) { + var extraY = 0; + var dpWidth = picker.outerWidth(); + var dpHeight = picker.outerHeight(); + var inputHeight = input.outerHeight(); + var doc = picker[0].ownerDocument; + var docElem = doc.documentElement; + var viewWidth = docElem.clientWidth + $(doc).scrollLeft(); + var viewHeight = docElem.clientHeight + $(doc).scrollTop(); + var offset = input.offset(); + var offsetLeft = offset.left; + var offsetTop = offset.top; + + offsetTop += inputHeight; + + offsetLeft -= + Math.min(offsetLeft, (offsetLeft + dpWidth > viewWidth && viewWidth > dpWidth) ? + Math.abs(offsetLeft + dpWidth - viewWidth) : 0); + + offsetTop -= + Math.min(offsetTop, ((offsetTop + dpHeight > viewHeight && viewHeight > dpHeight) ? + Math.abs(dpHeight + inputHeight - extraY) : extraY)); + + return { + top: offsetTop, + bottom: offset.bottom, + left: offsetLeft, + right: offset.right, + width: offset.width, + height: offset.height + }; + } + + /** + * noop - do nothing + */ + function noop() { + + } + + /** + * stopPropagation - makes the code only doing this a little easier to read in line + */ + function stopPropagation(e) { + e.stopPropagation(); + } + + /** + * Create a function bound to a given object + * Thanks to underscore.js + */ + function bind(func, obj) { + var slice = Array.prototype.slice; + var args = slice.call(arguments, 2); + return function () { + return func.apply(obj, args.concat(slice.call(arguments))); + }; + } + + /** + * Lightweight drag helper. Handles containment within the element, so that + * when dragging, the x is within [0,element.width] and y is within [0,element.height] + */ + function draggable(element, onmove, onstart, onstop) { + onmove = onmove || function () { }; + onstart = onstart || function () { }; + onstop = onstop || function () { }; + var doc = document; + var dragging = false; + var offset = {}; + var maxHeight = 0; + var maxWidth = 0; + var hasTouch = ('ontouchstart' in window); + + var duringDragEvents = {}; + duringDragEvents["selectstart"] = prevent; + duringDragEvents["dragstart"] = prevent; + duringDragEvents["touchmove mousemove"] = move; + duringDragEvents["touchend mouseup"] = stop; + + function prevent(e) { + if (e.stopPropagation) { + e.stopPropagation(); + } + if (e.preventDefault) { + e.preventDefault(); + } + e.returnValue = false; + } + + function move(e) { + if (dragging) { + // Mouseup happened outside of window + if (IE && doc.documentMode < 9 && !e.button) { + return stop(); + } + + var t0 = e.originalEvent && e.originalEvent.touches && e.originalEvent.touches[0]; + var pageX = t0 && t0.pageX || e.pageX; + var pageY = t0 && t0.pageY || e.pageY; + + var dragX = Math.max(0, Math.min(pageX - offset.left, maxWidth)); + var dragY = Math.max(0, Math.min(pageY - offset.top, maxHeight)); + + if (hasTouch) { + // Stop scrolling in iOS + prevent(e); + } + + onmove.apply(element, [dragX, dragY, e]); + } + } + + function start(e) { + var rightclick = (e.which) ? (e.which == 3) : (e.button == 2); + + if (!rightclick && !dragging) { + if (onstart.apply(element, arguments) !== false) { + dragging = true; + maxHeight = $(element).height(); + maxWidth = $(element).width(); + offset = $(element).offset(); + + $(doc).on(duringDragEvents); + $(doc.body).addClass("sp-dragging"); + + move(e); + + prevent(e); + } + } + } + + function stop() { + if (dragging) { + $(doc).off(duringDragEvents); + $(doc.body).removeClass("sp-dragging"); + + // Wait a tick before notifying observers to allow the click event + // to fire in Chrome. + setTimeout(function() { + onstop.apply(element, arguments); + }, 0); + } + dragging = false; + } + + $(element).on("touchstart mousedown", start); + } + + function throttle(func, wait, debounce) { + var timeout; + return function () { + var context = this, args = arguments; + var throttler = function () { + timeout = null; + func.apply(context, args); + }; + if (debounce) clearTimeout(timeout); + if (debounce || !timeout) timeout = setTimeout(throttler, wait); + }; + } + + function inputTypeColorSupport() { + return $.fn.spectrum.inputTypeColorSupport(); + } + + /** + * Define a jQuery plugin + */ + var dataID = "spectrum.id"; + $.fn.spectrum = function (opts, extra) { + + if (typeof opts == "string") { + + var returnValue = this; + var args = Array.prototype.slice.call( arguments, 1 ); + + this.each(function () { + var spect = spectrums[$(this).data(dataID)]; + if (spect) { + var method = spect[opts]; + if (!method) { + throw new Error( "Spectrum: no such method: '" + opts + "'" ); + } + + if (opts == "get") { + returnValue = spect.get(); + } + else if (opts == "container") { + returnValue = spect.container; + } + else if (opts == "option") { + returnValue = spect.option.apply(spect, args); + } + else if (opts == "destroy") { + spect.destroy(); + $(this).removeData(dataID); + } + else { + method.apply(spect, args); + } + } + }); + + return returnValue; + } + + // Initializing a new instance of spectrum + return this.spectrum("destroy").each(function () { + var options = $.extend({}, $(this).data(), opts); + var spect = spectrum(this, options); + $(this).data(dataID, spect.id); + }); + }; + + $.fn.spectrum.load = true; + $.fn.spectrum.loadOpts = {}; + $.fn.spectrum.draggable = draggable; + $.fn.spectrum.defaults = defaultOpts; + $.fn.spectrum.inputTypeColorSupport = function inputTypeColorSupport() { + if (typeof inputTypeColorSupport._cachedResult === "undefined") { + var colorInput = $("")[0]; // if color element is supported, value will default to not null + inputTypeColorSupport._cachedResult = colorInput.type === "color" && colorInput.value !== ""; + } + return inputTypeColorSupport._cachedResult; + }; + + $.spectrum = { }; + $.spectrum.localization = { }; + $.spectrum.palettes = { }; + + $.fn.spectrum.processNativeColorInputs = function () { + var colorInputs = $("input[type=color]"); + if (colorInputs.length && !inputTypeColorSupport()) { + colorInputs.spectrum({ + preferredFormat: "hex6" + }); + } + }; + + // TinyColor v1.1.2 + // https://github.com/bgrins/TinyColor + // Brian Grinstead, MIT License + + (function() { + + var trimLeft = /^[\s,#]+/, + trimRight = /\s+$/, + tinyCounter = 0, + math = Math, + mathRound = math.round, + mathMin = math.min, + mathMax = math.max, + mathRandom = math.random; + + var tinycolor = function(color, opts) { + + color = (color) ? color : ''; + opts = opts || { }; + + // If input is already a tinycolor, return itself + if (color instanceof tinycolor) { + return color; + } + // If we are called as a function, call using new instead + if (!(this instanceof tinycolor)) { + return new tinycolor(color, opts); + } + + var rgb = inputToRGB(color); + this._originalInput = color, + this._r = rgb.r, + this._g = rgb.g, + this._b = rgb.b, + this._a = rgb.a, + this._roundA = mathRound(1000 * this._a) / 1000, + this._format = opts.format || rgb.format; + this._gradientType = opts.gradientType; + + // Don't let the range of [0,255] come back in [0,1]. + // Potentially lose a little bit of precision here, but will fix issues where + // .5 gets interpreted as half of the total, instead of half of 1 + // If it was supposed to be 128, this was already taken care of by `inputToRgb` + if (this._r < 1) { this._r = mathRound(this._r); } + if (this._g < 1) { this._g = mathRound(this._g); } + if (this._b < 1) { this._b = mathRound(this._b); } + + this._ok = rgb.ok; + this._tc_id = tinyCounter++; + }; + + tinycolor.prototype = { + isDark: function() { + return this.getBrightness() < 128; + }, + isLight: function() { + return !this.isDark(); + }, + isValid: function() { + return this._ok; + }, + getOriginalInput: function() { + return this._originalInput; + }, + getFormat: function() { + return this._format; + }, + getAlpha: function() { + return this._a; + }, + getBrightness: function() { + var rgb = this.toRgb(); + return (rgb.r * 299 + rgb.g * 587 + rgb.b * 114) / 1000; + }, + setAlpha: function(value) { + this._a = boundAlpha(value); + this._roundA = mathRound(1000 * this._a) / 1000; + return this; + }, + toHsv: function() { + var hsv = rgbToHsv(this._r, this._g, this._b); + return { h: hsv.h * 360, s: hsv.s, v: hsv.v, a: this._a }; + }, + toHsvString: function() { + var hsv = rgbToHsv(this._r, this._g, this._b); + var h = mathRound(hsv.h * 360), s = mathRound(hsv.s * 100), v = mathRound(hsv.v * 100); + return (this._a == 1) ? + "hsv(" + h + ", " + s + "%, " + v + "%)" : + "hsva(" + h + ", " + s + "%, " + v + "%, "+ this._roundA + ")"; + }, + toHsl: function() { + var hsl = rgbToHsl(this._r, this._g, this._b); + return { h: hsl.h * 360, s: hsl.s, l: hsl.l, a: this._a }; + }, + toHslString: function() { + var hsl = rgbToHsl(this._r, this._g, this._b); + var h = mathRound(hsl.h * 360), s = mathRound(hsl.s * 100), l = mathRound(hsl.l * 100); + return (this._a == 1) ? + "hsl(" + h + ", " + s + "%, " + l + "%)" : + "hsla(" + h + ", " + s + "%, " + l + "%, "+ this._roundA + ")"; + }, + toHex: function(allow3Char) { + return rgbToHex(this._r, this._g, this._b, allow3Char); + }, + toHexString: function(allow3Char) { + return '#' + this.toHex(allow3Char); + }, + toHex8: function() { + return rgbaToHex(this._r, this._g, this._b, this._a); + }, + toHex8String: function() { + return '#' + this.toHex8(); + }, + toRgb: function() { + return { r: mathRound(this._r), g: mathRound(this._g), b: mathRound(this._b), a: this._a }; + }, + toRgbString: function() { + return (this._a == 1) ? + "rgb(" + mathRound(this._r) + ", " + mathRound(this._g) + ", " + mathRound(this._b) + ")" : + "rgba(" + mathRound(this._r) + ", " + mathRound(this._g) + ", " + mathRound(this._b) + ", " + this._roundA + ")"; + }, + toPercentageRgb: function() { + return { r: mathRound(bound01(this._r, 255) * 100) + "%", g: mathRound(bound01(this._g, 255) * 100) + "%", b: mathRound(bound01(this._b, 255) * 100) + "%", a: this._a }; + }, + toPercentageRgbString: function() { + return (this._a == 1) ? + "rgb(" + mathRound(bound01(this._r, 255) * 100) + "%, " + mathRound(bound01(this._g, 255) * 100) + "%, " + mathRound(bound01(this._b, 255) * 100) + "%)" : + "rgba(" + mathRound(bound01(this._r, 255) * 100) + "%, " + mathRound(bound01(this._g, 255) * 100) + "%, " + mathRound(bound01(this._b, 255) * 100) + "%, " + this._roundA + ")"; + }, + toName: function() { + if (this._a === 0) { + return "transparent"; + } + + if (this._a < 1) { + return false; + } + + return hexNames[rgbToHex(this._r, this._g, this._b, true)] || false; + }, + toFilter: function(secondColor) { + var hex8String = '#' + rgbaToHex(this._r, this._g, this._b, this._a); + var secondHex8String = hex8String; + var gradientType = this._gradientType ? "GradientType = 1, " : ""; + + if (secondColor) { + var s = tinycolor(secondColor); + secondHex8String = s.toHex8String(); + } + + return "progid:DXImageTransform.Microsoft.gradient("+gradientType+"startColorstr="+hex8String+",endColorstr="+secondHex8String+")"; + }, + toString: function(format) { + var formatSet = !!format; + format = format || this._format; + + var formattedString = false; + var hasAlpha = this._a < 1 && this._a >= 0; + var needsAlphaFormat = !formatSet && hasAlpha && (format === "hex" || format === "hex6" || format === "hex3" || format === "name"); + + if (needsAlphaFormat) { + // Special case for "transparent", all other non-alpha formats + // will return rgba when there is transparency. + if (format === "name" && this._a === 0) { + return this.toName(); + } + return this.toRgbString(); + } + if (format === "rgb") { + formattedString = this.toRgbString(); + } + if (format === "prgb") { + formattedString = this.toPercentageRgbString(); + } + if (format === "hex" || format === "hex6") { + formattedString = this.toHexString(); + } + if (format === "hex3") { + formattedString = this.toHexString(true); + } + if (format === "hex8") { + formattedString = this.toHex8String(); + } + if (format === "name") { + formattedString = this.toName(); + } + if (format === "hsl") { + formattedString = this.toHslString(); + } + if (format === "hsv") { + formattedString = this.toHsvString(); + } + + return formattedString || this.toHexString(); + }, + + _applyModification: function(fn, args) { + var color = fn.apply(null, [this].concat([].slice.call(args))); + this._r = color._r; + this._g = color._g; + this._b = color._b; + this.setAlpha(color._a); + return this; + }, + lighten: function() { + return this._applyModification(lighten, arguments); + }, + brighten: function() { + return this._applyModification(brighten, arguments); + }, + darken: function() { + return this._applyModification(darken, arguments); + }, + desaturate: function() { + return this._applyModification(desaturate, arguments); + }, + saturate: function() { + return this._applyModification(saturate, arguments); + }, + greyscale: function() { + return this._applyModification(greyscale, arguments); + }, + spin: function() { + return this._applyModification(spin, arguments); + }, + + _applyCombination: function(fn, args) { + return fn.apply(null, [this].concat([].slice.call(args))); + }, + analogous: function() { + return this._applyCombination(analogous, arguments); + }, + complement: function() { + return this._applyCombination(complement, arguments); + }, + monochromatic: function() { + return this._applyCombination(monochromatic, arguments); + }, + splitcomplement: function() { + return this._applyCombination(splitcomplement, arguments); + }, + triad: function() { + return this._applyCombination(triad, arguments); + }, + tetrad: function() { + return this._applyCombination(tetrad, arguments); + } + }; + + // If input is an object, force 1 into "1.0" to handle ratios properly + // String input requires "1.0" as input, so 1 will be treated as 1 + tinycolor.fromRatio = function(color, opts) { + if (typeof color == "object") { + var newColor = {}; + for (var i in color) { + if (color.hasOwnProperty(i)) { + if (i === "a") { + newColor[i] = color[i]; + } + else { + newColor[i] = convertToPercentage(color[i]); + } + } + } + color = newColor; + } + + return tinycolor(color, opts); + }; + + // Given a string or object, convert that input to RGB + // Possible string inputs: + // + // "red" + // "#f00" or "f00" + // "#ff0000" or "ff0000" + // "#ff000000" or "ff000000" + // "rgb 255 0 0" or "rgb (255, 0, 0)" + // "rgb 1.0 0 0" or "rgb (1, 0, 0)" + // "rgba (255, 0, 0, 1)" or "rgba 255, 0, 0, 1" + // "rgba (1.0, 0, 0, 1)" or "rgba 1.0, 0, 0, 1" + // "hsl(0, 100%, 50%)" or "hsl 0 100% 50%" + // "hsla(0, 100%, 50%, 1)" or "hsla 0 100% 50%, 1" + // "hsv(0, 100%, 100%)" or "hsv 0 100% 100%" + // + function inputToRGB(color) { + + var rgb = { r: 0, g: 0, b: 0 }; + var a = 1; + var ok = false; + var format = false; + + if (typeof color == "string") { + color = stringInputToObject(color); + } + + if (typeof color == "object") { + if (color.hasOwnProperty("r") && color.hasOwnProperty("g") && color.hasOwnProperty("b")) { + rgb = rgbToRgb(color.r, color.g, color.b); + ok = true; + format = String(color.r).substr(-1) === "%" ? "prgb" : "rgb"; + } + else if (color.hasOwnProperty("h") && color.hasOwnProperty("s") && color.hasOwnProperty("v")) { + color.s = convertToPercentage(color.s); + color.v = convertToPercentage(color.v); + rgb = hsvToRgb(color.h, color.s, color.v); + ok = true; + format = "hsv"; + } + else if (color.hasOwnProperty("h") && color.hasOwnProperty("s") && color.hasOwnProperty("l")) { + color.s = convertToPercentage(color.s); + color.l = convertToPercentage(color.l); + rgb = hslToRgb(color.h, color.s, color.l); + ok = true; + format = "hsl"; + } + + if (color.hasOwnProperty("a")) { + a = color.a; + } + } + + a = boundAlpha(a); + + return { + ok: ok, + format: color.format || format, + r: mathMin(255, mathMax(rgb.r, 0)), + g: mathMin(255, mathMax(rgb.g, 0)), + b: mathMin(255, mathMax(rgb.b, 0)), + a: a + }; + } + + + // Conversion Functions + // -------------------- + + // `rgbToHsl`, `rgbToHsv`, `hslToRgb`, `hsvToRgb` modified from: + // + + // `rgbToRgb` + // Handle bounds / percentage checking to conform to CSS color spec + // + // *Assumes:* r, g, b in [0, 255] or [0, 1] + // *Returns:* { r, g, b } in [0, 255] + function rgbToRgb(r, g, b){ + return { + r: bound01(r, 255) * 255, + g: bound01(g, 255) * 255, + b: bound01(b, 255) * 255 + }; + } + + // `rgbToHsl` + // Converts an RGB color value to HSL. + // *Assumes:* r, g, and b are contained in [0, 255] or [0, 1] + // *Returns:* { h, s, l } in [0,1] + function rgbToHsl(r, g, b) { + + r = bound01(r, 255); + g = bound01(g, 255); + b = bound01(b, 255); + + var max = mathMax(r, g, b), min = mathMin(r, g, b); + var h, s, l = (max + min) / 2; + + if(max == min) { + h = s = 0; // achromatic + } + else { + var d = max - min; + s = l > 0.5 ? d / (2 - max - min) : d / (max + min); + switch(max) { + case r: h = (g - b) / d + (g < b ? 6 : 0); break; + case g: h = (b - r) / d + 2; break; + case b: h = (r - g) / d + 4; break; + } + + h /= 6; + } + + return { h: h, s: s, l: l }; + } + + // `hslToRgb` + // Converts an HSL color value to RGB. + // *Assumes:* h is contained in [0, 1] or [0, 360] and s and l are contained [0, 1] or [0, 100] + // *Returns:* { r, g, b } in the set [0, 255] + function hslToRgb(h, s, l) { + var r, g, b; + + h = bound01(h, 360); + s = bound01(s, 100); + l = bound01(l, 100); + + function hue2rgb(p, q, t) { + if(t < 0) t += 1; + if(t > 1) t -= 1; + if(t < 1/6) return p + (q - p) * 6 * t; + if(t < 1/2) return q; + if(t < 2/3) return p + (q - p) * (2/3 - t) * 6; + return p; + } + + if(s === 0) { + r = g = b = l; // achromatic + } + else { + var q = l < 0.5 ? l * (1 + s) : l + s - l * s; + var p = 2 * l - q; + r = hue2rgb(p, q, h + 1/3); + g = hue2rgb(p, q, h); + b = hue2rgb(p, q, h - 1/3); + } + + return { r: r * 255, g: g * 255, b: b * 255 }; + } + + // `rgbToHsv` + // Converts an RGB color value to HSV + // *Assumes:* r, g, and b are contained in the set [0, 255] or [0, 1] + // *Returns:* { h, s, v } in [0,1] + function rgbToHsv(r, g, b) { + + r = bound01(r, 255); + g = bound01(g, 255); + b = bound01(b, 255); + + var max = mathMax(r, g, b), min = mathMin(r, g, b); + var h, s, v = max; + + var d = max - min; + s = max === 0 ? 0 : d / max; + + if(max == min) { + h = 0; // achromatic + } + else { + switch(max) { + case r: h = (g - b) / d + (g < b ? 6 : 0); break; + case g: h = (b - r) / d + 2; break; + case b: h = (r - g) / d + 4; break; + } + h /= 6; + } + return { h: h, s: s, v: v }; + } + + // `hsvToRgb` + // Converts an HSV color value to RGB. + // *Assumes:* h is contained in [0, 1] or [0, 360] and s and v are contained in [0, 1] or [0, 100] + // *Returns:* { r, g, b } in the set [0, 255] + function hsvToRgb(h, s, v) { + + h = bound01(h, 360) * 6; + s = bound01(s, 100); + v = bound01(v, 100); + + var i = math.floor(h), + f = h - i, + p = v * (1 - s), + q = v * (1 - f * s), + t = v * (1 - (1 - f) * s), + mod = i % 6, + r = [v, q, p, p, t, v][mod], + g = [t, v, v, q, p, p][mod], + b = [p, p, t, v, v, q][mod]; + + return { r: r * 255, g: g * 255, b: b * 255 }; + } + + // `rgbToHex` + // Converts an RGB color to hex + // Assumes r, g, and b are contained in the set [0, 255] + // Returns a 3 or 6 character hex + function rgbToHex(r, g, b, allow3Char) { + + var hex = [ + pad2(mathRound(r).toString(16)), + pad2(mathRound(g).toString(16)), + pad2(mathRound(b).toString(16)) + ]; + + // Return a 3 character hex if possible + if (allow3Char && hex[0].charAt(0) == hex[0].charAt(1) && hex[1].charAt(0) == hex[1].charAt(1) && hex[2].charAt(0) == hex[2].charAt(1)) { + return hex[0].charAt(0) + hex[1].charAt(0) + hex[2].charAt(0); + } + + return hex.join(""); + } + // `rgbaToHex` + // Converts an RGBA color plus alpha transparency to hex + // Assumes r, g, b and a are contained in the set [0, 255] + // Returns an 8 character hex + function rgbaToHex(r, g, b, a) { + + var hex = [ + pad2(convertDecimalToHex(a)), + pad2(mathRound(r).toString(16)), + pad2(mathRound(g).toString(16)), + pad2(mathRound(b).toString(16)) + ]; + + return hex.join(""); + } + + // `equals` + // Can be called with any tinycolor input + tinycolor.equals = function (color1, color2) { + if (!color1 || !color2) { return false; } + return tinycolor(color1).toRgbString() == tinycolor(color2).toRgbString(); + }; + tinycolor.random = function() { + return tinycolor.fromRatio({ + r: mathRandom(), + g: mathRandom(), + b: mathRandom() + }); + }; + + + // Modification Functions + // ---------------------- + // Thanks to less.js for some of the basics here + // + + function desaturate(color, amount) { + amount = (amount === 0) ? 0 : (amount || 10); + var hsl = tinycolor(color).toHsl(); + hsl.s -= amount / 100; + hsl.s = clamp01(hsl.s); + return tinycolor(hsl); + } + + function saturate(color, amount) { + amount = (amount === 0) ? 0 : (amount || 10); + var hsl = tinycolor(color).toHsl(); + hsl.s += amount / 100; + hsl.s = clamp01(hsl.s); + return tinycolor(hsl); + } + + function greyscale(color) { + return tinycolor(color).desaturate(100); + } + + function lighten (color, amount) { + amount = (amount === 0) ? 0 : (amount || 10); + var hsl = tinycolor(color).toHsl(); + hsl.l += amount / 100; + hsl.l = clamp01(hsl.l); + return tinycolor(hsl); + } + + function brighten(color, amount) { + amount = (amount === 0) ? 0 : (amount || 10); + var rgb = tinycolor(color).toRgb(); + rgb.r = mathMax(0, mathMin(255, rgb.r - mathRound(255 * - (amount / 100)))); + rgb.g = mathMax(0, mathMin(255, rgb.g - mathRound(255 * - (amount / 100)))); + rgb.b = mathMax(0, mathMin(255, rgb.b - mathRound(255 * - (amount / 100)))); + return tinycolor(rgb); + } + + function darken (color, amount) { + amount = (amount === 0) ? 0 : (amount || 10); + var hsl = tinycolor(color).toHsl(); + hsl.l -= amount / 100; + hsl.l = clamp01(hsl.l); + return tinycolor(hsl); + } + + // Spin takes a positive or negative amount within [-360, 360] indicating the change of hue. + // Values outside of this range will be wrapped into this range. + function spin(color, amount) { + var hsl = tinycolor(color).toHsl(); + var hue = (mathRound(hsl.h) + amount) % 360; + hsl.h = hue < 0 ? 360 + hue : hue; + return tinycolor(hsl); + } + + // Combination Functions + // --------------------- + // Thanks to jQuery xColor for some of the ideas behind these + // + + function complement(color) { + var hsl = tinycolor(color).toHsl(); + hsl.h = (hsl.h + 180) % 360; + return tinycolor(hsl); + } + + function triad(color) { + var hsl = tinycolor(color).toHsl(); + var h = hsl.h; + return [ + tinycolor(color), + tinycolor({ h: (h + 120) % 360, s: hsl.s, l: hsl.l }), + tinycolor({ h: (h + 240) % 360, s: hsl.s, l: hsl.l }) + ]; + } + + function tetrad(color) { + var hsl = tinycolor(color).toHsl(); + var h = hsl.h; + return [ + tinycolor(color), + tinycolor({ h: (h + 90) % 360, s: hsl.s, l: hsl.l }), + tinycolor({ h: (h + 180) % 360, s: hsl.s, l: hsl.l }), + tinycolor({ h: (h + 270) % 360, s: hsl.s, l: hsl.l }) + ]; + } + + function splitcomplement(color) { + var hsl = tinycolor(color).toHsl(); + var h = hsl.h; + return [ + tinycolor(color), + tinycolor({ h: (h + 72) % 360, s: hsl.s, l: hsl.l}), + tinycolor({ h: (h + 216) % 360, s: hsl.s, l: hsl.l}) + ]; + } + + function analogous(color, results, slices) { + results = results || 6; + slices = slices || 30; + + var hsl = tinycolor(color).toHsl(); + var part = 360 / slices; + var ret = [tinycolor(color)]; + + for (hsl.h = ((hsl.h - (part * results >> 1)) + 720) % 360; --results; ) { + hsl.h = (hsl.h + part) % 360; + ret.push(tinycolor(hsl)); + } + return ret; + } + + function monochromatic(color, results) { + results = results || 6; + var hsv = tinycolor(color).toHsv(); + var h = hsv.h, s = hsv.s, v = hsv.v; + var ret = []; + var modification = 1 / results; + + while (results--) { + ret.push(tinycolor({ h: h, s: s, v: v})); + v = (v + modification) % 1; + } + + return ret; + } + + // Utility Functions + // --------------------- + + tinycolor.mix = function(color1, color2, amount) { + amount = (amount === 0) ? 0 : (amount || 50); + + var rgb1 = tinycolor(color1).toRgb(); + var rgb2 = tinycolor(color2).toRgb(); + + var p = amount / 100; + var w = p * 2 - 1; + var a = rgb2.a - rgb1.a; + + var w1; + + if (w * a == -1) { + w1 = w; + } else { + w1 = (w + a) / (1 + w * a); + } + + w1 = (w1 + 1) / 2; + + var w2 = 1 - w1; + + var rgba = { + r: rgb2.r * w1 + rgb1.r * w2, + g: rgb2.g * w1 + rgb1.g * w2, + b: rgb2.b * w1 + rgb1.b * w2, + a: rgb2.a * p + rgb1.a * (1 - p) + }; + + return tinycolor(rgba); + }; + + + // Readability Functions + // --------------------- + // + + // `readability` + // Analyze the 2 colors and returns an object with the following properties: + // `brightness`: difference in brightness between the two colors + // `color`: difference in color/hue between the two colors + tinycolor.readability = function(color1, color2) { + var c1 = tinycolor(color1); + var c2 = tinycolor(color2); + var rgb1 = c1.toRgb(); + var rgb2 = c2.toRgb(); + var brightnessA = c1.getBrightness(); + var brightnessB = c2.getBrightness(); + var colorDiff = ( + Math.max(rgb1.r, rgb2.r) - Math.min(rgb1.r, rgb2.r) + + Math.max(rgb1.g, rgb2.g) - Math.min(rgb1.g, rgb2.g) + + Math.max(rgb1.b, rgb2.b) - Math.min(rgb1.b, rgb2.b) + ); + + return { + brightness: Math.abs(brightnessA - brightnessB), + color: colorDiff + }; + }; + + // `readable` + // http://www.w3.org/TR/AERT#color-contrast + // Ensure that foreground and background color combinations provide sufficient contrast. + // *Example* + // tinycolor.isReadable("#000", "#111") => false + tinycolor.isReadable = function(color1, color2) { + var readability = tinycolor.readability(color1, color2); + return readability.brightness > 125 && readability.color > 500; + }; + + // `mostReadable` + // Given a base color and a list of possible foreground or background + // colors for that base, returns the most readable color. + // *Example* + // tinycolor.mostReadable("#123", ["#fff", "#000"]) => "#000" + tinycolor.mostReadable = function(baseColor, colorList) { + var bestColor = null; + var bestScore = 0; + var bestIsReadable = false; + for (var i=0; i < colorList.length; i++) { + + // We normalize both around the "acceptable" breaking point, + // but rank brightness constrast higher than hue. + + var readability = tinycolor.readability(baseColor, colorList[i]); + var readable = readability.brightness > 125 && readability.color > 500; + var score = 3 * (readability.brightness / 125) + (readability.color / 500); + + if ((readable && ! bestIsReadable) || + (readable && bestIsReadable && score > bestScore) || + ((! readable) && (! bestIsReadable) && score > bestScore)) { + bestIsReadable = readable; + bestScore = score; + bestColor = tinycolor(colorList[i]); + } + } + return bestColor; + }; + + + // Big List of Colors + // ------------------ + // + var names = tinycolor.names = { + aliceblue: "f0f8ff", + antiquewhite: "faebd7", + aqua: "0ff", + aquamarine: "7fffd4", + azure: "f0ffff", + beige: "f5f5dc", + bisque: "ffe4c4", + black: "000", + blanchedalmond: "ffebcd", + blue: "00f", + blueviolet: "8a2be2", + brown: "a52a2a", + burlywood: "deb887", + burntsienna: "ea7e5d", + cadetblue: "5f9ea0", + chartreuse: "7fff00", + chocolate: "d2691e", + coral: "ff7f50", + cornflowerblue: "6495ed", + cornsilk: "fff8dc", + crimson: "dc143c", + cyan: "0ff", + darkblue: "00008b", + darkcyan: "008b8b", + darkgoldenrod: "b8860b", + darkgray: "a9a9a9", + darkgreen: "006400", + darkgrey: "a9a9a9", + darkkhaki: "bdb76b", + darkmagenta: "8b008b", + darkolivegreen: "556b2f", + darkorange: "ff8c00", + darkorchid: "9932cc", + darkred: "8b0000", + darksalmon: "e9967a", + darkseagreen: "8fbc8f", + darkslateblue: "483d8b", + darkslategray: "2f4f4f", + darkslategrey: "2f4f4f", + darkturquoise: "00ced1", + darkviolet: "9400d3", + deeppink: "ff1493", + deepskyblue: "00bfff", + dimgray: "696969", + dimgrey: "696969", + dodgerblue: "1e90ff", + firebrick: "b22222", + floralwhite: "fffaf0", + forestgreen: "228b22", + fuchsia: "f0f", + gainsboro: "dcdcdc", + ghostwhite: "f8f8ff", + gold: "ffd700", + goldenrod: "daa520", + gray: "808080", + green: "008000", + greenyellow: "adff2f", + grey: "808080", + honeydew: "f0fff0", + hotpink: "ff69b4", + indianred: "cd5c5c", + indigo: "4b0082", + ivory: "fffff0", + khaki: "f0e68c", + lavender: "e6e6fa", + lavenderblush: "fff0f5", + lawngreen: "7cfc00", + lemonchiffon: "fffacd", + lightblue: "add8e6", + lightcoral: "f08080", + lightcyan: "e0ffff", + lightgoldenrodyellow: "fafad2", + lightgray: "d3d3d3", + lightgreen: "90ee90", + lightgrey: "d3d3d3", + lightpink: "ffb6c1", + lightsalmon: "ffa07a", + lightseagreen: "20b2aa", + lightskyblue: "87cefa", + lightslategray: "789", + lightslategrey: "789", + lightsteelblue: "b0c4de", + lightyellow: "ffffe0", + lime: "0f0", + limegreen: "32cd32", + linen: "faf0e6", + magenta: "f0f", + maroon: "800000", + mediumaquamarine: "66cdaa", + mediumblue: "0000cd", + mediumorchid: "ba55d3", + mediumpurple: "9370db", + mediumseagreen: "3cb371", + mediumslateblue: "7b68ee", + mediumspringgreen: "00fa9a", + mediumturquoise: "48d1cc", + mediumvioletred: "c71585", + midnightblue: "191970", + mintcream: "f5fffa", + mistyrose: "ffe4e1", + moccasin: "ffe4b5", + navajowhite: "ffdead", + navy: "000080", + oldlace: "fdf5e6", + olive: "808000", + olivedrab: "6b8e23", + orange: "ffa500", + orangered: "ff4500", + orchid: "da70d6", + palegoldenrod: "eee8aa", + palegreen: "98fb98", + paleturquoise: "afeeee", + palevioletred: "db7093", + papayawhip: "ffefd5", + peachpuff: "ffdab9", + peru: "cd853f", + pink: "ffc0cb", + plum: "dda0dd", + powderblue: "b0e0e6", + purple: "800080", + rebeccapurple: "663399", + red: "f00", + rosybrown: "bc8f8f", + royalblue: "4169e1", + saddlebrown: "8b4513", + salmon: "fa8072", + sandybrown: "f4a460", + seagreen: "2e8b57", + seashell: "fff5ee", + sienna: "a0522d", + silver: "c0c0c0", + skyblue: "87ceeb", + slateblue: "6a5acd", + slategray: "708090", + slategrey: "708090", + snow: "fffafa", + springgreen: "00ff7f", + steelblue: "4682b4", + tan: "d2b48c", + teal: "008080", + thistle: "d8bfd8", + tomato: "ff6347", + turquoise: "40e0d0", + violet: "ee82ee", + wheat: "f5deb3", + white: "fff", + whitesmoke: "f5f5f5", + yellow: "ff0", + yellowgreen: "9acd32" + }; + + // Make it easy to access colors via `hexNames[hex]` + var hexNames = tinycolor.hexNames = flip(names); + + + // Utilities + // --------- + + // `{ 'name1': 'val1' }` becomes `{ 'val1': 'name1' }` + function flip(o) { + var flipped = { }; + for (var i in o) { + if (o.hasOwnProperty(i)) { + flipped[o[i]] = i; + } + } + return flipped; + } + + // Return a valid alpha value [0,1] with all invalid values being set to 1 + function boundAlpha(a) { + a = parseFloat(a); + + if (isNaN(a) || a < 0 || a > 1) { + a = 1; + } + + return a; + } + + // Take input from [0, n] and return it as [0, 1] + function bound01(n, max) { + if (isOnePointZero(n)) { n = "100%"; } + + var processPercent = isPercentage(n); + n = mathMin(max, mathMax(0, parseFloat(n))); + + // Automatically convert percentage into number + if (processPercent) { + n = parseInt(n * max, 10) / 100; + } + + // Handle floating point rounding errors + if ((math.abs(n - max) < 0.000001)) { + return 1; + } + + // Convert into [0, 1] range if it isn't already + return (n % max) / parseFloat(max); + } + + // Force a number between 0 and 1 + function clamp01(val) { + return mathMin(1, mathMax(0, val)); + } + + // Parse a base-16 hex value into a base-10 integer + function parseIntFromHex(val) { + return parseInt(val, 16); + } + + // Need to handle 1.0 as 100%, since once it is a number, there is no difference between it and 1 + // + function isOnePointZero(n) { + return typeof n == "string" && n.indexOf('.') != -1 && parseFloat(n) === 1; + } + + // Check to see if string passed in is a percentage + function isPercentage(n) { + return typeof n === "string" && n.indexOf('%') != -1; + } + + // Force a hex value to have 2 characters + function pad2(c) { + return c.length == 1 ? '0' + c : '' + c; + } + + // Replace a decimal with it's percentage value + function convertToPercentage(n) { + if (n <= 1) { + n = (n * 100) + "%"; + } + + return n; + } + + // Converts a decimal to a hex value + function convertDecimalToHex(d) { + return Math.round(parseFloat(d) * 255).toString(16); + } + // Converts a hex value to a decimal + function convertHexToDecimal(h) { + return (parseIntFromHex(h) / 255); + } + + var matchers = (function() { + + // + var CSS_INTEGER = "[-\\+]?\\d+%?"; + + // + var CSS_NUMBER = "[-\\+]?\\d*\\.\\d+%?"; + + // Allow positive/negative integer/number. Don't capture the either/or, just the entire outcome. + var CSS_UNIT = "(?:" + CSS_NUMBER + ")|(?:" + CSS_INTEGER + ")"; + + // Actual matching. + // Parentheses and commas are optional, but not required. + // Whitespace can take the place of commas or opening paren + var PERMISSIVE_MATCH3 = "[\\s|\\(]+(" + CSS_UNIT + ")[,|\\s]+(" + CSS_UNIT + ")[,|\\s]+(" + CSS_UNIT + ")\\s*\\)?"; + var PERMISSIVE_MATCH4 = "[\\s|\\(]+(" + CSS_UNIT + ")[,|\\s]+(" + CSS_UNIT + ")[,|\\s]+(" + CSS_UNIT + ")[,|\\s]+(" + CSS_UNIT + ")\\s*\\)?"; + + return { + rgb: new RegExp("rgb" + PERMISSIVE_MATCH3), + rgba: new RegExp("rgba" + PERMISSIVE_MATCH4), + hsl: new RegExp("hsl" + PERMISSIVE_MATCH3), + hsla: new RegExp("hsla" + PERMISSIVE_MATCH4), + hsv: new RegExp("hsv" + PERMISSIVE_MATCH3), + hsva: new RegExp("hsva" + PERMISSIVE_MATCH4), + hex3: /^([0-9a-fA-F]{1})([0-9a-fA-F]{1})([0-9a-fA-F]{1})$/, + hex6: /^([0-9a-fA-F]{2})([0-9a-fA-F]{2})([0-9a-fA-F]{2})$/, + hex8: /^([0-9a-fA-F]{2})([0-9a-fA-F]{2})([0-9a-fA-F]{2})([0-9a-fA-F]{2})$/ + }; + })(); + + // `stringInputToObject` + // Permissive string parsing. Take in a number of formats, and output an object + // based on detected format. Returns `{ r, g, b }` or `{ h, s, l }` or `{ h, s, v}` + function stringInputToObject(color) { + + color = color.replace(trimLeft,'').replace(trimRight, '').toLowerCase(); + var named = false; + if (names[color]) { + color = names[color]; + named = true; + } + else if (color == 'transparent') { + return { r: 0, g: 0, b: 0, a: 0, format: "name" }; + } + + // Try to match string input using regular expressions. + // Keep most of the number bounding out of this function - don't worry about [0,1] or [0,100] or [0,360] + // Just return an object and let the conversion functions handle that. + // This way the result will be the same whether the tinycolor is initialized with string or object. + var match; + if ((match = matchers.rgb.exec(color))) { + return { r: match[1], g: match[2], b: match[3] }; + } + if ((match = matchers.rgba.exec(color))) { + return { r: match[1], g: match[2], b: match[3], a: match[4] }; + } + if ((match = matchers.hsl.exec(color))) { + return { h: match[1], s: match[2], l: match[3] }; + } + if ((match = matchers.hsla.exec(color))) { + return { h: match[1], s: match[2], l: match[3], a: match[4] }; + } + if ((match = matchers.hsv.exec(color))) { + return { h: match[1], s: match[2], v: match[3] }; + } + if ((match = matchers.hsva.exec(color))) { + return { h: match[1], s: match[2], v: match[3], a: match[4] }; + } + if ((match = matchers.hex8.exec(color))) { + return { + a: convertHexToDecimal(match[1]), + r: parseIntFromHex(match[2]), + g: parseIntFromHex(match[3]), + b: parseIntFromHex(match[4]), + format: named ? "name" : "hex8" + }; + } + if ((match = matchers.hex6.exec(color))) { + return { + r: parseIntFromHex(match[1]), + g: parseIntFromHex(match[2]), + b: parseIntFromHex(match[3]), + format: named ? "name" : "hex" + }; + } + if ((match = matchers.hex3.exec(color))) { + return { + r: parseIntFromHex(match[1] + '' + match[1]), + g: parseIntFromHex(match[2] + '' + match[2]), + b: parseIntFromHex(match[3] + '' + match[3]), + format: named ? "name" : "hex" + }; + } + + return false; + } + + window.tinycolor = tinycolor; + })(); + + $(function () { + if ($.fn.spectrum.load) { + $.fn.spectrum.processNativeColorInputs(); + } + }); + +}); diff --git a/addons/web_flectra/static/src/js/backend_theme_customizer.js b/addons/web_flectra/static/src/js/backend_theme_customizer.js index 74f43f4ba1..45034e4346 100644 --- a/addons/web_flectra/static/src/js/backend_theme_customizer.js +++ b/addons/web_flectra/static/src/js/backend_theme_customizer.js @@ -74,7 +74,7 @@ flectra.define('web_flectra.BackendThemeCustomizer', function (require) { colorPicker.each(function () { var name = $(this).attr('data-identity') - var color_value = $(this).find('input').val() + var color_value = $(this).find('input.color-inp-value').val() color_value = _.str.trim(color_value); company_settings[name] = color_value; }) @@ -155,30 +155,28 @@ flectra.define('web_flectra.BackendThemeCustomizer', function (require) { _init_color_picker: function (item) { var self = this; - item.find('.f-theme-customizer-content .color_picker_component') - .colorpicker({ - format: 'rgba', - extensions: [ - { - name: 'swatches', - options: { - colors: { - 'black': '#000000', - 'gray': '#888888', - 'white': '#ffffff', - 'red': 'red', - 'default': '#777777', - 'primary': '#337ab7', - 'success': '#5cb85c', - 'info': '#5bc0de', - 'warning': '#f0ad4e', - 'danger': '#d9534f' - }, - namesAsValues: false - } - } - ] - }) + var items = item.find('.color-picker-base-spectrum'); + items.each(function () { + this.spectrum = $(this).spectrum({ + color: $(this).val(), + showInput: true, + hideAfterPaletteSelect: true, + clickoutFiresChange: true, + showInitial: true, + preferredFormat: "rgb", + }); + this.spectrum.on("move.spectrum", function(e, tinycolor){ + self._OnColorChange(e, tinycolor); + }); + }); + }, + + _OnColorChange :function(e, tinycolor){ + if($(e.target).hasClass('color-picker-base-spectrum')){ + var value = tinycolor.toRgbString(); + $(e.target).val(value); + $(e.target).parent().parent().find('.color-inp-value').val(value); + } }, _render: function() { @@ -213,7 +211,6 @@ flectra.define('web_flectra.BackendThemeCustomizer', function (require) { _on_save_btn: function (event) { event.preventDefault(); - this.$el.find('.f-theme-customizer-content .color_picker_component').colorpicker('destroy') this.$('.f-theme-customizer-panel').removeClass('open') $('body').append(this.loader); this._save_customizer_data().then(function(){ diff --git a/addons/web_flectra/static/src/js/web_responsive.js b/addons/web_flectra/static/src/js/web_responsive.js index 4a308ac0a5..9258dca236 100644 --- a/addons/web_flectra/static/src/js/web_responsive.js +++ b/addons/web_flectra/static/src/js/web_responsive.js @@ -228,31 +228,6 @@ flectra.define("web_responsive", function (require) { }, }); - var KeyboardNavigationShiftAltMixin = { - _shiftPressed: function (keyEvent) { - const alt = keyEvent.altKey || keyEvent.key === "Alt", - newEvent = _.extend({}, keyEvent), - shift = keyEvent.shiftKey || keyEvent.key === "Shift"; - // Mock event to make it seem like Alt is not pressed - if (alt && !shift) { - newEvent.altKey = false; - if (newEvent.key === "Alt") { - newEvent.key = "Shift"; - } - } - return newEvent; - }, - - _onKeyDown: function (keyDownEvent) { - return this._super(this._shiftPressed(keyDownEvent)); - }, - - _onKeyUp: function (keyUpEvent) { - return this._super(this._shiftPressed(keyUpEvent)); - }, - }; - - AbstractWebClient.include(KeyboardNavigationShiftAltMixin); DocumentViewer.include({ events: _.extend( diff --git a/addons/web_flectra/static/src/xml/backend_theme_customizer.xml b/addons/web_flectra/static/src/xml/backend_theme_customizer.xml index 30bb6c1754..3785f5711d 100755 --- a/addons/web_flectra/static/src/xml/backend_theme_customizer.xml +++ b/addons/web_flectra/static/src/xml/backend_theme_customizer.xml @@ -74,9 +74,9 @@
- - - + + +
@@ -85,9 +85,9 @@
- - - + + +
@@ -96,9 +96,9 @@
- - - + + +
diff --git a/addons/web_flectra/views/assets.xml b/addons/web_flectra/views/assets.xml index 9677c0bcc9..c32e55592c 100644 --- a/addons/web_flectra/views/assets.xml +++ b/addons/web_flectra/views/assets.xml @@ -46,9 +46,9 @@