From 2bc3e7236a08d120aba6d2696fd73dd038227de4 Mon Sep 17 00:00:00 2001 From: danicotra <32748257+danicotra@users.noreply.github.com> Date: Sun, 19 Nov 2017 14:48:09 +0100 Subject: [PATCH 01/12] Added several features, see README.md Added several features, see README.md --- README.md | 81 ++-- additional.css | 390 ++++++++++++++++++ additional.js | 3 + jquery-3.2.1.min.js | 4 + my_testcase.html | 118 ++++++ spectrum.js | 947 +++++++++++++++++++++++++++++++++++++++++--- 6 files changed, 1434 insertions(+), 109 deletions(-) create mode 100644 additional.css create mode 100644 additional.js create mode 100644 jquery-3.2.1.min.js create mode 100644 my_testcase.html diff --git a/README.md b/README.md index 0de67ecb..c8634e5d 100644 --- a/README.md +++ b/README.md @@ -1,69 +1,64 @@ -# Spectrum -## The No Hassle Colorpicker +# Spectrum++ +The No Hassle jQuery Colorpicker by Brian Grinstead + with some improvement and enhancements. -See the demo and docs: http://bgrins.github.io/spectrum. +Original project repository: [https://github.com/bgrins/spectrum](https://github.com/bgrins/spectrum) -I wanted a colorpicker that didn't require images, and that had an API that made sense to me as a developer who has worked with color in a number of applications. I had tried a number of existing plugins, but decided to try and make a smaller, simpler one. +### So... What's new? -I started using canvas, then switched to CSS gradients, since it turned out to be easier to manage, and provided better cross browser support. +Added followings new options/features: -### Basic Usage +* `showRGBsliders: boolean (true or false)` -Head over to the [docs](http://bgrins.github.io/spectrum) for more information. There is a visual demo of the different options hosted at: http://bgrins.github.io/spectrum. +When set to `true` it adds sliders for RGB that work in a similar way to the Alpha slider and, just like this one, they also show colors preview hints (through color gradients). - - +* `showRGBApickers: boolean (true or false)` - +When set to `true` it adds pickers for RGB + Alpha to let you input them manually and severalty. - +* `aPickerScale: int (100 or 255)` -### npm +Lets you choose the measurement scale for the Alpha pickers (also the palette filtering one I'll introduce below). The `int` parameter can be set either to 100 (default) or 255. Invalid values will be taken as 255. -Spectrum is registered as package with npm. It can be installed with: +* `showRGBmodes: boolean (true or false)` - npm install spectrum-colorpicker +When set to `true` the "_RGB modes_" sub-panel will be added... It means you'll be able to choose the mode incrementing/decrementing one RGB value will affect the other two. You can choose between: + 1. "**normal**" (default) stands for usual behavior (in which changing one RGB value won't affect the other two); + 2. "**linked**" incrementing/decrementing one RGB value will increment/decrement the other two by the same amount (the difference between initial value and incremented/decremented one); + 3. "**proportional with constraints**" similarly to linked, increment/decrement on one RGB value affects other two but difference is proportionally calculated relying on constraints you can choose (with specific RGB constraints pickers) to limit min and max RGB values tolerance range. -### Bower +IMPORTANT NOTE: constraints do their job only when RGB increments or decrements are made through RGB sliders and/or pickers, not on changes made through Hue/Saturation controllers (and, obviously, not even when choosing colors by directly typing on Spectrum's specific input text box). -Spectrum is registered as a package with [Bower](http://bower.io/), so it can be pulled down using: +* `maxPaletteRowElements: int (1...10)` - bower install spectrum +Lets you choose the number of colors per row on selection palette. +The `int` parameter must be an integer number between 1 and 10 (respectively the MINimum and the MAXimum number of per row allowed colors. Invalid values or values less than 1 will make Spectrum fall back to usual (default) behavior, values greater than 10 will be taken as 10 and no more than that. -### Using spectrum with a CDN +I think this should also address as a possible solution to this: +[https://github.com/bgrins/spectrum/issues/337](https://github.com/bgrins/spectrum/issues/337) -CDN provided by [cdnjs](https://cdnjs.com/libraries/spectrum) +* `paletteRGBAfiltering: boolean (true or false)` - - +When set to `true` the "_palette filtering_" sub-panel will show up and let you filter selection palette colors upon RGBA min/max bounds you can input through dedicated pickers. It is important to say that, when filter is on, you won't be allowed to select colors on selection palette that are "out of range". Furthermore, once max allowed selection palette size limit is reach (`maxSelectionSize`), the filter on option will also preserve the "in range" colors to stay on palette yielding the earliest "out of range" one to be replaced when adding a new color to selection palette (if there aren't "out of range" colors things will work as usual). Lastly, a button for removing the unfiltered selection palette colors all at once is also provided. -### Continuous Integration +TWO SIDE NOTES ON THIS FEATURE: +1. To make filtering possible I added to the `tinycolor` class the new `inRange(lowerbound_color, upperbound_color)` function which takes 2 RGBA colors (objects having `r`, `g`, `b` and `a` properties set properly) as lower and upper bounds and check if the tinycolor is "inside the range". Values for RGB properties must be set to integer number in the [0...255] range and the value for Alpha property must be a float between 0 and 1. If lower-bound isn't a valid color black with zero alpha `{r: 0, g: 0, b: 0, a: 0}` will be taken as lower-bound color, if upper-bound isn't a valid color white with full alpha `{r: 255, g: 255, b: 255, a: 1}` will be taken as upper-bound color. +2. Clear button uses the `clearPalette(target, exposeCurrent)` function which, when +`target` parameter is set to `1`, deals with unfiltered selection palette colors but, if needed, could also be used for removing only currently selected color (`target` parameter set to `0`) or to empty entire selection palette (`target` parameter set to `2`). The `exposeCurrent` can be set to true|false; when set to `true` it doesn't preserve the current color from being eventually removed from selection palette (which is mandatory when `target` is set to `0`) otherwise, when set to `false`, the currently selected color on palette will remain on palette even in the case it is "out of range" (the case you activated the filtering feature just after selecting a "non-in-range" color). -[![Build Status](https://secure.travis-ci.org/bgrins/spectrum.png?branch=master)](http://travis-ci.org/bgrins/spectrum) +### Good... Anything else? -Visit https://travis-ci.org/bgrins/spectrum to view the status of the automated tests. +Yes! :D. Besides the new features I fixed a "bug" which consists in the fact that, when typing on text box input or dragging Hue/Saturation controllers from "non-red" color to black or white, the "Hue color square" always got reset to red. This become more evident once I introduced the RGB sliders/pickers so I decided to do something and now the "Hue color square" doesn't always get reset to red when selecting black or white as color. -### Building Spectrum Locally +P.S. last advice for color neophytes (I'm one of you tbh! :)): +dragging on "Hue color square" horizontally affects the "L" on color's HSL (Hue, Saturation, Light), while vertical dragging affects the "V" on color's HSV (Hue, Saturation, Value). -If you'd like to download and use the plugin, head over to http://bgrins.github.io/spectrum/ and click the 'Download Zip' button. +### Known issues? -If you'd like to run the development version, spectrum uses Grunt to automate the testing, linting, and building. Head over to http://gruntjs.com/getting-started for more information. First, clone the repository, then run: +My CSS layout abilities are definitely not the "pro" ones, I mostly go the "trial and error" way until I get things look acceptable... (I highly suspect the additional CSS rules set could be better/optimized). - npm install -g grunt-cli - npm install +Also I didn't test this on IE < 11 versions (tbh I'm not even interested doing it really...) - # runs jshint and the unit test suite - grunt +### OK... Now let's see it! - # runs jshint, the unit test suite, and builds a minified version of the file. - grunt build - -### Internationalization - -If you are able to translate the text in the UI to another language, please do! You can do so by either [filing a pull request](https://github.com/bgrins/spectrum/pulls) or [opening an issue]( https://github.com/bgrins/spectrum/issues) with the translation. The existing languages are listed at: https://github.com/bgrins/spectrum/tree/master/i18n. - -For an example, see the [Dutch translation](i18n/jquery.spectrum-nl.js). +**FULL EXAMPLE** (showing all the described new features) ___[here](my_testcase.html)___ diff --git a/additional.css b/additional.css new file mode 100644 index 00000000..1b075531 --- /dev/null +++ b/additional.css @@ -0,0 +1,390 @@ +/*** +Spectrum Colorpicker v1.9.0 ?? +https://github.com/bgrins/spectrum +Author: Brian Grinstead +++ with more features added by danicotra +License: MIT +***/ + +.sp-palette { + *width: 120px; + max-width: 120px; +} +.sp-palette-toggle { +margin-top: 6px; +} +.sp-picker-container { +width: 200px; +} + +.sp-clear-enabled .sp-hue { +width: 25px; +margin: auto; +height: 80%; +} +/* 25px => 80% */ +.sp-top-inner { +height: 154px; +} +/* needed after constraints... * / +.sp-button-container { + margin-top: 5px; +}/**/ +.sp-input-disabled .sp-button-container { + margin-top: 1px; +} +/*BETTER*/ +.sp-input-container{ + margin-bottom: 8px; +} +/**/ +.sp-top { + margin-bottom: -2px; +} +.sp-rgb_sliders-enabled.sp-pickers-enabled.sp-alpha-enabled.sp-rgb_modes-enabled .sp-top { /* all four (3+Modes) classes ebabled on container */ + margin-bottom: 32px; +} +.sp-rgb_sliders-enabled.sp-pickers-enabled.sp-alpha-enabled .sp-top { /* three classes ebabled on container NO MODES */ + margin-bottom: 18px; +} +.sp-rgb_sliders-enabled.sp-alpha-enabled.sp-rgb_modes-enabled .sp-top { /* sliders+modes, alpha */ + margin-bottom: 30px; +} +.sp-rgb_sliders-enabled.sp-alpha-enabled .sp-top { /* both classes on container NO MODES */ + margin-bottom: 21px; +} +.sp-pickers-enabled.sp-rgb_modes-enabled.sp-alpha-enabled .sp-top { /* pickers+modes, alpha */ + margin-bottom: 30px; +} +.sp-pickers-enabled.sp-alpha-enabled .sp-top { /* both classes on container NO MODES */ + margin-bottom: 18px; +} +.sp-alpha-enabled .sp-top { + margin-bottom: 6px; +} +.sp-rgb_sliders-enabled .sp-top { + margin-bottom: 5px; +} +.sp-pickers-enabled .sp-top { + margin-bottom: 5px; +} +/*sp-rgb_modes-enabled only possible when also at least sliders/pickers enabled*/ +.sp-rgb_sliders-enabled.sp-pickers-enabled.sp-rgb_modes-enabled .sp-top { + margin-bottom: 18px; +} +.sp-rgb_sliders-enabled.sp-rgb_modes-enabled .sp-top { + margin-bottom: 18px; +} +.sp-pickers-enabled.sp-rgb_modes-enabled .sp-top { + margin-bottom: 18px; +} + +.sp-alpha { +bottom: -3px; +} +.sp-rgb_sliders-enabled .sp-alpha { +bottom: -12px; +} +.sp-pickers-enabled .sp-alpha { +bottom: -14px; +} + +.sp-rgb_sliders { +position: relative; +display: none; +right: 0; +left: 0; +height: 36px; +bottom: 0px +} +.sp-rgb_sliders-enabled .sp-rgb_sliders { + display: block; +} +.sp-r_slider-handle, .sp-g_slider-handle, .sp-b_slider-handle { + position:absolute; + top:-4px; + bottom: -4px; + width: 6px; + left: 50%; + cursor: pointer; + border: 1px solid black; + opacity: .8; +} +.sp-r_slider-handle { +background-color: #f00; +} +.sp-g_slider-handle { +background-color: #0f0; +} +.sp-b_slider-handle { +background-color: #00f; +} +.sp-r_slider, .sp-g_slider, .sp-b_slider { + display: block; + position: absolute; + bottom: 0px; + right: 0; + left: 0; + height: 8px; +margin-bottom: 6px; +} +.sp-r_slider-inner, .sp-g_slider-inner, .sp-b_slider-inner { + border: solid 1px #333; +} + +/* Don't allow text selection */ +.sp-r_slider, .sp-g_slider, .sp-b_slider, .sp-r_slider-handle, .sp-g_slider-handle, .sp-b_slider-handle { + -webkit-user-select:none; + -moz-user-select: -moz-none; + -o-user-select:none; + user-select: none; +} + +.sp-r_slider, .sp-g_slider, .sp-b_slider { + position:relative; + background-image: url(data:image/png;base64,iVBORw0KGgoAAAANSUhEUgAAAAwAAAAMCAIAAADZF8uwAAAAGUlEQVQYV2M4gwH+YwCGIasIUwhT25BVBADtzYNYrHvv4gAAAABJRU5ErkJggg==); +} +.sp-r_slider-inner, .sp-g_slider-inner, .sp-b_slider-inner { + display:block; + position:absolute; + top:0;left:0;bottom:0;right:0; +} + + +.sp-pickers { +position: relative; +display: none; +right: 0; +left: 0; +height: 24px; +bottom: 0px; +margin: 2px auto -6px auto; +} +.sp-pickers-enabled .sp-pickers { + display: block; +} +.sp-rgb_sliders-enabled .sp-pickers { +margin-top: 8px +} + +.sp-x_picker { + display: block; + float: left; + margin: 0 1px; + padding: 2px; + width: 48px; + height: 24px; + border-width: 1px; + border-style: solid; + outline: 0; + text-align: center; + vertical-align: text-bottom; +} + +.sp-r_picker { + background-color: #fdd; +} + +.sp-g_picker { + background-color: #dfd; +} + +.sp-b_picker { + background-color: #ddf; +} + +.sp-a_picker { + background-color: #eee; +} + +/*fieldset { border: 1px solid #ccc; }*/ + +.sp-rgb_modes_set { +position: relative; +display: none; +right: 0; +left: 0; +bottom: 0px; + padding: 4px 0 6px 6px; +/* +height: 98px; + margin: 21px -3px -9px -2px; + +clear: both; +*/ + margin: 0px -3px -5px -2px; +top: 5px; +} +.sp-rgb_sliders-enabled.sp-pickers-enabled.sp-rgb_modes-enabled .sp-rgb_modes_set, +.sp-rgb_sliders-enabled.sp-rgb_modes-enabled .sp-rgb_modes_set, +.sp-pickers-enabled.sp-rgb_modes-enabled .sp-rgb_modes_set { + display: block; +} +.sp-alpha-enabled .sp-rgb_modes_set { +top: 19px; +} +.sp-input-disabled .sp-rgb_modes_set { +margin-bottom: -7px; +} +.sp-legend-small { + display: none; + font-size: 4pt; +} +.sp-legend-tooltip-show .sp-legend-small { + display: block; + font-size: smaller; + border: 1pt solid #fc9; + background-color: #ff9; + width: 80px; + float: right; + position: absolute; + right: -1px; + top: -12px; + margin: auto; +} +.sp-rgb_modes_set label { + margin: 0 10px 0 -4px; /*-3*/ +} + +.sp-rgb_mode_selector { + margin: 0 4px 1px -4px; + vertical-align: sub; +} + +.sp-rgb_constraints { + margin: 6px auto 0 auto; +} + +.sp-r_constraint1, .sp-r_constraint2, .sp-g_constraint1, .sp-g_constraint2, .sp-b_constraint1, .sp-b_constraint2 { + margin: 0 4px 0 0; +} + +.sp-rgb_modes_set .sp-rgb_constraint_label { +display: block; +float: left; +margin: 5px -2px 0 -2px; +} + +label.r { +color: #f00; +} +label.g { +color: #0f0; +} +label.b { +color: #00f; +} + +.sp-r_slider-constraint1, .sp-r_slider-constraint2, .sp-g_slider-constraint1, .sp-g_slider-constraint2, .sp-b_slider-constraint1, .sp-b_slider-constraint2 { + position:absolute; + top:-4px; + bottom: -4px; + width: 0px; + left: -1px; + cursor: pointer; + border: 1px solid black; + opacity: .8; + + -webkit-user-select:none; + -moz-user-select: -moz-none; + -o-user-select:none; + user-select: none; + + display: none; +} +.sp-r_slider-constraint2, .sp-g_slider-constraint2, .sp-b_slider-constraint2 { + left: 100%; +} +.sp-rgb_prop .sp-r_slider-constraint1, .sp-rgb_prop .sp-r_slider-constraint2, +.sp-rgb_prop .sp-g_slider-constraint1, .sp-rgb_prop .sp-g_slider-constraint2, +.sp-rgb_prop .sp-b_slider-constraint1, .sp-rgb_prop .sp-b_slider-constraint2 { + display: block; +} + +.sp-rgb_modes-enabled.sp-rgb_linked .sp-r_slider-handle, .sp-rgb_modes-enabled.sp-rgb_linked .sp-g_slider-handle, .sp-rgb_modes-enabled.sp-rgb_linked .sp-b_slider-handle { + background-color: #000; +} +.sp-rgb_modes-enabled.sp-rgb_prop .sp-r_slider-handle, .sp-rgb_modes-enabled.sp-rgb_prop .sp-g_slider-handle, .sp-rgb_modes-enabled.sp-rgb_prop .sp-b_slider-handle { + background-color: #fff; +} + +/* constraints + pickers +.sp-top { + margin-bottom: 11px !important; +} +*/ + +.sp-palette_filtering_set { + display: none; + clear: both; +} +.sp-palette-filtering-enabled .sp-palette_filtering_set { + display: block; + margin-top: 45px; +padding-top: 5px; +} +.sp-palette_filtering-legend{ +box-shadow: 1px 1px 1px 1px #ccc; +} +.sp-palette-filters { + display: none; +} +.sp-palette-filters-on .sp-palette-filters { + display: block; +} +.sp-palette_filter_selector { +margin: 0 0 7px -4px; +vertical-align: sub; +} +.sp-palette_filtering_set label { +margin: 0 10px 0 4px; +} +.sp-palette_filtering_set .sp-palette_filter_label { +display: block; +float: left; +margin: 5px 0 7px 0; +width: 15px; +} +.sp-palette_filtering_set .sp-palette_filter_label.head { +position:relative; + margin: 1px 3px 2px 27px; +} +label.a { +color: #fff; +} + +/*.sp-r_constraint1, .sp-r_constraint2,*/ +.sp-r_filter1, .sp-r_filter2 { + border-color: #c00; + color: #f00; +} +/*.sp-g_constraint1, .sp-g_constraint2,*/ +.sp-g_filter1, .sp-g_filter2 { + border-color: #0c0; + color: #0f0; +} +/*.sp-b_constraint1, .sp-b_constraint2,*/ +.sp-b_filter1, .sp-b_filter2 { + border-color: #00c; + color: #00f; +} +.sp-a_filter1, .sp-a_filter2 { + border-color: #999; + color: #ccc; +} + + +.sp-palette .sp-thumb-dark.sp-thumb-active .sp-thumb-inner, +.sp-palette .sp-thumb-light.sp-thumb-active .sp-thumb-inner { +cursor: default; +} + +.sp-palette .sp-thumb-dark.sp-thumb-inactive .sp-thumb-inner { +background-image: url(data:image/png;base64,iVBORw0KGgoAAAANSUhEUgAAABIAAAASCAYAAABWzo5XAAAABGdBTUEAALGPC/xhBQAAAAlwSFlzAAAOwgAADsIBFShKgAAAABl0RVh0U29mdHdhcmUAcGFpbnQubmV0IDQuMC4xNzNun2MAAADNSURBVDhPrdKhEQIxEAXQExRBAQgkJSAp4SQlUAIegaQEBBJ5AkERSCRlhP9Dktlsdpkhw595w2VZvrgwhBD+whz20IMNbGEuZpYFcG+VZ3rhBswDvLIlvIDZQ5zrpRPkWGWyhBkhfieXaAYXyJFlumQH5bflQbDK1uCWUHUQdJlMU0LNQGDZFWTKy9XMYaLfCePeZjNIdMk9fTJmWXVIvNs5xtMnTVl5SL5eMbhlcokmyDFvB2SZ+88+wxO8kuwA1Z5e6GYOe5jD34XhDXYvEjls9oNmAAAAAElFTkSuQmCC); +cursor: not-allowed; +} + +.sp-palette .sp-thumb-light.sp-thumb-inactive .sp-thumb-inner { +background-image: url(data:image/png;base64,iVBORw0KGgoAAAANSUhEUgAAABIAAAASCAYAAABWzo5XAAAAAXNSR0IArs4c6QAAAARnQU1BAACxjwv8YQUAAAAJcEhZcwAADsMAAA7DAcdvqGQAAAAZdEVYdFNvZnR3YXJlAHBhaW50Lm5ldCA0LjAuMTczbp9jAAAA1UlEQVQ4T62SsQ0CMQxFUzAEA1BQMgIlI1zJCIxAT0HJCBSUlFdQMAQlJWOE78hnObYDIuJLTzr/+/5FkpRz/guh2UM9pLQBWzDXvgVacG4lngncAH08QFgGLcEL0LAX34ROHCBcGaRLiEH+meAMXDhESBlkS3bVrh6KEZetQbOk7FmjmL5M40rKTmQSEJVdeXlCDtcSmgRkz4Ro32Zo+pK7+g7LqqEYjduBjsrzT6Mavl3xhzIJcXDkEBHfTl3WfNln8ARhyQR0sDkX6iU0ewjN38npDdYczGIKuRnZAAAAAElFTkSuQmCC); +cursor: not-allowed; +} \ No newline at end of file diff --git a/additional.js b/additional.js new file mode 100644 index 00000000..50f1fb7c --- /dev/null +++ b/additional.js @@ -0,0 +1,3 @@ +String.prototype.replaceAt=function(index, replacement) { + return this.substr(0, index) + replacement + this.substr(index + replacement.length); +} \ No newline at end of file diff --git a/jquery-3.2.1.min.js b/jquery-3.2.1.min.js new file mode 100644 index 00000000..644d35e2 --- /dev/null +++ b/jquery-3.2.1.min.js @@ -0,0 +1,4 @@ +/*! jQuery v3.2.1 | (c) JS Foundation and other contributors | jquery.org/license */ +!function(a,b){"use strict";"object"==typeof module&&"object"==typeof module.exports?module.exports=a.document?b(a,!0):function(a){if(!a.document)throw new Error("jQuery requires a window with a document");return b(a)}:b(a)}("undefined"!=typeof window?window:this,function(a,b){"use strict";var c=[],d=a.document,e=Object.getPrototypeOf,f=c.slice,g=c.concat,h=c.push,i=c.indexOf,j={},k=j.toString,l=j.hasOwnProperty,m=l.toString,n=m.call(Object),o={};function p(a,b){b=b||d;var c=b.createElement("script");c.text=a,b.head.appendChild(c).parentNode.removeChild(c)}var q="3.2.1",r=function(a,b){return new r.fn.init(a,b)},s=/^[\s\uFEFF\xA0]+|[\s\uFEFF\xA0]+$/g,t=/^-ms-/,u=/-([a-z])/g,v=function(a,b){return b.toUpperCase()};r.fn=r.prototype={jquery:q,constructor:r,length:0,toArray:function(){return f.call(this)},get:function(a){return null==a?f.call(this):a<0?this[a+this.length]:this[a]},pushStack:function(a){var b=r.merge(this.constructor(),a);return b.prevObject=this,b},each:function(a){return r.each(this,a)},map:function(a){return this.pushStack(r.map(this,function(b,c){return a.call(b,c,b)}))},slice:function(){return this.pushStack(f.apply(this,arguments))},first:function(){return this.eq(0)},last:function(){return this.eq(-1)},eq:function(a){var b=this.length,c=+a+(a<0?b:0);return this.pushStack(c>=0&&c0&&b-1 in a)}var x=function(a){var b,c,d,e,f,g,h,i,j,k,l,m,n,o,p,q,r,s,t,u="sizzle"+1*new Date,v=a.document,w=0,x=0,y=ha(),z=ha(),A=ha(),B=function(a,b){return a===b&&(l=!0),0},C={}.hasOwnProperty,D=[],E=D.pop,F=D.push,G=D.push,H=D.slice,I=function(a,b){for(var c=0,d=a.length;c+~]|"+K+")"+K+"*"),S=new RegExp("="+K+"*([^\\]'\"]*?)"+K+"*\\]","g"),T=new RegExp(N),U=new RegExp("^"+L+"$"),V={ID:new RegExp("^#("+L+")"),CLASS:new RegExp("^\\.("+L+")"),TAG:new RegExp("^("+L+"|[*])"),ATTR:new RegExp("^"+M),PSEUDO:new RegExp("^"+N),CHILD:new RegExp("^:(only|first|last|nth|nth-last)-(child|of-type)(?:\\("+K+"*(even|odd|(([+-]|)(\\d*)n|)"+K+"*(?:([+-]|)"+K+"*(\\d+)|))"+K+"*\\)|)","i"),bool:new RegExp("^(?:"+J+")$","i"),needsContext:new RegExp("^"+K+"*[>+~]|:(even|odd|eq|gt|lt|nth|first|last)(?:\\("+K+"*((?:-\\d)?\\d*)"+K+"*\\)|)(?=[^-]|$)","i")},W=/^(?:input|select|textarea|button)$/i,X=/^h\d$/i,Y=/^[^{]+\{\s*\[native \w/,Z=/^(?:#([\w-]+)|(\w+)|\.([\w-]+))$/,$=/[+~]/,_=new RegExp("\\\\([\\da-f]{1,6}"+K+"?|("+K+")|.)","ig"),aa=function(a,b,c){var d="0x"+b-65536;return d!==d||c?b:d<0?String.fromCharCode(d+65536):String.fromCharCode(d>>10|55296,1023&d|56320)},ba=/([\0-\x1f\x7f]|^-?\d)|^-$|[^\0-\x1f\x7f-\uFFFF\w-]/g,ca=function(a,b){return b?"\0"===a?"\ufffd":a.slice(0,-1)+"\\"+a.charCodeAt(a.length-1).toString(16)+" ":"\\"+a},da=function(){m()},ea=ta(function(a){return a.disabled===!0&&("form"in a||"label"in a)},{dir:"parentNode",next:"legend"});try{G.apply(D=H.call(v.childNodes),v.childNodes),D[v.childNodes.length].nodeType}catch(fa){G={apply:D.length?function(a,b){F.apply(a,H.call(b))}:function(a,b){var c=a.length,d=0;while(a[c++]=b[d++]);a.length=c-1}}}function ga(a,b,d,e){var f,h,j,k,l,o,r,s=b&&b.ownerDocument,w=b?b.nodeType:9;if(d=d||[],"string"!=typeof a||!a||1!==w&&9!==w&&11!==w)return d;if(!e&&((b?b.ownerDocument||b:v)!==n&&m(b),b=b||n,p)){if(11!==w&&(l=Z.exec(a)))if(f=l[1]){if(9===w){if(!(j=b.getElementById(f)))return d;if(j.id===f)return d.push(j),d}else if(s&&(j=s.getElementById(f))&&t(b,j)&&j.id===f)return d.push(j),d}else{if(l[2])return G.apply(d,b.getElementsByTagName(a)),d;if((f=l[3])&&c.getElementsByClassName&&b.getElementsByClassName)return G.apply(d,b.getElementsByClassName(f)),d}if(c.qsa&&!A[a+" "]&&(!q||!q.test(a))){if(1!==w)s=b,r=a;else if("object"!==b.nodeName.toLowerCase()){(k=b.getAttribute("id"))?k=k.replace(ba,ca):b.setAttribute("id",k=u),o=g(a),h=o.length;while(h--)o[h]="#"+k+" "+sa(o[h]);r=o.join(","),s=$.test(a)&&qa(b.parentNode)||b}if(r)try{return G.apply(d,s.querySelectorAll(r)),d}catch(x){}finally{k===u&&b.removeAttribute("id")}}}return i(a.replace(P,"$1"),b,d,e)}function ha(){var a=[];function b(c,e){return a.push(c+" ")>d.cacheLength&&delete b[a.shift()],b[c+" "]=e}return b}function ia(a){return a[u]=!0,a}function ja(a){var b=n.createElement("fieldset");try{return!!a(b)}catch(c){return!1}finally{b.parentNode&&b.parentNode.removeChild(b),b=null}}function ka(a,b){var c=a.split("|"),e=c.length;while(e--)d.attrHandle[c[e]]=b}function la(a,b){var c=b&&a,d=c&&1===a.nodeType&&1===b.nodeType&&a.sourceIndex-b.sourceIndex;if(d)return d;if(c)while(c=c.nextSibling)if(c===b)return-1;return a?1:-1}function ma(a){return function(b){var c=b.nodeName.toLowerCase();return"input"===c&&b.type===a}}function na(a){return function(b){var c=b.nodeName.toLowerCase();return("input"===c||"button"===c)&&b.type===a}}function oa(a){return function(b){return"form"in b?b.parentNode&&b.disabled===!1?"label"in b?"label"in b.parentNode?b.parentNode.disabled===a:b.disabled===a:b.isDisabled===a||b.isDisabled!==!a&&ea(b)===a:b.disabled===a:"label"in b&&b.disabled===a}}function pa(a){return ia(function(b){return b=+b,ia(function(c,d){var e,f=a([],c.length,b),g=f.length;while(g--)c[e=f[g]]&&(c[e]=!(d[e]=c[e]))})})}function qa(a){return a&&"undefined"!=typeof a.getElementsByTagName&&a}c=ga.support={},f=ga.isXML=function(a){var b=a&&(a.ownerDocument||a).documentElement;return!!b&&"HTML"!==b.nodeName},m=ga.setDocument=function(a){var b,e,g=a?a.ownerDocument||a:v;return g!==n&&9===g.nodeType&&g.documentElement?(n=g,o=n.documentElement,p=!f(n),v!==n&&(e=n.defaultView)&&e.top!==e&&(e.addEventListener?e.addEventListener("unload",da,!1):e.attachEvent&&e.attachEvent("onunload",da)),c.attributes=ja(function(a){return a.className="i",!a.getAttribute("className")}),c.getElementsByTagName=ja(function(a){return a.appendChild(n.createComment("")),!a.getElementsByTagName("*").length}),c.getElementsByClassName=Y.test(n.getElementsByClassName),c.getById=ja(function(a){return o.appendChild(a).id=u,!n.getElementsByName||!n.getElementsByName(u).length}),c.getById?(d.filter.ID=function(a){var b=a.replace(_,aa);return function(a){return a.getAttribute("id")===b}},d.find.ID=function(a,b){if("undefined"!=typeof b.getElementById&&p){var c=b.getElementById(a);return c?[c]:[]}}):(d.filter.ID=function(a){var b=a.replace(_,aa);return function(a){var c="undefined"!=typeof a.getAttributeNode&&a.getAttributeNode("id");return c&&c.value===b}},d.find.ID=function(a,b){if("undefined"!=typeof b.getElementById&&p){var c,d,e,f=b.getElementById(a);if(f){if(c=f.getAttributeNode("id"),c&&c.value===a)return[f];e=b.getElementsByName(a),d=0;while(f=e[d++])if(c=f.getAttributeNode("id"),c&&c.value===a)return[f]}return[]}}),d.find.TAG=c.getElementsByTagName?function(a,b){return"undefined"!=typeof b.getElementsByTagName?b.getElementsByTagName(a):c.qsa?b.querySelectorAll(a):void 0}:function(a,b){var c,d=[],e=0,f=b.getElementsByTagName(a);if("*"===a){while(c=f[e++])1===c.nodeType&&d.push(c);return d}return f},d.find.CLASS=c.getElementsByClassName&&function(a,b){if("undefined"!=typeof b.getElementsByClassName&&p)return b.getElementsByClassName(a)},r=[],q=[],(c.qsa=Y.test(n.querySelectorAll))&&(ja(function(a){o.appendChild(a).innerHTML="",a.querySelectorAll("[msallowcapture^='']").length&&q.push("[*^$]="+K+"*(?:''|\"\")"),a.querySelectorAll("[selected]").length||q.push("\\["+K+"*(?:value|"+J+")"),a.querySelectorAll("[id~="+u+"-]").length||q.push("~="),a.querySelectorAll(":checked").length||q.push(":checked"),a.querySelectorAll("a#"+u+"+*").length||q.push(".#.+[+~]")}),ja(function(a){a.innerHTML="";var b=n.createElement("input");b.setAttribute("type","hidden"),a.appendChild(b).setAttribute("name","D"),a.querySelectorAll("[name=d]").length&&q.push("name"+K+"*[*^$|!~]?="),2!==a.querySelectorAll(":enabled").length&&q.push(":enabled",":disabled"),o.appendChild(a).disabled=!0,2!==a.querySelectorAll(":disabled").length&&q.push(":enabled",":disabled"),a.querySelectorAll("*,:x"),q.push(",.*:")})),(c.matchesSelector=Y.test(s=o.matches||o.webkitMatchesSelector||o.mozMatchesSelector||o.oMatchesSelector||o.msMatchesSelector))&&ja(function(a){c.disconnectedMatch=s.call(a,"*"),s.call(a,"[s!='']:x"),r.push("!=",N)}),q=q.length&&new RegExp(q.join("|")),r=r.length&&new RegExp(r.join("|")),b=Y.test(o.compareDocumentPosition),t=b||Y.test(o.contains)?function(a,b){var c=9===a.nodeType?a.documentElement:a,d=b&&b.parentNode;return a===d||!(!d||1!==d.nodeType||!(c.contains?c.contains(d):a.compareDocumentPosition&&16&a.compareDocumentPosition(d)))}:function(a,b){if(b)while(b=b.parentNode)if(b===a)return!0;return!1},B=b?function(a,b){if(a===b)return l=!0,0;var d=!a.compareDocumentPosition-!b.compareDocumentPosition;return d?d:(d=(a.ownerDocument||a)===(b.ownerDocument||b)?a.compareDocumentPosition(b):1,1&d||!c.sortDetached&&b.compareDocumentPosition(a)===d?a===n||a.ownerDocument===v&&t(v,a)?-1:b===n||b.ownerDocument===v&&t(v,b)?1:k?I(k,a)-I(k,b):0:4&d?-1:1)}:function(a,b){if(a===b)return l=!0,0;var c,d=0,e=a.parentNode,f=b.parentNode,g=[a],h=[b];if(!e||!f)return a===n?-1:b===n?1:e?-1:f?1:k?I(k,a)-I(k,b):0;if(e===f)return la(a,b);c=a;while(c=c.parentNode)g.unshift(c);c=b;while(c=c.parentNode)h.unshift(c);while(g[d]===h[d])d++;return d?la(g[d],h[d]):g[d]===v?-1:h[d]===v?1:0},n):n},ga.matches=function(a,b){return ga(a,null,null,b)},ga.matchesSelector=function(a,b){if((a.ownerDocument||a)!==n&&m(a),b=b.replace(S,"='$1']"),c.matchesSelector&&p&&!A[b+" "]&&(!r||!r.test(b))&&(!q||!q.test(b)))try{var d=s.call(a,b);if(d||c.disconnectedMatch||a.document&&11!==a.document.nodeType)return d}catch(e){}return ga(b,n,null,[a]).length>0},ga.contains=function(a,b){return(a.ownerDocument||a)!==n&&m(a),t(a,b)},ga.attr=function(a,b){(a.ownerDocument||a)!==n&&m(a);var e=d.attrHandle[b.toLowerCase()],f=e&&C.call(d.attrHandle,b.toLowerCase())?e(a,b,!p):void 0;return void 0!==f?f:c.attributes||!p?a.getAttribute(b):(f=a.getAttributeNode(b))&&f.specified?f.value:null},ga.escape=function(a){return(a+"").replace(ba,ca)},ga.error=function(a){throw new Error("Syntax error, unrecognized expression: "+a)},ga.uniqueSort=function(a){var b,d=[],e=0,f=0;if(l=!c.detectDuplicates,k=!c.sortStable&&a.slice(0),a.sort(B),l){while(b=a[f++])b===a[f]&&(e=d.push(f));while(e--)a.splice(d[e],1)}return k=null,a},e=ga.getText=function(a){var b,c="",d=0,f=a.nodeType;if(f){if(1===f||9===f||11===f){if("string"==typeof a.textContent)return a.textContent;for(a=a.firstChild;a;a=a.nextSibling)c+=e(a)}else if(3===f||4===f)return a.nodeValue}else while(b=a[d++])c+=e(b);return c},d=ga.selectors={cacheLength:50,createPseudo:ia,match:V,attrHandle:{},find:{},relative:{">":{dir:"parentNode",first:!0}," ":{dir:"parentNode"},"+":{dir:"previousSibling",first:!0},"~":{dir:"previousSibling"}},preFilter:{ATTR:function(a){return a[1]=a[1].replace(_,aa),a[3]=(a[3]||a[4]||a[5]||"").replace(_,aa),"~="===a[2]&&(a[3]=" "+a[3]+" "),a.slice(0,4)},CHILD:function(a){return a[1]=a[1].toLowerCase(),"nth"===a[1].slice(0,3)?(a[3]||ga.error(a[0]),a[4]=+(a[4]?a[5]+(a[6]||1):2*("even"===a[3]||"odd"===a[3])),a[5]=+(a[7]+a[8]||"odd"===a[3])):a[3]&&ga.error(a[0]),a},PSEUDO:function(a){var b,c=!a[6]&&a[2];return V.CHILD.test(a[0])?null:(a[3]?a[2]=a[4]||a[5]||"":c&&T.test(c)&&(b=g(c,!0))&&(b=c.indexOf(")",c.length-b)-c.length)&&(a[0]=a[0].slice(0,b),a[2]=c.slice(0,b)),a.slice(0,3))}},filter:{TAG:function(a){var b=a.replace(_,aa).toLowerCase();return"*"===a?function(){return!0}:function(a){return a.nodeName&&a.nodeName.toLowerCase()===b}},CLASS:function(a){var b=y[a+" "];return b||(b=new RegExp("(^|"+K+")"+a+"("+K+"|$)"))&&y(a,function(a){return b.test("string"==typeof a.className&&a.className||"undefined"!=typeof a.getAttribute&&a.getAttribute("class")||"")})},ATTR:function(a,b,c){return function(d){var e=ga.attr(d,a);return null==e?"!="===b:!b||(e+="","="===b?e===c:"!="===b?e!==c:"^="===b?c&&0===e.indexOf(c):"*="===b?c&&e.indexOf(c)>-1:"$="===b?c&&e.slice(-c.length)===c:"~="===b?(" "+e.replace(O," ")+" ").indexOf(c)>-1:"|="===b&&(e===c||e.slice(0,c.length+1)===c+"-"))}},CHILD:function(a,b,c,d,e){var f="nth"!==a.slice(0,3),g="last"!==a.slice(-4),h="of-type"===b;return 1===d&&0===e?function(a){return!!a.parentNode}:function(b,c,i){var j,k,l,m,n,o,p=f!==g?"nextSibling":"previousSibling",q=b.parentNode,r=h&&b.nodeName.toLowerCase(),s=!i&&!h,t=!1;if(q){if(f){while(p){m=b;while(m=m[p])if(h?m.nodeName.toLowerCase()===r:1===m.nodeType)return!1;o=p="only"===a&&!o&&"nextSibling"}return!0}if(o=[g?q.firstChild:q.lastChild],g&&s){m=q,l=m[u]||(m[u]={}),k=l[m.uniqueID]||(l[m.uniqueID]={}),j=k[a]||[],n=j[0]===w&&j[1],t=n&&j[2],m=n&&q.childNodes[n];while(m=++n&&m&&m[p]||(t=n=0)||o.pop())if(1===m.nodeType&&++t&&m===b){k[a]=[w,n,t];break}}else if(s&&(m=b,l=m[u]||(m[u]={}),k=l[m.uniqueID]||(l[m.uniqueID]={}),j=k[a]||[],n=j[0]===w&&j[1],t=n),t===!1)while(m=++n&&m&&m[p]||(t=n=0)||o.pop())if((h?m.nodeName.toLowerCase()===r:1===m.nodeType)&&++t&&(s&&(l=m[u]||(m[u]={}),k=l[m.uniqueID]||(l[m.uniqueID]={}),k[a]=[w,t]),m===b))break;return t-=e,t===d||t%d===0&&t/d>=0}}},PSEUDO:function(a,b){var c,e=d.pseudos[a]||d.setFilters[a.toLowerCase()]||ga.error("unsupported pseudo: "+a);return e[u]?e(b):e.length>1?(c=[a,a,"",b],d.setFilters.hasOwnProperty(a.toLowerCase())?ia(function(a,c){var d,f=e(a,b),g=f.length;while(g--)d=I(a,f[g]),a[d]=!(c[d]=f[g])}):function(a){return e(a,0,c)}):e}},pseudos:{not:ia(function(a){var b=[],c=[],d=h(a.replace(P,"$1"));return d[u]?ia(function(a,b,c,e){var f,g=d(a,null,e,[]),h=a.length;while(h--)(f=g[h])&&(a[h]=!(b[h]=f))}):function(a,e,f){return b[0]=a,d(b,null,f,c),b[0]=null,!c.pop()}}),has:ia(function(a){return function(b){return ga(a,b).length>0}}),contains:ia(function(a){return a=a.replace(_,aa),function(b){return(b.textContent||b.innerText||e(b)).indexOf(a)>-1}}),lang:ia(function(a){return U.test(a||"")||ga.error("unsupported lang: "+a),a=a.replace(_,aa).toLowerCase(),function(b){var c;do if(c=p?b.lang:b.getAttribute("xml:lang")||b.getAttribute("lang"))return c=c.toLowerCase(),c===a||0===c.indexOf(a+"-");while((b=b.parentNode)&&1===b.nodeType);return!1}}),target:function(b){var c=a.location&&a.location.hash;return c&&c.slice(1)===b.id},root:function(a){return a===o},focus:function(a){return a===n.activeElement&&(!n.hasFocus||n.hasFocus())&&!!(a.type||a.href||~a.tabIndex)},enabled:oa(!1),disabled:oa(!0),checked:function(a){var b=a.nodeName.toLowerCase();return"input"===b&&!!a.checked||"option"===b&&!!a.selected},selected:function(a){return a.parentNode&&a.parentNode.selectedIndex,a.selected===!0},empty:function(a){for(a=a.firstChild;a;a=a.nextSibling)if(a.nodeType<6)return!1;return!0},parent:function(a){return!d.pseudos.empty(a)},header:function(a){return X.test(a.nodeName)},input:function(a){return W.test(a.nodeName)},button:function(a){var b=a.nodeName.toLowerCase();return"input"===b&&"button"===a.type||"button"===b},text:function(a){var b;return"input"===a.nodeName.toLowerCase()&&"text"===a.type&&(null==(b=a.getAttribute("type"))||"text"===b.toLowerCase())},first:pa(function(){return[0]}),last:pa(function(a,b){return[b-1]}),eq:pa(function(a,b,c){return[c<0?c+b:c]}),even:pa(function(a,b){for(var c=0;c=0;)a.push(d);return a}),gt:pa(function(a,b,c){for(var d=c<0?c+b:c;++d1?function(b,c,d){var e=a.length;while(e--)if(!a[e](b,c,d))return!1;return!0}:a[0]}function va(a,b,c){for(var d=0,e=b.length;d-1&&(f[j]=!(g[j]=l))}}else r=wa(r===g?r.splice(o,r.length):r),e?e(null,g,r,i):G.apply(g,r)})}function ya(a){for(var b,c,e,f=a.length,g=d.relative[a[0].type],h=g||d.relative[" "],i=g?1:0,k=ta(function(a){return a===b},h,!0),l=ta(function(a){return I(b,a)>-1},h,!0),m=[function(a,c,d){var e=!g&&(d||c!==j)||((b=c).nodeType?k(a,c,d):l(a,c,d));return b=null,e}];i1&&ua(m),i>1&&sa(a.slice(0,i-1).concat({value:" "===a[i-2].type?"*":""})).replace(P,"$1"),c,i0,e=a.length>0,f=function(f,g,h,i,k){var l,o,q,r=0,s="0",t=f&&[],u=[],v=j,x=f||e&&d.find.TAG("*",k),y=w+=null==v?1:Math.random()||.1,z=x.length;for(k&&(j=g===n||g||k);s!==z&&null!=(l=x[s]);s++){if(e&&l){o=0,g||l.ownerDocument===n||(m(l),h=!p);while(q=a[o++])if(q(l,g||n,h)){i.push(l);break}k&&(w=y)}c&&((l=!q&&l)&&r--,f&&t.push(l))}if(r+=s,c&&s!==r){o=0;while(q=b[o++])q(t,u,g,h);if(f){if(r>0)while(s--)t[s]||u[s]||(u[s]=E.call(i));u=wa(u)}G.apply(i,u),k&&!f&&u.length>0&&r+b.length>1&&ga.uniqueSort(i)}return k&&(w=y,j=v),t};return c?ia(f):f}return h=ga.compile=function(a,b){var c,d=[],e=[],f=A[a+" "];if(!f){b||(b=g(a)),c=b.length;while(c--)f=ya(b[c]),f[u]?d.push(f):e.push(f);f=A(a,za(e,d)),f.selector=a}return f},i=ga.select=function(a,b,c,e){var f,i,j,k,l,m="function"==typeof a&&a,n=!e&&g(a=m.selector||a);if(c=c||[],1===n.length){if(i=n[0]=n[0].slice(0),i.length>2&&"ID"===(j=i[0]).type&&9===b.nodeType&&p&&d.relative[i[1].type]){if(b=(d.find.ID(j.matches[0].replace(_,aa),b)||[])[0],!b)return c;m&&(b=b.parentNode),a=a.slice(i.shift().value.length)}f=V.needsContext.test(a)?0:i.length;while(f--){if(j=i[f],d.relative[k=j.type])break;if((l=d.find[k])&&(e=l(j.matches[0].replace(_,aa),$.test(i[0].type)&&qa(b.parentNode)||b))){if(i.splice(f,1),a=e.length&&sa(i),!a)return G.apply(c,e),c;break}}}return(m||h(a,n))(e,b,!p,c,!b||$.test(a)&&qa(b.parentNode)||b),c},c.sortStable=u.split("").sort(B).join("")===u,c.detectDuplicates=!!l,m(),c.sortDetached=ja(function(a){return 1&a.compareDocumentPosition(n.createElement("fieldset"))}),ja(function(a){return a.innerHTML="","#"===a.firstChild.getAttribute("href")})||ka("type|href|height|width",function(a,b,c){if(!c)return a.getAttribute(b,"type"===b.toLowerCase()?1:2)}),c.attributes&&ja(function(a){return a.innerHTML="",a.firstChild.setAttribute("value",""),""===a.firstChild.getAttribute("value")})||ka("value",function(a,b,c){if(!c&&"input"===a.nodeName.toLowerCase())return a.defaultValue}),ja(function(a){return null==a.getAttribute("disabled")})||ka(J,function(a,b,c){var d;if(!c)return a[b]===!0?b.toLowerCase():(d=a.getAttributeNode(b))&&d.specified?d.value:null}),ga}(a);r.find=x,r.expr=x.selectors,r.expr[":"]=r.expr.pseudos,r.uniqueSort=r.unique=x.uniqueSort,r.text=x.getText,r.isXMLDoc=x.isXML,r.contains=x.contains,r.escapeSelector=x.escape;var y=function(a,b,c){var d=[],e=void 0!==c;while((a=a[b])&&9!==a.nodeType)if(1===a.nodeType){if(e&&r(a).is(c))break;d.push(a)}return d},z=function(a,b){for(var c=[];a;a=a.nextSibling)1===a.nodeType&&a!==b&&c.push(a);return c},A=r.expr.match.needsContext;function B(a,b){return a.nodeName&&a.nodeName.toLowerCase()===b.toLowerCase()}var C=/^<([a-z][^\/\0>:\x20\t\r\n\f]*)[\x20\t\r\n\f]*\/?>(?:<\/\1>|)$/i,D=/^.[^:#\[\.,]*$/;function E(a,b,c){return r.isFunction(b)?r.grep(a,function(a,d){return!!b.call(a,d,a)!==c}):b.nodeType?r.grep(a,function(a){return a===b!==c}):"string"!=typeof b?r.grep(a,function(a){return i.call(b,a)>-1!==c}):D.test(b)?r.filter(b,a,c):(b=r.filter(b,a),r.grep(a,function(a){return i.call(b,a)>-1!==c&&1===a.nodeType}))}r.filter=function(a,b,c){var d=b[0];return c&&(a=":not("+a+")"),1===b.length&&1===d.nodeType?r.find.matchesSelector(d,a)?[d]:[]:r.find.matches(a,r.grep(b,function(a){return 1===a.nodeType}))},r.fn.extend({find:function(a){var b,c,d=this.length,e=this;if("string"!=typeof a)return this.pushStack(r(a).filter(function(){for(b=0;b1?r.uniqueSort(c):c},filter:function(a){return this.pushStack(E(this,a||[],!1))},not:function(a){return this.pushStack(E(this,a||[],!0))},is:function(a){return!!E(this,"string"==typeof a&&A.test(a)?r(a):a||[],!1).length}});var F,G=/^(?:\s*(<[\w\W]+>)[^>]*|#([\w-]+))$/,H=r.fn.init=function(a,b,c){var e,f;if(!a)return this;if(c=c||F,"string"==typeof a){if(e="<"===a[0]&&">"===a[a.length-1]&&a.length>=3?[null,a,null]:G.exec(a),!e||!e[1]&&b)return!b||b.jquery?(b||c).find(a):this.constructor(b).find(a);if(e[1]){if(b=b instanceof r?b[0]:b,r.merge(this,r.parseHTML(e[1],b&&b.nodeType?b.ownerDocument||b:d,!0)),C.test(e[1])&&r.isPlainObject(b))for(e in b)r.isFunction(this[e])?this[e](b[e]):this.attr(e,b[e]);return this}return f=d.getElementById(e[2]),f&&(this[0]=f,this.length=1),this}return a.nodeType?(this[0]=a,this.length=1,this):r.isFunction(a)?void 0!==c.ready?c.ready(a):a(r):r.makeArray(a,this)};H.prototype=r.fn,F=r(d);var I=/^(?:parents|prev(?:Until|All))/,J={children:!0,contents:!0,next:!0,prev:!0};r.fn.extend({has:function(a){var b=r(a,this),c=b.length;return this.filter(function(){for(var a=0;a-1:1===c.nodeType&&r.find.matchesSelector(c,a))){f.push(c);break}return this.pushStack(f.length>1?r.uniqueSort(f):f)},index:function(a){return a?"string"==typeof a?i.call(r(a),this[0]):i.call(this,a.jquery?a[0]:a):this[0]&&this[0].parentNode?this.first().prevAll().length:-1},add:function(a,b){return this.pushStack(r.uniqueSort(r.merge(this.get(),r(a,b))))},addBack:function(a){return this.add(null==a?this.prevObject:this.prevObject.filter(a))}});function K(a,b){while((a=a[b])&&1!==a.nodeType);return a}r.each({parent:function(a){var b=a.parentNode;return b&&11!==b.nodeType?b:null},parents:function(a){return y(a,"parentNode")},parentsUntil:function(a,b,c){return y(a,"parentNode",c)},next:function(a){return K(a,"nextSibling")},prev:function(a){return K(a,"previousSibling")},nextAll:function(a){return y(a,"nextSibling")},prevAll:function(a){return y(a,"previousSibling")},nextUntil:function(a,b,c){return y(a,"nextSibling",c)},prevUntil:function(a,b,c){return y(a,"previousSibling",c)},siblings:function(a){return z((a.parentNode||{}).firstChild,a)},children:function(a){return z(a.firstChild)},contents:function(a){return B(a,"iframe")?a.contentDocument:(B(a,"template")&&(a=a.content||a),r.merge([],a.childNodes))}},function(a,b){r.fn[a]=function(c,d){var e=r.map(this,b,c);return"Until"!==a.slice(-5)&&(d=c),d&&"string"==typeof d&&(e=r.filter(d,e)),this.length>1&&(J[a]||r.uniqueSort(e),I.test(a)&&e.reverse()),this.pushStack(e)}});var L=/[^\x20\t\r\n\f]+/g;function M(a){var b={};return r.each(a.match(L)||[],function(a,c){b[c]=!0}),b}r.Callbacks=function(a){a="string"==typeof a?M(a):r.extend({},a);var b,c,d,e,f=[],g=[],h=-1,i=function(){for(e=e||a.once,d=b=!0;g.length;h=-1){c=g.shift();while(++h-1)f.splice(c,1),c<=h&&h--}),this},has:function(a){return a?r.inArray(a,f)>-1:f.length>0},empty:function(){return f&&(f=[]),this},disable:function(){return e=g=[],f=c="",this},disabled:function(){return!f},lock:function(){return e=g=[],c||b||(f=c=""),this},locked:function(){return!!e},fireWith:function(a,c){return e||(c=c||[],c=[a,c.slice?c.slice():c],g.push(c),b||i()),this},fire:function(){return j.fireWith(this,arguments),this},fired:function(){return!!d}};return j};function N(a){return a}function O(a){throw a}function P(a,b,c,d){var e;try{a&&r.isFunction(e=a.promise)?e.call(a).done(b).fail(c):a&&r.isFunction(e=a.then)?e.call(a,b,c):b.apply(void 0,[a].slice(d))}catch(a){c.apply(void 0,[a])}}r.extend({Deferred:function(b){var c=[["notify","progress",r.Callbacks("memory"),r.Callbacks("memory"),2],["resolve","done",r.Callbacks("once memory"),r.Callbacks("once memory"),0,"resolved"],["reject","fail",r.Callbacks("once memory"),r.Callbacks("once memory"),1,"rejected"]],d="pending",e={state:function(){return d},always:function(){return f.done(arguments).fail(arguments),this},"catch":function(a){return e.then(null,a)},pipe:function(){var a=arguments;return r.Deferred(function(b){r.each(c,function(c,d){var e=r.isFunction(a[d[4]])&&a[d[4]];f[d[1]](function(){var a=e&&e.apply(this,arguments);a&&r.isFunction(a.promise)?a.promise().progress(b.notify).done(b.resolve).fail(b.reject):b[d[0]+"With"](this,e?[a]:arguments)})}),a=null}).promise()},then:function(b,d,e){var f=0;function g(b,c,d,e){return function(){var h=this,i=arguments,j=function(){var a,j;if(!(b=f&&(d!==O&&(h=void 0,i=[a]),c.rejectWith(h,i))}};b?k():(r.Deferred.getStackHook&&(k.stackTrace=r.Deferred.getStackHook()),a.setTimeout(k))}}return r.Deferred(function(a){c[0][3].add(g(0,a,r.isFunction(e)?e:N,a.notifyWith)),c[1][3].add(g(0,a,r.isFunction(b)?b:N)),c[2][3].add(g(0,a,r.isFunction(d)?d:O))}).promise()},promise:function(a){return null!=a?r.extend(a,e):e}},f={};return r.each(c,function(a,b){var g=b[2],h=b[5];e[b[1]]=g.add,h&&g.add(function(){d=h},c[3-a][2].disable,c[0][2].lock),g.add(b[3].fire),f[b[0]]=function(){return f[b[0]+"With"](this===f?void 0:this,arguments),this},f[b[0]+"With"]=g.fireWith}),e.promise(f),b&&b.call(f,f),f},when:function(a){var b=arguments.length,c=b,d=Array(c),e=f.call(arguments),g=r.Deferred(),h=function(a){return function(c){d[a]=this,e[a]=arguments.length>1?f.call(arguments):c,--b||g.resolveWith(d,e)}};if(b<=1&&(P(a,g.done(h(c)).resolve,g.reject,!b),"pending"===g.state()||r.isFunction(e[c]&&e[c].then)))return g.then();while(c--)P(e[c],h(c),g.reject);return g.promise()}});var Q=/^(Eval|Internal|Range|Reference|Syntax|Type|URI)Error$/;r.Deferred.exceptionHook=function(b,c){a.console&&a.console.warn&&b&&Q.test(b.name)&&a.console.warn("jQuery.Deferred exception: "+b.message,b.stack,c)},r.readyException=function(b){a.setTimeout(function(){throw b})};var R=r.Deferred();r.fn.ready=function(a){return R.then(a)["catch"](function(a){r.readyException(a)}),this},r.extend({isReady:!1,readyWait:1,ready:function(a){(a===!0?--r.readyWait:r.isReady)||(r.isReady=!0,a!==!0&&--r.readyWait>0||R.resolveWith(d,[r]))}}),r.ready.then=R.then;function S(){d.removeEventListener("DOMContentLoaded",S), +a.removeEventListener("load",S),r.ready()}"complete"===d.readyState||"loading"!==d.readyState&&!d.documentElement.doScroll?a.setTimeout(r.ready):(d.addEventListener("DOMContentLoaded",S),a.addEventListener("load",S));var T=function(a,b,c,d,e,f,g){var h=0,i=a.length,j=null==c;if("object"===r.type(c)){e=!0;for(h in c)T(a,b,h,c[h],!0,f,g)}else if(void 0!==d&&(e=!0,r.isFunction(d)||(g=!0),j&&(g?(b.call(a,d),b=null):(j=b,b=function(a,b,c){return j.call(r(a),c)})),b))for(;h1,null,!0)},removeData:function(a){return this.each(function(){X.remove(this,a)})}}),r.extend({queue:function(a,b,c){var d;if(a)return b=(b||"fx")+"queue",d=W.get(a,b),c&&(!d||Array.isArray(c)?d=W.access(a,b,r.makeArray(c)):d.push(c)),d||[]},dequeue:function(a,b){b=b||"fx";var c=r.queue(a,b),d=c.length,e=c.shift(),f=r._queueHooks(a,b),g=function(){r.dequeue(a,b)};"inprogress"===e&&(e=c.shift(),d--),e&&("fx"===b&&c.unshift("inprogress"),delete f.stop,e.call(a,g,f)),!d&&f&&f.empty.fire()},_queueHooks:function(a,b){var c=b+"queueHooks";return W.get(a,c)||W.access(a,c,{empty:r.Callbacks("once memory").add(function(){W.remove(a,[b+"queue",c])})})}}),r.fn.extend({queue:function(a,b){var c=2;return"string"!=typeof a&&(b=a,a="fx",c--),arguments.length\x20\t\r\n\f]+)/i,la=/^$|\/(?:java|ecma)script/i,ma={option:[1,""],thead:[1,"","
"],col:[2,"","
"],tr:[2,"","
"],td:[3,"","
"],_default:[0,"",""]};ma.optgroup=ma.option,ma.tbody=ma.tfoot=ma.colgroup=ma.caption=ma.thead,ma.th=ma.td;function na(a,b){var c;return c="undefined"!=typeof a.getElementsByTagName?a.getElementsByTagName(b||"*"):"undefined"!=typeof a.querySelectorAll?a.querySelectorAll(b||"*"):[],void 0===b||b&&B(a,b)?r.merge([a],c):c}function oa(a,b){for(var c=0,d=a.length;c-1)e&&e.push(f);else if(j=r.contains(f.ownerDocument,f),g=na(l.appendChild(f),"script"),j&&oa(g),c){k=0;while(f=g[k++])la.test(f.type||"")&&c.push(f)}return l}!function(){var a=d.createDocumentFragment(),b=a.appendChild(d.createElement("div")),c=d.createElement("input");c.setAttribute("type","radio"),c.setAttribute("checked","checked"),c.setAttribute("name","t"),b.appendChild(c),o.checkClone=b.cloneNode(!0).cloneNode(!0).lastChild.checked,b.innerHTML="",o.noCloneChecked=!!b.cloneNode(!0).lastChild.defaultValue}();var ra=d.documentElement,sa=/^key/,ta=/^(?:mouse|pointer|contextmenu|drag|drop)|click/,ua=/^([^.]*)(?:\.(.+)|)/;function va(){return!0}function wa(){return!1}function xa(){try{return d.activeElement}catch(a){}}function ya(a,b,c,d,e,f){var g,h;if("object"==typeof b){"string"!=typeof c&&(d=d||c,c=void 0);for(h in b)ya(a,h,c,d,b[h],f);return a}if(null==d&&null==e?(e=c,d=c=void 0):null==e&&("string"==typeof c?(e=d,d=void 0):(e=d,d=c,c=void 0)),e===!1)e=wa;else if(!e)return a;return 1===f&&(g=e,e=function(a){return r().off(a),g.apply(this,arguments)},e.guid=g.guid||(g.guid=r.guid++)),a.each(function(){r.event.add(this,b,e,d,c)})}r.event={global:{},add:function(a,b,c,d,e){var f,g,h,i,j,k,l,m,n,o,p,q=W.get(a);if(q){c.handler&&(f=c,c=f.handler,e=f.selector),e&&r.find.matchesSelector(ra,e),c.guid||(c.guid=r.guid++),(i=q.events)||(i=q.events={}),(g=q.handle)||(g=q.handle=function(b){return"undefined"!=typeof r&&r.event.triggered!==b.type?r.event.dispatch.apply(a,arguments):void 0}),b=(b||"").match(L)||[""],j=b.length;while(j--)h=ua.exec(b[j])||[],n=p=h[1],o=(h[2]||"").split(".").sort(),n&&(l=r.event.special[n]||{},n=(e?l.delegateType:l.bindType)||n,l=r.event.special[n]||{},k=r.extend({type:n,origType:p,data:d,handler:c,guid:c.guid,selector:e,needsContext:e&&r.expr.match.needsContext.test(e),namespace:o.join(".")},f),(m=i[n])||(m=i[n]=[],m.delegateCount=0,l.setup&&l.setup.call(a,d,o,g)!==!1||a.addEventListener&&a.addEventListener(n,g)),l.add&&(l.add.call(a,k),k.handler.guid||(k.handler.guid=c.guid)),e?m.splice(m.delegateCount++,0,k):m.push(k),r.event.global[n]=!0)}},remove:function(a,b,c,d,e){var f,g,h,i,j,k,l,m,n,o,p,q=W.hasData(a)&&W.get(a);if(q&&(i=q.events)){b=(b||"").match(L)||[""],j=b.length;while(j--)if(h=ua.exec(b[j])||[],n=p=h[1],o=(h[2]||"").split(".").sort(),n){l=r.event.special[n]||{},n=(d?l.delegateType:l.bindType)||n,m=i[n]||[],h=h[2]&&new RegExp("(^|\\.)"+o.join("\\.(?:.*\\.|)")+"(\\.|$)"),g=f=m.length;while(f--)k=m[f],!e&&p!==k.origType||c&&c.guid!==k.guid||h&&!h.test(k.namespace)||d&&d!==k.selector&&("**"!==d||!k.selector)||(m.splice(f,1),k.selector&&m.delegateCount--,l.remove&&l.remove.call(a,k));g&&!m.length&&(l.teardown&&l.teardown.call(a,o,q.handle)!==!1||r.removeEvent(a,n,q.handle),delete i[n])}else for(n in i)r.event.remove(a,n+b[j],c,d,!0);r.isEmptyObject(i)&&W.remove(a,"handle events")}},dispatch:function(a){var b=r.event.fix(a),c,d,e,f,g,h,i=new Array(arguments.length),j=(W.get(this,"events")||{})[b.type]||[],k=r.event.special[b.type]||{};for(i[0]=b,c=1;c=1))for(;j!==this;j=j.parentNode||this)if(1===j.nodeType&&("click"!==a.type||j.disabled!==!0)){for(f=[],g={},c=0;c-1:r.find(e,this,null,[j]).length),g[e]&&f.push(d);f.length&&h.push({elem:j,handlers:f})}return j=this,i\x20\t\r\n\f]*)[^>]*)\/>/gi,Aa=/\s*$/g;function Ea(a,b){return B(a,"table")&&B(11!==b.nodeType?b:b.firstChild,"tr")?r(">tbody",a)[0]||a:a}function Fa(a){return a.type=(null!==a.getAttribute("type"))+"/"+a.type,a}function Ga(a){var b=Ca.exec(a.type);return b?a.type=b[1]:a.removeAttribute("type"),a}function Ha(a,b){var c,d,e,f,g,h,i,j;if(1===b.nodeType){if(W.hasData(a)&&(f=W.access(a),g=W.set(b,f),j=f.events)){delete g.handle,g.events={};for(e in j)for(c=0,d=j[e].length;c1&&"string"==typeof q&&!o.checkClone&&Ba.test(q))return a.each(function(e){var f=a.eq(e);s&&(b[0]=q.call(this,e,f.html())),Ja(f,b,c,d)});if(m&&(e=qa(b,a[0].ownerDocument,!1,a,d),f=e.firstChild,1===e.childNodes.length&&(e=f),f||d)){for(h=r.map(na(e,"script"),Fa),i=h.length;l")},clone:function(a,b,c){var d,e,f,g,h=a.cloneNode(!0),i=r.contains(a.ownerDocument,a);if(!(o.noCloneChecked||1!==a.nodeType&&11!==a.nodeType||r.isXMLDoc(a)))for(g=na(h),f=na(a),d=0,e=f.length;d0&&oa(g,!i&&na(a,"script")),h},cleanData:function(a){for(var b,c,d,e=r.event.special,f=0;void 0!==(c=a[f]);f++)if(U(c)){if(b=c[W.expando]){if(b.events)for(d in b.events)e[d]?r.event.remove(c,d):r.removeEvent(c,d,b.handle);c[W.expando]=void 0}c[X.expando]&&(c[X.expando]=void 0)}}}),r.fn.extend({detach:function(a){return Ka(this,a,!0)},remove:function(a){return Ka(this,a)},text:function(a){return T(this,function(a){return void 0===a?r.text(this):this.empty().each(function(){1!==this.nodeType&&11!==this.nodeType&&9!==this.nodeType||(this.textContent=a)})},null,a,arguments.length)},append:function(){return Ja(this,arguments,function(a){if(1===this.nodeType||11===this.nodeType||9===this.nodeType){var b=Ea(this,a);b.appendChild(a)}})},prepend:function(){return Ja(this,arguments,function(a){if(1===this.nodeType||11===this.nodeType||9===this.nodeType){var b=Ea(this,a);b.insertBefore(a,b.firstChild)}})},before:function(){return Ja(this,arguments,function(a){this.parentNode&&this.parentNode.insertBefore(a,this)})},after:function(){return Ja(this,arguments,function(a){this.parentNode&&this.parentNode.insertBefore(a,this.nextSibling)})},empty:function(){for(var a,b=0;null!=(a=this[b]);b++)1===a.nodeType&&(r.cleanData(na(a,!1)),a.textContent="");return this},clone:function(a,b){return a=null!=a&&a,b=null==b?a:b,this.map(function(){return r.clone(this,a,b)})},html:function(a){return T(this,function(a){var b=this[0]||{},c=0,d=this.length;if(void 0===a&&1===b.nodeType)return b.innerHTML;if("string"==typeof a&&!Aa.test(a)&&!ma[(ka.exec(a)||["",""])[1].toLowerCase()]){a=r.htmlPrefilter(a);try{for(;c1)}});function _a(a,b,c,d,e){return new _a.prototype.init(a,b,c,d,e)}r.Tween=_a,_a.prototype={constructor:_a,init:function(a,b,c,d,e,f){this.elem=a,this.prop=c,this.easing=e||r.easing._default,this.options=b,this.start=this.now=this.cur(),this.end=d,this.unit=f||(r.cssNumber[c]?"":"px")},cur:function(){var a=_a.propHooks[this.prop];return a&&a.get?a.get(this):_a.propHooks._default.get(this)},run:function(a){var b,c=_a.propHooks[this.prop];return this.options.duration?this.pos=b=r.easing[this.easing](a,this.options.duration*a,0,1,this.options.duration):this.pos=b=a,this.now=(this.end-this.start)*b+this.start,this.options.step&&this.options.step.call(this.elem,this.now,this),c&&c.set?c.set(this):_a.propHooks._default.set(this),this}},_a.prototype.init.prototype=_a.prototype,_a.propHooks={_default:{get:function(a){var b;return 1!==a.elem.nodeType||null!=a.elem[a.prop]&&null==a.elem.style[a.prop]?a.elem[a.prop]:(b=r.css(a.elem,a.prop,""),b&&"auto"!==b?b:0)},set:function(a){r.fx.step[a.prop]?r.fx.step[a.prop](a):1!==a.elem.nodeType||null==a.elem.style[r.cssProps[a.prop]]&&!r.cssHooks[a.prop]?a.elem[a.prop]=a.now:r.style(a.elem,a.prop,a.now+a.unit)}}},_a.propHooks.scrollTop=_a.propHooks.scrollLeft={set:function(a){a.elem.nodeType&&a.elem.parentNode&&(a.elem[a.prop]=a.now)}},r.easing={linear:function(a){return a},swing:function(a){return.5-Math.cos(a*Math.PI)/2},_default:"swing"},r.fx=_a.prototype.init,r.fx.step={};var ab,bb,cb=/^(?:toggle|show|hide)$/,db=/queueHooks$/;function eb(){bb&&(d.hidden===!1&&a.requestAnimationFrame?a.requestAnimationFrame(eb):a.setTimeout(eb,r.fx.interval),r.fx.tick())}function fb(){return a.setTimeout(function(){ab=void 0}),ab=r.now()}function gb(a,b){var c,d=0,e={height:a};for(b=b?1:0;d<4;d+=2-b)c=ca[d],e["margin"+c]=e["padding"+c]=a;return b&&(e.opacity=e.width=a),e}function hb(a,b,c){for(var d,e=(kb.tweeners[b]||[]).concat(kb.tweeners["*"]),f=0,g=e.length;f1)},removeAttr:function(a){return this.each(function(){r.removeAttr(this,a)})}}),r.extend({attr:function(a,b,c){var d,e,f=a.nodeType;if(3!==f&&8!==f&&2!==f)return"undefined"==typeof a.getAttribute?r.prop(a,b,c):(1===f&&r.isXMLDoc(a)||(e=r.attrHooks[b.toLowerCase()]||(r.expr.match.bool.test(b)?lb:void 0)),void 0!==c?null===c?void r.removeAttr(a,b):e&&"set"in e&&void 0!==(d=e.set(a,c,b))?d:(a.setAttribute(b,c+""),c):e&&"get"in e&&null!==(d=e.get(a,b))?d:(d=r.find.attr(a,b), +null==d?void 0:d))},attrHooks:{type:{set:function(a,b){if(!o.radioValue&&"radio"===b&&B(a,"input")){var c=a.value;return a.setAttribute("type",b),c&&(a.value=c),b}}}},removeAttr:function(a,b){var c,d=0,e=b&&b.match(L);if(e&&1===a.nodeType)while(c=e[d++])a.removeAttribute(c)}}),lb={set:function(a,b,c){return b===!1?r.removeAttr(a,c):a.setAttribute(c,c),c}},r.each(r.expr.match.bool.source.match(/\w+/g),function(a,b){var c=mb[b]||r.find.attr;mb[b]=function(a,b,d){var e,f,g=b.toLowerCase();return d||(f=mb[g],mb[g]=e,e=null!=c(a,b,d)?g:null,mb[g]=f),e}});var nb=/^(?:input|select|textarea|button)$/i,ob=/^(?:a|area)$/i;r.fn.extend({prop:function(a,b){return T(this,r.prop,a,b,arguments.length>1)},removeProp:function(a){return this.each(function(){delete this[r.propFix[a]||a]})}}),r.extend({prop:function(a,b,c){var d,e,f=a.nodeType;if(3!==f&&8!==f&&2!==f)return 1===f&&r.isXMLDoc(a)||(b=r.propFix[b]||b,e=r.propHooks[b]),void 0!==c?e&&"set"in e&&void 0!==(d=e.set(a,c,b))?d:a[b]=c:e&&"get"in e&&null!==(d=e.get(a,b))?d:a[b]},propHooks:{tabIndex:{get:function(a){var b=r.find.attr(a,"tabindex");return b?parseInt(b,10):nb.test(a.nodeName)||ob.test(a.nodeName)&&a.href?0:-1}}},propFix:{"for":"htmlFor","class":"className"}}),o.optSelected||(r.propHooks.selected={get:function(a){var b=a.parentNode;return b&&b.parentNode&&b.parentNode.selectedIndex,null},set:function(a){var b=a.parentNode;b&&(b.selectedIndex,b.parentNode&&b.parentNode.selectedIndex)}}),r.each(["tabIndex","readOnly","maxLength","cellSpacing","cellPadding","rowSpan","colSpan","useMap","frameBorder","contentEditable"],function(){r.propFix[this.toLowerCase()]=this});function pb(a){var b=a.match(L)||[];return b.join(" ")}function qb(a){return a.getAttribute&&a.getAttribute("class")||""}r.fn.extend({addClass:function(a){var b,c,d,e,f,g,h,i=0;if(r.isFunction(a))return this.each(function(b){r(this).addClass(a.call(this,b,qb(this)))});if("string"==typeof a&&a){b=a.match(L)||[];while(c=this[i++])if(e=qb(c),d=1===c.nodeType&&" "+pb(e)+" "){g=0;while(f=b[g++])d.indexOf(" "+f+" ")<0&&(d+=f+" ");h=pb(d),e!==h&&c.setAttribute("class",h)}}return this},removeClass:function(a){var b,c,d,e,f,g,h,i=0;if(r.isFunction(a))return this.each(function(b){r(this).removeClass(a.call(this,b,qb(this)))});if(!arguments.length)return this.attr("class","");if("string"==typeof a&&a){b=a.match(L)||[];while(c=this[i++])if(e=qb(c),d=1===c.nodeType&&" "+pb(e)+" "){g=0;while(f=b[g++])while(d.indexOf(" "+f+" ")>-1)d=d.replace(" "+f+" "," ");h=pb(d),e!==h&&c.setAttribute("class",h)}}return this},toggleClass:function(a,b){var c=typeof a;return"boolean"==typeof b&&"string"===c?b?this.addClass(a):this.removeClass(a):r.isFunction(a)?this.each(function(c){r(this).toggleClass(a.call(this,c,qb(this),b),b)}):this.each(function(){var b,d,e,f;if("string"===c){d=0,e=r(this),f=a.match(L)||[];while(b=f[d++])e.hasClass(b)?e.removeClass(b):e.addClass(b)}else void 0!==a&&"boolean"!==c||(b=qb(this),b&&W.set(this,"__className__",b),this.setAttribute&&this.setAttribute("class",b||a===!1?"":W.get(this,"__className__")||""))})},hasClass:function(a){var b,c,d=0;b=" "+a+" ";while(c=this[d++])if(1===c.nodeType&&(" "+pb(qb(c))+" ").indexOf(b)>-1)return!0;return!1}});var rb=/\r/g;r.fn.extend({val:function(a){var b,c,d,e=this[0];{if(arguments.length)return d=r.isFunction(a),this.each(function(c){var e;1===this.nodeType&&(e=d?a.call(this,c,r(this).val()):a,null==e?e="":"number"==typeof e?e+="":Array.isArray(e)&&(e=r.map(e,function(a){return null==a?"":a+""})),b=r.valHooks[this.type]||r.valHooks[this.nodeName.toLowerCase()],b&&"set"in b&&void 0!==b.set(this,e,"value")||(this.value=e))});if(e)return b=r.valHooks[e.type]||r.valHooks[e.nodeName.toLowerCase()],b&&"get"in b&&void 0!==(c=b.get(e,"value"))?c:(c=e.value,"string"==typeof c?c.replace(rb,""):null==c?"":c)}}}),r.extend({valHooks:{option:{get:function(a){var b=r.find.attr(a,"value");return null!=b?b:pb(r.text(a))}},select:{get:function(a){var b,c,d,e=a.options,f=a.selectedIndex,g="select-one"===a.type,h=g?null:[],i=g?f+1:e.length;for(d=f<0?i:g?f:0;d-1)&&(c=!0);return c||(a.selectedIndex=-1),f}}}}),r.each(["radio","checkbox"],function(){r.valHooks[this]={set:function(a,b){if(Array.isArray(b))return a.checked=r.inArray(r(a).val(),b)>-1}},o.checkOn||(r.valHooks[this].get=function(a){return null===a.getAttribute("value")?"on":a.value})});var sb=/^(?:focusinfocus|focusoutblur)$/;r.extend(r.event,{trigger:function(b,c,e,f){var g,h,i,j,k,m,n,o=[e||d],p=l.call(b,"type")?b.type:b,q=l.call(b,"namespace")?b.namespace.split("."):[];if(h=i=e=e||d,3!==e.nodeType&&8!==e.nodeType&&!sb.test(p+r.event.triggered)&&(p.indexOf(".")>-1&&(q=p.split("."),p=q.shift(),q.sort()),k=p.indexOf(":")<0&&"on"+p,b=b[r.expando]?b:new r.Event(p,"object"==typeof b&&b),b.isTrigger=f?2:3,b.namespace=q.join("."),b.rnamespace=b.namespace?new RegExp("(^|\\.)"+q.join("\\.(?:.*\\.|)")+"(\\.|$)"):null,b.result=void 0,b.target||(b.target=e),c=null==c?[b]:r.makeArray(c,[b]),n=r.event.special[p]||{},f||!n.trigger||n.trigger.apply(e,c)!==!1)){if(!f&&!n.noBubble&&!r.isWindow(e)){for(j=n.delegateType||p,sb.test(j+p)||(h=h.parentNode);h;h=h.parentNode)o.push(h),i=h;i===(e.ownerDocument||d)&&o.push(i.defaultView||i.parentWindow||a)}g=0;while((h=o[g++])&&!b.isPropagationStopped())b.type=g>1?j:n.bindType||p,m=(W.get(h,"events")||{})[b.type]&&W.get(h,"handle"),m&&m.apply(h,c),m=k&&h[k],m&&m.apply&&U(h)&&(b.result=m.apply(h,c),b.result===!1&&b.preventDefault());return b.type=p,f||b.isDefaultPrevented()||n._default&&n._default.apply(o.pop(),c)!==!1||!U(e)||k&&r.isFunction(e[p])&&!r.isWindow(e)&&(i=e[k],i&&(e[k]=null),r.event.triggered=p,e[p](),r.event.triggered=void 0,i&&(e[k]=i)),b.result}},simulate:function(a,b,c){var d=r.extend(new r.Event,c,{type:a,isSimulated:!0});r.event.trigger(d,null,b)}}),r.fn.extend({trigger:function(a,b){return this.each(function(){r.event.trigger(a,b,this)})},triggerHandler:function(a,b){var c=this[0];if(c)return r.event.trigger(a,b,c,!0)}}),r.each("blur focus focusin focusout resize scroll click dblclick mousedown mouseup mousemove mouseover mouseout mouseenter mouseleave change select submit keydown keypress keyup contextmenu".split(" "),function(a,b){r.fn[b]=function(a,c){return arguments.length>0?this.on(b,null,a,c):this.trigger(b)}}),r.fn.extend({hover:function(a,b){return this.mouseenter(a).mouseleave(b||a)}}),o.focusin="onfocusin"in a,o.focusin||r.each({focus:"focusin",blur:"focusout"},function(a,b){var c=function(a){r.event.simulate(b,a.target,r.event.fix(a))};r.event.special[b]={setup:function(){var d=this.ownerDocument||this,e=W.access(d,b);e||d.addEventListener(a,c,!0),W.access(d,b,(e||0)+1)},teardown:function(){var d=this.ownerDocument||this,e=W.access(d,b)-1;e?W.access(d,b,e):(d.removeEventListener(a,c,!0),W.remove(d,b))}}});var tb=a.location,ub=r.now(),vb=/\?/;r.parseXML=function(b){var c;if(!b||"string"!=typeof b)return null;try{c=(new a.DOMParser).parseFromString(b,"text/xml")}catch(d){c=void 0}return c&&!c.getElementsByTagName("parsererror").length||r.error("Invalid XML: "+b),c};var wb=/\[\]$/,xb=/\r?\n/g,yb=/^(?:submit|button|image|reset|file)$/i,zb=/^(?:input|select|textarea|keygen)/i;function Ab(a,b,c,d){var e;if(Array.isArray(b))r.each(b,function(b,e){c||wb.test(a)?d(a,e):Ab(a+"["+("object"==typeof e&&null!=e?b:"")+"]",e,c,d)});else if(c||"object"!==r.type(b))d(a,b);else for(e in b)Ab(a+"["+e+"]",b[e],c,d)}r.param=function(a,b){var c,d=[],e=function(a,b){var c=r.isFunction(b)?b():b;d[d.length]=encodeURIComponent(a)+"="+encodeURIComponent(null==c?"":c)};if(Array.isArray(a)||a.jquery&&!r.isPlainObject(a))r.each(a,function(){e(this.name,this.value)});else for(c in a)Ab(c,a[c],b,e);return d.join("&")},r.fn.extend({serialize:function(){return r.param(this.serializeArray())},serializeArray:function(){return this.map(function(){var a=r.prop(this,"elements");return a?r.makeArray(a):this}).filter(function(){var a=this.type;return this.name&&!r(this).is(":disabled")&&zb.test(this.nodeName)&&!yb.test(a)&&(this.checked||!ja.test(a))}).map(function(a,b){var c=r(this).val();return null==c?null:Array.isArray(c)?r.map(c,function(a){return{name:b.name,value:a.replace(xb,"\r\n")}}):{name:b.name,value:c.replace(xb,"\r\n")}}).get()}});var Bb=/%20/g,Cb=/#.*$/,Db=/([?&])_=[^&]*/,Eb=/^(.*?):[ \t]*([^\r\n]*)$/gm,Fb=/^(?:about|app|app-storage|.+-extension|file|res|widget):$/,Gb=/^(?:GET|HEAD)$/,Hb=/^\/\//,Ib={},Jb={},Kb="*/".concat("*"),Lb=d.createElement("a");Lb.href=tb.href;function Mb(a){return function(b,c){"string"!=typeof b&&(c=b,b="*");var d,e=0,f=b.toLowerCase().match(L)||[];if(r.isFunction(c))while(d=f[e++])"+"===d[0]?(d=d.slice(1)||"*",(a[d]=a[d]||[]).unshift(c)):(a[d]=a[d]||[]).push(c)}}function Nb(a,b,c,d){var e={},f=a===Jb;function g(h){var i;return e[h]=!0,r.each(a[h]||[],function(a,h){var j=h(b,c,d);return"string"!=typeof j||f||e[j]?f?!(i=j):void 0:(b.dataTypes.unshift(j),g(j),!1)}),i}return g(b.dataTypes[0])||!e["*"]&&g("*")}function Ob(a,b){var c,d,e=r.ajaxSettings.flatOptions||{};for(c in b)void 0!==b[c]&&((e[c]?a:d||(d={}))[c]=b[c]);return d&&r.extend(!0,a,d),a}function Pb(a,b,c){var d,e,f,g,h=a.contents,i=a.dataTypes;while("*"===i[0])i.shift(),void 0===d&&(d=a.mimeType||b.getResponseHeader("Content-Type"));if(d)for(e in h)if(h[e]&&h[e].test(d)){i.unshift(e);break}if(i[0]in c)f=i[0];else{for(e in c){if(!i[0]||a.converters[e+" "+i[0]]){f=e;break}g||(g=e)}f=f||g}if(f)return f!==i[0]&&i.unshift(f),c[f]}function Qb(a,b,c,d){var e,f,g,h,i,j={},k=a.dataTypes.slice();if(k[1])for(g in a.converters)j[g.toLowerCase()]=a.converters[g];f=k.shift();while(f)if(a.responseFields[f]&&(c[a.responseFields[f]]=b),!i&&d&&a.dataFilter&&(b=a.dataFilter(b,a.dataType)),i=f,f=k.shift())if("*"===f)f=i;else if("*"!==i&&i!==f){if(g=j[i+" "+f]||j["* "+f],!g)for(e in j)if(h=e.split(" "),h[1]===f&&(g=j[i+" "+h[0]]||j["* "+h[0]])){g===!0?g=j[e]:j[e]!==!0&&(f=h[0],k.unshift(h[1]));break}if(g!==!0)if(g&&a["throws"])b=g(b);else try{b=g(b)}catch(l){return{state:"parsererror",error:g?l:"No conversion from "+i+" to "+f}}}return{state:"success",data:b}}r.extend({active:0,lastModified:{},etag:{},ajaxSettings:{url:tb.href,type:"GET",isLocal:Fb.test(tb.protocol),global:!0,processData:!0,async:!0,contentType:"application/x-www-form-urlencoded; charset=UTF-8",accepts:{"*":Kb,text:"text/plain",html:"text/html",xml:"application/xml, text/xml",json:"application/json, text/javascript"},contents:{xml:/\bxml\b/,html:/\bhtml/,json:/\bjson\b/},responseFields:{xml:"responseXML",text:"responseText",json:"responseJSON"},converters:{"* text":String,"text html":!0,"text json":JSON.parse,"text xml":r.parseXML},flatOptions:{url:!0,context:!0}},ajaxSetup:function(a,b){return b?Ob(Ob(a,r.ajaxSettings),b):Ob(r.ajaxSettings,a)},ajaxPrefilter:Mb(Ib),ajaxTransport:Mb(Jb),ajax:function(b,c){"object"==typeof b&&(c=b,b=void 0),c=c||{};var e,f,g,h,i,j,k,l,m,n,o=r.ajaxSetup({},c),p=o.context||o,q=o.context&&(p.nodeType||p.jquery)?r(p):r.event,s=r.Deferred(),t=r.Callbacks("once memory"),u=o.statusCode||{},v={},w={},x="canceled",y={readyState:0,getResponseHeader:function(a){var b;if(k){if(!h){h={};while(b=Eb.exec(g))h[b[1].toLowerCase()]=b[2]}b=h[a.toLowerCase()]}return null==b?null:b},getAllResponseHeaders:function(){return k?g:null},setRequestHeader:function(a,b){return null==k&&(a=w[a.toLowerCase()]=w[a.toLowerCase()]||a,v[a]=b),this},overrideMimeType:function(a){return null==k&&(o.mimeType=a),this},statusCode:function(a){var b;if(a)if(k)y.always(a[y.status]);else for(b in a)u[b]=[u[b],a[b]];return this},abort:function(a){var b=a||x;return e&&e.abort(b),A(0,b),this}};if(s.promise(y),o.url=((b||o.url||tb.href)+"").replace(Hb,tb.protocol+"//"),o.type=c.method||c.type||o.method||o.type,o.dataTypes=(o.dataType||"*").toLowerCase().match(L)||[""],null==o.crossDomain){j=d.createElement("a");try{j.href=o.url,j.href=j.href,o.crossDomain=Lb.protocol+"//"+Lb.host!=j.protocol+"//"+j.host}catch(z){o.crossDomain=!0}}if(o.data&&o.processData&&"string"!=typeof o.data&&(o.data=r.param(o.data,o.traditional)),Nb(Ib,o,c,y),k)return y;l=r.event&&o.global,l&&0===r.active++&&r.event.trigger("ajaxStart"),o.type=o.type.toUpperCase(),o.hasContent=!Gb.test(o.type),f=o.url.replace(Cb,""),o.hasContent?o.data&&o.processData&&0===(o.contentType||"").indexOf("application/x-www-form-urlencoded")&&(o.data=o.data.replace(Bb,"+")):(n=o.url.slice(f.length),o.data&&(f+=(vb.test(f)?"&":"?")+o.data,delete o.data),o.cache===!1&&(f=f.replace(Db,"$1"),n=(vb.test(f)?"&":"?")+"_="+ub++ +n),o.url=f+n),o.ifModified&&(r.lastModified[f]&&y.setRequestHeader("If-Modified-Since",r.lastModified[f]),r.etag[f]&&y.setRequestHeader("If-None-Match",r.etag[f])),(o.data&&o.hasContent&&o.contentType!==!1||c.contentType)&&y.setRequestHeader("Content-Type",o.contentType),y.setRequestHeader("Accept",o.dataTypes[0]&&o.accepts[o.dataTypes[0]]?o.accepts[o.dataTypes[0]]+("*"!==o.dataTypes[0]?", "+Kb+"; q=0.01":""):o.accepts["*"]);for(m in o.headers)y.setRequestHeader(m,o.headers[m]);if(o.beforeSend&&(o.beforeSend.call(p,y,o)===!1||k))return y.abort();if(x="abort",t.add(o.complete),y.done(o.success),y.fail(o.error),e=Nb(Jb,o,c,y)){if(y.readyState=1,l&&q.trigger("ajaxSend",[y,o]),k)return y;o.async&&o.timeout>0&&(i=a.setTimeout(function(){y.abort("timeout")},o.timeout));try{k=!1,e.send(v,A)}catch(z){if(k)throw z;A(-1,z)}}else A(-1,"No Transport");function A(b,c,d,h){var j,m,n,v,w,x=c;k||(k=!0,i&&a.clearTimeout(i),e=void 0,g=h||"",y.readyState=b>0?4:0,j=b>=200&&b<300||304===b,d&&(v=Pb(o,y,d)),v=Qb(o,v,y,j),j?(o.ifModified&&(w=y.getResponseHeader("Last-Modified"),w&&(r.lastModified[f]=w),w=y.getResponseHeader("etag"),w&&(r.etag[f]=w)),204===b||"HEAD"===o.type?x="nocontent":304===b?x="notmodified":(x=v.state,m=v.data,n=v.error,j=!n)):(n=x,!b&&x||(x="error",b<0&&(b=0))),y.status=b,y.statusText=(c||x)+"",j?s.resolveWith(p,[m,x,y]):s.rejectWith(p,[y,x,n]),y.statusCode(u),u=void 0,l&&q.trigger(j?"ajaxSuccess":"ajaxError",[y,o,j?m:n]),t.fireWith(p,[y,x]),l&&(q.trigger("ajaxComplete",[y,o]),--r.active||r.event.trigger("ajaxStop")))}return y},getJSON:function(a,b,c){return r.get(a,b,c,"json")},getScript:function(a,b){return r.get(a,void 0,b,"script")}}),r.each(["get","post"],function(a,b){r[b]=function(a,c,d,e){return r.isFunction(c)&&(e=e||d,d=c,c=void 0),r.ajax(r.extend({url:a,type:b,dataType:e,data:c,success:d},r.isPlainObject(a)&&a))}}),r._evalUrl=function(a){return r.ajax({url:a,type:"GET",dataType:"script",cache:!0,async:!1,global:!1,"throws":!0})},r.fn.extend({wrapAll:function(a){var b;return this[0]&&(r.isFunction(a)&&(a=a.call(this[0])),b=r(a,this[0].ownerDocument).eq(0).clone(!0),this[0].parentNode&&b.insertBefore(this[0]),b.map(function(){var a=this;while(a.firstElementChild)a=a.firstElementChild;return a}).append(this)),this},wrapInner:function(a){return r.isFunction(a)?this.each(function(b){r(this).wrapInner(a.call(this,b))}):this.each(function(){var b=r(this),c=b.contents();c.length?c.wrapAll(a):b.append(a)})},wrap:function(a){var b=r.isFunction(a);return this.each(function(c){r(this).wrapAll(b?a.call(this,c):a)})},unwrap:function(a){return this.parent(a).not("body").each(function(){r(this).replaceWith(this.childNodes)}),this}}),r.expr.pseudos.hidden=function(a){return!r.expr.pseudos.visible(a)},r.expr.pseudos.visible=function(a){return!!(a.offsetWidth||a.offsetHeight||a.getClientRects().length)},r.ajaxSettings.xhr=function(){try{return new a.XMLHttpRequest}catch(b){}};var Rb={0:200,1223:204},Sb=r.ajaxSettings.xhr();o.cors=!!Sb&&"withCredentials"in Sb,o.ajax=Sb=!!Sb,r.ajaxTransport(function(b){var c,d;if(o.cors||Sb&&!b.crossDomain)return{send:function(e,f){var g,h=b.xhr();if(h.open(b.type,b.url,b.async,b.username,b.password),b.xhrFields)for(g in b.xhrFields)h[g]=b.xhrFields[g];b.mimeType&&h.overrideMimeType&&h.overrideMimeType(b.mimeType),b.crossDomain||e["X-Requested-With"]||(e["X-Requested-With"]="XMLHttpRequest");for(g in e)h.setRequestHeader(g,e[g]);c=function(a){return function(){c&&(c=d=h.onload=h.onerror=h.onabort=h.onreadystatechange=null,"abort"===a?h.abort():"error"===a?"number"!=typeof h.status?f(0,"error"):f(h.status,h.statusText):f(Rb[h.status]||h.status,h.statusText,"text"!==(h.responseType||"text")||"string"!=typeof h.responseText?{binary:h.response}:{text:h.responseText},h.getAllResponseHeaders()))}},h.onload=c(),d=h.onerror=c("error"),void 0!==h.onabort?h.onabort=d:h.onreadystatechange=function(){4===h.readyState&&a.setTimeout(function(){c&&d()})},c=c("abort");try{h.send(b.hasContent&&b.data||null)}catch(i){if(c)throw i}},abort:function(){c&&c()}}}),r.ajaxPrefilter(function(a){a.crossDomain&&(a.contents.script=!1)}),r.ajaxSetup({accepts:{script:"text/javascript, application/javascript, application/ecmascript, application/x-ecmascript"},contents:{script:/\b(?:java|ecma)script\b/},converters:{"text script":function(a){return r.globalEval(a),a}}}),r.ajaxPrefilter("script",function(a){void 0===a.cache&&(a.cache=!1),a.crossDomain&&(a.type="GET")}),r.ajaxTransport("script",function(a){if(a.crossDomain){var b,c;return{send:function(e,f){b=r(" + + + + + + + + + +
+ +

Full Example : showing all added features

+

(palette filtering + RGB(A) sliders, pickers and mode)

+ + +
+ +
+ + + +

+Known issues : my CSS Layout ! :-p + (I think ruleset could be better optimized)

+WON'T DO : style on RGB(A) pickers inputs arrows ('cause only Chrome would support them actually...) + + \ No newline at end of file diff --git a/spectrum.js b/spectrum.js index e129e184..dee48056 100644 --- a/spectrum.js +++ b/spectrum.js @@ -1,6 +1,7 @@ -// Spectrum Colorpicker v1.8.0 +// Spectrum Colorpicker v1.9.0 ?? // https://github.com/bgrins/spectrum // Author: Brian Grinstead +// ++ with more features added by danicotra // License: MIT (function (factory) { @@ -43,6 +44,9 @@ localStorageKey: false, appendTo: "body", maxSelectionSize: 7, + + maxPaletteRowElements: 6, + cancelText: "cancel", chooseText: "choose", togglePaletteMoreText: "more", @@ -53,12 +57,25 @@ className: "", // Deprecated - use containerClassName and replacerClassName instead. containerClassName: "", replacerClassName: "", + + clearFilteredPaletteText: "clear unfiltered", + + showRGBsliders: false, + showRGBApickers: false, + aPickerScale: 100, + showAlpha: false, + + showRGBmodes: false, + theme: "sp-light", palette: [["#ffffff", "#000000", "#ff0000", "#ff8000", "#ffff00", "#008000", "#0000ff", "#4b0082", "#9400d3"]], selectionPalette: [], disabled: false, offset: null + + ,paletteRGBAfiltering: false + }, spectrums = [], IE = !!/msie/i.exec( window.navigator.userAgent ), @@ -96,6 +113,23 @@ "
", "", "
", +"
palette filtering: ", +"", +"", +"
", +"", +"
", +"", +"
", +"", +"
", +"", +"
", +"", +"
", +"", +"
", +"
", "", "
", "
", @@ -115,7 +149,38 @@ gradientFix, "
", "
", + + "
", +//"", + "
", + "
", + "
", + "
", + + "
", +"", +"", +"", +"", + "
", + "
", + +"
RGB mode: (do not affects hue/saturation controllers)", +"", +"
", +"", +"
", +"", +"", +"", +"
", +"", +"", +"", +"
", +"
", + "", "
", "", @@ -130,14 +195,17 @@ ].join(""); })(); - function paletteTemplate (p, color, className, opts) { + function paletteTemplate(p, color, className, opts, filter) { 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" : ""; + + if (tinycolor.equals(color, current)) c += " sp-thumb-active"; + else if (filter != undefined && filter.isOn && ! tiny.inRange(filter.lowerbound, filter.upperbound)) c += " sp-thumb-inactive"; + var formattedString = tiny.toString(opts.preferredFormat || "rgb"); var swatchStyle = rgbaSupport ? ("background-color:" + tiny.toRgbString()) : "filter:" + tiny.toFilter(); html.push(''); @@ -191,18 +259,56 @@ dragHelperHeight = 0, slideHeight = 0, slideWidth = 0, + + rsWidth = 0, + rSlideHelperWidth = 0, + gsWidth = 0, + gSlideHelperWidth = 0, + bsWidth = 0, + bSlideHelperWidth = 0, + alphaWidth = 0, alphaSlideHelperWidth = 0, slideHelperHeight = 0, currentHue = 0, currentSaturation = 0, currentValue = 0, + + currentR = 0, + currentG = 0, + currentB = 0, + currentAP = 100, + currentAlpha = 1, + + currentRGBMode = 0, + currentRC1 = 0, + currentGC1 = 0, + currentBC1 = 0, + currentRC2 = 255, + currentGC2 = 255, + currentBC2 = 255, + + paletteFilteringStatus = 0, + currentRF1 = 0, + currentGF1 = 0, + currentBF1 = 0, + currentAF1 = 0, + currentRF2 = 255, + currentGF2 = 255, + currentBF2 = 255, + currentAF2 = 100, + + draggerHueUpdateOnBW = false, + palette = [], paletteArray = [], paletteLookup = {}, selectionPalette = opts.selectionPalette.slice(0), maxSelectionSize = opts.maxSelectionSize, + + maxPaletteRowElements = (opts.maxPaletteRowElements > 10 ? 10 : opts.maxPaletteRowElements), + draggingClass = "sp-dragging", shiftMovementDirection = null; @@ -216,9 +322,43 @@ dragHelper = container.find(".sp-dragger"), slider = container.find(".sp-hue"), slideHelper = container.find(".sp-slider"), + + rSliderInner = container.find(".sp-r_slider-inner"), + rSlider = container.find(".sp-r_slider"), + rSlideHelper = container.find(".sp-r_slider-handle"), + gSliderInner = container.find(".sp-g_slider-inner"), + gSlider = container.find(".sp-g_slider"), + gSlideHelper = container.find(".sp-g_slider-handle"), + bSliderInner = container.find(".sp-b_slider-inner"), + bSlider = container.find(".sp-b_slider"), + bSlideHelper = container.find(".sp-b_slider-handle"), + rPickerInput = container.find(".sp-r_picker"), + gPickerInput = container.find(".sp-g_picker"), + bPickerInput = container.find(".sp-b_picker"), + aPickerInput = container.find(".sp-a_picker"), + alphaSliderInner = container.find(".sp-alpha-inner"), alphaSlider = container.find(".sp-alpha"), alphaSlideHelper = container.find(".sp-alpha-handle"), + + rgbModes = container.find("input[name=sp-rgb_mode]"), + rC1Input = container.find(".sp-r_constraint1"), + rC2Input = container.find(".sp-r_constraint2"), + gC1Input = container.find(".sp-g_constraint1"), + gC2Input = container.find(".sp-g_constraint2"), + bC1Input = container.find(".sp-b_constraint1"), + bC2Input = container.find(".sp-b_constraint2"), + + paletteFilters = container.find("input[name=sp-palette_filtering]"), + rF1Input = container.find(".sp-r_filter1"), + rF2Input = container.find(".sp-r_filter2"), + gF1Input = container.find(".sp-g_filter1"), + gF2Input = container.find(".sp-g_filter2"), + bF1Input = container.find(".sp-b_filter1"), + bF2Input = container.find(".sp-b_filter2"), + aF1Input = container.find(".sp-a_filter1"), + aF2Input = container.find(".sp-a_filter2"), + textInput = container.find(".sp-input"), paletteContainer = container.find(".sp-palette"), initialColorContainer = container.find(".sp-initial"), @@ -226,6 +366,9 @@ clearButton = container.find(".sp-clear"), chooseButton = container.find(".sp-choose"), toggleButton = container.find(".sp-palette-toggle"), + + clearFilteredPaletteButton = container.find(".sp-palette_filter-clear"), + isInput = boundElement.is("input"), isInputTypeColor = isInput && boundElement.attr("type") === "color" && inputTypeColorSupport(), shouldReplace = isInput && !flat, @@ -261,7 +404,14 @@ container.toggleClass("sp-flat", flat); container.toggleClass("sp-input-disabled", !opts.showInput); + + container.toggleClass("sp-rgb_sliders-enabled", opts.showRGBsliders); + container.toggleClass("sp-pickers-enabled", opts.showRGBApickers); + container.toggleClass("sp-alpha-enabled", opts.showAlpha); + + container.toggleClass("sp-rgb_modes-enabled", opts.showRGBmodes); + container.toggleClass("sp-clear-enabled", allowEmpty); container.toggleClass("sp-buttons-disabled", !opts.showButtons); container.toggleClass("sp-palette-buttons-disabled", !opts.togglePaletteOnly); @@ -270,6 +420,8 @@ container.toggleClass("sp-initial-disabled", !opts.showInitial); container.addClass(opts.className).addClass(opts.containerClassName); + container.toggleClass("sp-palette-filtering-enabled", opts.paletteRGBAfiltering); + reflow(); } @@ -281,6 +433,19 @@ applyOptions(); + if (opts.aPickerScale != 100) { + opts.aPickerScale = 255; + currentAP = opts.aPickerScale; + aPickerInput.val(currentAP); + aPickerInput.prop("max", currentAP); + + currentAF2 = opts.aPickerScale; + aF1Input.prop("max", currentAF2); + aF2Input.val(currentAF2); + aF2Input.prop("max", currentAF2); + } + aPickerInput.prop('disabled', !opts.showAlpha); + if (shouldReplace) { boundElement.after(replacer).hide(); } @@ -302,9 +467,16 @@ appendTo.append(container); } + + if (opts.showPalette && opts.maxPaletteRowElements > 0) { // resize palette container + paletteContainer.css("*width", 20*maxPaletteRowElements+"px"); + paletteContainer.css("max-width", 20*maxPaletteRowElements+"px"); + } + + updateSelectionPaletteFromStorage(); - offsetElement.on("click.spectrum touchstart.spectrum", function (e) { + offsetElement.bind("click.spectrum touchstart.spectrum", function (e) { if (!disabled) { toggle(); } @@ -323,15 +495,179 @@ // Prevent clicks from bubbling up to document. This would cause it to be hidden. container.click(stopPropagation); + + // Handle user typed input on RGBA pickers + rPickerInput.change(function () { setFromPickerInput(rPickerInput, currentR) }); + rPickerInput.bind("paste", function () { + setTimeout(setFromPickerInput(rPickerInput, currentR), 1); + }); + rPickerInput.keydown(function (e) { if (e.keyCode == 13) { setFromPickerInput(rPickerInput, currentR); } }); + gPickerInput.change(function () { setFromPickerInput(gPickerInput, currentG) }); + gPickerInput.bind("paste", function () { + setTimeout(setFromPickerInput(gPickerInput, currentG), 1); + }); + gPickerInput.keydown(function (e) { if (e.keyCode == 13) { setFromPickerInput(gPickerInput, currentG); } }); + bPickerInput.change(function () { setFromPickerInput(bPickerInput, currentB) }); + bPickerInput.bind("paste", function () { + setTimeout(setFromPickerInput(bPickerInput, currentB), 1); + }); + bPickerInput.keydown(function (e) { if (e.keyCode == 13) { setFromPickerInput(bPickerInput, currentB); } }); + aPickerInput.change(function () { setFromPickerInput(aPickerInput, currentAP, opts.aPickerScale) }); + aPickerInput.bind("paste", function () { + setTimeout(setFromPickerInput(aPickerInput, currentAP, opts.aPickerScale), 1); + }); + aPickerInput.keydown(function (e) { if (e.keyCode == 13) { setFromPickerInput(aPickerInput, currentAP, opts.aPickerScale); } }); + + rgbModes.on('change', function() { + if (this.value == '2') { //proportional + currentRGBMode = 2; + } + else if (this.value == '1') { //linked + currentRGBMode = 1; + } + else { //normal + currentRGBMode = 0; + } + //(CSS) classtoggle = handles color + enable/disable+show/hide contraints BUT nothing more (constraints don't have to move here nor handles have to) + container.toggleClass("sp-rgb_linked", (currentRGBMode == 1)); + container.toggleClass("sp-rgb_prop", (currentRGBMode == 2)); + container.find("[id*=_constraint]").prop('disabled', (currentRGBMode != 2)); + if (opts.showRGBsliders) updateRGBSlidersGradients(); + }); + + // Handle user typed input on RGB constraints + container.find("[id*=_constraint1]").each(function () { + var cp_id = $(this).prop('id'); + var cHelper = container.find(".sp-" + cp_id.charAt(0) + "_slider-constraint1"); + if (cp_id.charAt(0) == "r") { + $(this).change(function () { if ($(this).val() != currentRC1) updateConstraintLocation($(this), cHelper, rsWidth, +300 + +currentRC2, "r1"); }); + $(this).bind("paste", function () { + setTimeout(updateConstraintLocation($(this), cHelper, rsWidth, +300 + +currentRC2, "r1"), 1); + }); + $(this).keydown(function (e) { if (e.keyCode == 13) { updateConstraintLocation($(this), cHelper, rsWidth, +300 + +currentRC2, "r1"); } }); + } else if (cp_id.charAt(0) == "g") { + $(this).change(function () { if ($(this).val() != currentGC1) updateConstraintLocation($(this), cHelper, gsWidth, +300 + +currentGC2, "g1"); }); + $(this).bind("paste", function () { + setTimeout(updateConstraintLocation($(this), cHelper, gsWidth, +300 + +currentGC2, "g1"), 1); + }); + $(this).keydown(function (e) { if (e.keyCode == 13) { updateConstraintLocation($(this), cHelper, gsWidth, +300 + +currentGC2, "g1"); } }); + } else { + $(this).change(function () { if ($(this).val() != currentBC1) updateConstraintLocation($(this), cHelper, bsWidth, +300 + +currentBC2, "b1"); }); + $(this).bind("paste", function () { + setTimeout(updateConstraintLocation($(this), cHelper, bsWidth, +300 + +currentBC2, "b1"), 1); + }); + $(this).keydown(function (e) { if (e.keyCode == 13) { updateConstraintLocation($(this), cHelper, bsWidth, +300 + +currentBC2, "b1"); } }); + } + }); + container.find("[id*=_constraint2]").each(function () { + var cp_id = $(this).prop('id'); + var cHelper = container.find(".sp-" + cp_id.charAt(0) + "_slider-constraint2"); + if (cp_id.charAt(0) == "r") { + $(this).change(function () { if ($(this).val() != currentRC2) updateConstraintLocation($(this), cHelper, rsWidth, currentRC1, "r2"); }); + $(this).bind("paste", function () { + setTimeout(updateConstraintLocation($(this), cHelper, rsWidth, currentRC1, "r2"), 1); + }); + $(this).keydown(function (e) { if (e.keyCode == 13) { updateConstraintLocation($(this), cHelper, rsWidth, currentRC1, "r2"); } }); + } else if (cp_id.charAt(0) == "g") { + $(this).change(function () { if ($(this).val() != currentGC2) updateConstraintLocation($(this), cHelper, gsWidth, currentGC1, "g2"); }); + $(this).bind("paste", function () { + setTimeout(updateConstraintLocation($(this), cHelper, gsWidth, currentGC1, "g2"), 1); + }); + $(this).keydown(function (e) { if (e.keyCode == 13) { updateConstraintLocation($(this), cHelper, gsWidth, currentGC1, "g2"); } }); + } else { + $(this).change(function () { if ($(this).val() != currentBC2) updateConstraintLocation($(this), cHelper, bsWidth, currentBC1, "b2"); }); + $(this).bind("paste", function () { + setTimeout(updateConstraintLocation($(this), cHelper, bsWidth, currentBC1, "b2"), 1); + }); + $(this).keydown(function (e) { if (e.keyCode == 13) { updateConstraintLocation($(this), cHelper, bsWidth, currentBC1, "b2"); } }); + } + }); + + container.find(".sp-rgb_modes-legend").mouseover(function () { $(this).toggleClass("sp-legend-tooltip-show", true); }); + container.find(".sp-rgb_modes-legend").mouseout(function () { $(this).toggleClass("sp-legend-tooltip-show", false); }); + + paletteFilters.on('change', function() { + if (this.value == '1') { + paletteFilteringStatus = 1; + container.find("[id*=r_filter]").prop('disabled', false); + container.find("[id*=g_filter]").prop('disabled', false); + container.find("[id*=b_filter]").prop('disabled', false); + if (opts.showAlpha) container.find("[id*=a_filter]").prop('disabled', false); + } + else { + paletteFilteringStatus = 0; + container.find("[id*=_filter]").prop('disabled', true); + } + container.toggleClass("sp-palette-filters-on", (paletteFilteringStatus == 1)); // activate/deactivate palette colors filtering + drawPalette(); // and then re-draw palette (with/without colors filtering) + }); + + container.find("[id*=_filter1]").each(function () { + var cp_id = $(this).prop('id'); + if (cp_id.charAt(0) == "r") { + $(this).change(function () { updatePaletteFiltering($(this), +300 + +currentRF2, "r1", currentRF1); }); + $(this).bind("paste", function () { + setTimeout(updatePaletteFiltering($(this), +300 + +currentRF2, "r1", currentRF1), 1); + }); + $(this).keydown(function (e) { if (e.keyCode == 13) { updatePaletteFiltering($(this), +300 + +currentRF2, "r1", currentRF1); } }); + } else if (cp_id.charAt(0) == "g") { + $(this).change(function () { updatePaletteFiltering($(this), +300 + +currentGF2, "g1", currentGF1); }); + $(this).bind("paste", function () { + setTimeout(updatePaletteFiltering($(this), +300 + +currentGF2, "g1", currentGF1), 1); + }); + $(this).keydown(function (e) { if (e.keyCode == 13) { updatePaletteFiltering($(this), +300 + +currentGF2, "g1", currentGF1); } }); + } else if (cp_id.charAt(0) == "b") { + $(this).change(function () { updatePaletteFiltering($(this), +300 + +currentBF2, "b1", currentBF1); }); + $(this).bind("paste", function () { + setTimeout(updatePaletteFiltering($(this), +300 + +currentBF2, "b1", currentBF1), 1); + }); + $(this).keydown(function (e) { if (e.keyCode == 13) { updatePaletteFiltering($(this), +300 + +currentBF2, "b1", currentBF1); } }); + } else { + $(this).change(function () { updatePaletteFiltering($(this), +300 + +currentAF2, "a1", currentAF1); }); + $(this).bind("paste", function () { + setTimeout(updatePaletteFiltering($(this), +300 + +currentAF2, "a1", currentAF1), 1); + }); + $(this).keydown(function (e) { if (e.keyCode == 13) { updatePaletteFiltering($(this), +300 + +currentAF2, "a1", currentAF1); } }); + } + }); + container.find("[id*=_filter2]").each(function () { + var cp_id = $(this).prop('id'); + if (cp_id.charAt(0) == "r") { + $(this).change(function () { updatePaletteFiltering($(this), currentRF1, "r2", currentRF2); }); + $(this).bind("paste", function () { + setTimeout(updatePaletteFiltering($(this), currentRF1, "r2", currentRF2), 1); + }); + $(this).keydown(function (e) { if (e.keyCode == 13) { updatePaletteFiltering($(this), currentRF1, "r2", currentRF2); } }); + } else if (cp_id.charAt(0) == "g") { + $(this).change(function () { updatePaletteFiltering($(this), currentGF1, "g2", currentGF2); }); + $(this).bind("paste", function () { + setTimeout(updatePaletteFiltering($(this), currentGF1, "g2", currentGF2), 1); + }); + $(this).keydown(function (e) { if (e.keyCode == 13) { updatePaletteFiltering($(this), currentGF1, "g2", currentGF2); } }); + } else if (cp_id.charAt(0) == "b") { + $(this).change(function () { updatePaletteFiltering($(this), currentBF1, "b2", currentBF2); }); + $(this).bind("paste", function () { + setTimeout(updatePaletteFiltering($(this), currentBF1, "b2", currentBF2), 1); + }); + $(this).keydown(function (e) { if (e.keyCode == 13) { updatePaletteFiltering($(this), currentBF1, "b2", currentBF2); } }); + } else { + $(this).change(function () { updatePaletteFiltering($(this), currentAF1, "a2", currentAF2); }); + $(this).bind("paste", function () { + setTimeout(updatePaletteFiltering($(this), currentAF1, "a2", currentAF2), 1); + }); + $(this).keydown(function (e) { if (e.keyCode == 13) { updatePaletteFiltering($(this), currentAF1, "a2", currentAF2); } }); + } + }); + // Handle user typed input textInput.change(setFromTextInput); - textInput.on("paste", function () { + textInput.bind("paste", function () { setTimeout(setFromTextInput, 1); }); textInput.keydown(function (e) { if (e.keyCode == 13) { setFromTextInput(); } }); cancelButton.text(opts.cancelText); - cancelButton.on("click.spectrum", function (e) { + cancelButton.bind("click.spectrum", function (e) { e.stopPropagation(); e.preventDefault(); revert(); @@ -339,7 +675,7 @@ }); clearButton.attr("title", opts.clearText); - clearButton.on("click.spectrum", function (e) { + clearButton.bind("click.spectrum", function (e) { e.stopPropagation(); e.preventDefault(); isEmpty = true; @@ -352,7 +688,7 @@ }); chooseButton.text(opts.chooseText); - chooseButton.on("click.spectrum", function (e) { + chooseButton.bind("click.spectrum", function (e) { e.stopPropagation(); e.preventDefault(); @@ -367,7 +703,7 @@ }); toggleButton.text(opts.showPaletteOnly ? opts.togglePaletteMoreText : opts.togglePaletteLessText); - toggleButton.on("click.spectrum", function (e) { + toggleButton.bind("click.spectrum", function (e) { e.stopPropagation(); e.preventDefault(); @@ -384,6 +720,101 @@ applyOptions(); }); + + clearFilteredPaletteButton.text(opts.clearFilteredPaletteText); + clearFilteredPaletteButton.bind("click.spectrum", function (e) { + e.stopPropagation(); + e.preventDefault(); + + clearPalette(1, true); + }); + + + draggable(rSlider, function (dragX, dragY, e) { +var diff = currentR; + currentR = (dragX / rsWidth * 255); + isEmpty = false; + if (e.shiftKey) { + currentR = Math.round(currentR * 10) / 10; + } + if (!opts.showAlpha) { + currentAlpha = 1; + currentAP = opts.aPickerScale; + } +if (currentRGBMode != 0) { + diff = currentR - diff; + if (currentRGBMode == 1) { // linked + currentG = (currentG + diff > 0 ? (currentG + diff < 255 ? currentG + diff : 255) : 0); + currentB = (currentB + diff > 0 ? (currentB + diff < 255 ? currentB + diff : 255) : 0); + } else if (currentRGBMode == 2) { // prop + if (+currentR >= +currentRC2) { currentR = currentRC2; currentG = currentGC2; currentB = currentBC2; updateHelperLocations(); } + else if (+currentR <= +currentRC1) { currentR = currentRC1; currentG = currentGC1; currentB = currentBC1; updateHelperLocations(); } + else { + diff = +currentR - +currentRC1; currentG = +currentGC1 + Math.round(diff * (currentGC2 - currentGC1) / (currentRC2 - currentRC1)); currentB = +currentBC1 + Math.round(diff * (currentBC2 - currentBC1) / (currentRC2 - currentRC1)); + } + } +} +updateHSVbyDrag(); + move(); + }, dragStart, dragStop); + + draggable(gSlider, function (dragX, dragY, e) { +var diff = currentG; + currentG = (dragX / gsWidth * 255); + isEmpty = false; + if (e.shiftKey) { + currentG = Math.round(currentG * 10) / 10; + } + if (!opts.showAlpha) { + currentAlpha = 1; + currentAP = opts.aPickerScale; + } +if (currentRGBMode != 0) { + diff = currentG - diff; + if (currentRGBMode == 1) { // linked + currentR = (currentR + diff > 0 ? (currentR + diff < 255 ? currentR + diff : 255) : 0); + currentB = (currentB + diff > 0 ? (currentB + diff < 255 ? currentB + diff : 255) : 0); + } else if (currentRGBMode == 2) { // prop + if (+currentG >= +currentGC2) { currentR = currentRC2; currentG = currentGC2; currentB = currentBC2; updateHelperLocations(); } + else if (+currentG <= +currentGC1) { currentR = currentRC1; currentG = currentGC1; currentB = currentBC1; updateHelperLocations(); } + else { + diff = +currentG - +currentGC1; currentR = +currentRC1 + Math.round(diff * (currentRC2 - currentRC1) / (currentGC2 - currentGC1)); currentB = +currentBC1 + Math.round(diff * (currentBC2 - currentBC1) / (currentGC2 - currentGC1)); + } + } +} +updateHSVbyDrag(); + move(); + }, dragStart, dragStop); + + draggable(bSlider, function (dragX, dragY, e) { +var diff = currentB; + currentB = (dragX / bsWidth * 255); + isEmpty = false; + if (e.shiftKey) { + currentB = Math.round(currentB * 10) / 10; + } + if (!opts.showAlpha) { + currentAlpha = 1; + currentAP = opts.aPickerScale; + } +if (currentRGBMode != 0) { + diff = currentB - diff; + if (currentRGBMode == 1) { // linked + currentR = (currentR + diff > 0 ? (currentR + diff < 255 ? currentR + diff : 255) : 0); + currentG = (currentG + diff > 0 ? (currentG + diff < 255 ? currentG + diff : 255) : 0); + } else if (currentRGBMode == 2) { // prop + if (+currentB >= +currentBC2) { currentR = currentRC2; currentG = currentGC2; currentB = currentBC2; updateHelperLocations(); } + else if (+currentB <= +currentBC1) { currentR = currentRC1; currentG = currentGC1; currentB = currentBC1; updateHelperLocations(); } + else { + diff = +currentB - +currentBC1; currentR = +currentRC1 + Math.round(diff * (currentRC2 - currentRC1) / (currentBC2 - currentBC1)); currentG = +currentGC1 + Math.round(diff * (currentGC2 - currentGC1) / (currentBC2 - currentBC1)); + } + } +} +updateHSVbyDrag(); + move(); + }, dragStart, dragStop); + + draggable(alphaSlider, function (dragX, dragY, e) { currentAlpha = (dragX / alphaWidth); isEmpty = false; @@ -391,6 +822,8 @@ currentAlpha = Math.round(currentAlpha * 10) / 10; } + currentAP = currentAlpha * opts.aPickerScale; + move(); }, dragStart, dragStop); @@ -399,8 +832,18 @@ isEmpty = false; if (!opts.showAlpha) { currentAlpha = 1; + + currentAP = opts.aPickerScale; + } + +updateRGBbyDrag(); +draggerHueUpdateOnBW = true; + move(); + +draggerHueUpdateOnBW = false; + }, dragStart, dragStop); draggable(dragger, function (dragX, dragY, e) { @@ -430,10 +873,14 @@ isEmpty = false; if (!opts.showAlpha) { currentAlpha = 1; + + currentAP = opts.aPickerScale; + } - move(); +updateRGBbyDrag(); + move(); }, dragStart, dragStop); if (!!initialColor) { @@ -454,31 +901,38 @@ show(); } + + function updateHSVbyDrag() { + var new_hsv = new tinycolor({ r: currentR, g: currentG, b: currentB }).toHsv(); + if (currentR+currentG+currentB > 0 && currentR+currentG+currentB < 765) currentHue = (new_hsv.h % 360) / 360; + currentSaturation = new_hsv.s; + currentValue = new_hsv.v; + } + + function updateRGBbyDrag() { + var new_rgb = new tinycolor({ h: currentHue * 360, s: currentSaturation, v: currentValue }).toRgb(); + currentR = new_rgb.r; + currentG = new_rgb.g; + currentB = new_rgb.b; + } + + 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")); + var thumb_el = $(e.target).closest(".sp-thumb-el"); + if (!(thumb_el.hasClass('sp-thumb-active') || thumb_el.hasClass('sp-thumb-inactive'))) { + set(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) { + if (!(e.data && e.data.ignore)) { updateOriginalInput(true); - hide(); - } else { - updateOriginalInput(); + if (opts.hideAfterPaletteSelect) hide(); } } - 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); + paletteContainer.delegate(".sp-thumb-el", paletteEvent, paletteElementClick); + initialColorContainer.delegate(".sp-thumb-el:nth-child(1)", paletteEvent, { ignore: true }, paletteElementClick); } function updateSelectionPaletteFromStorage() { @@ -508,6 +962,25 @@ if (showSelectionPalette) { var rgb = tinycolor(color).toRgbString(); if (!paletteLookup[rgb] && $.inArray(rgb, selectionPalette) === -1) { + + if (paletteFilteringStatus && (selectionPalette.length >= maxSelectionSize)) { + var AF1 = 1, AF2 = 1; + if (opts.showAlpha) { + AF1 = Math.round(100*currentAF1/opts.aPickerScale)/100; + AF2 = Math.round(100*currentAF2/opts.aPickerScale)/100; + } + var lowerbound = { r: currentRF1, g: currentGF1, b: currentBF1, a: AF1 }, + upperbound = { r: currentRF2, g: currentGF2, b: currentBF2, a: AF2 }; + + for (var i = 0; i < selectionPalette.length; ++i) { + var current_color = tinycolor(selectionPalette[i]); + if (! current_color.inRange(lowerbound, upperbound)) { + selectionPalette.splice(i, 1) + break; + } + } + } + selectionPalette.push(rgb); while(selectionPalette.length > maxSelectionSize) { selectionPalette.shift(); @@ -549,7 +1022,18 @@ updateSelectionPaletteFromStorage(); if (selectionPalette) { - html.push(paletteTemplate(getUniqueSelectionPalette(), currentColor, "sp-palette-row sp-palette-row-selection", opts)); + + var paletteFiltering = null; + if (paletteFilteringStatus) { + var AF1 = 1, AF2 = 1; + if (opts.showAlpha) { + AF1 = Math.round(100*currentAF1/opts.aPickerScale)/100; + AF2 = Math.round(100*currentAF2/opts.aPickerScale)/100; + } + paletteFiltering = {isOn: paletteFilteringStatus, lowerbound: { r: currentRF1, g: currentGF1, b: currentBF1, a: AF1 }, upperbound: { r: currentRF2, g: currentGF2, b: currentBF2, a: AF2 }}; + } + html.push(paletteTemplate(getUniqueSelectionPalette(), currentColor, "sp-palette-row sp-palette-row-selection", opts, paletteFiltering)); + } paletteContainer.html(html.join("")); @@ -585,15 +1069,23 @@ if ((value === null || value === "") && allowEmpty) { set(null); - move(); - updateOriginalInput(); + updateOriginalInput(true); } else { var tiny = tinycolor(value); if (tiny.isValid()) { + + if ((tiny.getFormat() == "rgb" || tiny.getFormat() == "hex") && currentRGBMode == 2) { + if (tiny._r > currentRC2) tiny._r = currentRC2; + else if (tiny._r < currentRC1) tiny._r = currentRC1; + if (tiny._g > currentGC2) tiny._g = currentGC2; + else if (tiny._g < currentGC1) tiny._g = currentGC1; + if (tiny._b > currentBC2) tiny._b = currentBC2; + else if (tiny._b < currentBC1) tiny._b = currentBC1; + } + set(tiny); - move(); - updateOriginalInput(); + updateOriginalInput(true); } else { textInput.addClass("sp-validation-error"); @@ -601,6 +1093,65 @@ } } +function setFromPickerInput(pickerInput, old, mv=255) { + // (I need to do this because click on pickers number input arrows doesn't immediately make contraints lose focus more about this on updateUI() ) + if ($( document.activeElement ).prop("id").indexOf("_constraint") >= 0) $(document.activeElement).blur(); + + var value = pickerInput.val(); + if (value == old) return; + if (value < 0) value = 0; + else if (value > mv) value = mv; + + if (currentRGBMode != 0 && $.isNumeric(value)) { + var c_id = pickerInput.prop('id').charAt(0); + var diff = value; + if (c_id == 'r') { + diff -= currentR; + if (currentRGBMode == 1) { // fixed + gPickerInput.val(currentG + diff > 0 ? (currentG + diff < 255 ? currentG + diff : 255) : 0); + bPickerInput.val(currentB + diff > 0 ? (currentB + diff < 255 ? currentB + diff : 255) : 0); + } else if (currentRGBMode == 2) { // prop + if (+value >= +currentRC2) { value = currentRC2; gPickerInput.val(currentGC2); bPickerInput.val(currentBC2); } + else if (+value <= +currentRC1) { value = currentRC1; gPickerInput.val(currentGC1); bPickerInput.val(currentBC1); } + else { diff = +value - +currentRC1; gPickerInput.val(+currentGC1 + Math.round(diff * (currentGC2 - currentGC1) / (currentRC2 - currentRC1))); bPickerInput.val(+currentBC1 + Math.round(diff * (currentBC2 - currentBC1) / (currentRC2 - currentRC1))); } + } + } else if (c_id == 'g') { + diff -= currentG; + if (currentRGBMode == 1) { // fixed + rPickerInput.val(currentR + diff > 0 ? (currentR + diff < 255 ? currentR + diff : 255) : 0); + bPickerInput.val(currentB + diff > 0 ? (currentB + diff < 255 ? currentB + diff : 255) : 0); + } else if (currentRGBMode == 2) { // prop + if (+value >= +currentGC2) { value = currentGC2; rPickerInput.val(currentRC2); bPickerInput.val(currentBC2); } + else if (+value <= +currentGC1) { value = currentGC1; rPickerInput.val(currentRC1); bPickerInput.val(currentBC1); } + else { diff = +value - +currentGC1; rPickerInput.val(+currentRC1 + Math.round(diff * (currentRC2 - currentRC1) / (currentGC2 - currentGC1))); bPickerInput.val(+currentBC1 + Math.round(diff * (currentBC2 - currentBC1) / (currentGC2 - currentGC1))); } + } + } else if (c_id == 'b') { + diff -= currentB; + if (currentRGBMode == 1) { // fixed + rPickerInput.val(currentR + diff > 0 ? (currentR + diff < 255 ? currentR + diff : 255) : 0); + gPickerInput.val(currentG + diff > 0 ? (currentG + diff < 255 ? currentG + diff : 255) : 0); + } else if (currentRGBMode == 2) { // prop + if (+value >= +currentBC2) { value = currentBC2; rPickerInput.val(currentRC2); gPickerInput.val(currentGC2); } + else if (+value <= +currentBC1) { value = currentBC1; rPickerInput.val(currentRC1); gPickerInput.val(currentGC1); } + else { diff = +value - +currentBC1; rPickerInput.val(+currentRC1 + Math.round(diff * (currentRC2 - currentRC1) / (currentBC2 - currentBC1))); gPickerInput.val(+currentGC1 + Math.round(diff * (currentGC2 - currentGC1) / (currentBC2 - currentBC1))); } + } + } + } + pickerInput.val(value); + value = "(" + rPickerInput.val() + ", " + gPickerInput.val() + ", " + bPickerInput.val(); + + if (opts.showAlpha) { + value = "rgba" + value + ", " + Math.round(aPickerInput.val() / mv * 100)/100 + ")"; + } + else { + value = "rgb" + value + ")"; + } + var tiny = tinycolor(value); + if (tiny.isValid()) { + set(tiny); + } +} + function toggle() { if (visible) { hide(); @@ -627,9 +1178,9 @@ hideAll(); visible = true; - $(doc).on("keydown.spectrum", onkeydown); - $(doc).on("click.spectrum", clickout); - $(window).on("resize.spectrum", resize); + $(doc).bind("keydown.spectrum", onkeydown); + $(doc).bind("click.spectrum", clickout); + $(window).bind("resize.spectrum", resize); replacer.addClass("sp-active"); container.removeClass("sp-hidden"); @@ -651,6 +1202,10 @@ } function clickout(e) { + + // (I already explained why I need this on updateUI() ) + if ($( document.activeElement ).prop("id").indexOf("_constraint") >= 0) $( document.activeElement ).trigger( "change" ); + // Return on right click. if (e.button == 2) { return; } @@ -672,9 +1227,9 @@ if (!visible || flat) { return; } visible = false; - $(doc).off("keydown.spectrum", onkeydown); - $(doc).off("click.spectrum", clickout); - $(window).off("resize.spectrum", resize); + $(doc).unbind("keydown.spectrum", onkeydown); + $(doc).unbind("click.spectrum", clickout); + $(window).unbind("resize.spectrum", resize); replacer.removeClass("sp-active"); container.addClass("sp-hidden"); @@ -685,7 +1240,6 @@ function revert() { set(colorOnShow, true); - updateOriginalInput(true); } function set(color, ignoreFormatChange) { @@ -704,7 +1258,12 @@ newColor = tinycolor(color); newHsv = newColor.toHsv(); - currentHue = (newHsv.h % 360) / 360; + currentR = newColor._r; + currentG = newColor._g; + currentB = newColor._b; + currentAP = newHsv.a * opts.aPickerScale; + + if (currentR+currentG+currentB > 0 && currentR+currentG+currentB < 765) currentHue = (newHsv.h % 360) / 360; currentSaturation = newHsv.s; currentValue = newHsv.v; currentAlpha = newHsv.a; @@ -727,7 +1286,7 @@ h: currentHue, s: currentSaturation, v: currentValue, - a: Math.round(currentAlpha * 1000) / 1000 + a: Math.round(currentAlpha * 100) / 100 }, { format: opts.format || currentPreferredFormat }); } @@ -746,12 +1305,23 @@ textInput.removeClass("sp-validation-error"); +// need to manually trigger contraints update if I moved from one contraints input to a dragger or arrows of a picker number input (because constraint input doesn't lose its focus) + if ($( document.activeElement ).prop("id").indexOf("_constraint") >= 0 + || $( document.activeElement ).prop("id").indexOf("_picker") >= 0 ) $(document.activeElement).blur(); //second line for picker updating when passing to rgb sliders without hitting enter + updateHelperLocations(); + var realColor = get({ format: format }), + displayColor = ''; + +if (draggerHueUpdateOnBW || !(realColor.toHex(true) == "000" || realColor.toHex(true) == "fff")) { // only update when not black|white : this should prevent square to always drop back to red even when sliding/picking from green, blue, etc. (BUT forced to ALWAYS update after Hue slider drag) + // 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")) { @@ -760,8 +1330,6 @@ } } - var realColor = get({ format: format }), - displayColor = ''; //reset background info for preview element previewElement.removeClass("sp-clear-display"); @@ -784,8 +1352,22 @@ previewElement.css("filter", realColor.toFilter()); } + if (opts.showRGBsliders) { + updateRGBSlidersGradients(realHex); + } + + if (opts.showRGBApickers) { + var rgb = realColor.toRgb(); + rPickerInput.val(rgb.r); + gPickerInput.val(rgb.g); + bPickerInput.val(rgb.b); + } + if (opts.showAlpha) { var rgb = realColor.toRgb(); + + if (opts.showRGBApickers) aPickerInput.val(Math.round(rgb.a * opts.aPickerScale)); + rgb.a = 0; var realAlpha = tinycolor(rgb).toRgbString(); var gradient = "linear-gradient(left, " + realAlpha + ", " + realHex + ")"; @@ -818,18 +1400,93 @@ drawInitial(); } + function updateRGBSlidersGradients(realHex = get().toHexString()) { //### IE gradient-filters ok ?? + var g_left = "linear-gradient(left,", gradientR = " ", gradientG = " ", gradientB = " "; + if (currentRGBMode == 2) { + if (IE) { gradientR = gradientG = gradientB = tinycolor({ r: currentRC1, g: currentGC1, b: currentBC1 }).toFilter({ gradientType: false }, tinycolor({ r: currentRC2, g: currentGC2, b: currentBC2 })); } + else { gradientR = gradientG = gradientB += "rgb("+currentRC1+","+currentGC1+","+currentBC1+"),rgb("+currentRC2+","+currentGC2+","+currentBC2+")"; } + } else if (currentRGBMode == 1) { + if (IE) { + gradientR = tinycolor({ r: 0, g: Math.max(0, +currentG - +currentR), b: Math.max(0, +currentB - +currentR) }).toFilter({ gradientType: false }, tinycolor({ r: 255, g: Math.min(255, 255 + +currentG - +currentR), b: Math.min(255, 255 + +currentB - +currentR) })); + gradientG = tinycolor({ r: Math.max(0, +currentR - +currentG), g: 0, b: Math.max(0, +currentB - +currentG) }).toFilter({ gradientType: false }, tinycolor({ r: Math.min(255, 255 + +currentR - +currentG), g: 255, b: Math.min(255, 255 + +currentB - +currentG) })); + gradientB = tinycolor({ r: Math.max(0, +currentR - +currentB), g: Math.max(0, +currentG - +currentB), b: 0 }).toFilter({ gradientType: false }, tinycolor({ r: Math.min(255, 255 + +currentR - +currentB), g: Math.min(255, 255 + +currentG - +currentB), b: 255 })); + } + else { + gradientR += "rgb(0,"+Math.max(0, +currentG - +currentR)+","+Math.max(0, +currentB - +currentR)+"),rgb(255,"+Math.min(255, 255 + +currentG - +currentR)+","+Math.min(255, 255 + +currentB - +currentR)+")"; + gradientG += "rgb("+Math.max(0, +currentR - +currentG)+",0,"+Math.max(0, +currentB - +currentG)+"),rgb("+Math.min(255, 255 + +currentR - +currentG)+",255,"+Math.min(255, 255 + +currentB - +currentG)+")"; + gradientB += "rgb("+Math.max(0, +currentR - +currentB)+","+Math.max(0, +currentG - +currentB)+",0),rgb("+Math.min(255, 255 + +currentR - +currentB)+","+Math.min(255, 255 + +currentG - +currentB)+",255)"; + } + } else { + if (IE) { + gradientR = tinycolor(realHex.replaceAt(1, "00")).toFilter({ gradientType: false }, realHex.replaceAt(1, "ff")); + gradientG = tinycolor(realHex.replaceAt(3, "00")).toFilter({ gradientType: false }, realHex.replaceAt(3, "ff")); + gradientB = tinycolor(realHex.replaceAt(5, "00")).toFilter({ gradientType: false }, realHex.replaceAt(5, "ff")); + } + else { + gradientR += realHex.replaceAt(1, "00") + "," + realHex.replaceAt(1, "ff"); + gradientG += realHex.replaceAt(3, "00") + "," + realHex.replaceAt(3, "ff"); + gradientB += realHex.replaceAt(5, "00") + "," + realHex.replaceAt(5, "ff"); + } + } + if (IE) { + rSliderInner.css("filter", gradientR); + } + else { + gradientR += ")"; + rSliderInner.css("background", "-webkit-" + g_left + gradientR); + rSliderInner.css("background", "-moz-" + g_left + gradientR); + rSliderInner.css("background", "-ms-" + g_left + gradientR); + // Use current syntax gradient on unprefixed property. + rSliderInner.css("background", "linear-gradient(to right," + gradientR); + } + + if (IE) { + gSliderInner.css("filter", gradientG); + } + else { + gradientG += ")"; + gSliderInner.css("background", "-webkit-" + g_left + gradientG); + gSliderInner.css("background", "-moz-" + g_left + gradientG); + gSliderInner.css("background", "-ms-" + g_left + gradientG); + // Use current syntax gradient on unprefixed property. + gSliderInner.css("background", "linear-gradient(to right, " + gradientG); + } + + if (IE) { + bSliderInner.css("filter", gradientB); + } + else { + gradientB += ")"; + bSliderInner.css("background", "-webkit-" + g_left + gradientB); + bSliderInner.css("background", "-moz-" + g_left + gradientB); + bSliderInner.css("background", "-ms-" + g_left + gradientB); + // Use current syntax gradient on unprefixed property. + bSliderInner.css("background", "linear-gradient(to right, " + gradientB); + } + } + function updateHelperLocations() { var s = currentSaturation; var v = currentValue; if(allowEmpty && isEmpty) { //if selected color is empty, hide the helpers + + rSlideHelper.hide(); + gSlideHelper.hide(); + bSlideHelper.hide(); + alphaSlideHelper.hide(); slideHelper.hide(); dragHelper.hide(); } else { //make sure helpers are visible + + rSlideHelper.show(); + gSlideHelper.show(); + bSlideHelper.show(); + alphaSlideHelper.show(); slideHelper.show(); dragHelper.show(); @@ -850,6 +1507,21 @@ "left": dragX + "px" }); + + var rsX = Math.round(currentR * rsWidth / 255); + rSlideHelper.css({ + "left": (rsX - (rSlideHelperWidth / 2)) + "px" + }); + var gsX = Math.round(currentG * gsWidth / 255); + gSlideHelper.css({ + "left": (gsX - (gSlideHelperWidth / 2)) + "px" + }); + var bsX = Math.round(currentB * bsWidth / 255); + bSlideHelper.css({ + "left": (bsX - (bSlideHelperWidth / 2)) + "px" + }); + + var alphaX = currentAlpha * alphaWidth; alphaSlideHelper.css({ "left": (alphaX - (alphaSlideHelperWidth / 2)) + "px" @@ -863,6 +1535,138 @@ } } + + function updateConstraintLocation(pickerInput, cHelper, sWidth, mv, cp_id) { + var value = pickerInput.val(); + if (value < 0) value = 0; + else if (value > 255) value = 255; + + if (value >= 0 && value <= 255) { + if (mv < 300) { // C2, mv=C1 + if (+value < +mv) value = mv; + } else { // C1, mv=C2 + if (+value > +mv - 300) value = +mv - 300; + } + pickerInput.val(value); + cHelper.css({ + "left": (Math.round(value * sWidth / 255) - (mv < 300 ? 1 : 2)) + "px" + }); + + switch (cp_id) { + case "r1": + currentRC1 = value; + break; + case "g1": + currentGC1 = value; + break; + case "b1": + currentBC1 = value; + break; + case "r2": + currentRC2 = value; + break; + case "g2": + currentGC2 = value; + break; + case "b2": + currentBC2 = value; + break; + } + if (opts.showRGBsliders) updateRGBSlidersGradients(); + } + } + + function updatePaletteFiltering(pickerInput, mv, cp_id, old) { + var value = pickerInput.val(); + if (value == old) return; + if (value < 0) value = 0; + else if (value > 255) value = 255; + + if (value >= 0 && value <= 255) { + if (mv < 300) { // F2, mv=F1 + if (+value < +mv) value = mv; + } else { // F1, mv=f2 + if (+value > +mv - 300) value = +mv - 300; + } + + switch (cp_id) { + case "r1": + currentRF1 = value; + break; + case "g1": + currentGF1 = value; + break; + case "b1": + currentBF1 = value; + break; + case "a1": + currentAF1 = value; + break; + case "r2": + currentRF2 = value; + break; + case "g2": + currentGF2 = value; + break; + case "b2": + currentBF2 = value; + break; + case "a2": + if (+value > +opts.aPickerScale) value = opts.aPickerScale; + currentAF2 = value; + break; + } + pickerInput.val(value); + drawPalette(); // update palette with colors filtering + } + } + + function clearPalette(target, exposeCurrent) { // target color(s) to remove : 0 = current only, 1 = unfiltered (may or not preserve current), 2 = all (may or not preserve current) + if (showSelectionPalette && ((target == 0 && exposeCurrent === true) || (target == 1 && paletteFilteringStatus) || (target == 2))) { + if (! exposeCurrent || target == 0) var color = get(); + switch (target) { + case 0: // I know exposeCurrent is always true in this case + let i = selectionPalette.indexOf(tinycolor(color).toRgbString()); + if (i >= 0) selectionPalette.splice(i, 1); + break; + + case 1: // I know paletteFilteringStatus is always on in this case + let AF1 = 1, AF2 = 1; + if (opts.showAlpha) { + AF1 = Math.round(100*currentAF1/opts.aPickerScale)/100; + AF2 = Math.round(100*currentAF2/opts.aPickerScale)/100; + } + var lowerbound = { r: currentRF1, g: currentGF1, b: currentBF1, a: AF1 }, + upperbound = { r: currentRF2, g: currentGF2, b: currentBF2, a: AF2 }; + + for (let i = selectionPalette.length-1; i>=0; i--) { + let current_tiny = tinycolor(selectionPalette[i]); + if (! current_tiny.inRange(lowerbound, upperbound)) if (exposeCurrent || ! tinycolor.equals(color, selectionPalette[i])) selectionPalette.splice(i, 1); + } + break; + + case 2: + let preserveCurrent = false; + if (! exposeCurrent) { + var current = tinycolor(color).toRgbString(); + if (selectionPalette.indexOf(current) >= 0) preserveCurrent = true; + } + selectionPalette = []; + if (preserveCurrent) selectionPalette.push(current); + break; + } + + if (localStorageKey && window.localStorage) { + try { + window.localStorage[localStorageKey] = selectionPalette.join(";"); + } + catch(e) { } + } + + drawPalette(); + } + } + function updateOriginalInput(fireCallback) { var color = get(), displayColor = '', @@ -894,6 +1698,14 @@ slideWidth = slider.width(); slideHeight = slider.height(); slideHelperHeight = slideHelper.height(); + + rsWidth = rSlider.width(); + rSlideHelperWidth = rSlideHelper.width(); + gsWidth = gSlider.width(); + gSlideHelperWidth = gSlideHelper.width(); + bsWidth = bSlider.width(); + bSlideHelperWidth = bSlideHelper.width(); + alphaWidth = alphaSlider.width(); alphaSlideHelperWidth = alphaSlideHelper.width(); @@ -917,7 +1729,7 @@ function destroy() { boundElement.show(); - offsetElement.off("click.spectrum touchstart.spectrum"); + offsetElement.unbind("click.spectrum touchstart.spectrum"); container.remove(); replacer.remove(); spectrums[spect.id] = null; @@ -996,27 +1808,17 @@ 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; + offset.top += inputHeight; - offsetLeft -= - Math.min(offsetLeft, (offsetLeft + dpWidth > viewWidth && viewWidth > dpWidth) ? - Math.abs(offsetLeft + dpWidth - viewWidth) : 0); + offset.left -= + Math.min(offset.left, (offset.left + dpWidth > viewWidth && viewWidth > dpWidth) ? + Math.abs(offset.left + dpWidth - viewWidth) : 0); - offsetTop -= - Math.min(offsetTop, ((offsetTop + dpHeight > viewHeight && viewHeight > dpHeight) ? + offset.top -= + Math.min(offset.top, ((offset.top + 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 - }; + return offset; } /** @@ -1109,7 +1911,7 @@ maxWidth = $(element).width(); offset = $(element).offset(); - $(doc).on(duringDragEvents); + $(doc).bind(duringDragEvents); $(doc.body).addClass("sp-dragging"); move(e); @@ -1121,7 +1923,7 @@ function stop() { if (dragging) { - $(doc).off(duringDragEvents); + $(doc).unbind(duringDragEvents); $(doc.body).removeClass("sp-dragging"); // Wait a tick before notifying observers to allow the click event @@ -1133,7 +1935,7 @@ dragging = false; } - $(element).on("touchstart mousedown", start); + $(element).bind("touchstart mousedown", start); } function throttle(func, wait, debounce) { @@ -1196,7 +1998,7 @@ // Initializing a new instance of spectrum return this.spectrum("destroy").each(function () { - var options = $.extend({}, $(this).data(), opts); + var options = $.extend({}, opts, $(this).data()); var spect = spectrum(this, options); $(this).data(dataID, spect.id); }); @@ -1262,7 +2064,7 @@ this._g = rgb.g, this._b = rgb.b, this._a = rgb.a, - this._roundA = mathRound(1000 * this._a) / 1000, + this._roundA = mathRound(100*this._a) / 100, this._format = opts.format || rgb.format; this._gradientType = opts.gradientType; @@ -1303,7 +2105,7 @@ }, setAlpha: function(value) { this._a = boundAlpha(value); - this._roundA = mathRound(1000 * this._a) / 1000; + this._roundA = mathRound(100*this._a) / 100; return this; }, toHsv: function() { @@ -1423,6 +2225,10 @@ return formattedString || this.toHexString(); }, + inRange: function(color1, color2) { + return inRange(this, color1, color2); + }, + _applyModification: function(fn, args) { var color = fn.apply(null, [this].concat([].slice.call(args))); this._r = color._r; @@ -1740,6 +2546,15 @@ if (!color1 || !color2) { return false; } return tinycolor(color1).toRgbString() == tinycolor(color2).toRgbString(); }; + + function inRange(color, lowerbound_color, upperbound_color) { + if (lowerbound_color !== undefined && typeof lowerbound_color == "object" && lowerbound_color.hasOwnProperty("r") && lowerbound_color.hasOwnProperty("g") && lowerbound_color.hasOwnProperty("b") && lowerbound_color.hasOwnProperty("a")) + if ( +lowerbound_color.r > +color._r || +lowerbound_color.g > +color._g || +lowerbound_color.b > +color._b || +lowerbound_color.a > +color._roundA) return false; + if (upperbound_color !== undefined && typeof upperbound_color == "object" && upperbound_color.hasOwnProperty("r") && upperbound_color.hasOwnProperty("g") && upperbound_color.hasOwnProperty("b") && upperbound_color.hasOwnProperty("a")) + if ( +upperbound_color.r < +color._r || +upperbound_color.g < +color._g || +upperbound_color.b < +color._b || +upperbound_color.a < +color._roundA) return false; + return true; + }; + tinycolor.random = function() { return tinycolor.fromRatio({ r: mathRandom(), From 5f702c0501b49057e5c0b5fcc5f1ae5c0b200acf Mon Sep 17 00:00:00 2001 From: danicotra <32748257+danicotra@users.noreply.github.com> Date: Sun, 19 Nov 2017 14:58:04 +0100 Subject: [PATCH 02/12] Update README.md --- README.md | 2 +- 1 file changed, 1 insertion(+), 1 deletion(-) diff --git a/README.md b/README.md index c8634e5d..c792d21f 100644 --- a/README.md +++ b/README.md @@ -61,4 +61,4 @@ Also I didn't test this on IE < 11 versions (tbh I'm not even interested doing i ### OK... Now let's see it! -**FULL EXAMPLE** (showing all the described new features) ___[here](my_testcase.html)___ +**FULL EXAMPLE** (showing all the described new features) ___[here](https://danicotra.github.io/spectrum/my_testcase.html)___ From 661df5f6e79a2b75b9cb836b38232862f64214bf Mon Sep 17 00:00:00 2001 From: danicotra <32748257+danicotra@users.noreply.github.com> Date: Sun, 19 Nov 2017 16:05:04 +0100 Subject: [PATCH 03/12] Add files via upload --- indexof-min.js | 1 + 1 file changed, 1 insertion(+) create mode 100644 indexof-min.js diff --git a/indexof-min.js b/indexof-min.js new file mode 100644 index 00000000..1b931647 --- /dev/null +++ b/indexof-min.js @@ -0,0 +1 @@ +if(!Array.prototype.indexOf){Array.prototype.indexOf=function(b){var a=this.length>>>0;var c=Number(arguments[1])||0;c=(c<0)?Math.ceil(c):Math.floor(c);if(c<0){c+=a}for(;c Date: Sun, 19 Nov 2017 16:07:13 +0100 Subject: [PATCH 04/12] link to original file repository --- indexof-min.js | 3 ++- 1 file changed, 2 insertions(+), 1 deletion(-) diff --git a/indexof-min.js b/indexof-min.js index 1b931647..78484a98 100644 --- a/indexof-min.js +++ b/indexof-min.js @@ -1 +1,2 @@ -if(!Array.prototype.indexOf){Array.prototype.indexOf=function(b){var a=this.length>>>0;var c=Number(arguments[1])||0;c=(c<0)?Math.ceil(c):Math.floor(c);if(c<0){c+=a}for(;c>>0;var c=Number(arguments[1])||0;c=(c<0)?Math.ceil(c):Math.floor(c);if(c<0){c+=a}for(;c Date: Sun, 19 Nov 2017 16:11:43 +0100 Subject: [PATCH 05/12] Added indexOf polyfill for IE 11 sake --- my_testcase.html | 9 +++------ 1 file changed, 3 insertions(+), 6 deletions(-) diff --git a/my_testcase.html b/my_testcase.html index 69ab709d..fb289be9 100644 --- a/my_testcase.html +++ b/my_testcase.html @@ -14,6 +14,8 @@ + + @@ -109,10 +111,5 @@

Full Example : showing all added features

//*/ - -

-Known issues : my CSS Layout ! :-p - (I think ruleset could be better optimized)

-WON'T DO : style on RGB(A) pickers inputs arrows ('cause only Chrome would support them actually...) - \ No newline at end of file + From 7441d9f998af262535cb6a72dd35a18783da42d6 Mon Sep 17 00:00:00 2001 From: danicotra <32748257+danicotra@users.noreply.github.com> Date: Sun, 19 Nov 2017 16:25:26 +0100 Subject: [PATCH 06/12] check before using indexOf polyfill & avoid use of default parameters values on functions for IE 11 sake --- spectrum.js | 8 +++++--- 1 file changed, 5 insertions(+), 3 deletions(-) diff --git a/spectrum.js b/spectrum.js index dee48056..ce4300b5 100644 --- a/spectrum.js +++ b/spectrum.js @@ -1093,7 +1093,8 @@ updateRGBbyDrag(); } } -function setFromPickerInput(pickerInput, old, mv=255) { +function setFromPickerInput(pickerInput, old, mv) { + if (mv === undefined) mv = 255; // (I need to do this because click on pickers number input arrows doesn't immediately make contraints lose focus more about this on updateUI() ) if ($( document.activeElement ).prop("id").indexOf("_constraint") >= 0) $(document.activeElement).blur(); @@ -1306,7 +1307,7 @@ function setFromPickerInput(pickerInput, old, mv=255) { textInput.removeClass("sp-validation-error"); // need to manually trigger contraints update if I moved from one contraints input to a dragger or arrows of a picker number input (because constraint input doesn't lose its focus) - if ($( document.activeElement ).prop("id").indexOf("_constraint") >= 0 + if ($( document.activeElement ).prop("id") !== undefined && ($( document.activeElement ).prop("id").indexOf("_constraint") >= 0 || $( document.activeElement ).prop("id").indexOf("_picker") >= 0 ) $(document.activeElement).blur(); //second line for picker updating when passing to rgb sliders without hitting enter updateHelperLocations(); @@ -1400,7 +1401,8 @@ if (draggerHueUpdateOnBW || !(realColor.toHex(true) == "000" || realColor.toHex( drawInitial(); } - function updateRGBSlidersGradients(realHex = get().toHexString()) { //### IE gradient-filters ok ?? + function updateRGBSlidersGradients(realHex) { //### IE gradient-filters ok ?? + if (realHex === undefined) realHex = get().toHexString(); var g_left = "linear-gradient(left,", gradientR = " ", gradientG = " ", gradientB = " "; if (currentRGBMode == 2) { if (IE) { gradientR = gradientG = gradientB = tinycolor({ r: currentRC1, g: currentGC1, b: currentBC1 }).toFilter({ gradientType: false }, tinycolor({ r: currentRC2, g: currentGC2, b: currentBC2 })); } From 3101040e3be706713b517e5346d1cb5c74c97c9c Mon Sep 17 00:00:00 2001 From: danicotra <32748257+danicotra@users.noreply.github.com> Date: Sun, 19 Nov 2017 17:31:02 +0100 Subject: [PATCH 07/12] TRAVIS --- spectrum.js | 322 ++++++++++++++++++++++++++-------------------------- 1 file changed, 161 insertions(+), 161 deletions(-) diff --git a/spectrum.js b/spectrum.js index ce4300b5..dc6ceb20 100644 --- a/spectrum.js +++ b/spectrum.js @@ -71,11 +71,11 @@ theme: "sp-light", palette: [["#ffffff", "#000000", "#ff0000", "#ff8000", "#ffff00", "#008000", "#0000ff", "#4b0082", "#9400d3"]], selectionPalette: [], - disabled: false, - offset: null - ,paletteRGBAfiltering: false + paletteRGBAfiltering: false, + disabled: false, + offset: null }, spectrums = [], IE = !!/msie/i.exec( window.navigator.userAgent ), @@ -204,7 +204,7 @@ var c = tiny.toHsl().l < 0.5 ? "sp-thumb-el sp-thumb-dark" : "sp-thumb-el sp-thumb-light"; if (tinycolor.equals(color, current)) c += " sp-thumb-active"; - else if (filter != undefined && filter.isOn && ! tiny.inRange(filter.lowerbound, filter.upperbound)) c += " sp-thumb-inactive"; + else if (filter !== undefined && filter.isOn && ! tiny.inRange(filter.lowerbound, filter.upperbound)) c += " sp-thumb-inactive"; var formattedString = tiny.toString(opts.preferredFormat || "rgb"); var swatchStyle = rgbaSupport ? ("background-color:" + tiny.toRgbString()) : "filter:" + tiny.toFilter(); @@ -497,94 +497,94 @@ // Handle user typed input on RGBA pickers - rPickerInput.change(function () { setFromPickerInput(rPickerInput, currentR) }); + rPickerInput.change(function () { setFromPickerInput(rPickerInput, currentR); }); rPickerInput.bind("paste", function () { setTimeout(setFromPickerInput(rPickerInput, currentR), 1); }); rPickerInput.keydown(function (e) { if (e.keyCode == 13) { setFromPickerInput(rPickerInput, currentR); } }); - gPickerInput.change(function () { setFromPickerInput(gPickerInput, currentG) }); + gPickerInput.change(function () { setFromPickerInput(gPickerInput, currentG); }); gPickerInput.bind("paste", function () { setTimeout(setFromPickerInput(gPickerInput, currentG), 1); }); gPickerInput.keydown(function (e) { if (e.keyCode == 13) { setFromPickerInput(gPickerInput, currentG); } }); - bPickerInput.change(function () { setFromPickerInput(bPickerInput, currentB) }); + bPickerInput.change(function () { setFromPickerInput(bPickerInput, currentB); }); bPickerInput.bind("paste", function () { setTimeout(setFromPickerInput(bPickerInput, currentB), 1); }); bPickerInput.keydown(function (e) { if (e.keyCode == 13) { setFromPickerInput(bPickerInput, currentB); } }); - aPickerInput.change(function () { setFromPickerInput(aPickerInput, currentAP, opts.aPickerScale) }); + aPickerInput.change(function () { setFromPickerInput(aPickerInput, currentAP, opts.aPickerScale); }); aPickerInput.bind("paste", function () { setTimeout(setFromPickerInput(aPickerInput, currentAP, opts.aPickerScale), 1); }); aPickerInput.keydown(function (e) { if (e.keyCode == 13) { setFromPickerInput(aPickerInput, currentAP, opts.aPickerScale); } }); - rgbModes.on('change', function() { - if (this.value == '2') { //proportional - currentRGBMode = 2; - } - else if (this.value == '1') { //linked - currentRGBMode = 1; - } + rgbModes.on('change', function() { + if (this.value == '2') { //proportional + currentRGBMode = 2; + } + else if (this.value == '1') { //linked + currentRGBMode = 1; + } else { //normal - currentRGBMode = 0; + currentRGBMode = 0; } //(CSS) classtoggle = handles color + enable/disable+show/hide contraints BUT nothing more (constraints don't have to move here nor handles have to) container.toggleClass("sp-rgb_linked", (currentRGBMode == 1)); container.toggleClass("sp-rgb_prop", (currentRGBMode == 2)); container.find("[id*=_constraint]").prop('disabled', (currentRGBMode != 2)); if (opts.showRGBsliders) updateRGBSlidersGradients(); - }); + }); // Handle user typed input on RGB constraints - container.find("[id*=_constraint1]").each(function () { - var cp_id = $(this).prop('id'); - var cHelper = container.find(".sp-" + cp_id.charAt(0) + "_slider-constraint1"); - if (cp_id.charAt(0) == "r") { + container.find("[id*=_constraint1]").each(function () { + var cp_id = $(this).prop('id'); + var cHelper = container.find(".sp-" + cp_id.charAt(0) + "_slider-constraint1"); + if (cp_id.charAt(0) == "r") { $(this).change(function () { if ($(this).val() != currentRC1) updateConstraintLocation($(this), cHelper, rsWidth, +300 + +currentRC2, "r1"); }); - $(this).bind("paste", function () { - setTimeout(updateConstraintLocation($(this), cHelper, rsWidth, +300 + +currentRC2, "r1"), 1); - }); - $(this).keydown(function (e) { if (e.keyCode == 13) { updateConstraintLocation($(this), cHelper, rsWidth, +300 + +currentRC2, "r1"); } }); - } else if (cp_id.charAt(0) == "g") { + $(this).bind("paste", function () { + setTimeout(updateConstraintLocation($(this), cHelper, rsWidth, +300 + +currentRC2, "r1"), 1); + }); + $(this).keydown(function (e) { if (e.keyCode == 13) { updateConstraintLocation($(this), cHelper, rsWidth, +300 + +currentRC2, "r1"); } }); + } else if (cp_id.charAt(0) == "g") { $(this).change(function () { if ($(this).val() != currentGC1) updateConstraintLocation($(this), cHelper, gsWidth, +300 + +currentGC2, "g1"); }); - $(this).bind("paste", function () { - setTimeout(updateConstraintLocation($(this), cHelper, gsWidth, +300 + +currentGC2, "g1"), 1); - }); - $(this).keydown(function (e) { if (e.keyCode == 13) { updateConstraintLocation($(this), cHelper, gsWidth, +300 + +currentGC2, "g1"); } }); - } else { + $(this).bind("paste", function () { + setTimeout(updateConstraintLocation($(this), cHelper, gsWidth, +300 + +currentGC2, "g1"), 1); + }); + $(this).keydown(function (e) { if (e.keyCode == 13) { updateConstraintLocation($(this), cHelper, gsWidth, +300 + +currentGC2, "g1"); } }); + } else { $(this).change(function () { if ($(this).val() != currentBC1) updateConstraintLocation($(this), cHelper, bsWidth, +300 + +currentBC2, "b1"); }); - $(this).bind("paste", function () { - setTimeout(updateConstraintLocation($(this), cHelper, bsWidth, +300 + +currentBC2, "b1"), 1); - }); - $(this).keydown(function (e) { if (e.keyCode == 13) { updateConstraintLocation($(this), cHelper, bsWidth, +300 + +currentBC2, "b1"); } }); - } - }); - container.find("[id*=_constraint2]").each(function () { - var cp_id = $(this).prop('id'); - var cHelper = container.find(".sp-" + cp_id.charAt(0) + "_slider-constraint2"); - if (cp_id.charAt(0) == "r") { + $(this).bind("paste", function () { + setTimeout(updateConstraintLocation($(this), cHelper, bsWidth, +300 + +currentBC2, "b1"), 1); + }); + $(this).keydown(function (e) { if (e.keyCode == 13) { updateConstraintLocation($(this), cHelper, bsWidth, +300 + +currentBC2, "b1"); } }); + } + }); + container.find("[id*=_constraint2]").each(function () { + var cp_id = $(this).prop('id'); + var cHelper = container.find(".sp-" + cp_id.charAt(0) + "_slider-constraint2"); + if (cp_id.charAt(0) == "r") { $(this).change(function () { if ($(this).val() != currentRC2) updateConstraintLocation($(this), cHelper, rsWidth, currentRC1, "r2"); }); - $(this).bind("paste", function () { - setTimeout(updateConstraintLocation($(this), cHelper, rsWidth, currentRC1, "r2"), 1); - }); - $(this).keydown(function (e) { if (e.keyCode == 13) { updateConstraintLocation($(this), cHelper, rsWidth, currentRC1, "r2"); } }); - } else if (cp_id.charAt(0) == "g") { + $(this).bind("paste", function () { + setTimeout(updateConstraintLocation($(this), cHelper, rsWidth, currentRC1, "r2"), 1); + }); + $(this).keydown(function (e) { if (e.keyCode == 13) { updateConstraintLocation($(this), cHelper, rsWidth, currentRC1, "r2"); } }); + } else if (cp_id.charAt(0) == "g") { $(this).change(function () { if ($(this).val() != currentGC2) updateConstraintLocation($(this), cHelper, gsWidth, currentGC1, "g2"); }); - $(this).bind("paste", function () { - setTimeout(updateConstraintLocation($(this), cHelper, gsWidth, currentGC1, "g2"), 1); - }); - $(this).keydown(function (e) { if (e.keyCode == 13) { updateConstraintLocation($(this), cHelper, gsWidth, currentGC1, "g2"); } }); - } else { + $(this).bind("paste", function () { + setTimeout(updateConstraintLocation($(this), cHelper, gsWidth, currentGC1, "g2"), 1); + }); + $(this).keydown(function (e) { if (e.keyCode == 13) { updateConstraintLocation($(this), cHelper, gsWidth, currentGC1, "g2"); } }); + } else { $(this).change(function () { if ($(this).val() != currentBC2) updateConstraintLocation($(this), cHelper, bsWidth, currentBC1, "b2"); }); - $(this).bind("paste", function () { - setTimeout(updateConstraintLocation($(this), cHelper, bsWidth, currentBC1, "b2"), 1); - }); - $(this).keydown(function (e) { if (e.keyCode == 13) { updateConstraintLocation($(this), cHelper, bsWidth, currentBC1, "b2"); } }); - } - }); + $(this).bind("paste", function () { + setTimeout(updateConstraintLocation($(this), cHelper, bsWidth, currentBC1, "b2"), 1); + }); + $(this).keydown(function (e) { if (e.keyCode == 13) { updateConstraintLocation($(this), cHelper, bsWidth, currentBC1, "b2"); } }); + } + }); - container.find(".sp-rgb_modes-legend").mouseover(function () { $(this).toggleClass("sp-legend-tooltip-show", true); }); - container.find(".sp-rgb_modes-legend").mouseout(function () { $(this).toggleClass("sp-legend-tooltip-show", false); }); + container.find(".sp-rgb_modes-legend").mouseover(function () { $(this).toggleClass("sp-legend-tooltip-show", true); }); + container.find(".sp-rgb_modes-legend").mouseout(function () { $(this).toggleClass("sp-legend-tooltip-show", false); }); paletteFilters.on('change', function() { if (this.value == '1') { @@ -739,20 +739,20 @@ var diff = currentR; } if (!opts.showAlpha) { currentAlpha = 1; - currentAP = opts.aPickerScale; + currentAP = opts.aPickerScale; } if (currentRGBMode != 0) { - diff = currentR - diff; - if (currentRGBMode == 1) { // linked - currentG = (currentG + diff > 0 ? (currentG + diff < 255 ? currentG + diff : 255) : 0); - currentB = (currentB + diff > 0 ? (currentB + diff < 255 ? currentB + diff : 255) : 0); - } else if (currentRGBMode == 2) { // prop - if (+currentR >= +currentRC2) { currentR = currentRC2; currentG = currentGC2; currentB = currentBC2; updateHelperLocations(); } - else if (+currentR <= +currentRC1) { currentR = currentRC1; currentG = currentGC1; currentB = currentBC1; updateHelperLocations(); } - else { + diff = currentR - diff; + if (currentRGBMode == 1) { // linked + currentG = (currentG + diff > 0 ? (currentG + diff < 255 ? currentG + diff : 255) : 0); + currentB = (currentB + diff > 0 ? (currentB + diff < 255 ? currentB + diff : 255) : 0); + } else if (currentRGBMode == 2) { // prop + if (+currentR >= +currentRC2) { currentR = currentRC2; currentG = currentGC2; currentB = currentBC2; updateHelperLocations(); } + else if (+currentR <= +currentRC1) { currentR = currentRC1; currentG = currentGC1; currentB = currentBC1; updateHelperLocations(); } + else { diff = +currentR - +currentRC1; currentG = +currentGC1 + Math.round(diff * (currentGC2 - currentGC1) / (currentRC2 - currentRC1)); currentB = +currentBC1 + Math.round(diff * (currentBC2 - currentBC1) / (currentRC2 - currentRC1)); } - } + } } updateHSVbyDrag(); move(); @@ -767,20 +767,20 @@ var diff = currentG; } if (!opts.showAlpha) { currentAlpha = 1; - currentAP = opts.aPickerScale; + currentAP = opts.aPickerScale; } if (currentRGBMode != 0) { - diff = currentG - diff; - if (currentRGBMode == 1) { // linked - currentR = (currentR + diff > 0 ? (currentR + diff < 255 ? currentR + diff : 255) : 0); - currentB = (currentB + diff > 0 ? (currentB + diff < 255 ? currentB + diff : 255) : 0); - } else if (currentRGBMode == 2) { // prop - if (+currentG >= +currentGC2) { currentR = currentRC2; currentG = currentGC2; currentB = currentBC2; updateHelperLocations(); } - else if (+currentG <= +currentGC1) { currentR = currentRC1; currentG = currentGC1; currentB = currentBC1; updateHelperLocations(); } - else { + diff = currentG - diff; + if (currentRGBMode == 1) { // linked + currentR = (currentR + diff > 0 ? (currentR + diff < 255 ? currentR + diff : 255) : 0); + currentB = (currentB + diff > 0 ? (currentB + diff < 255 ? currentB + diff : 255) : 0); + } else if (currentRGBMode == 2) { // prop + if (+currentG >= +currentGC2) { currentR = currentRC2; currentG = currentGC2; currentB = currentBC2; updateHelperLocations(); } + else if (+currentG <= +currentGC1) { currentR = currentRC1; currentG = currentGC1; currentB = currentBC1; updateHelperLocations(); } + else { diff = +currentG - +currentGC1; currentR = +currentRC1 + Math.round(diff * (currentRC2 - currentRC1) / (currentGC2 - currentGC1)); currentB = +currentBC1 + Math.round(diff * (currentBC2 - currentBC1) / (currentGC2 - currentGC1)); } - } + } } updateHSVbyDrag(); move(); @@ -795,20 +795,20 @@ var diff = currentB; } if (!opts.showAlpha) { currentAlpha = 1; - currentAP = opts.aPickerScale; + currentAP = opts.aPickerScale; } if (currentRGBMode != 0) { - diff = currentB - diff; - if (currentRGBMode == 1) { // linked - currentR = (currentR + diff > 0 ? (currentR + diff < 255 ? currentR + diff : 255) : 0); - currentG = (currentG + diff > 0 ? (currentG + diff < 255 ? currentG + diff : 255) : 0); - } else if (currentRGBMode == 2) { // prop - if (+currentB >= +currentBC2) { currentR = currentRC2; currentG = currentGC2; currentB = currentBC2; updateHelperLocations(); } - else if (+currentB <= +currentBC1) { currentR = currentRC1; currentG = currentGC1; currentB = currentBC1; updateHelperLocations(); } - else { + diff = currentB - diff; + if (currentRGBMode == 1) { // linked + currentR = (currentR + diff > 0 ? (currentR + diff < 255 ? currentR + diff : 255) : 0); + currentG = (currentG + diff > 0 ? (currentG + diff < 255 ? currentG + diff : 255) : 0); + } else if (currentRGBMode == 2) { // prop + if (+currentB >= +currentBC2) { currentR = currentRC2; currentG = currentGC2; currentB = currentBC2; updateHelperLocations(); } + else if (+currentB <= +currentBC1) { currentR = currentRC1; currentG = currentGC1; currentB = currentBC1; updateHelperLocations(); } + else { diff = +currentB - +currentBC1; currentR = +currentRC1 + Math.round(diff * (currentRC2 - currentRC1) / (currentBC2 - currentBC1)); currentG = +currentGC1 + Math.round(diff * (currentGC2 - currentGC1) / (currentBC2 - currentBC1)); } - } + } } updateHSVbyDrag(); move(); @@ -833,7 +833,7 @@ updateHSVbyDrag(); if (!opts.showAlpha) { currentAlpha = 1; - currentAP = opts.aPickerScale; + currentAP = opts.aPickerScale; } @@ -874,7 +874,7 @@ draggerHueUpdateOnBW = false; if (!opts.showAlpha) { currentAlpha = 1; - currentAP = opts.aPickerScale; + currentAP = opts.aPickerScale; } @@ -1075,14 +1075,14 @@ updateRGBbyDrag(); var tiny = tinycolor(value); if (tiny.isValid()) { - if ((tiny.getFormat() == "rgb" || tiny.getFormat() == "hex") && currentRGBMode == 2) { - if (tiny._r > currentRC2) tiny._r = currentRC2; - else if (tiny._r < currentRC1) tiny._r = currentRC1; - if (tiny._g > currentGC2) tiny._g = currentGC2; - else if (tiny._g < currentGC1) tiny._g = currentGC1; - if (tiny._b > currentBC2) tiny._b = currentBC2; - else if (tiny._b < currentBC1) tiny._b = currentBC1; - } + if ((tiny.getFormat() == "rgb" || tiny.getFormat() == "hex") && currentRGBMode == 2) { + if (tiny._r > currentRC2) tiny._r = currentRC2; + else if (tiny._r < currentRC1) tiny._r = currentRC1; + if (tiny._g > currentGC2) tiny._g = currentGC2; + else if (tiny._g < currentGC1) tiny._g = currentGC1; + if (tiny._b > currentBC2) tiny._b = currentBC2; + else if (tiny._b < currentBC1) tiny._b = currentBC1; + } set(tiny); updateOriginalInput(true); @@ -1094,59 +1094,59 @@ updateRGBbyDrag(); } function setFromPickerInput(pickerInput, old, mv) { - if (mv === undefined) mv = 255; - // (I need to do this because click on pickers number input arrows doesn't immediately make contraints lose focus more about this on updateUI() ) + if (mv === undefined) mv = 255; + // (I need to do this because click on pickers number input arrows doesn't immediately make contraints lose focus more about this on updateUI() ) if ($( document.activeElement ).prop("id").indexOf("_constraint") >= 0) $(document.activeElement).blur(); var value = pickerInput.val(); - if (value == old) return; - if (value < 0) value = 0; - else if (value > mv) value = mv; - - if (currentRGBMode != 0 && $.isNumeric(value)) { - var c_id = pickerInput.prop('id').charAt(0); - var diff = value; - if (c_id == 'r') { - diff -= currentR; - if (currentRGBMode == 1) { // fixed - gPickerInput.val(currentG + diff > 0 ? (currentG + diff < 255 ? currentG + diff : 255) : 0); - bPickerInput.val(currentB + diff > 0 ? (currentB + diff < 255 ? currentB + diff : 255) : 0); - } else if (currentRGBMode == 2) { // prop - if (+value >= +currentRC2) { value = currentRC2; gPickerInput.val(currentGC2); bPickerInput.val(currentBC2); } - else if (+value <= +currentRC1) { value = currentRC1; gPickerInput.val(currentGC1); bPickerInput.val(currentBC1); } - else { diff = +value - +currentRC1; gPickerInput.val(+currentGC1 + Math.round(diff * (currentGC2 - currentGC1) / (currentRC2 - currentRC1))); bPickerInput.val(+currentBC1 + Math.round(diff * (currentBC2 - currentBC1) / (currentRC2 - currentRC1))); } - } - } else if (c_id == 'g') { - diff -= currentG; - if (currentRGBMode == 1) { // fixed - rPickerInput.val(currentR + diff > 0 ? (currentR + diff < 255 ? currentR + diff : 255) : 0); - bPickerInput.val(currentB + diff > 0 ? (currentB + diff < 255 ? currentB + diff : 255) : 0); - } else if (currentRGBMode == 2) { // prop - if (+value >= +currentGC2) { value = currentGC2; rPickerInput.val(currentRC2); bPickerInput.val(currentBC2); } - else if (+value <= +currentGC1) { value = currentGC1; rPickerInput.val(currentRC1); bPickerInput.val(currentBC1); } - else { diff = +value - +currentGC1; rPickerInput.val(+currentRC1 + Math.round(diff * (currentRC2 - currentRC1) / (currentGC2 - currentGC1))); bPickerInput.val(+currentBC1 + Math.round(diff * (currentBC2 - currentBC1) / (currentGC2 - currentGC1))); } - } - } else if (c_id == 'b') { - diff -= currentB; - if (currentRGBMode == 1) { // fixed - rPickerInput.val(currentR + diff > 0 ? (currentR + diff < 255 ? currentR + diff : 255) : 0); - gPickerInput.val(currentG + diff > 0 ? (currentG + diff < 255 ? currentG + diff : 255) : 0); - } else if (currentRGBMode == 2) { // prop - if (+value >= +currentBC2) { value = currentBC2; rPickerInput.val(currentRC2); gPickerInput.val(currentGC2); } - else if (+value <= +currentBC1) { value = currentBC1; rPickerInput.val(currentRC1); gPickerInput.val(currentGC1); } - else { diff = +value - +currentBC1; rPickerInput.val(+currentRC1 + Math.round(diff * (currentRC2 - currentRC1) / (currentBC2 - currentBC1))); gPickerInput.val(+currentGC1 + Math.round(diff * (currentGC2 - currentGC1) / (currentBC2 - currentBC1))); } - } - } - } - pickerInput.val(value); + if (value == old) return; + if (value < 0) value = 0; + else if (value > mv) value = mv; + + if (currentRGBMode != 0 && $.isNumeric(value)) { + var c_id = pickerInput.prop('id').charAt(0); + var diff = value; + if (c_id == 'r') { + diff -= currentR; + if (currentRGBMode == 1) { // fixed + gPickerInput.val(currentG + diff > 0 ? (currentG + diff < 255 ? currentG + diff : 255) : 0); + bPickerInput.val(currentB + diff > 0 ? (currentB + diff < 255 ? currentB + diff : 255) : 0); + } else if (currentRGBMode == 2) { // prop + if (+value >= +currentRC2) { value = currentRC2; gPickerInput.val(currentGC2); bPickerInput.val(currentBC2); } + else if (+value <= +currentRC1) { value = currentRC1; gPickerInput.val(currentGC1); bPickerInput.val(currentBC1); } + else { diff = +value - +currentRC1; gPickerInput.val(+currentGC1 + Math.round(diff * (currentGC2 - currentGC1) / (currentRC2 - currentRC1))); bPickerInput.val(+currentBC1 + Math.round(diff * (currentBC2 - currentBC1) / (currentRC2 - currentRC1))); } + } + } else if (c_id == 'g') { + diff -= currentG; + if (currentRGBMode == 1) { // fixed + rPickerInput.val(currentR + diff > 0 ? (currentR + diff < 255 ? currentR + diff : 255) : 0); + bPickerInput.val(currentB + diff > 0 ? (currentB + diff < 255 ? currentB + diff : 255) : 0); + } else if (currentRGBMode == 2) { // prop + if (+value >= +currentGC2) { value = currentGC2; rPickerInput.val(currentRC2); bPickerInput.val(currentBC2); } + else if (+value <= +currentGC1) { value = currentGC1; rPickerInput.val(currentRC1); bPickerInput.val(currentBC1); } + else { diff = +value - +currentGC1; rPickerInput.val(+currentRC1 + Math.round(diff * (currentRC2 - currentRC1) / (currentGC2 - currentGC1))); bPickerInput.val(+currentBC1 + Math.round(diff * (currentBC2 - currentBC1) / (currentGC2 - currentGC1))); } + } + } else if (c_id == 'b') { + diff -= currentB; + if (currentRGBMode == 1) { // fixed + rPickerInput.val(currentR + diff > 0 ? (currentR + diff < 255 ? currentR + diff : 255) : 0); + gPickerInput.val(currentG + diff > 0 ? (currentG + diff < 255 ? currentG + diff : 255) : 0); + } else if (currentRGBMode == 2) { // prop + if (+value >= +currentBC2) { value = currentBC2; rPickerInput.val(currentRC2); gPickerInput.val(currentGC2); } + else if (+value <= +currentBC1) { value = currentBC1; rPickerInput.val(currentRC1); gPickerInput.val(currentGC1); } + else { diff = +value - +currentBC1; rPickerInput.val(+currentRC1 + Math.round(diff * (currentRC2 - currentRC1) / (currentBC2 - currentBC1))); gPickerInput.val(+currentGC1 + Math.round(diff * (currentGC2 - currentGC1) / (currentBC2 - currentBC1))); } + } + } + } + pickerInput.val(value); value = "(" + rPickerInput.val() + ", " + gPickerInput.val() + ", " + bPickerInput.val(); - if (opts.showAlpha) { + if (opts.showAlpha) { value = "rgba" + value + ", " + Math.round(aPickerInput.val() / mv * 100)/100 + ")"; - } - else { + } + else { value = "rgb" + value + ")"; - } + } var tiny = tinycolor(value); if (tiny.isValid()) { set(tiny); @@ -1204,7 +1204,7 @@ function setFromPickerInput(pickerInput, old, mv) { function clickout(e) { - // (I already explained why I need this on updateUI() ) + // (I already explained why I need this on updateUI() ) if ($( document.activeElement ).prop("id").indexOf("_constraint") >= 0) $( document.activeElement ).trigger( "change" ); // Return on right click. @@ -1539,20 +1539,20 @@ if (draggerHueUpdateOnBW || !(realColor.toHex(true) == "000" || realColor.toHex( function updateConstraintLocation(pickerInput, cHelper, sWidth, mv, cp_id) { - var value = pickerInput.val(); - if (value < 0) value = 0; - else if (value > 255) value = 255; - - if (value >= 0 && value <= 255) { - if (mv < 300) { // C2, mv=C1 - if (+value < +mv) value = mv; - } else { // C1, mv=C2 - if (+value > +mv - 300) value = +mv - 300; - } - pickerInput.val(value); - cHelper.css({ - "left": (Math.round(value * sWidth / 255) - (mv < 300 ? 1 : 2)) + "px" - }); + var value = pickerInput.val(); + if (value < 0) value = 0; + else if (value > 255) value = 255; + + if (value >= 0 && value <= 255) { + if (mv < 300) { // C2, mv=C1 + if (+value < +mv) value = mv; + } else { // C1, mv=C2 + if (+value > +mv - 300) value = +mv - 300; + } + pickerInput.val(value); + cHelper.css({ + "left": (Math.round(value * sWidth / 255) - (mv < 300 ? 1 : 2)) + "px" + }); switch (cp_id) { case "r1": @@ -1575,7 +1575,7 @@ if (draggerHueUpdateOnBW || !(realColor.toHex(true) == "000" || realColor.toHex( break; } if (opts.showRGBsliders) updateRGBSlidersGradients(); - } + } } function updatePaletteFiltering(pickerInput, mv, cp_id, old) { From 39cbebb355d4f504cfea46535f490d4dda12a8a1 Mon Sep 17 00:00:00 2001 From: danicotra <32748257+danicotra@users.noreply.github.com> Date: Sun, 19 Nov 2017 17:53:20 +0100 Subject: [PATCH 08/12] TRAVIS TAKE THIS! --- spectrum.js | 25 +++++++++++++------------ 1 file changed, 13 insertions(+), 12 deletions(-) diff --git a/spectrum.js b/spectrum.js index dc6ceb20..3590bfd5 100644 --- a/spectrum.js +++ b/spectrum.js @@ -741,7 +741,7 @@ var diff = currentR; currentAlpha = 1; currentAP = opts.aPickerScale; } -if (currentRGBMode != 0) { +if (currentRGBMode !== 0) { diff = currentR - diff; if (currentRGBMode == 1) { // linked currentG = (currentG + diff > 0 ? (currentG + diff < 255 ? currentG + diff : 255) : 0); @@ -769,7 +769,7 @@ var diff = currentG; currentAlpha = 1; currentAP = opts.aPickerScale; } -if (currentRGBMode != 0) { +if (currentRGBMode !== 0) { diff = currentG - diff; if (currentRGBMode == 1) { // linked currentR = (currentR + diff > 0 ? (currentR + diff < 255 ? currentR + diff : 255) : 0); @@ -797,7 +797,7 @@ var diff = currentB; currentAlpha = 1; currentAP = opts.aPickerScale; } -if (currentRGBMode != 0) { +if (currentRGBMode !== 0) { diff = currentB - diff; if (currentRGBMode == 1) { // linked currentR = (currentR + diff > 0 ? (currentR + diff < 255 ? currentR + diff : 255) : 0); @@ -975,7 +975,7 @@ updateRGBbyDrag(); for (var i = 0; i < selectionPalette.length; ++i) { var current_color = tinycolor(selectionPalette[i]); if (! current_color.inRange(lowerbound, upperbound)) { - selectionPalette.splice(i, 1) + selectionPalette.splice(i, 1); break; } } @@ -1095,7 +1095,7 @@ updateRGBbyDrag(); function setFromPickerInput(pickerInput, old, mv) { if (mv === undefined) mv = 255; - // (I need to do this because click on pickers number input arrows doesn't immediately make contraints lose focus more about this on updateUI() ) + // (I need to do this because click on pickers number input arrows doesn't immediately make contraints lose focus more about this on updateUI() ) if ($( document.activeElement ).prop("id").indexOf("_constraint") >= 0) $(document.activeElement).blur(); var value = pickerInput.val(); @@ -1103,7 +1103,7 @@ function setFromPickerInput(pickerInput, old, mv) { if (value < 0) value = 0; else if (value > mv) value = mv; - if (currentRGBMode != 0 && $.isNumeric(value)) { + if (currentRGBMode !== 0 && $.isNumeric(value)) { var c_id = pickerInput.prop('id').charAt(0); var diff = value; if (c_id == 'r') { @@ -1307,8 +1307,7 @@ function setFromPickerInput(pickerInput, old, mv) { textInput.removeClass("sp-validation-error"); // need to manually trigger contraints update if I moved from one contraints input to a dragger or arrows of a picker number input (because constraint input doesn't lose its focus) - if ($( document.activeElement ).prop("id") !== undefined && ($( document.activeElement ).prop("id").indexOf("_constraint") >= 0 - || $( document.activeElement ).prop("id").indexOf("_picker") >= 0 ) $(document.activeElement).blur(); //second line for picker updating when passing to rgb sliders without hitting enter + if ($( document.activeElement ).prop("id") !== undefined && ($( document.activeElement ).prop("id").indexOf("_constraint") >= 0 || $( document.activeElement ).prop("id").indexOf("_picker") >= 0 ) $(document.activeElement).blur(); //second line for picker updating when passing to rgb sliders without hitting enter updateHelperLocations(); @@ -1357,15 +1356,16 @@ if (draggerHueUpdateOnBW || !(realColor.toHex(true) == "000" || realColor.toHex( updateRGBSlidersGradients(realHex); } - if (opts.showRGBApickers) { + if (opts.showRGBApickers || opts.showAlpha) { var rgb = realColor.toRgb(); + + if (opts.showRGBApickers) { rPickerInput.val(rgb.r); gPickerInput.val(rgb.g); bPickerInput.val(rgb.b); } if (opts.showAlpha) { - var rgb = realColor.toRgb(); if (opts.showRGBApickers) aPickerInput.val(Math.round(rgb.a * opts.aPickerScale)); @@ -1385,6 +1385,7 @@ if (draggerHueUpdateOnBW || !(realColor.toHex(true) == "000" || realColor.toHex( "linear-gradient(to right, " + realAlpha + ", " + realHex + ")"); } } + } displayColor = realColor.toString(format); } @@ -1624,8 +1625,8 @@ if (draggerHueUpdateOnBW || !(realColor.toHex(true) == "000" || realColor.toHex( } function clearPalette(target, exposeCurrent) { // target color(s) to remove : 0 = current only, 1 = unfiltered (may or not preserve current), 2 = all (may or not preserve current) - if (showSelectionPalette && ((target == 0 && exposeCurrent === true) || (target == 1 && paletteFilteringStatus) || (target == 2))) { - if (! exposeCurrent || target == 0) var color = get(); + if (showSelectionPalette && ((target === 0 && exposeCurrent === true) || (target == 1 && paletteFilteringStatus) || (target == 2))) { + if (! exposeCurrent || target === 0) var color = get(); switch (target) { case 0: // I know exposeCurrent is always true in this case let i = selectionPalette.indexOf(tinycolor(color).toRgbString()); From 14b5e32c1724dd1ef6eaf1766fe840e61acbaea0 Mon Sep 17 00:00:00 2001 From: danicotra <32748257+danicotra@users.noreply.github.com> Date: Sun, 19 Nov 2017 22:34:26 +0100 Subject: [PATCH 09/12] Modified to meet TRAVIS --- spectrum.js | 100 ++++++++++++++++++++++++++-------------------------- 1 file changed, 50 insertions(+), 50 deletions(-) diff --git a/spectrum.js b/spectrum.js index 3590bfd5..60e082fc 100644 --- a/spectrum.js +++ b/spectrum.js @@ -540,23 +540,23 @@ var cp_id = $(this).prop('id'); var cHelper = container.find(".sp-" + cp_id.charAt(0) + "_slider-constraint1"); if (cp_id.charAt(0) == "r") { - $(this).change(function () { if ($(this).val() != currentRC1) updateConstraintLocation($(this), cHelper, rsWidth, +300 + +currentRC2, "r1"); }); + $(this).change(function () { if ($(this).val() != currentRC1) updateConstraintLocation($(this), cHelper, rsWidth, +300 + (+currentRC2), "r1"); }); $(this).bind("paste", function () { - setTimeout(updateConstraintLocation($(this), cHelper, rsWidth, +300 + +currentRC2, "r1"), 1); + setTimeout(updateConstraintLocation($(this), cHelper, rsWidth, +300 + (+currentRC2), "r1"), 1); }); - $(this).keydown(function (e) { if (e.keyCode == 13) { updateConstraintLocation($(this), cHelper, rsWidth, +300 + +currentRC2, "r1"); } }); + $(this).keydown(function (e) { if (e.keyCode == 13) { updateConstraintLocation($(this), cHelper, rsWidth, +300 + (+currentRC2), "r1"); } }); } else if (cp_id.charAt(0) == "g") { - $(this).change(function () { if ($(this).val() != currentGC1) updateConstraintLocation($(this), cHelper, gsWidth, +300 + +currentGC2, "g1"); }); + $(this).change(function () { if ($(this).val() != currentGC1) updateConstraintLocation($(this), cHelper, gsWidth, +300 + (+currentGC2), "g1"); }); $(this).bind("paste", function () { - setTimeout(updateConstraintLocation($(this), cHelper, gsWidth, +300 + +currentGC2, "g1"), 1); + setTimeout(updateConstraintLocation($(this), cHelper, gsWidth, +300 + (+currentGC2), "g1"), 1); }); - $(this).keydown(function (e) { if (e.keyCode == 13) { updateConstraintLocation($(this), cHelper, gsWidth, +300 + +currentGC2, "g1"); } }); + $(this).keydown(function (e) { if (e.keyCode == 13) { updateConstraintLocation($(this), cHelper, gsWidth, +300 + (+currentGC2), "g1"); } }); } else { - $(this).change(function () { if ($(this).val() != currentBC1) updateConstraintLocation($(this), cHelper, bsWidth, +300 + +currentBC2, "b1"); }); + $(this).change(function () { if ($(this).val() != currentBC1) updateConstraintLocation($(this), cHelper, bsWidth, +300 + (+currentBC2), "b1"); }); $(this).bind("paste", function () { - setTimeout(updateConstraintLocation($(this), cHelper, bsWidth, +300 + +currentBC2, "b1"), 1); + setTimeout(updateConstraintLocation($(this), cHelper, bsWidth, +300 + (+currentBC2), "b1"), 1); }); - $(this).keydown(function (e) { if (e.keyCode == 13) { updateConstraintLocation($(this), cHelper, bsWidth, +300 + +currentBC2, "b1"); } }); + $(this).keydown(function (e) { if (e.keyCode == 13) { updateConstraintLocation($(this), cHelper, bsWidth, +300 + (+currentBC2), "b1"); } }); } }); container.find("[id*=_constraint2]").each(function () { @@ -605,29 +605,29 @@ container.find("[id*=_filter1]").each(function () { var cp_id = $(this).prop('id'); if (cp_id.charAt(0) == "r") { - $(this).change(function () { updatePaletteFiltering($(this), +300 + +currentRF2, "r1", currentRF1); }); + $(this).change(function () { updatePaletteFiltering($(this), +300 + (+currentRF2), "r1", currentRF1); }); $(this).bind("paste", function () { - setTimeout(updatePaletteFiltering($(this), +300 + +currentRF2, "r1", currentRF1), 1); + setTimeout(updatePaletteFiltering($(this), +300 + (+currentRF2), "r1", currentRF1), 1); }); - $(this).keydown(function (e) { if (e.keyCode == 13) { updatePaletteFiltering($(this), +300 + +currentRF2, "r1", currentRF1); } }); + $(this).keydown(function (e) { if (e.keyCode == 13) { updatePaletteFiltering($(this), +300 + (+currentRF2), "r1", currentRF1); } }); } else if (cp_id.charAt(0) == "g") { - $(this).change(function () { updatePaletteFiltering($(this), +300 + +currentGF2, "g1", currentGF1); }); + $(this).change(function () { updatePaletteFiltering($(this), +300 + (+currentGF2), "g1", currentGF1); }); $(this).bind("paste", function () { - setTimeout(updatePaletteFiltering($(this), +300 + +currentGF2, "g1", currentGF1), 1); + setTimeout(updatePaletteFiltering($(this), +300 + (+currentGF2), "g1", currentGF1), 1); }); - $(this).keydown(function (e) { if (e.keyCode == 13) { updatePaletteFiltering($(this), +300 + +currentGF2, "g1", currentGF1); } }); + $(this).keydown(function (e) { if (e.keyCode == 13) { updatePaletteFiltering($(this), +300 + (+currentGF2), "g1", currentGF1); } }); } else if (cp_id.charAt(0) == "b") { - $(this).change(function () { updatePaletteFiltering($(this), +300 + +currentBF2, "b1", currentBF1); }); + $(this).change(function () { updatePaletteFiltering($(this), +300 + (+currentBF2), "b1", currentBF1); }); $(this).bind("paste", function () { - setTimeout(updatePaletteFiltering($(this), +300 + +currentBF2, "b1", currentBF1), 1); + setTimeout(updatePaletteFiltering($(this), +300 + (+currentBF2), "b1", currentBF1), 1); }); - $(this).keydown(function (e) { if (e.keyCode == 13) { updatePaletteFiltering($(this), +300 + +currentBF2, "b1", currentBF1); } }); + $(this).keydown(function (e) { if (e.keyCode == 13) { updatePaletteFiltering($(this), +300 + (+currentBF2), "b1", currentBF1); } }); } else { - $(this).change(function () { updatePaletteFiltering($(this), +300 + +currentAF2, "a1", currentAF1); }); + $(this).change(function () { updatePaletteFiltering($(this), +300 + (+currentAF2), "a1", currentAF1); }); $(this).bind("paste", function () { - setTimeout(updatePaletteFiltering($(this), +300 + +currentAF2, "a1", currentAF1), 1); + setTimeout(updatePaletteFiltering($(this), +300 + (+currentAF2), "a1", currentAF1), 1); }); - $(this).keydown(function (e) { if (e.keyCode == 13) { updatePaletteFiltering($(this), +300 + +currentAF2, "a1", currentAF1); } }); + $(this).keydown(function (e) { if (e.keyCode == 13) { updatePaletteFiltering($(this), +300 + (+currentAF2), "a1", currentAF1); } }); } }); container.find("[id*=_filter2]").each(function () { @@ -747,10 +747,10 @@ if (currentRGBMode !== 0) { currentG = (currentG + diff > 0 ? (currentG + diff < 255 ? currentG + diff : 255) : 0); currentB = (currentB + diff > 0 ? (currentB + diff < 255 ? currentB + diff : 255) : 0); } else if (currentRGBMode == 2) { // prop - if (+currentR >= +currentRC2) { currentR = currentRC2; currentG = currentGC2; currentB = currentBC2; updateHelperLocations(); } - else if (+currentR <= +currentRC1) { currentR = currentRC1; currentG = currentGC1; currentB = currentBC1; updateHelperLocations(); } + if ((+currentR) >= (+currentRC2)) { currentR = currentRC2; currentG = currentGC2; currentB = currentBC2; updateHelperLocations(); } + else if ((+currentR) <= (+currentRC1)) { currentR = currentRC1; currentG = currentGC1; currentB = currentBC1; updateHelperLocations(); } else { - diff = +currentR - +currentRC1; currentG = +currentGC1 + Math.round(diff * (currentGC2 - currentGC1) / (currentRC2 - currentRC1)); currentB = +currentBC1 + Math.round(diff * (currentBC2 - currentBC1) / (currentRC2 - currentRC1)); + diff = (+currentR) - (+currentRC1); currentG = (+currentGC1) + Math.round(diff * (currentGC2 - currentGC1) / (currentRC2 - currentRC1)); currentB = (+currentBC1) + Math.round(diff * (currentBC2 - currentBC1) / (currentRC2 - currentRC1)); } } } @@ -775,10 +775,10 @@ if (currentRGBMode !== 0) { currentR = (currentR + diff > 0 ? (currentR + diff < 255 ? currentR + diff : 255) : 0); currentB = (currentB + diff > 0 ? (currentB + diff < 255 ? currentB + diff : 255) : 0); } else if (currentRGBMode == 2) { // prop - if (+currentG >= +currentGC2) { currentR = currentRC2; currentG = currentGC2; currentB = currentBC2; updateHelperLocations(); } - else if (+currentG <= +currentGC1) { currentR = currentRC1; currentG = currentGC1; currentB = currentBC1; updateHelperLocations(); } + if ((+currentG) >= (+currentGC2)) { currentR = currentRC2; currentG = currentGC2; currentB = currentBC2; updateHelperLocations(); } + else if ((+currentG) <= (+currentGC1)) { currentR = currentRC1; currentG = currentGC1; currentB = currentBC1; updateHelperLocations(); } else { - diff = +currentG - +currentGC1; currentR = +currentRC1 + Math.round(diff * (currentRC2 - currentRC1) / (currentGC2 - currentGC1)); currentB = +currentBC1 + Math.round(diff * (currentBC2 - currentBC1) / (currentGC2 - currentGC1)); + diff = (+currentG) - (+currentGC1); currentR = (+currentRC1) + Math.round(diff * (currentRC2 - currentRC1) / (currentGC2 - currentGC1)); currentB = (+currentBC1) + Math.round(diff * (currentBC2 - currentBC1) / (currentGC2 - currentGC1)); } } } @@ -803,10 +803,10 @@ if (currentRGBMode !== 0) { currentR = (currentR + diff > 0 ? (currentR + diff < 255 ? currentR + diff : 255) : 0); currentG = (currentG + diff > 0 ? (currentG + diff < 255 ? currentG + diff : 255) : 0); } else if (currentRGBMode == 2) { // prop - if (+currentB >= +currentBC2) { currentR = currentRC2; currentG = currentGC2; currentB = currentBC2; updateHelperLocations(); } - else if (+currentB <= +currentBC1) { currentR = currentRC1; currentG = currentGC1; currentB = currentBC1; updateHelperLocations(); } + if ((+currentB) >= (+currentBC2)) { currentR = currentRC2; currentG = currentGC2; currentB = currentBC2; updateHelperLocations(); } + else if ((+currentB) <= (+currentBC1)) { currentR = currentRC1; currentG = currentGC1; currentB = currentBC1; updateHelperLocations(); } else { - diff = +currentB - +currentBC1; currentR = +currentRC1 + Math.round(diff * (currentRC2 - currentRC1) / (currentBC2 - currentBC1)); currentG = +currentGC1 + Math.round(diff * (currentGC2 - currentGC1) / (currentBC2 - currentBC1)); + diff = (+currentB) - (+currentBC1); currentR = (+currentRC1) + Math.round(diff * (currentRC2 - currentRC1) / (currentBC2 - currentBC1)); currentG = (+currentGC1) + Math.round(diff * (currentGC2 - currentGC1) / (currentBC2 - currentBC1)); } } } @@ -1112,9 +1112,9 @@ function setFromPickerInput(pickerInput, old, mv) { gPickerInput.val(currentG + diff > 0 ? (currentG + diff < 255 ? currentG + diff : 255) : 0); bPickerInput.val(currentB + diff > 0 ? (currentB + diff < 255 ? currentB + diff : 255) : 0); } else if (currentRGBMode == 2) { // prop - if (+value >= +currentRC2) { value = currentRC2; gPickerInput.val(currentGC2); bPickerInput.val(currentBC2); } - else if (+value <= +currentRC1) { value = currentRC1; gPickerInput.val(currentGC1); bPickerInput.val(currentBC1); } - else { diff = +value - +currentRC1; gPickerInput.val(+currentGC1 + Math.round(diff * (currentGC2 - currentGC1) / (currentRC2 - currentRC1))); bPickerInput.val(+currentBC1 + Math.round(diff * (currentBC2 - currentBC1) / (currentRC2 - currentRC1))); } + if ((+value) >= (+currentRC2)) { value = currentRC2; gPickerInput.val(currentGC2); bPickerInput.val(currentBC2); } + else if ((+value) <= (+currentRC1)) { value = currentRC1; gPickerInput.val(currentGC1); bPickerInput.val(currentBC1); } + else { diff = (+value) - (+currentRC1); gPickerInput.val((+currentGC1) + Math.round(diff * (currentGC2 - currentGC1) / (currentRC2 - currentRC1))); bPickerInput.val((+currentBC1) + Math.round(diff * (currentBC2 - currentBC1) / (currentRC2 - currentRC1))); } } } else if (c_id == 'g') { diff -= currentG; @@ -1122,9 +1122,9 @@ function setFromPickerInput(pickerInput, old, mv) { rPickerInput.val(currentR + diff > 0 ? (currentR + diff < 255 ? currentR + diff : 255) : 0); bPickerInput.val(currentB + diff > 0 ? (currentB + diff < 255 ? currentB + diff : 255) : 0); } else if (currentRGBMode == 2) { // prop - if (+value >= +currentGC2) { value = currentGC2; rPickerInput.val(currentRC2); bPickerInput.val(currentBC2); } - else if (+value <= +currentGC1) { value = currentGC1; rPickerInput.val(currentRC1); bPickerInput.val(currentBC1); } - else { diff = +value - +currentGC1; rPickerInput.val(+currentRC1 + Math.round(diff * (currentRC2 - currentRC1) / (currentGC2 - currentGC1))); bPickerInput.val(+currentBC1 + Math.round(diff * (currentBC2 - currentBC1) / (currentGC2 - currentGC1))); } + if ((+value) >= (+currentGC2)) { value = currentGC2; rPickerInput.val(currentRC2); bPickerInput.val(currentBC2); } + else if ((+value) <= (+currentGC1)) { value = currentGC1; rPickerInput.val(currentRC1); bPickerInput.val(currentBC1); } + else { diff = (+value) - (+currentGC1); rPickerInput.val((+currentRC1) + Math.round(diff * (currentRC2 - currentRC1) / (currentGC2 - currentGC1))); bPickerInput.val((+currentBC1) + Math.round(diff * (currentBC2 - currentBC1) / (currentGC2 - currentGC1))); } } } else if (c_id == 'b') { diff -= currentB; @@ -1132,9 +1132,9 @@ function setFromPickerInput(pickerInput, old, mv) { rPickerInput.val(currentR + diff > 0 ? (currentR + diff < 255 ? currentR + diff : 255) : 0); gPickerInput.val(currentG + diff > 0 ? (currentG + diff < 255 ? currentG + diff : 255) : 0); } else if (currentRGBMode == 2) { // prop - if (+value >= +currentBC2) { value = currentBC2; rPickerInput.val(currentRC2); gPickerInput.val(currentGC2); } - else if (+value <= +currentBC1) { value = currentBC1; rPickerInput.val(currentRC1); gPickerInput.val(currentGC1); } - else { diff = +value - +currentBC1; rPickerInput.val(+currentRC1 + Math.round(diff * (currentRC2 - currentRC1) / (currentBC2 - currentBC1))); gPickerInput.val(+currentGC1 + Math.round(diff * (currentGC2 - currentGC1) / (currentBC2 - currentBC1))); } + if ((+value) >= (+currentBC2)) { value = currentBC2; rPickerInput.val(currentRC2); gPickerInput.val(currentGC2); } + else if ((+value) <= (+currentBC1)) { value = currentBC1; rPickerInput.val(currentRC1); gPickerInput.val(currentGC1); } + else { diff = (+value) - (+currentBC1); rPickerInput.val((+currentRC1) + Math.round(diff * (currentRC2 - currentRC1) / (currentBC2 - currentBC1))); gPickerInput.val((+currentGC1) + Math.round(diff * (currentGC2 - currentGC1) / (currentBC2 - currentBC1))); } } } } @@ -1410,14 +1410,14 @@ if (draggerHueUpdateOnBW || !(realColor.toHex(true) == "000" || realColor.toHex( else { gradientR = gradientG = gradientB += "rgb("+currentRC1+","+currentGC1+","+currentBC1+"),rgb("+currentRC2+","+currentGC2+","+currentBC2+")"; } } else if (currentRGBMode == 1) { if (IE) { - gradientR = tinycolor({ r: 0, g: Math.max(0, +currentG - +currentR), b: Math.max(0, +currentB - +currentR) }).toFilter({ gradientType: false }, tinycolor({ r: 255, g: Math.min(255, 255 + +currentG - +currentR), b: Math.min(255, 255 + +currentB - +currentR) })); - gradientG = tinycolor({ r: Math.max(0, +currentR - +currentG), g: 0, b: Math.max(0, +currentB - +currentG) }).toFilter({ gradientType: false }, tinycolor({ r: Math.min(255, 255 + +currentR - +currentG), g: 255, b: Math.min(255, 255 + +currentB - +currentG) })); - gradientB = tinycolor({ r: Math.max(0, +currentR - +currentB), g: Math.max(0, +currentG - +currentB), b: 0 }).toFilter({ gradientType: false }, tinycolor({ r: Math.min(255, 255 + +currentR - +currentB), g: Math.min(255, 255 + +currentG - +currentB), b: 255 })); + gradientR = tinycolor({ r: 0, g: Math.max(0, (+currentG) - (+currentR)), b: Math.max(0, (+currentB) - (+currentR)) }).toFilter({ gradientType: false }, tinycolor({ r: 255, g: Math.min(255, 255 + (+currentG) - (+currentR)), b: Math.min(255, 255 + (+currentB) - (+currentR)) })); + gradientG = tinycolor({ r: Math.max(0, (+currentR) - (+currentG)), g: 0, b: Math.max(0, (+currentB) - (+currentG)) }).toFilter({ gradientType: false }, tinycolor({ r: Math.min(255, 255 + (+currentR) - (+currentG)), g: 255, b: Math.min(255, 255 + (+currentB) - (+currentG)) })); + gradientB = tinycolor({ r: Math.max(0, (+currentR) - (+currentB)), g: Math.max(0, (+currentG) - (+currentB)), b: 0 }).toFilter({ gradientType: false }, tinycolor({ r: Math.min(255, 255 + (+currentR) - (+currentB)), g: Math.min(255, 255 + (+currentG) - (+currentB)), b: 255 })); } else { - gradientR += "rgb(0,"+Math.max(0, +currentG - +currentR)+","+Math.max(0, +currentB - +currentR)+"),rgb(255,"+Math.min(255, 255 + +currentG - +currentR)+","+Math.min(255, 255 + +currentB - +currentR)+")"; - gradientG += "rgb("+Math.max(0, +currentR - +currentG)+",0,"+Math.max(0, +currentB - +currentG)+"),rgb("+Math.min(255, 255 + +currentR - +currentG)+",255,"+Math.min(255, 255 + +currentB - +currentG)+")"; - gradientB += "rgb("+Math.max(0, +currentR - +currentB)+","+Math.max(0, +currentG - +currentB)+",0),rgb("+Math.min(255, 255 + +currentR - +currentB)+","+Math.min(255, 255 + +currentG - +currentB)+",255)"; + gradientR += "rgb(0,"+Math.max(0, (+currentG) - (+currentR))+","+Math.max(0, (+currentB) - (+currentR))+"),rgb(255,"+Math.min(255, 255 + (+currentG) - (+currentR))+","+Math.min(255, 255 + (+currentB) - (+currentR))+")"; + gradientG += "rgb("+Math.max(0, (+currentR) - (+currentG))+",0,"+Math.max(0, (+currentB) - (+currentG))+"),rgb("+Math.min(255, 255 + (+currentR) - (+currentG))+",255,"+Math.min(255, 255 + (+currentB) - (+currentG))+")"; + gradientB += "rgb("+Math.max(0, (+currentR) - (+currentB))+","+Math.max(0, (+currentG) - (+currentB))+",0),rgb("+Math.min(255, 255 + (+currentR) - (+currentB))+","+Math.min(255, 255 + (+currentG) - (+currentB))+",255)"; } } else { if (IE) { @@ -1546,9 +1546,9 @@ if (draggerHueUpdateOnBW || !(realColor.toHex(true) == "000" || realColor.toHex( if (value >= 0 && value <= 255) { if (mv < 300) { // C2, mv=C1 - if (+value < +mv) value = mv; + if ((+value) < (+mv)) value = mv; } else { // C1, mv=C2 - if (+value > +mv - 300) value = +mv - 300; + if ((+value) > (+mv) - 300) value = (+mv) - 300; } pickerInput.val(value); cHelper.css({ @@ -1587,9 +1587,9 @@ if (draggerHueUpdateOnBW || !(realColor.toHex(true) == "000" || realColor.toHex( if (value >= 0 && value <= 255) { if (mv < 300) { // F2, mv=F1 - if (+value < +mv) value = mv; + if ((+value) < (+mv)) value = mv; } else { // F1, mv=f2 - if (+value > +mv - 300) value = +mv - 300; + if ((+value) > (+mv) - 300) value = (+mv) - 300; } switch (cp_id) { @@ -1615,7 +1615,7 @@ if (draggerHueUpdateOnBW || !(realColor.toHex(true) == "000" || realColor.toHex( currentBF2 = value; break; case "a2": - if (+value > +opts.aPickerScale) value = opts.aPickerScale; + if ((+value) > +opts.aPickerScale) value = opts.aPickerScale; currentAF2 = value; break; } From 9ae9208f29cf82179db4480a1bfdb1045f494cc0 Mon Sep 17 00:00:00 2001 From: danicotra <32748257+danicotra@users.noreply.github.com> Date: Sun, 19 Nov 2017 23:04:44 +0100 Subject: [PATCH 10/12] Modified to meet TRAVIS --- spectrum.js | 12 ++++++------ 1 file changed, 6 insertions(+), 6 deletions(-) diff --git a/spectrum.js b/spectrum.js index 60e082fc..e4c05e8e 100644 --- a/spectrum.js +++ b/spectrum.js @@ -204,7 +204,7 @@ var c = tiny.toHsl().l < 0.5 ? "sp-thumb-el sp-thumb-dark" : "sp-thumb-el sp-thumb-light"; if (tinycolor.equals(color, current)) c += " sp-thumb-active"; - else if (filter !== undefined && filter.isOn && ! tiny.inRange(filter.lowerbound, filter.upperbound)) c += " sp-thumb-inactive"; + else if (filter !== undefined && filter !== null && filter.isOn && ! tiny.inRange(filter.lowerbound, filter.upperbound)) c += " sp-thumb-inactive"; var formattedString = tiny.toString(opts.preferredFormat || "rgb"); var swatchStyle = rgbaSupport ? ("background-color:" + tiny.toRgbString()) : "filter:" + tiny.toFilter(); @@ -1094,7 +1094,7 @@ updateRGBbyDrag(); } function setFromPickerInput(pickerInput, old, mv) { - if (mv === undefined) mv = 255; + if (mv === undefined || mv === null) mv = 255; // (I need to do this because click on pickers number input arrows doesn't immediately make contraints lose focus more about this on updateUI() ) if ($( document.activeElement ).prop("id").indexOf("_constraint") >= 0) $(document.activeElement).blur(); @@ -1307,7 +1307,7 @@ function setFromPickerInput(pickerInput, old, mv) { textInput.removeClass("sp-validation-error"); // need to manually trigger contraints update if I moved from one contraints input to a dragger or arrows of a picker number input (because constraint input doesn't lose its focus) - if ($( document.activeElement ).prop("id") !== undefined && ($( document.activeElement ).prop("id").indexOf("_constraint") >= 0 || $( document.activeElement ).prop("id").indexOf("_picker") >= 0 ) $(document.activeElement).blur(); //second line for picker updating when passing to rgb sliders without hitting enter + if ($( document.activeElement ).prop("id") !== undefined && ($( document.activeElement ).prop("id").indexOf("_constraint") >= 0 || $( document.activeElement ).prop("id").indexOf("_picker") >= 0 )) $(document.activeElement).blur(); //second line for picker updating when passing to rgb sliders without hitting enter updateHelperLocations(); @@ -1403,7 +1403,7 @@ if (draggerHueUpdateOnBW || !(realColor.toHex(true) == "000" || realColor.toHex( } function updateRGBSlidersGradients(realHex) { //### IE gradient-filters ok ?? - if (realHex === undefined) realHex = get().toHexString(); + if (realHex === undefined || realHex === null) realHex = get().toHexString(); var g_left = "linear-gradient(left,", gradientR = " ", gradientG = " ", gradientB = " "; if (currentRGBMode == 2) { if (IE) { gradientR = gradientG = gradientB = tinycolor({ r: currentRC1, g: currentGC1, b: currentBC1 }).toFilter({ gradientType: false }, tinycolor({ r: currentRC2, g: currentGC2, b: currentBC2 })); } @@ -2551,9 +2551,9 @@ if (draggerHueUpdateOnBW || !(realColor.toHex(true) == "000" || realColor.toHex( }; function inRange(color, lowerbound_color, upperbound_color) { - if (lowerbound_color !== undefined && typeof lowerbound_color == "object" && lowerbound_color.hasOwnProperty("r") && lowerbound_color.hasOwnProperty("g") && lowerbound_color.hasOwnProperty("b") && lowerbound_color.hasOwnProperty("a")) + if (lowerbound_color !== undefined && lowerbound_color !== null && typeof lowerbound_color == "object" && lowerbound_color.hasOwnProperty("r") && lowerbound_color.hasOwnProperty("g") && lowerbound_color.hasOwnProperty("b") && lowerbound_color.hasOwnProperty("a")) if ( +lowerbound_color.r > +color._r || +lowerbound_color.g > +color._g || +lowerbound_color.b > +color._b || +lowerbound_color.a > +color._roundA) return false; - if (upperbound_color !== undefined && typeof upperbound_color == "object" && upperbound_color.hasOwnProperty("r") && upperbound_color.hasOwnProperty("g") && upperbound_color.hasOwnProperty("b") && upperbound_color.hasOwnProperty("a")) + if (upperbound_color !== undefined && upperbound_color !== null && typeof upperbound_color == "object" && upperbound_color.hasOwnProperty("r") && upperbound_color.hasOwnProperty("g") && upperbound_color.hasOwnProperty("b") && upperbound_color.hasOwnProperty("a")) if ( +upperbound_color.r < +color._r || +upperbound_color.g < +color._g || +upperbound_color.b < +color._b || +upperbound_color.a < +color._roundA) return false; return true; }; From 8e038d6e29628c74da362e68be5c697eaac9dc69 Mon Sep 17 00:00:00 2001 From: danicotra <32748257+danicotra@users.noreply.github.com> Date: Sun, 19 Nov 2017 23:09:32 +0100 Subject: [PATCH 11/12] Modified to meet TRAVIS --- spectrum.js | 10 +++++----- 1 file changed, 5 insertions(+), 5 deletions(-) diff --git a/spectrum.js b/spectrum.js index e4c05e8e..a7ee5ce9 100644 --- a/spectrum.js +++ b/spectrum.js @@ -1629,12 +1629,12 @@ if (draggerHueUpdateOnBW || !(realColor.toHex(true) == "000" || realColor.toHex( if (! exposeCurrent || target === 0) var color = get(); switch (target) { case 0: // I know exposeCurrent is always true in this case - let i = selectionPalette.indexOf(tinycolor(color).toRgbString()); + var i = selectionPalette.indexOf(tinycolor(color).toRgbString()); if (i >= 0) selectionPalette.splice(i, 1); break; case 1: // I know paletteFilteringStatus is always on in this case - let AF1 = 1, AF2 = 1; + var AF1 = 1, AF2 = 1; if (opts.showAlpha) { AF1 = Math.round(100*currentAF1/opts.aPickerScale)/100; AF2 = Math.round(100*currentAF2/opts.aPickerScale)/100; @@ -1642,14 +1642,14 @@ if (draggerHueUpdateOnBW || !(realColor.toHex(true) == "000" || realColor.toHex( var lowerbound = { r: currentRF1, g: currentGF1, b: currentBF1, a: AF1 }, upperbound = { r: currentRF2, g: currentGF2, b: currentBF2, a: AF2 }; - for (let i = selectionPalette.length-1; i>=0; i--) { - let current_tiny = tinycolor(selectionPalette[i]); + for (var i = selectionPalette.length-1; i>=0; i--) { + var current_tiny = tinycolor(selectionPalette[i]); if (! current_tiny.inRange(lowerbound, upperbound)) if (exposeCurrent || ! tinycolor.equals(color, selectionPalette[i])) selectionPalette.splice(i, 1); } break; case 2: - let preserveCurrent = false; + var preserveCurrent = false; if (! exposeCurrent) { var current = tinycolor(color).toRgbString(); if (selectionPalette.indexOf(current) >= 0) preserveCurrent = true; From 316cca996b886e94cab327053f96bf9155862ac7 Mon Sep 17 00:00:00 2001 From: danicotra <32748257+danicotra@users.noreply.github.com> Date: Sun, 19 Nov 2017 23:22:04 +0100 Subject: [PATCH 12/12] Modified to meet TRAVIS --- spectrum.js | 12 +++++++----- 1 file changed, 7 insertions(+), 5 deletions(-) diff --git a/spectrum.js b/spectrum.js index a7ee5ce9..611c320b 100644 --- a/spectrum.js +++ b/spectrum.js @@ -1626,10 +1626,11 @@ if (draggerHueUpdateOnBW || !(realColor.toHex(true) == "000" || realColor.toHex( function clearPalette(target, exposeCurrent) { // target color(s) to remove : 0 = current only, 1 = unfiltered (may or not preserve current), 2 = all (may or not preserve current) if (showSelectionPalette && ((target === 0 && exposeCurrent === true) || (target == 1 && paletteFilteringStatus) || (target == 2))) { - if (! exposeCurrent || target === 0) var color = get(); + var color, i; + if (! exposeCurrent || target === 0) color = get(); switch (target) { case 0: // I know exposeCurrent is always true in this case - var i = selectionPalette.indexOf(tinycolor(color).toRgbString()); + i = selectionPalette.indexOf(tinycolor(color).toRgbString()); if (i >= 0) selectionPalette.splice(i, 1); break; @@ -1642,7 +1643,7 @@ if (draggerHueUpdateOnBW || !(realColor.toHex(true) == "000" || realColor.toHex( var lowerbound = { r: currentRF1, g: currentGF1, b: currentBF1, a: AF1 }, upperbound = { r: currentRF2, g: currentGF2, b: currentBF2, a: AF2 }; - for (var i = selectionPalette.length-1; i>=0; i--) { + for (i = selectionPalette.length-1; i>=0; i--) { var current_tiny = tinycolor(selectionPalette[i]); if (! current_tiny.inRange(lowerbound, upperbound)) if (exposeCurrent || ! tinycolor.equals(color, selectionPalette[i])) selectionPalette.splice(i, 1); } @@ -1650,8 +1651,9 @@ if (draggerHueUpdateOnBW || !(realColor.toHex(true) == "000" || realColor.toHex( case 2: var preserveCurrent = false; + var current; if (! exposeCurrent) { - var current = tinycolor(color).toRgbString(); + current = tinycolor(color).toRgbString(); if (selectionPalette.indexOf(current) >= 0) preserveCurrent = true; } selectionPalette = []; @@ -2556,7 +2558,7 @@ if (draggerHueUpdateOnBW || !(realColor.toHex(true) == "000" || realColor.toHex( if (upperbound_color !== undefined && upperbound_color !== null && typeof upperbound_color == "object" && upperbound_color.hasOwnProperty("r") && upperbound_color.hasOwnProperty("g") && upperbound_color.hasOwnProperty("b") && upperbound_color.hasOwnProperty("a")) if ( +upperbound_color.r < +color._r || +upperbound_color.g < +color._g || +upperbound_color.b < +color._b || +upperbound_color.a < +color._roundA) return false; return true; - }; + } tinycolor.random = function() { return tinycolor.fromRatio({