From 2cf7ba8f3d08ed582c3ad1e905b80aa3bcc98f47 Mon Sep 17 00:00:00 2001 From: peterd Date: Mon, 2 Feb 2015 14:48:14 +0100 Subject: [PATCH] Initial commit --- Gruntfile.js | 28 +++ LICENSE.md | 21 ++ README.md | 183 ++++++++++++++ colors.js | 418 ++++++++++++++++++++++++++++++++ development/colorPicker.css | 67 +++++ development/compatibility.css | 45 ++++ development/fmog.png | Bin 0 -> 6629 bytes development/screen-shot-all.jpg | Bin 0 -> 24262 bytes development/ui.html | 25 ++ index.css | 29 +++ index.html | 206 ++++++++++++++++ jqColorPicker.js | 244 +++++++++++++++++++ jqColorPicker.js.map | 1 + jqColorPicker.min.js | 4 + package.json | 12 + 15 files changed, 1283 insertions(+) create mode 100644 Gruntfile.js create mode 100644 LICENSE.md create mode 100644 README.md create mode 100644 colors.js create mode 100644 development/colorPicker.css create mode 100644 development/compatibility.css create mode 100644 development/fmog.png create mode 100644 development/screen-shot-all.jpg create mode 100644 development/ui.html create mode 100644 index.css create mode 100644 index.html create mode 100644 jqColorPicker.js create mode 100644 jqColorPicker.js.map create mode 100644 jqColorPicker.min.js create mode 100644 package.json diff --git a/Gruntfile.js b/Gruntfile.js new file mode 100644 index 0000000..b58bdfc --- /dev/null +++ b/Gruntfile.js @@ -0,0 +1,28 @@ +module.exports = function(grunt) { + + // Project configuration. + grunt.initConfig({ + pkg: grunt.file.readJSON('package.json'), + uglify: { + options: { + banner: '/*! <%= pkg.name %> - v<%= pkg.version %> <%= grunt.template.today("yyyy-mm-dd") %> */\n', + sourceMap: true, + // sourceMapIncludeSources: true, + sourceMapName: 'jqColorPicker.js.map', + report: 'gzip' + }, + my_target: { + files: [{ + 'jqColorPicker.min.js': ['colors.js', 'jqColorPicker.js'] + }] + } + } + }); + + // Load the plugin that provides the "uglify" task. + grunt.loadNpmTasks('grunt-contrib-uglify'); + + // Default task(s). + grunt.registerTask('default', ['uglify']); + +}; \ No newline at end of file diff --git a/LICENSE.md b/LICENSE.md new file mode 100644 index 0000000..41a5104 --- /dev/null +++ b/LICENSE.md @@ -0,0 +1,21 @@ +The MIT License (MIT) + +Copyright (c) 2014 Peter Dematté + +Permission is hereby granted, free of charge, to any person obtaining a copy +of this software and associated documentation files (the "Software"), to deal +in the Software without restriction, including without limitation the rights +to use, copy, modify, merge, publish, distribute, sublicense, and/or sell +copies of the Software, and to permit persons to whom the Software is +furnished to do so, subject to the following conditions: + +The above copyright notice and this permission notice shall be included in +all copies or substantial portions of the Software. + +THE SOFTWARE IS PROVIDED "AS IS", WITHOUT WARRANTY OF ANY KIND, EXPRESS OR +IMPLIED, INCLUDING BUT NOT LIMITED TO THE WARRANTIES OF MERCHANTABILITY, +FITNESS FOR A PARTICULAR PURPOSE AND NONINFRINGEMENT. IN NO EVENT SHALL THE +AUTHORS OR COPYRIGHT HOLDERS BE LIABLE FOR ANY CLAIM, DAMAGES OR OTHER +LIABILITY, WHETHER IN AN ACTION OF CONTRACT, TORT OR OTHERWISE, ARISING FROM, +OUT OF OR IN CONNECTION WITH THE SOFTWARE OR THE USE OR OTHER DEALINGS IN +THE SOFTWARE. diff --git a/README.md b/README.md new file mode 100644 index 0000000..13b947a --- /dev/null +++ b/README.md @@ -0,0 +1,183 @@ + +# tinyColorPicker and colors + +Looking for mobile first, tiny foot print, fast, scaleable, flexible and pluggable...
+This 4.4KB small HSB color picker is based on a subset of [https://github.com/PitPik/colorPicker/blob/master/colors.js](colors.js) from it's big brother [https://github.com/PitPik/colorPicker/](colorPicker), supports all modern features like touch and MS pointer, GPU accelerated rendering, battery friendly requestAnimationFrame and provides a lot of hooks for developers to write plugins + +##Demo +See **demo** at [dematte.at/tinyColorPicker](http://dematte.at/tinyColorPicker) + + + +All the WCAG 2.0 calculations for readability are also based on opacity levels of all layers
+Supported color spaces are: (* also displayed as colors in realtime)
+rgb, hsv(b), hsl, HEX + +##colors.js + +```javascript +Colors({ // all options have a default value... + color: 'rgba(204, 82, 37, 0.8)', // initial color (#RGB, RGB, #RRGGBB, RRGGBB, rgb(r, g, b), ...) + grey: {r: 0.298954, g: 0.586434, b: 0.114612}, // CIE-XYZ 1931 + luminance: {r: 0.2126, g: 0.7152, b: 0.0722}, // W3C 2.0 + valueRanges: {rgb: {r: [0, 255], g: [0, 255], b: [0, 255]}, hsv:...}, // skip ranges if no conversion required + customBG: '#808080' // the solid bgColor behind the chosen bgColor (saved color) + convertCallback: function(colors, type){}, // callback function after color convertion for further calculations... +}); +``` +##jqColorPicker.js + +colorPicker uses an instance of Colors and passes the options to it, so some values are the same... + +```javascript +var myColorPicker = new ColorPicker({ + color: ..., // see Colors... + customBG: '#FFF' // see Colors... + animationSpeed: 150, // toggle animation speed + GPU: true, // use transform: translate3d + doRender: true, // manipulate color ans bgColor of input field + opacity: true, // enable / disable alpha slider + renderCallback: function($elm, toggled) {}, // this === instance + buidCallback: function($elm, toggled) {}, // this === instance + css: '', // replaces existing css + cssAddon: '', // adds cdd to existing + margin: '', // positioning margin + preventFocus: false // prevent default on focus of input fields +}); +``` + +##The color model, the methods and more + +After initializing Color or ColorPicker you'll get a clean but rhich model of the instance: + +```javascript +myColors: { + colors: { all kinds of color values... see later}, + options: { all the options you set or that are set as default... }, + __proto__: { // all methods Color uses + setColor: function(newCol, type, alpha) {}, + setCustomBackground: function(col) {}, + saveAsBackground: function() {}, + } +} +``` + +```javascript +myColorPicker: { + color: { // instance of Color inside colorPicker + colors: { all kinds of color values... see later}, + options: { all the options you set or that are set as default... }, + __proto__: { all methods Color uses ... see above} + }, + __proto__: { // all methods ColorPicker uses + render: function() {}, + } +} +``` + + +The color model + +```javascript +HEX: // current color as HEX (upper case, 6 digits) +rgb: // current RGB color as normalized values (0 - 1) + r: // red + g: // green + b: // blue +hsv: // current color values in normalized HSV (HSB) model + h: // hue + s: // saturation + v: // value (brightness) +hsl: // current color values in normalized HSL model + h: // hue + s: // saturation + l: // lightness +RND: // all above colors in their defined ranges + rgb: // current RGB color, rounded between 0 and 255 + r: // red (0 - 255) + g: // green (0 - 255) + b: // blue (0 - 255) + hsv: // see above + h: // hue (0 - 360 degrees) + s: // saturation (0 - 100 %) + v: // value (brightness) (0 - 100 %) + hsl: // see above + h: // hue (0 - 360 degrees) + s: // saturation (0 - 100 %) + l: // lightness (0 - 100 %) +background: // saved (background) color (saveAsBackground(){}) + rgb: // color in RGB model + r: // red + g: // green + b: // blue + RGB: // RGB color, rounded between 0 and 255 + r: // red (0 - 255) + g: // green (0 - 255) + b: // blue (0 - 255) + alpha: // alpha or opacity value (0 - 1) + equivalentGrey: // r = g = b = (0 - 255) + rgbaMixBlack: // saved (background) color mixed with solid black color + r: // red + g: // green + b: // blue + a: // resulting alpha or opacity value (0 - 1) + luminance: // luminance of resulting mix (0 - 1) + rgbaMixCustom: // saved (background) color mixed with custom (solid) color + r: // red + g: // green + b: // blue + a: // resulting alpha or opacity value (0 - 1) + luminance: // luminance of resulting mix (0 - 1) + rgbaMixWhite: // saved (background) color mixed with solid white color + r: // red + g: // green + b: // blue + a: // resulting alpha or opacity value (0 - 1) + luminance: // luminance of resulting mix (0 - 1) +alpha: // alpha or opacity value (0 - 1) of current color +equivalentGrey: // r = g = b = (0 - 1) +HUELuminance: // luminance of hue (in full brightnes and saturation) (0 - 1) +RGBLuminance: // luminance of the current color +hueRGB: // rounded integer value of current color in rgb model with full saturation and brightness + r: // red (0 - 255) + g: // green (0 - 255) + b: // blue (0 - 255) +saveColor: // '' or 'web smart' or 'web save', if so. +webSave: // closest web-save color + r: // red (0 - 255) + g: // green (0 - 255) + b: // blue (0 - 255) +webSmart: // closest web-smart color + r: // red (0 - 255) + g: // green (0 - 255) + b: // blue (0 - 255) +rgbaMixBG: // color mix result: current color above saved (background) color + r: // red (0 - 1) + g: // green (0 - 1) + b: // blue (0 - 1) + a: // resulting alpha or opacity value (0 - 1) + luminance: // luminance of resulting mix (0 - 1) +rgbaMixBGMixCustom: // color mix result: current color above saved (background) color above solid custom color + r: // red (0 - 1) + g: // green (0 - 1) + b: // blue (0 - 1) + a: // resulting alpha or opacity value (0 - 1) + luminance: // luminance of resulting mix (0 - 1) + luminanceDelta: // luminance difference between current color and resulting saved-custom mix (0 - 1) + hueDelta: // hue difference between current color and resulting saved-custom mix (0 - 1) + WCAG2Ratio: // readability vale (1 - 21, 1:1 to 21:1) +rgbaMixBlack: // color mix result: current color above solid black + r: // red (0 - 1) + g: // green (0 - 1) + b: // blue (0 - 1) + a: // resulting alpha or opacity value (0 - 1) + luminance: // luminance of resulting mix (0 - 1) + WCAG2Ratio: // readability vale (1 - 21, 1:1 to 21:1) +rgbaMixWhite: // color mix result: current color above solid white + r: // red (0 - 1) + g: // green (0 - 1) + b: // blue (0 - 1) + a: // resulting alpha or opacity value (0 - 1) + luminance: // luminance of resulting mix (0 - 1) + WCAG2Ratio: // readability vale (1 - 21, 1:1 to 21:1) +``` diff --git a/colors.js b/colors.js new file mode 100644 index 0000000..5df3eb6 --- /dev/null +++ b/colors.js @@ -0,0 +1,418 @@ +;(function(window, undefined){ + "use strict" + + var _valueRanges = { + rgb: {r: [0, 255], g: [0, 255], b: [0, 255]}, + hsv: {h: [0, 360], s: [0, 100], v: [0, 100]}, + hsl: {h: [0, 360], s: [0, 100], l: [0, 100]}, + alpha: {alpha: [0, 1]}, + HEX: {HEX: [0, 16777215]} // maybe we don't need this + }, + + _instance = {}, + _colors = {}, + + grey = {r: 0.298954, g: 0.586434, b: 0.114612}, // CIE-XYZ 1931 + luminance = {r: 0.2126, g: 0.7152, b: 0.0722}, // W3C 2.0 + + Colors = window.Colors = function(options) { + this.colors = {RND: {}}; + this.options = { + color: 'rgba(204, 82, 37, 0.8)', // init value(s)... + grey: grey, + luminance: luminance, + valueRanges: _valueRanges + // customBG: '#808080' + // convertCallback: undefined, + // allMixDetails: false + }; + initInstance(this, options || {}); + }, + initInstance = function(THIS, options) { + var importColor, + _options = THIS.options, + customBG; + + focusInstance(THIS); + for (var option in options) { + if (options[option] !== undefined) _options[option] = options[option]; + } + customBG = _options.customBG; + _options.customBG = (typeof customBG === 'string') ? ColorConverter.txt2color(customBG).rgb : customBG; + _colors = setColor(THIS.colors, _options.color, undefined, true); // THIS.colors = _colors = + }, + focusInstance = function(THIS) { + if (_instance !== THIS) { + _instance = THIS; + _colors = THIS.colors; + } + }; + + Colors.prototype.setColor = function(newCol, type, alpha) { + focusInstance(this); + if (newCol) { + return setColor(this.colors, newCol, type, undefined, alpha); + } else { + if (alpha !== undefined) { + this.colors.alpha = alpha; + } + return convertColors(type); + } + }; + + Colors.prototype.setCustomBackground = function(col) { // wild gues,... check again... + focusInstance(this); // needed??? + this.options.customBG = (typeof col === 'string') ? ColorConverter.txt2color(col).rgb : col; + // return setColor(this.colors, this.options.customBG, 'rgb', true); // !!!!RGB + return setColor(this.colors, undefined, 'rgb'); // just recalculate existing + }; + + Colors.prototype.saveAsBackground = function() { // alpha + focusInstance(this); // needed??? + // return setColor(this.colors, this.colors.RND.rgb, 'rgb', true); + return setColor(this.colors, undefined, 'rgb', true); + }; + + // ------------------------------------------------------ // + // ---------- Color calculation related stuff ---------- // + // -------------------------------------------------------// + + function setColor(colors, color, type, save, alpha) { // color only full range + if (typeof color === 'string') { + var color = ColorConverter.txt2color(color); // new object + type = color.type; + _colors[type] = color[type]; + alpha = alpha !== undefined ? alpha : color.alpha; + } else if (color) { + for (var n in color) { + colors[type][n] = limitValue(color[n] / _valueRanges[type][n][1], 0 , 1); + } + } + if (alpha !== undefined) { + colors.alpha = +alpha; + } + return convertColors(type, save ? colors : undefined); + } + + function saveAsBackground(RGB, rgb, alpha) { + var grey = _instance.options.grey, + color = {}; + + color.RGB = {r: RGB.r, g: RGB.g, b: RGB.b}; + color.rgb = {r: rgb.r, g: rgb.g, b: rgb.b}; + color.alpha = alpha; + // color.RGBLuminance = getLuminance(RGB); + color.equivalentGrey = Math.round(grey.r * RGB.r + grey.g * RGB.g + grey.b * RGB.b); + + color.rgbaMixBlack = mixColors(rgb, {r: 0, g: 0, b: 0}, alpha, 1); + color.rgbaMixWhite = mixColors(rgb, {r: 1, g: 1, b: 1}, alpha, 1); + color.rgbaMixBlack.luminance = getLuminance(color.rgbaMixBlack, true); + color.rgbaMixWhite.luminance = getLuminance(color.rgbaMixWhite, true); + + if (_instance.options.customBG) { + color.rgbaMixCustom = mixColors(rgb, _instance.options.customBG, alpha, 1); + color.rgbaMixCustom.luminance = getLuminance(color.rgbaMixCustom, true); + _instance.options.customBG.luminance = getLuminance(_instance.options.customBG, true); + } + + return color; + } + + function convertColors(type, colorObj) { + // console.time('convertColors'); + var colors = colorObj || _colors, + convert = ColorConverter, + options = _instance.options, + ranges = _valueRanges, + RND = colors.RND, + // type = colorType, // || _mode.type, + modes, mode = '', from = '', // value = '', + exceptions = {hsl: 'hsv', rgb: type}, + RGB = RND.rgb, SAVE, SMART; + + if (type !== 'alpha') { + for (var typ in ranges) { + if (!ranges[typ][typ]) { // no alpha|HEX + if (type !== typ) { + from = exceptions[typ] || 'rgb'; + colors[typ] = convert[from + '2' + typ](colors[from]); + } + + if (!RND[typ]) RND[typ] = {}; + modes = colors[typ]; + for(mode in modes) { + RND[typ][mode] = Math.round(modes[mode] * ranges[typ][mode][1]); + } + } + } + + RGB = RND.rgb; + colors.HEX = convert.RGB2HEX(RGB); + colors.equivalentGrey = + options.grey.r * colors.rgb.r + + options.grey.g * colors.rgb.g + + options.grey.b * colors.rgb.b; + colors.webSave = SAVE = getClosestWebColor(RGB, 51); + // colors.webSave.HEX = convert.RGB2HEX(colors.webSave); + colors.webSmart = SMART = getClosestWebColor(RGB, 17); + // colors.webSmart.HEX = convert.RGB2HEX(colors.webSmart); + colors.saveColor = + RGB.r === SAVE.r && RGB.g === SAVE.g && RGB.b === SAVE.b ? 'web save' : + RGB.r === SMART.r && RGB.g === SMART.g && RGB.b === SMART.b ? 'web smart' : ''; + colors.hueRGB = ColorConverter.hue2RGB(colors.hsv.h); + + if (colorObj) { + colors.background = saveAsBackground(RGB, colors.rgb, colors.alpha); + } + } // else RGB = RND.rgb; + + var rgb = colors.rgb, // for better minification... + alpha = colors.alpha, + luminance = 'luminance', + background = colors.background, + rgbaMixBlack, rgbaMixWhite, rgbaMixCustom, + rgbaMixBG, rgbaMixBGMixBlack, rgbaMixBGMixWhite, rgbaMixBGMixCustom; + + rgbaMixBlack = mixColors(rgb, {r: 0, g: 0, b: 0}, alpha, 1); + rgbaMixBlack[luminance] = getLuminance(rgbaMixBlack, true); + colors.rgbaMixBlack = rgbaMixBlack; + + rgbaMixWhite = mixColors(rgb, {r: 1, g: 1, b: 1}, alpha, 1); + rgbaMixWhite[luminance] = getLuminance(rgbaMixWhite, true); + colors.rgbaMixWhite = rgbaMixWhite; + + if (options.customBG) { + rgbaMixBGMixCustom = mixColors(rgb, background.rgbaMixCustom, alpha, 1); + rgbaMixBGMixCustom[luminance] = getLuminance(rgbaMixBGMixCustom, true); + rgbaMixBGMixCustom.WCAG2Ratio = getWCAG2Ratio(rgbaMixBGMixCustom[luminance], + background.rgbaMixCustom[luminance]); + colors.rgbaMixBGMixCustom = rgbaMixBGMixCustom; + /* ------ */ + rgbaMixBGMixCustom.luminanceDelta = Math.abs( + rgbaMixBGMixCustom[luminance] - background.rgbaMixCustom[luminance]); + rgbaMixBGMixCustom.hueDelta = getHueDelta(background.rgbaMixCustom, rgbaMixBGMixCustom, true); + /* ------ */ + } + + colors.RGBLuminance = getLuminance(RGB); + colors.HUELuminance = getLuminance(colors.hueRGB); + + // renderVars.readyToRender = true; + if (options.convertCallback) { + options.convertCallback(colors, type); //, convert); //, _mode); + } + + // console.timeEnd('convertColors') + // if (colorObj) + return colors; + } + + + // ------------------------------------------------------ // + // ------------------ color conversion ------------------ // + // -------------------------------------------------------// + + var ColorConverter = { + txt2color: function(txt) { + var color = {}, + parts = txt.replace(/(?:#|\)|%)/g, '').split('('), + values = (parts[1] || '').split(/,\s*/), + type = parts[1] ? parts[0].substr(0, 3) : 'rgb', + m = ''; + + color.type = type; + color[type] = {}; + if (parts[1]) { + for (var n = 3; n--; ) { + m = type[n] || type.charAt(n); // IE7 + color[type][m] = +values[n] / _valueRanges[type][m][1]; + } + } else { + color.rgb = ColorConverter.HEX2rgb(parts[0]); + } + // color.color = color[type]; + color.alpha = values[3] ? +values[3] : 1; + + return color; + }, + + RGB2HEX: function(RGB) { + return ( + (RGB.r < 16 ? '0' : '') + RGB.r.toString(16) + + (RGB.g < 16 ? '0' : '') + RGB.g.toString(16) + + (RGB.b < 16 ? '0' : '') + RGB.b.toString(16) + ).toUpperCase(); + }, + + HEX2rgb: function(HEX) { + HEX = HEX.split(''); // IE7 + return { + r: parseInt(HEX[0] + HEX[HEX[3] ? 1 : 0], 16) / 255, + g: parseInt(HEX[HEX[3] ? 2 : 1] + (HEX[3] || HEX[1]), 16) / 255, + b: parseInt((HEX[4] || HEX[2]) + (HEX[5] || HEX[2]), 16) / 255 + }; + }, + + hue2RGB: function(hue) { + var h = hue * 6, + mod = ~~h % 6, // Math.floor(h) -> faster in most browsers + i = h === 6 ? 0 : (h - mod); + + return { + r: Math.round([1, 1 - i, 0, 0, i, 1][mod] * 255), + g: Math.round([i, 1, 1, 1 - i, 0, 0][mod] * 255), + b: Math.round([0, 0, i, 1, 1, 1 - i][mod] * 255) + }; + }, + + // ------------------------ HSV ------------------------ // + + rgb2hsv: function(rgb) { // faster + var r = rgb.r, + g = rgb.g, + b = rgb.b, + k = 0, chroma, min, s; + + if (g < b) { + g = b + (b = g, 0); + k = -1; + } + min = b; + if (r < g) { + r = g + (g = r, 0); + k = -2 / 6 - k; + min = Math.min(g, b); // g < b ? g : b; ??? + } + chroma = r - min; + s = r ? (chroma / r) : 0; + return { + h: s < 1e-15 ? ((_colors && _colors.hsl && _colors.hsl.h) || 0) : + chroma ? Math.abs(k + (g - b) / (6 * chroma)) : 0, + s: r ? (chroma / r) : ((_colors && _colors.hsv && _colors.hsv.s) || 0), // ??_colors.hsv.s || 0 + v: r + }; + }, + + hsv2rgb: function(hsv) { + var h = hsv.h * 6, + s = hsv.s, + v = hsv.v, + i = ~~h, // Math.floor(h) -> faster in most browsers + f = h - i, + p = v * (1 - s), + q = v * (1 - f * s), + t = v * (1 - (1 - f) * s), + mod = i % 6; + + return { + r: [v, q, p, p, t, v][mod], + g: [t, v, v, q, p, p][mod], + b: [p, p, t, v, v, q][mod] + }; + }, + + // ------------------------ HSL ------------------------ // + + hsv2hsl: function(hsv) { + var l = (2 - hsv.s) * hsv.v, + s = hsv.s * hsv.v; + + s = !hsv.s ? 0 : l < 1 ? (l ? s / l : 0) : s / (2 - l); + + return { + h: hsv.h, + s: !hsv.v && !s ? ((_colors && _colors.hsl && _colors.hsl.s) || 0) : s, // ??? + l: l / 2 + }; + }, + + rgb2hsl: function(rgb, dependent) { // not used in Color + var hsv = ColorConverter.rgb2hsv(rgb); + + return ColorConverter.hsv2hsl(dependent ? hsv : (_colors.hsv = hsv)); + }, + + hsl2rgb: function(hsl) { + var h = hsl.h * 6, + s = hsl.s, + l = hsl.l, + v = l < 0.5 ? l * (1 + s) : (l + s) - (s * l), + m = l + l - v, + sv = v ? ((v - m) / v) : 0, + sextant = ~~h, // Math.floor(h) -> faster in most browsers + fract = h - sextant, + vsf = v * sv * fract, + t = m + vsf, + q = v - vsf, + mod = sextant % 6; + + return { + r: [v, q, m, m, t, v][mod], + g: [t, v, v, q, m, m][mod], + b: [m, m, t, v, v, q][mod] + }; + } + }; + + // ------------------------------------------------------ // + // ------------------ helper functions ------------------ // + // -------------------------------------------------------// + + function getClosestWebColor(RGB, val) { + var out = {}, + tmp = 0, + half = val / 2; + + for (var n in RGB) { + tmp = RGB[n] % val; // 51 = 'web save', 17 = 'web smart' + out[n] = RGB[n] + (tmp > half ? val - tmp : -tmp); + } + return out; + } + + function getHueDelta(rgb1, rgb2, nominal) { + return (Math.max(rgb1.r - rgb2.r, rgb2.r - rgb1.r) + + Math.max(rgb1.g - rgb2.g, rgb2.g - rgb1.g) + + Math.max(rgb1.b - rgb2.b, rgb2.b - rgb1.b)) * (nominal ? 255 : 1) / 765; + } + + function getLuminance(rgb, normalized) { + var div = normalized ? 1 : 255, + RGB = [rgb.r / div, rgb.g / div, rgb.b / div], + luminance = _instance.options.luminance; + + for (var i = RGB.length; i--; ) { + RGB[i] = RGB[i] <= 0.03928 ? RGB[i] / 12.92 : Math.pow(((RGB[i] + 0.055) / 1.055), 2.4); + } + return ((luminance.r * RGB[0]) + (luminance.g * RGB[1]) + (luminance.b * RGB[2])); + } + + function mixColors(topColor, bottomColor, topAlpha, bottomAlpha) { + var newColor = {}, + alphaTop = (topAlpha !== undefined ? topAlpha : 1), + alphaBottom = (bottomAlpha !== undefined ? bottomAlpha : 1), + alpha = alphaTop + alphaBottom * (1 - alphaTop); // 1 - (1 - alphaTop) * (1 - alphaBottom); + + for(var n in topColor) { + newColor[n] = (topColor[n] * alphaTop + bottomColor[n] * alphaBottom * (1 - alphaTop)) / alpha; + } + newColor.a = alpha; + return newColor; + } + + function getWCAG2Ratio(lum1, lum2) { + var ratio = 1; + + if (lum1 >= lum2) { + ratio = (lum1 + 0.05) / (lum2 + 0.05); + } else { + ratio = (lum2 + 0.05) / (lum1 + 0.05); + } + return Math.round(ratio * 100) / 100; + } + + function limitValue(value, min, max) { + // return Math.max(min, Math.min(max, value)); // faster?? + return (value > max ? max : value < min ? min : value); + } +})(window); \ No newline at end of file diff --git a/development/colorPicker.css b/development/colorPicker.css new file mode 100644 index 0000000..cfca6c5 --- /dev/null +++ b/development/colorPicker.css @@ -0,0 +1,67 @@ +.cp-color-picker { + position: absolute; + overflow: hidden; + padding: 6px 6px 0; + background-color: #444; + color: #bbb; + font-family: Arial, Helvetica, sans-serif; + font-size: 12px; + font-weight: normal; + cursor: default; + border-radius: 5px; +} +.cp-color-picker > div { + position: relative; + overflow: hidden; +} +.cp-xy-slider { + float: left; + height: 128px; + width: 128px; + margin-bottom: 6px; + background: linear-gradient(to right, rgba(255,255,255,1) 0%,rgba(255,255,255,0) 100%); +} +.cp-white { + height: 100%; + width: 100%; + background: linear-gradient(to bottom, rgba(0,0,0,0) 0%,rgba(0,0,0,1) 100%); +} +.cp-xy-cursor { + position: absolute; + width: 10px; + height: 10px; + margin: -5px; + border: 1px solid white; + border-radius: 100%; + box-sizing: border-box; +} +.cp-z-slider { + float: right; + margin-left: 6px; + height: 128px; + width: 20px; + background: linear-gradient(to bottom, #ff0000 0%,#ff00ff 17%,#0000ff 33%,#00ffff 50%,#00ff00 67%,#ffff00 83%,#ff0000 100%); +} +.cp-z-cursor { + position: absolute; + margin-top: -4px; + width: 100%; + border: 4px solid white; + border-color: transparent white; + box-sizing: border-box; +} +.cp-alpha { + clear: left; + width: 100%; + height: 16px; + margin: 6px 0; + background: linear-gradient(to right, rgba(68,68,68,1) 0%,rgba(0,0,0,0) 100%); +} +.cp-alpha-cursor { + position: absolute; + margin-left: -4px; + height: 100%; + border: 4px solid white; + border-color: white transparent; + box-sizing: border-box; +} \ No newline at end of file diff --git a/development/compatibility.css b/development/compatibility.css new file mode 100644 index 0000000..a10424b --- /dev/null +++ b/development/compatibility.css @@ -0,0 +1,45 @@ +.cp-xy-slider { + /* IE9 SVG, needs conditional override of 'filter' to 'none' */ + background: url(data:image/svg+xml;base64,PD94bWwgdmVyc2lvbj0iMS4wIiA/Pgo8c3ZnIHhtbG5zPSJodHRwOi8vd3d3LnczLm9yZy8yMDAwL3N2ZyIgd2lkdGg9IjEwMCUiIGhlaWdodD0iMTAwJSIgdmlld0JveD0iMCAwIDEgMSIgcHJlc2VydmVBc3BlY3RSYXRpbz0ibm9uZSI+CiAgPGxpbmVhckdyYWRpZW50IGlkPSJncmFkLXVjZ2ctZ2VuZXJhdGVkIiBncmFkaWVudFVuaXRzPSJ1c2VyU3BhY2VPblVzZSIgeDE9IjAlIiB5MT0iMCUiIHgyPSIxMDAlIiB5Mj0iMCUiPgogICAgPHN0b3Agb2Zmc2V0PSIwJSIgc3RvcC1jb2xvcj0iI2ZmZmZmZiIgc3RvcC1vcGFjaXR5PSIxIi8+CiAgICA8c3RvcCBvZmZzZXQ9IjEwMCUiIHN0b3AtY29sb3I9IiNmZmZmZmYiIHN0b3Atb3BhY2l0eT0iMCIvPgogIDwvbGluZWFyR3JhZGllbnQ+CiAgPHJlY3QgeD0iMCIgeT0iMCIgd2lkdGg9IjEiIGhlaWdodD0iMSIgZmlsbD0idXJsKCNncmFkLXVjZ2ctZ2VuZXJhdGVkKSIgLz4KPC9zdmc+); + background: -moz-linear-gradient(left, rgba(255,255,255,1) 0%, rgba(255,255,255,0) 100%); /* FF3.6+ */ + background: -webkit-gradient(linear, left top, right top, color-stop(0%,rgba(255,255,255,1)), color-stop(100%,rgba(255,255,255,0))); /* Chrome,Safari4+ */ + background: -webkit-linear-gradient(left, rgba(255,255,255,1) 0%,rgba(255,255,255,0) 100%); /* Chrome10+,Safari5.1+ */ + background: -o-linear-gradient(left, rgba(255,255,255,1) 0%,rgba(255,255,255,0) 100%); /* Opera 11.10+ */ + background: -ms-linear-gradient(left, rgba(255,255,255,1) 0%,rgba(255,255,255,0) 100%); /* IE10+ */ + background: linear-gradient(to right, rgba(255,255,255,1) 0%,rgba(255,255,255,0) 100%); /* W3C */ + filter: progid:DXImageTransform.Microsoft.gradient( startColorstr='#ffffff', endColorstr='#00ffffff',GradientType=1 ); /* IE6-8 */ +} + +.cp-white { + /* IE9 SVG, needs conditional override of 'filter' to 'none' */ + background: url(data:image/svg+xml;base64,PD94bWwgdmVyc2lvbj0iMS4wIiA/Pgo8c3ZnIHhtbG5zPSJodHRwOi8vd3d3LnczLm9yZy8yMDAwL3N2ZyIgd2lkdGg9IjEwMCUiIGhlaWdodD0iMTAwJSIgdmlld0JveD0iMCAwIDEgMSIgcHJlc2VydmVBc3BlY3RSYXRpbz0ibm9uZSI+CiAgPGxpbmVhckdyYWRpZW50IGlkPSJncmFkLXVjZ2ctZ2VuZXJhdGVkIiBncmFkaWVudFVuaXRzPSJ1c2VyU3BhY2VPblVzZSIgeDE9IjAlIiB5MT0iMCUiIHgyPSIwJSIgeTI9IjEwMCUiPgogICAgPHN0b3Agb2Zmc2V0PSIwJSIgc3RvcC1jb2xvcj0iIzAwMDAwMCIgc3RvcC1vcGFjaXR5PSIwIi8+CiAgICA8c3RvcCBvZmZzZXQ9IjEwMCUiIHN0b3AtY29sb3I9IiMwMDAwMDAiIHN0b3Atb3BhY2l0eT0iMSIvPgogIDwvbGluZWFyR3JhZGllbnQ+CiAgPHJlY3QgeD0iMCIgeT0iMCIgd2lkdGg9IjEiIGhlaWdodD0iMSIgZmlsbD0idXJsKCNncmFkLXVjZ2ctZ2VuZXJhdGVkKSIgLz4KPC9zdmc+); + background: -moz-linear-gradient(top, rgba(0,0,0,0) 0%, rgba(0,0,0,1) 100%); /* FF3.6+ */ + background: -webkit-gradient(linear, left top, left bottom, color-stop(0%,rgba(0,0,0,0)), color-stop(100%,rgba(0,0,0,1))); /* Chrome,Safari4+ */ + background: -webkit-linear-gradient(top, rgba(0,0,0,0) 0%,rgba(0,0,0,1) 100%); /* Chrome10+,Safari5.1+ */ + background: -o-linear-gradient(top, rgba(0,0,0,0) 0%,rgba(0,0,0,1) 100%); /* Opera 11.10+ */ + background: -ms-linear-gradient(top, rgba(0,0,0,0) 0%,rgba(0,0,0,1) 100%); /* IE10+ */ + background: linear-gradient(to bottom, rgba(0,0,0,0) 0%,rgba(0,0,0,1) 100%); /* W3C */ + filter: progid:DXImageTransform.Microsoft.gradient( startColorstr='#00000000', endColorstr='#000000',GradientType=0 ); /* IE6-8 */ +} +.cp-z-slider { + background: url(rainbow.png); /* Old browsers */ + /* IE9 SVG, needs conditional override of 'filter' to 'none' */ + background: url(data:image/svg+xml;base64,PD94bWwgdmVyc2lvbj0iMS4wIiA/Pgo8c3ZnIHhtbG5zPSJodHRwOi8vd3d3LnczLm9yZy8yMDAwL3N2ZyIgd2lkdGg9IjEwMCUiIGhlaWdodD0iMTAwJSIgdmlld0JveD0iMCAwIDEgMSIgcHJlc2VydmVBc3BlY3RSYXRpbz0ibm9uZSI+CiAgPGxpbmVhckdyYWRpZW50IGlkPSJncmFkLXVjZ2ctZ2VuZXJhdGVkIiBncmFkaWVudFVuaXRzPSJ1c2VyU3BhY2VPblVzZSIgeDE9IjAlIiB5MT0iMCUiIHgyPSIwJSIgeTI9IjEwMCUiPgogICAgPHN0b3Agb2Zmc2V0PSIwJSIgc3RvcC1jb2xvcj0iI2ZmMDAwMCIgc3RvcC1vcGFjaXR5PSIxIi8+CiAgICA8c3RvcCBvZmZzZXQ9IjE3JSIgc3RvcC1jb2xvcj0iI2ZmMDBmZiIgc3RvcC1vcGFjaXR5PSIxIi8+CiAgICA8c3RvcCBvZmZzZXQ9IjMzJSIgc3RvcC1jb2xvcj0iIzAwMDBmZiIgc3RvcC1vcGFjaXR5PSIxIi8+CiAgICA8c3RvcCBvZmZzZXQ9IjUwJSIgc3RvcC1jb2xvcj0iIzAwZmZmZiIgc3RvcC1vcGFjaXR5PSIxIi8+CiAgICA8c3RvcCBvZmZzZXQ9IjY3JSIgc3RvcC1jb2xvcj0iIzAwZmYwMCIgc3RvcC1vcGFjaXR5PSIxIi8+CiAgICA8c3RvcCBvZmZzZXQ9IjgzJSIgc3RvcC1jb2xvcj0iI2ZmZmYwMCIgc3RvcC1vcGFjaXR5PSIxIi8+CiAgICA8c3RvcCBvZmZzZXQ9IjEwMCUiIHN0b3AtY29sb3I9IiNmZjAwMDAiIHN0b3Atb3BhY2l0eT0iMSIvPgogIDwvbGluZWFyR3JhZGllbnQ+CiAgPHJlY3QgeD0iMCIgeT0iMCIgd2lkdGg9IjEiIGhlaWdodD0iMSIgZmlsbD0idXJsKCNncmFkLXVjZ2ctZ2VuZXJhdGVkKSIgLz4KPC9zdmc+); + background: -moz-linear-gradient(top, rgba(255,0,0,1) 0%, rgba(255,0,255,1) 17%, rgba(0,0,255,1) 33%, rgba(0,255,255,1) 50%, rgba(0,255,0,1) 67%, rgba(255,255,0,1) 83%, rgba(255,0,0,1) 100%); /* FF3.6+ */ + background: -webkit-gradient(linear, left top, left bottom, color-stop(0%,rgba(255,0,0,1)), color-stop(17%,rgba(255,0,255,1)), color-stop(33%,rgba(0,0,255,1)), color-stop(50%,rgba(0,255,255,1)), color-stop(67%,rgba(0,255,0,1)), color-stop(83%,rgba(255,255,0,1)), color-stop(100%,rgba(255,0,0,1))); /* Chrome,Safari4+ */ + background: -webkit-linear-gradient(top, rgba(255,0,0,1) 0%,rgba(255,0,255,1) 17%,rgba(0,0,255,1) 33%,rgba(0,255,255,1) 50%,rgba(0,255,0,1) 67%,rgba(255,255,0,1) 83%,rgba(255,0,0,1) 100%); /* Chrome10+,Safari5.1+ */ + background: -o-linear-gradient(top, rgba(255,0,0,1) 0%,rgba(255,0,255,1) 17%,rgba(0,0,255,1) 33%,rgba(0,255,255,1) 50%,rgba(0,255,0,1) 67%,rgba(255,255,0,1) 83%,rgba(255,0,0,1) 100%); /* Opera 11.10+ */ + background: -ms-linear-gradient(top, rgba(255,0,0,1) 0%,rgba(255,0,255,1) 17%,rgba(0,0,255,1) 33%,rgba(0,255,255,1) 50%,rgba(0,255,0,1) 67%,rgba(255,255,0,1) 83%,rgba(255,0,0,1) 100%); /* IE10+ */ + background: linear-gradient(to bottom, rgba(255,0,0,1) 0%,rgba(255,0,255,1) 17%,rgba(0,0,255,1) 33%,rgba(0,255,255,1) 50%,rgba(0,255,0,1) 67%,rgba(255,255,0,1) 83%,rgba(255,0,0,1) 100%); /* W3C */ +} +.cp-alpha { + /* IE9 SVG, needs conditional override of 'filter' to 'none' */ + background: url(data:image/svg+xml;base64,PD94bWwgdmVyc2lvbj0iMS4wIiA/Pgo8c3ZnIHhtbG5zPSJodHRwOi8vd3d3LnczLm9yZy8yMDAwL3N2ZyIgd2lkdGg9IjEwMCUiIGhlaWdodD0iMTAwJSIgdmlld0JveD0iMCAwIDEgMSIgcHJlc2VydmVBc3BlY3RSYXRpbz0ibm9uZSI+CiAgPGxpbmVhckdyYWRpZW50IGlkPSJncmFkLXVjZ2ctZ2VuZXJhdGVkIiBncmFkaWVudFVuaXRzPSJ1c2VyU3BhY2VPblVzZSIgeDE9IjAlIiB5MT0iMCUiIHgyPSIxMDAlIiB5Mj0iMCUiPgogICAgPHN0b3Agb2Zmc2V0PSIwJSIgc3RvcC1jb2xvcj0iIzQ0NDQ0NCIgc3RvcC1vcGFjaXR5PSIxIi8+CiAgICA8c3RvcCBvZmZzZXQ9IjEwMCUiIHN0b3AtY29sb3I9IiMwMDAwMDAiIHN0b3Atb3BhY2l0eT0iMCIvPgogIDwvbGluZWFyR3JhZGllbnQ+CiAgPHJlY3QgeD0iMCIgeT0iMCIgd2lkdGg9IjEiIGhlaWdodD0iMSIgZmlsbD0idXJsKCNncmFkLXVjZ2ctZ2VuZXJhdGVkKSIgLz4KPC9zdmc+); + background: -moz-linear-gradient(left, rgba(68,68,68,1) 0%, rgba(0,0,0,0) 100%); /* FF3.6+ */ + background: -webkit-gradient(linear, left top, right top, color-stop(0%,rgba(68,68,68,1)), color-stop(100%,rgba(0,0,0,0))); /* Chrome,Safari4+ */ + background: -webkit-linear-gradient(left, rgba(68,68,68,1) 0%,rgba(0,0,0,0) 100%); /* Chrome10+,Safari5.1+ */ + background: -o-linear-gradient(left, rgba(68,68,68,1) 0%,rgba(0,0,0,0) 100%); /* Opera 11.10+ */ + background: -ms-linear-gradient(left, rgba(68,68,68,1) 0%,rgba(0,0,0,0) 100%); /* IE10+ */ + background: linear-gradient(to right, rgba(68,68,68,1) 0%,rgba(0,0,0,0) 100%); /* W3C */ + filter: progid:DXImageTransform.Microsoft.gradient( startColorstr='#444444', endColorstr='#00000000',GradientType=1 ); /* IE6-8 */ +} diff --git a/development/fmog.png b/development/fmog.png new file mode 100644 index 0000000000000000000000000000000000000000..291618458fe1a41057ec4299d8766935397fd04b GIT binary patch literal 6629 zcmXw8c|26#`)3TJ!HA4~OCS5#w}`St_H|5yXpm%0*0E;amt;#3N*WAi$Py!aV_zG4 zWQ$~%WdBWlU%%IV-FyDH=RVJQ-sk;(&U4O9Fg3oz0OkZ!P*5=F>E1Rcw^@I0S{m}x z>`j9S1qBCI@3saUJ-v}1=mnq1`pnnvP{Yp*j+{hav6Fs+Gun7I!0sTJs-;Lo*7}|G1wYycLlBQ}iA4%k7sA?qVA%lfILN$Z_MLnMq$F zkLw!OyeSb;VGe!$UM$6uqg)Z;h#g1vPqx+fsBASF`pqC1x+g$s5%|rRlFe?5RXTb9mkm|P9pTU53&nSuLfdG_|CI%HaBPUm1+kDu(zF`vf z=J<7pxg~N=->@*UdBAi8GVhzAa#UMY8e#I(nx}st)Gc>aEqa^4p3T_Q69JWgbI_Ez zEcMM_hvQ;w)E);P988o)NIkXkySW!%mMi197w)$|z*)A$coWmBwmop7wrwA>+GL+Z zkEG*9-enV$qJ+!Q!>4e8LOLJ)YF453bHP=OIQyv78V8^6x4G{pC@eJ5-#l+vKkL2& zci);dpuq}4uxmvx!F`#6rWX_+zk@z<_!D)8W~^Ggia1Yu?|vD9iVGQiv&%^@iaIn4 zsj@?x2VqZCAHSpg=?_B4n~s!}SObjmybldt*Oyb``+xAA=`vh>T{_hFN}jho?AVud zh)*ju?hMZwD`{S7O=K3Eu^9-rE$Fss+nRcjYc<~JTdHy}>r-};QII_BI5nPKP-U#P zpUnB^%X|1ho^lR1l1V*l+GYw5-H@Cdoe#3JVyHWax_?%-ZrA)$2GMCAh3q>$`hpWt zYIx_xte$00S0o_S>M5@>>@e93EN8eidvyQYoZ;q~d_WA-HfX%FOeHf&plon66UV(@)Qk z&5#+Q1C>C&yjIn>O0`or<2fdpzqB1(uulfE>o68je(-gB+&c;~=i{xZ#{kGgm$*`y zQE#ZXiiKRB02X@Wso5}ue3vT&HIb$_+*k3HvhbodSHcRb0x;r(&r0v*xn7#GUeMUh zN#26Zn9aB>q8j4c{sLZwRqEkXa%E3hcefYs&vi{GFZMW~*&zSCjnP-2@v4-R5zd^- zax2P(4a+hfm%n;HCwrY3Oq-2{?II{YMzl3a{(7ZCitsxq1T(UF#{@$hC;Yx2ty)TD z=lAU*Wn}0uUvc?32c%LsXG@qc%EbgBTJV@Mi9P9E54OkKz#eEi(oVfC^6PE=deAR3 zXkV{B6->rz4~Su&gdlSmF&7QKqL6XV{W&Fcm2UT_h>ojbHI~10WaBFzv zn$qb(RXIDq0VG?31I{^ALxcr%Q5L2yhRG-bFM^IggsCPnuQi`fifPY|C%14#*7+}v z+_9~c24FO!y5v(OjqLCOE2+58En{@((g}dU+`ONESS@~CMAJa&@_LC zl9X^#)qd@)#%j+sJzzHZkl?UbVZN^fV(y{Sqi}0E^Y;Ve4&PGXgT`T?aZ-#Jf#~pr zuWRJy23YhN7zwb-l6vi`A?+dAd|EViC-}X`pPBFNnxQiwMl_)A$|13tbkm@oxq;bg zfA-@qWaY3F0Mi}}gDZWwb{D<1dh2dfd`($ZQ!0N#S3szMAU#D1le&d_wsKHOigZxv z#rasl;_z;m1V1bxN^my|vx)mJycUKm)Y-}ZhQGJNO9?MhLr9!}bH#5zyO*DCk9z)Y zs33KU>lusPf?K#VH^z?QPE{B2F+Xa4E06|e1r{F-Pinj2Huq6{+jrYgiu+pTAK`8M~6?<{GSq1Ta%y*yN~VZzg=Q2l0$Kr!3l_utkUfPX3Ik@#ZnBTGa@LWRG z%EdS}Y}**X5nkR75brU4miF|X<->=@*UI)?m6N_1#@WxNj>gxvWK-YRF8wq@xYnF z4`jV#HbyyY>W%Z!iQX_UQE&&~a$c15>aK+z}IWuLt% z2H|vu;g9Wkd6%SOAZ78Y2nkiHfN0wth|DY-1_*mPT|!?d?cvjaGwq{4303#IhUSwL z6L8Pu`7p8Q$E2R(X0;+(#Oz2dT7KsSADTat=xwSE9Jlw?y#I$(^nG;c-0o;10 zqy03?>rePP#iN$bJ|6~d7X1Q*PYwtJ|&T`hA^LbjeQcC z9pc{s*UjSg7!qnS&T9$8K7x>IP=t{rfcRmY_?E^_T7gDu}_VOg$Pa650G22^{;v(-Tj5ug#F?&M+xn9vBX zwV7^|htFI}qI4w$I#BezOQ^@@+pF-9c>dUl{GwB1>HIrlKM~B0qx@|QrO1zi>xP9Y z!;r@vf<2Ekp;rpoyNLmbM7$h*{98rjhh>Y5s(-+;eAMh_pr0E$`}N+HVmEnX8trDl zc+UT64)n#$LUD{r%1ITWi4z+G7?`UFj})ccvlm(UssT+WmTAM};=eV!k;H1m>Bk%C zkSCWk!@{^R#%~GR3O{&|grY^bS^6e^G?Q!6;VFB?MO49=`&tn{ng6Y>O{=^ID&8?~ zIgtlbhmyGb87Y{CFR&$i{u1F4B(=bw1E54{2PD>>C-g;kg-}dNVV5;M7 zSlDJo&~V4yxQ5TIf>6k(AS|;5cmd9}NyT z=?nk*rwo*WItx$dPRi1w8UaH^q<>F8;)Q5NI`adID9hIcQZC%LkUw$;$dld8|L6j| zg6D>tz4J9a^xbm4WkH?*&hG;?tzz|U0_xU4iHCH}F4-ua5PVe{&hYt=;=R(==l8DK zv|MNT@5=@a$daY^hV{lwHf%&RpI6=j$=mmGRCvsZmUTa>in&fbMoV--|9y@r>`CQL zt}{~c3K;fJxolj9hRR`?!AkLXCzMO*AJ(?6__$? z8(lVSYl;#BleytVBkB`ln2(w^OtIZ??hx#7TT+(^fB(g6PE{xPg#t_G9`BbBRS1l;Gy%1+%vS?*K_{t4LsrW9|;LtoEcV`9D z=cCGz6HbQ3BtW)z8Q%(x9C;3USRiGzt<%Z(>_Psvj*pN$vDu~mY>v8c z@SF16R-ZrC+;w8;D%tr|oWN9IydnxqY!vvHngX$t$sE%*2Pn7uX$?ABg0~1+qxQ^= z1)^N)azg4)qSKA{^Q8M87-(p;N4P;9WJ6LO@`)4M+=>`4d;JaeWb|D>)ODr#rg-0J zx2Q=z>TNV|iw3jVz;i3&4PaRBaZyB{^N9txM3&_NtsP6BJ!bR)$Pz9yetICX8US)rNWbILdVoq2AEh8qFXkx+6m;Zc|ZMs@2U&6EBHO|X5e;9CZWILo3GCwh4f6i21{~eA#mfv=>Z6Y0B5{pZ|7nng zmyX16$8;@#QcHu~xl2~=N-sl}=%`8+b@<}u+-ZoSMQ2>hDOIb$qoyl7k-79(f-0GO zK_c;FCZu(FFJJu*<_klTGUDU`Cl3J()cMm4+kx(C@;8yGU*r=~kI z6;^~JyQdh6RI~rG2;z9?M|tP9^xes5*U{-tP;B217UoVO*WI53MTXM=l!p?<-sGH* zwsucjbyh%-cqCNpGr4x4X4MZj5zyTVTxOygy9k9z1q3~uO6vGCr`&TQNmtWdrIy!({w_to>=+d$42+y_B_i!ITnkCO#w2r~ukRLM+;bL(rgG9pD z2kMTILFG&qOsxhZ1%8pC6p}xpKMBNyk(0i640)At6zN9U7oFm=>z@nmVADC#se^hx z^O?P-5zg<8L-zU~UMsYAUN3%WAO@nvT~YZ5E<7ge(Gh2C`@lOKz?*9n8R7Y!To_p z;-vlrg2N@EIYtT;?vSKr@?M&4VbNG7jG3L9q(dOuK|FBR`P_DPiOQ>LaKEU3AQvT~ zfce9jT&Lz*wba=kCgnu7=_w9mDUOA64|#9>j@}t@+g)sJWe~@!Iste`c5{n;ExH-ScStwWy3Ix z`eG4(k^f(`BLgxA@RwoMb1LEIxQ zQZBU=0k86kc{c6boNqIV)+bnU?$0rjxAw7hGz~(T;=ZQZ63_OEFG1#!cul~g@<{kz zRR7u82)DOO&S}C#FWRnULqrY<6f3 zqMXtG_XJ`!_-vz7u4oGMsDZ_^P*~Prxq$jmHtEaOxL%fc^kH$mLx-y$0x?a_{;smX zZIM?lMA6^xUxy+Ns_SM8Lh6i>Sv9_EcteUI_P*zw=iw7m_sr~z6Q2LqE;10?#|t)B z@OfyBQpN}wsIjWDCY>1D2XftB(zNjOl*MguSP`<=^@A}8$OE~dUA$*a3t_BvnSwID zHYbA|r;$)v%;@r4*e{zFJE9z3)B=cQu^yNFs(w{Hi?T4M)6E6v&)yXprzR)v*W9GW z^4|;bdk}A@RzbiBNB=}6z_mWY8rs+vkNkB z1CG*OEs6f7LeIT6aIK&8X^@DE^xAoehH=3_r2nYPskAgC9Yo?GbE|{3OIQkIFa^ZY z7a@uJIn@aV8rsCsKOD-Ig3{I77 zkf!`#+@{q2#}$4D!~w=u(ZU_>8`+U0$^#%77e08eTh(<0F$Wc7I5L9tZhqEH9SxXC%T|odDmrQ!9 zj-xf^tEfeq#W%8DrhFn$L21Z*tgS zJy3Jk_@uXvfXqRBb+uiyN{ab1JUc>t|S2}?Du|TG4 zTIWEfQ_9Ly22Y^2(qf}j-%I_zs!ubdH*d7ZOX43ny&TyNym9DN7{_sYF3?2Ri>INk zrt$hdVMuvMIgWR(V#Gvg_Woz0!UlaQzYf+T_|n4a7K zeH`fQsvqo@Nj8(1MEdZPhG*`OjkS6^BSV+^35UUfM#W=`nf{;N9Dj$qsk8LB0%xuv z7SGg&NP1-2Vx5r=UhE8-m@n8I?AMhffyqHYw)yVpR5wpqsa4a;q zT_&4=F;I^z*v35iDWv_^h@`gP*TVE#NW{|mC8Vk zSBC!^%0Or@VqQo{{x5Puj-h)+{3_1P>zmqQBCv5M8=LAwz)*KZX-5~r-Q2X2Y zIK*n1Bd1)bEqdUxEh0e6zO?f6{XLH*>-Gah&;MY8vxW^TFyUGMt^efnn+DZZ!`c&T z)>XZDRon&}YZly9YzD8b;`ciP*HwL9-;m17`FzzOUw^sm1JGw9AP16}$Pc+(?#>k{I-%q*1bx{Qq&ZzUF!c`ms|P5|4h>ITo3<7{(VECr)_+@QWF*Ve*}Dc AmjD0& literal 0 HcmV?d00001 diff --git a/development/screen-shot-all.jpg b/development/screen-shot-all.jpg new file mode 100644 index 0000000000000000000000000000000000000000..18471264996e6d0f0f4de8dca88a2949963ad282 GIT binary patch literal 24262 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
)+e0Q4z{ho7W01iDr?LGyB$ku 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

CBJ{FZc2N#w(^nrd)eEy?_X`tQ7 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 literal 0 HcmV?d00001 diff --git a/development/ui.html b/development/ui.html new file mode 100644 index 0000000..a2417e8 --- /dev/null +++ b/development/ui.html @@ -0,0 +1,25 @@ + + + + + + + + UI dev + + +

Tiny jQuery colorPicker UI

+
+
+
+
+
+
+
+
+
+
+
+
+ + \ No newline at end of file diff --git a/index.css b/index.css new file mode 100644 index 0000000..bfce9d1 --- /dev/null +++ b/index.css @@ -0,0 +1,29 @@ +body { + color: #ccc; + padding: .5em 2em; + font: normal normal normal 1em/1.35em Georgia, "Times New Roman", Times, serif; + background: url(data:image/jpg;base64,/9j/4AAQSkZJRgABAgAAZABkAAD/2wBDAAQDAwMDAwQDAwQGBAMEBgcFBAQFBwgGBgcGBggKCAkJCQkICgoMDAwMDAoMDA0NDAwRERERERQUFBQUFBQUFBT/2wBDAQQFBQgHCA8KCg8UDg4OFBQUFBQUFBQUFBQUFBQUFBQUFBQUFBQUFBQUFBQUFBQUFBQUFBQUFBQUFBQUFBQUFBT/wgARCADlAOUDAREAAhEBAxEB/8QAFwABAQEBAAAAAAAAAAAAAAAAAQACB//EABQBAQAAAAAAAAAAAAAAAAAAAAD/2gAMAwEAAhADEAAAAeSAaAQI0ACAgQgRAJEREJAICRAIgREBAaAiASASECNGQESAiISIgIiIgISIQAjQEQiQEZEgEQIQASIQIhAiARAgEhAjREQgZIiEhAgASA0BGjJCRk0BEIEBCAgJoyAkREQgQgQgJkQEBEiIgAhISASEgICITJoBMEaITJoyJEREBoBAiIiEDRkgISASIiIhASEDIkJAQCIEQgAkIEAkAiJGRASAiIiIBIhAQAQIhIhMiBoiICIiEgECEAEiA0AEQgaABIiASIRMkREQmRIgEiAQESIAEiI0ZIiEDQAREQGgNGRAiECIQNGCISETJEICAgJEQmRAiNGSASITIkICZEiISIiASAiIRAgA0JkiEAIQEBASEyJEREAgaMmgNABEREREQgICAgRERAaAhAgISIiAhIQIjRkgISECISIjIkREREJEBGjIgQkBEQCIARoCIiASIiEyIkJkiIgEiIiIiAiNEREIERAAkICAgAkRCBEREQkBCACRCBEQCREAkJkSEBIyJEREAiQAREIgQgAiREBCZESMiICACREaAgIDRCAmSASIiIiIBIiAhECIgEiASEgIjRAACRoAIRMEJERCBEREBs//xAAeEAAABgMBAQAAAAAAAAAAAAABESAhMEEAEEBQYP/aAAgBAQABBQJZSVOGiwseAp2XZ8x6FF+EeGo4346bG8EkhyVKWwhZQzBBe60Oh8EO0Od8fxSwsLC4aiDymSXW2FhcRQkgYCVU5Jv1QmrTfMPwFs+E9VACamqB8dFR/wD/xAAUEQEAAAAAAAAAAAAAAAAAAACQ/9oACAEDAQE/AVJ//8QAFBEBAAAAAAAAAAAAAAAAAAAAkP/aAAgBAgEBPwFSf//EABYQAQEBAAAAAAAAAAAAAAAAADFwYP/aAAgBAQAGPwLTFnNoWFk//8QAJhAAAgEEAgICAwEBAQAAAAAAAAERECExQVGBYXHR8CCRsaHB8f/aAAgBAQABPyEWyMU12IWqIFNNux1RCY20nZE2G3I8jo6L8Ucnunp6/wCUYkR/Dsvz/SfJoPwehKCPI3ukuJLsUjm5FkNuSHFNDRcvxRwWL0Q4LCUCwo5MRc7JsIT5DE10cU+a7VL8nAxYfuk36pNJ+2PrBI1kTWbDRN+TdG8HH4OLU2R4E8SOBNSybm3SxA01JDR2X5IIH/zwbRoZF6J368DZEvv/AIJ14Jh0ST4EzZOSfJJPjQ2fdEwOiZ0dDXgej5Gy32Sx8DovZ3RTOGPR4EFlRN8kLg2cDzmvGBU7IHRx5PCHj8IHT5OPu6LDOTohcEeSFIw8uEXjFHqxkR7/AERmx0P0fdVtGDonNj9kjORNHBwcliwjzo7o8V2JG8Cm9i9y/wBghkiMEKcmGTstJbmrbkcciJ5FtE+Ti5bmmQ1iV/RpC368myWSyb5IzTn2fs7OzAWPxgtychowfdnpS4z8jfl0L3o7F7EpIGqJLxnyd/01n+i9iESSWkhUSdGv5Ts0XOhogaQjkinbHouRc6OhRC8joXo4JUG6TRDfg5sap0cXqyxYbQ1ImPgtDLcEo3AlTWDgWCPB0L0aF76Niy4LshnY5tfZtdGgy/1l/wALCgsqbL8UWKJ+aX5IZhRXc02X5OBYea/cn7O2W8/ezYkK5knuj2NmN0T8V2KnjRBAl/D9mh6U0NQ6c/J2KeS9htySyXkRlgnwSHn8G2S/rJ8f7XWSLnxSNSWJsTOxySXop8l8yyXb5PuaLMmzodHKZfgzojwXk0W5LNZGgkMsWkgQbp9zRY6o1VOjrBauHWFT4GkZGV0JCFI4OS5emjd2bObHR0Q62jBBhNIO6Zq4M8UmmVOBk+DyPJclWEQQNDiiSGsX0NHAl5EayRJv8HeYo4pFsCSHkXJdiJ5/VJLU0TjRMIUFrDj7Avf5XHoZ8UzR+xexojQ80eqT5OeTkejTFsm4xfb0uXilzQyUSofqps7p3TdxUciwOJZbk7Nrij/CxgWLcijkXunVI/g1RpChIcUd/hHlHY6eaWpJNfuqt5NV5Oqs2dGsU5IZqjpcuX8UbgvWzk4pcguKRzkZ0aNlpLckLk8ybpe42XJZclouOXkS38EeH+fNJ2PVjWCK9mlRbJotkOwm/vBAsmQ+xl7WJtg6GyUTS800dCPkkTUYnwhdU3oeWSJkuOxr5JfJPkjyQR/RNiarBCLcf6apov8AY5H2a3/o8nyoi9L3LmxTcVwje880/RbgXpeT7otFbU0ff9P/2gAMAwEAAgADAAAAEIBBIBBBJBJBJAAIBIIABJJBIAABJAIABJAIBAAABIBJBIAJAIJAIJJIABJBAIIBIBAIJABIAIBBIJAIJAAJABIJABBBJJBBBBIIIJJBBBIIJJAAJJBBJAAIIBIAIAJBBJJJIABJIBJABBIBIBABAIAAJIJAJBBBABIJJJBAIBAJIIBAJIJAIBAJIBBAABBIAAAJABBBJAAIABIJIAABJAAIAJIBBIBAJJBIJBJJJJJIJIBAAJABIAJIBAAJABAAJBJIIIIJBBJJAJBAIJAIIIBJABAJIIIAIIIBJIBBJJBJBIIJABAIAJBJAABJJIABABBAIBBJAAIAIJBBBAIIJJBJBJIJABIBIJBJBIJAIJAAJIJJBJAABJJBBAJIJIBAJJABJAAJIBABJJIJIAAIAABBIBAJBBBBAAJJBJ//xAAUEQEAAAAAAAAAAAAAAAAAAACQ/9oACAEDAQE/EFJ//8QAFBEBAAAAAAAAAAAAAAAAAAAAkP/aAAgBAgEBPxBSf//EACUQAQACAgIBAwUBAQAAAAAAAAERIQAxQVFhcYGRobHB0fDh8f/aAAgBAQABPxBdN+3pkUTs7xJO7BnjIgFOJ7yAHok9v9zZDcVf9OGWk2lvm8ZTCChXM12YtlYuIqufGCRZEpZX2y1aEokB78ZegUxJ5y5ZkgRUc9ZviG547wEzNbPW8Sfe7nv3zQRUtffJpHkNYqWhjrvEqTOiK7xmnsYCg2JYTC1XYip98Wagm+sXaJ/qybJLLkkURc2n7wlRCYReJ/vbC1MHNx1gaklOffF0jBbnrweMhYhSk8v4zQZRJ/KwRKKIDn9YxQydSvPWEkZShc+f8ySbMw9/XIRA7YCXDkNjXvhJGbTMycmMzNmpufXHkGuXy3vCK9Vbg2C5mDevXBATVV7YrYxTV5JETu9dZZ1Nbju8RlZPX+fOBJJNNzzOSJq+Z8fvBVRIVd+NGUgR2VjwMEPX1wyiSZ3CfjADImjh69MiXtPHWKd8e32xEEhqGMQ4mjrrIrQSRtMoZsC5f1gengucgB2l4n84p6DK+BbOSgybiPjE7oZIa1D24qJpFwGn/ckm4sIYO/OKZJk9nvAsPRYg4whOd+PfjIFnMLadY6saIlxiRU0xF9Zx4szGJpkdvWUBoXXD/mMyIupvGTW5eRyVbp/d5c8ibm+PPrkRI3XRmxrt7ZPnj2+2IZLIdAyYCH5jXeKlnUEex4wQvUA8decKpN1iGp4+UYPzy8YKkqeQbyFHZq/3jEcyTIC4pEaiOHzgrF436+mO10pbXHL75AVmnAmDOhNeMk1AvhT/AJgigApuU4xAkgEE3PvkEkRF4AlE3MxJlQKFrsyR0iOJ6zokTxP9xnIhi2PfGhHKKjziEpBNxYV6YkyLWyIwHRsoePXOeeOjCbA1N/fWQQDZ4MbA7S4OYzYb0OvGShF0c4wLpwqFonH/AHLAa6j+ckp2Hh785PUztuNfOVg5AONJEa6ecVozTEhWSkCWVmt3geS2Xo+uamKtSh4PGe4s106jKaIiAkOvTJKdw6gwKREyzP8AGSQQc7BnjKEiebTKVetO/wDuCQYsSfn65cgCJ3894AbK8RGsiyfRXeWKDbKz4y+Pn/dYXE8Rs+uTnoTSmKmZHw3iJKWIjAZdEwQ398Jil32P+ZQpiFed4SzaZdR+s5FHH19MAUNydsZZfAZnvADAjUvO8YhGkSBfXOBMqWxyu/DkplhMRaTTBvxkACDKlfpiIYYo398I74Zr84BuH1/WVAcFq8djtvl/eDpJLl/uMg72n5zhlU+uFUuvrEOcgrR3zll6b46M4ukbMAaMwT6dZBSDnpPvkESgb8/LOEmgCOvStYjGyPB/mJHI0PGKwIlETX7rJWVKn8f8wVEk4n5wN0qIsyFsgRtj+5wAjMkExE7xRYBZZ4a71h2jYYY7cAUB1NwV85C3nmuDzhqZIiPO8edNFYAqxsaGufOBZON0398CITG5v7347yHa1cXN/PWCCNKCPS85Xls9H7yvGvH1MAmOie+P9wEJHyevnCd/lOjpzx5jICOkFfxncKY/qwauSU+h4wPMEFQnHjA1SY5j9ZMsQTRx16Y6kCPT9ZGkEUKB/mQuuBy5wciTZwlfOQ2q1OnvAvGZtjCkIImwNMmzqoo84RJuI3B1vJWzfHt1gkRKdT+6yCoSzA/HjGZf+NemWd/Pp3i+23HenPvXrkAJB9Fv5wih5uK2fGeg0vP1wSjPOvT+3iW6isRgK+fE58HD+MQpCxE6/OO98zMGGBfPvoxYX4h9sNR45r4yB9he8kJidx9MhkiDdffeKqXDoMmWwryhzlBPTcvzmzUicmFTHv7ZGUjNPPnCx089GLV5cTPGEQj6GY56yJLL9/xeAZZPEgvfjOgVSHXjGRklEjJE419Mh3TdA/dyEl8L2lnE40MNXvv1ybKDcRM5IQFBe3BYlyavWaTHW/ORNaeJ/ORBqybnr7YywEUeWSoQtdT3glEEehgpQagqbrV5CEvZLA/fBpFetz+cArlFs373iPKb659fvkck2V/mEkr016euSRuSXnSIowWH2Q/isltuZPkxKOd+XnJJGKLmOcYBq/QXnzgohTrrrJKX5r7msjbzRU9GI1Ba5+2QlkgeH+3gQGqJiO/XCVMDbXOTKUTHP+sZhW579+cj1/ODF3431lCWUAEOJWyRd9ZKpna89/XIiwhlqvzhcsok1PnzkXnL2+eLyYs9xLPDk5aCK3HGMQ1L3Pbe8Ai4CJ5/f3yCky+h6ZAjTkrwyABH2t9snDwlqy+9YkKWdqMcmJkZZhWV84thVKNL48ZozNUX/mAgRyczx4M2W12z+MY4jgqeuoxcvHE1nIetOMQLSIvzkDTcdYhegcX1koColp3xkx5j36yKPJ6jRzPnPFEVSTgJGLqVjLOueQd84L45OMgBLOqI/f4xAEG413LdYCQRmG/b+5wSKOUJvIQJbBet4U7K/GSJQsLYx14wgEnBPP8AnjFOWNx/RkCTmQfBlpwrJAbUzJe28XpOiy9GdQbO5nBIMXO7jWsdyN7d+PGAZvdgT16YRfOvPOCUh4ZiJ54xZaTRPO5+cEptUtrvy5IrywQDxilVPNh3nB5PUaHc5Zo2j/RlykzF4LTJE8RkJlsvXrgTN88H4zVu48/3OVg8Ie+AMpULBfGQL3/zGBXqqZECJYPGLOWV+nWLkRc+/wAZA+hZOQcQq8+DzhEMg135MElyhBPX1xhaRrXpvAQk5LffCF8L2OXOkRXOJlLTHnjCZMOzvvWVbUxAGHeMKuK29/nJEy5Imn/Mlv2sY00Vyz3kUU6j39MV0I7ZoujvJUFEWajx8YEupZqfOQ1XR1T75RJeO8uYua1Hb3goUTW6/WVNzau+b8YEFv09/TA5k0LSYyUc39MZ1Bvt6y7QUVf+4aMJJarj1wGGjoVnk84LkC3986jd6lysFHYffJkledv7yZBr74SrMxHf6yShbtpMJGT9O/GNw88KGaciJqesNjUxLtxmFdRkxmEYim24yYkwk6mbxWhX3jFZuYvkj2nJdX2wPsZTDMNcP5wheCPD+cray3Z6YpIKjPEHzOSscSD8/wC40EvOr9tecgNnXl+InjJTVo8+mCmUBF8YkSkuevHeTb3ER2ecGl3MxR2YsAcuIeDBaEPcMZh16kRs/eLInRVVV6wxL5JiA8ZHDPPTrFVBJrcvnWHGKCZuPVyrEtM0vfpi0wycJxIhjwmcjy6wA2STV5Bc23UfvJA3vrxjGhjdzGFVWw0tXxlhJ0i/8y1tqO/vluz6GDLwSSRjqSWa1hPtLXK8Zx2rNQ+2QnZD9dYc+kM+v2yUTDwk/bJiYg6vsyGGvNT+cDiIkS/78YLTPpcdecP60F+nnxhKKFKYZvZRn9MJgaj279fxjLF+9fCziI44d/reIXDLEz/uARxNv7zlNNbyHHHrjN8SMe3WAhDAq6Z+cQp2Jv2/zOl+P7zgrG5BbPGDoUTwD9DEimVvgLvsxQphsCevXKBY5mTrz5x0FvVvreSw7fFo+uE1upCLqcDISXyLhYIuHdYkkvAVm/3kksJeBXJdx7MuMEapON4yTaI3fG9+MhE87Y9/1grmV84C05OcFLKMumLPGC7VMTxuMN9NBSHfnGA7UJP7WHbBAO1ajnBETAC0SbyZeJmPbrEmhaghwAtjbz2YBYWDgZjGtiLRa5wBgrpBj75EWHNQJxuWpnamQ39FGTIeY68ZJ6lXeA93Hvhxct/fIJJSeB84DSS7L9c00sPORPFdfFbwKiJfXEMc77SjIXDJC78ZACRDMa4wphKnbvEASLenqfzgCQlbnXE/nEJrepmsICJloTIIBqI3vKlJ3tfXphUK5FJmsjlYmIyImiQxLMMA8hhcDR2YQhFizD/mVIhmZr/mBRJ16c4k4TzcORseCtddfrAJGmuu/rikpHmTJLbHhnKizXfnyZXYeWnvA3o8T6uULGochiJ5GpmzHbIqXj6rZ8YCYimBT/mAZGHY+i39MAVlOeP3iBJSEHRzPnxgpCQmWgPzm0edwenrgNBmJdmzrIoWK5ygVbiC/TLC5d8v9rNvlGO1jff9+cKOridlZCvyEYBkiCuvXIFqSiO8ZFNlzETv3wKEEFNp/mCB2YAj36cFmjQfjFeZX4+N4DiF5iZ85tKa41v1wkgdy+e8SGw0TMSfOTTRQEsb/OAdVRMMYI1W9pPGISm7O+f8ywpE6afxkaVXjBVOief7nBlyiHD3iGlUlmHIRFxASf7iDKpRKj24yERN+Y+mIFrJFX11khVoTUjvO39/e+QErrd5wJtTTFZJJ5qH13ktCbZL5PN4oVXgmQ8ec45QsgDzinEww6Dn0xkmFxaOdkkiIMUWVMyA4UUljqvt64BC7jvtzkmivLvnFliXi94C9xF6+uDFXiI465yQkJ9nyby1ssev4/3FQTgszPP2xSkr3DWNbn5vjxiuVzrj9Yr2lJX+MsluNwcnjLWJNv2yPJHzxlpAnVHr48YMCSDAxMV7c5F65nIQunsg/OSIXBDet5R9nW80Go+WXEIOgSP74yEebjWQCEEJo/z9ZCEINV753b3Vce2IizuYCJ3175ek7evrgQDRu/V6wlmFiN35wMgSWqHvJQpiuJ7yUck79f8AMZmXqNHGLXlGs0RVPrtwjz1qznJFCaPxeARJpg/uMKsleqOSk4YOBcnnAZ3d8nT5ybswSc+HJmN3LPp64zbviUZyITz3B+8QkJDFYChIqa9cbCaNxf5xgp6cGcb6IxETzZYH3wBJo1QP2z4k8VU9GEwwqyxMd4ytibbvrJ1L57ySAJa6DAPJHXOT1G6+T9YDUxBO5+MlRefyZNY65+2KCunfvizBsCcz9srsTRca9MNpVNi+vTFuI7YbiMWCuyXr5ya+lN4XGXPHj67wPyEbJ4d1kNUJUqDXpiLM/wB85FRgANbqvXJSiQlup8YiNcR9fvkDI8m30nA7idbMpHhqw/OKRxZNv785IvA3FeP3hAxDf9/TlRxPv4xIibvzPO8IlZCI784KpLwhGAEkMDbHEVkwpEkSFusVVRbxY4s0uwi3+4wky087x3Gpdk4Ik4a5P7WNJWlWpioxtCal+3eIDDHXH7weeieW+H4wkluVOjs785LMzuY56xAlD6j9MgtH9OQsS14R5M0RcRHGXAtn077xgYlId+PTGJItvbi1Rzv4wPrKVeRSvifGjLHlE7nvJeHZxnLAS0FvGRMiJp8/bAbO/X74LwJvo68ZNNeHTG8FwVNfbIZezAKqxJtQ/OEZVorfJnBVEG0+05BCwRuZPoYkCufO4yeCTMzB5/DlTPLevTusktU60RUdeucBO+MqNGa+27zRGrs45/eaDPfJiqqAUhU5MsRFzd/1e+C9cxuecrkbIYjjgydVT6fvNi0jr284llPfeAd7fw5smezWAgTa7jBFkc69MiCAZqEyGSx3U7+MZFK5kT/MbKrZTX4xBolLI9vGbadzO+Z6yuYZ9v1iw0rOkPjG1Ldxq/SL1htbURXn0+2V0WlwdOK0D+es5xSIgnBlYrnr7z4wUvbuXjACiQb2W3l9BJc5KiKlIvsyNjG2OOfXJqOdsS/nBO8SyX+8WQl0/wBvHhGNt28ZLkRPR0d4pqT0g/XWVd9ag7yyEHuzr1weEfbEKwxTEglEZTiMiQs1Onk8YghLDPTzjEY4JxhnQzHOHAEyhUc18cxggHKfRjrWAkkzBdHccZqd6dx3jwiAmpnnCeF67yZK64vWWL71GCsUODr84qBPRp/3Emhh6v8AOXWv+vXFhouQ134xBDB3nMRPbipICTediKEn4856OU89YNuje8YOjdDiGwJivbJCRqb4N81iK87nSfbLJJEnIDQ+dz6YbIXOp7xSRBZjZ84tpolWfvITEyrGz95IMxw/rwAJhh5jrL1J1PGBNSXELWIkWS+/OQhyu7DLtb8n9xlblLv+GU0EJ5cY9bOZ7yDpNRzzk0YN4SqODPzhrcofdnYsTzPnK2/l5y/5GSud878YXfU7xmDUy/jC3r9tec8t+fXCZdyzM54W2ZnK8R4ygnz33m0Dtz6eMdk784RJHIzppf3zwiPE9Zc8zea+4qYzgv0rb5w8Exon8Vh4jz1rCPb8z849B+T9Ybo+phEvaPnLren7M//Z); + margin: auto; + max-width: 600px; +} +input:focus { + outline: none; +} +h1, h2 { + line-height: 1em; +} +a { + color: #fff; +} +pre { + display: inline; + background-color: rgba(255, 255, 255, .2); + padding: .5em; +} +.color { + padding: .5em; + margin-right: .4em; + border: 1px solid #aaa; + border-radius: 3px; + width: 140px; +} \ No newline at end of file diff --git a/index.html b/index.html new file mode 100644 index 0000000..0e48df9 --- /dev/null +++ b/index.html @@ -0,0 +1,206 @@ + + + + + + + + + tiny jQuery colorPicker + + +

Tiny jQuery colorPicker

+

Looking for mobile first, tiny foot print, fast, scaleable, flexible and pluggable...
+This 4.4KB small HSB color picker is based on a subset of colors.js from it's big brother colorPicker, supports all modern features like touch and MS pointer, GPU accelerated rendering, battery friendly requestAnimationFrame and provides a lot of hooks for developers to write plugins (See demo plugins below in Demo).

+ +

Demo

+On all inputs with calssName 'color': 
$('input.color').colorPicker();
+

Switch between plugins: + + (see index.js for more details...) +

+

+ + + +

+

Features

+

Tiny jQuery colorPicker only loads if triggered to show. It uses battery saving technologies and super fast rendering for best performance on desktop and mobile browsers.
+This colorPicker is very flexible to modify and customize and there is an easy way to write plugins to extend functionality, look and feel...
+As Tiny jQuery colorPicker uses colors.js from it's big brother colorPicker, it provides a clean and rich color model and API that enables flexible extending for programmers. (See colorPicker on GitHub for more details)

+

The following snipped shows how easy it is to make plugins: use for mobile

+
+window.myColorPicker = $('input.color').colorPicker({
+    buidCallback: function($elm) {
+        $elm.prepend('<div class="cp-disp"></div>');
+    },
+    cssAddon:
+        '.cp-disp{padding:10px; margin-bottom:6px; font-size:19px; height:20px; line-height:20px}' +
+        '.cp-xy-slider{width:200px; height:200px;}' +
+        '.cp-xy-cursor{width:16px; height:16px; border-width:2px; margin:-8px}' +
+        '.cp-z-slider{height:200px; width:40px;}' +
+        '.cp-z-cursor{border-width:8px; margin-top:-8px;}' +
+        '.cp-alpha{height:40px;}' +
+        '.cp-alpha-cursor{border-width: 8px; margin-left:-8px;}',
+
+    renderCallback: function($elm, toggled) {
+        var colors = this.color.colors,
+            rgb = colors.RND.rgb;
+
+        $('.cp-disp').css({
+            backgroundColor: '#' + colors.HEX,
+            color: colors.RGBLuminance > 0.22 ? '#222' : '#ddd'
+        }).text('rgba(' + rgb.r + ', ' + rgb.g + ', ' + rgb.b +
+            ', ' + (Math.round(colors.alpha * 100) / 100) + ')');
+    }
+});
+
+

API and usage

+

Will follow... See tinyColorPicke on GitHub for now.

+ + + + + + +Fork me on GitHub + + \ No newline at end of file diff --git a/jqColorPicker.js b/jqColorPicker.js new file mode 100644 index 0000000..36785ce --- /dev/null +++ b/jqColorPicker.js @@ -0,0 +1,244 @@ +;(function($, Colors, undefined){ + 'use strict'; + + var $document = $(document), + _colorPicker, + _color, + _options, + _cache = {}, + _$UI, + _pointermove = 'touchmove mousemove pointermove', + _pointerup = 'touchend mouseup pointerup', + _GPU = false, + _animate = window.requestAnimationFrame || + window.webkitRequestAnimationFrame || function(cb){cb()}, + _html = '
', + // 'grunt-contrib-uglify' puts all this back to one single string... + _css = '.cp-color-picker{position:absolute;overflow:hidden;padding:6p' + + 'x 6px 0;background-color:#444;color:#bbb;font-family:Arial,Helve' + + 'tica,sans-serif;font-size:12px;font-weight:400;cursor:default;bo' + + 'rder-radius:5px}.cp-color-picker>div{position:relative;overflow:' + + 'hidden}.cp-xy-slider{float:left;height:128px;width:128px;margin-' + + 'bottom:6px;background:linear-gradient(to right,rgba(255,255,255,' + + '1)0,rgba(255,255,255,0)100%)}.cp-white{height:100%;width:100%;ba' + + 'ckground:linear-gradient(to bottom,rgba(0,0,0,0)0,rgba(0,0,0,1)1' + + '00%)}.cp-xy-cursor{position:absolute;top:0;width:10px;height:10p' + + 'x;margin:-5px;border:1px solid #fff;border-radius:100%;box-sizin' + + 'g:border-box}.cp-z-slider{float:right;margin-left:6px;height:128' + + 'px;width:20px;background:linear-gradient(to bottom,red 0,#f0f 17' + + '%,#00f 33%,#0ff 50%,#0f0 67%,#ff0 83%,red 100%)}.cp-z-cursor{pos' + + 'ition:absolute;margin-top:-4px;width:100%;border:4px solid #fff;' + + 'border-color:transparent #fff;box-sizing:border-box}.cp-alpha{cl' + + 'ear:left;width:100%;height:16px;margin:6px 0;background:linear-g' + + 'radient(to right,rgba(68,68,68,1)0,rgba(0,0,0,0)100%)}.cp-alpha-' + + 'cursor{position:absolute;margin-left:-4px;height:100%;border:4px' + + ' solid #fff;border-color:#fff transparent;box-sizing:border-box}', + + ColorPicker = function(options) { + _color = this.color = new Colors(options); + _options = _color.options; + }; + + ColorPicker.prototype.render = render; + + function extractValue(elm) { + return elm.value || $(elm).css('background-color') || '#fff'; + } + + function resolveEventType(event) { + return event.originalEvent.touches ? + event.originalEvent.touches[0] : event; + } + + function toggle(event) { + var $this = $(this), + position; + + if (event) { + position = $this.offset(); + _cache.$element = $this; + _options.preventFocus && event.preventDefault(); + + (_$UI || build()).css({ + 'left': position.left, // check for space... + 'top': position.top + $this.outerHeight(true) + }).show(_options.animationSpeed, function() { + _cache.alphaWidth = $('.cp-alpha', _$UI).width(); + _cache.sliderWidth = $('.cp-xy-slider', _$UI).width(); + _color.setColor(extractValue($this[0])); + _animate(function(){render(true)}); + }); + } else { + $(_$UI).hide(_options.animationSpeed, function() { + _cache.$element.blur(); + }); + } + }; + + function build() { + // CSS + $('head').append(''); + // HTML + return _$UI = $(_html).css({'margin': _options.margin}). + find('.cp-alpha').toggle(!!_options.opacity). + parent(). // back to $(_html) + show(0, function() { + _GPU = _options.GPU && $(this).css('transform') === ''; + _options.buidCallback.call(_colorPicker, $(this)); + }).hide(). + on('touchstart mousedown pointerdown', + '.cp-xy-slider,.cp-z-slider,.cp-alpha', pointerdown). + appendTo(document.body); + } + + function pointerdown(e) { + var action = this.className.replace('cp-', '').replace('-', '_'); + + e.preventDefault(); + + _cache.elementOrigin = $(this).offset(); + (action = action === 'xy_slider' ? xy_slider : + action === 'z_slider' ? z_slider : alpha)(e); + + $document.on(_pointerup, pointerup).on(_pointermove, action); + } + + function pointerup(e) { + $document.off(_pointermove).off(_pointerup); + } + + function xy_slider(event) { + var e = resolveEventType(event), + x = e.pageX - _cache.elementOrigin.left, + y = e.pageY - _cache.elementOrigin.top; + + _color.setColor({ + s: x / _cache.sliderWidth * 100, + v: 100 - (y / _cache.sliderWidth * 100) + }, 'hsv'); + _animate(render); + } + + function z_slider(event) { + var z = resolveEventType(event).pageY - _cache.elementOrigin.top, + hsv = _color.colors.hsv; + + _color.setColor({h: 360 - (z / _cache.sliderWidth * 360)}, 'hsv'); + _animate(render); + } + + function alpha(event) { + var x = resolveEventType(event).pageX - _cache.elementOrigin.left, + alpha = x / _cache.alphaWidth; + + _color.setColor({}, 'rgb', alpha > 1 ? 1 : alpha < 0 ? 0 : alpha); + _animate(render); + } + + function render(toggled) { + var colors = _color.colors, + hueRGB = colors.hueRGB, + RGB = colors.RND.rgb, + HSL = colors.RND.hsl, + dark = '#222', + light = '#ddd', + colorMode = _cache.$element.data('colorMode'), + isAlpha = colors.alpha !== 1, + alpha = Math.round(colors.alpha * 100) / 100, + RGBInnerText = RGB.r + ', ' + RGB.g + ', ' + RGB.b, + RGBAText = 'rgba(' + RGBInnerText + ', ' + alpha + ')', + text = (colorMode === 'HEX' && !isAlpha ? '#' + colors.HEX : + colorMode === 'rgb' || (colorMode === 'HEX' && isAlpha) ? + (!isAlpha ? 'rgb(' + RGBInnerText + ')' : RGBAText) : + ('hsl' + (isAlpha ? 'a(' : '(') + HSL.h + ', ' + HSL.s + '%, ' + + HSL.l + '%' + (isAlpha ? ', ' + alpha : '') + ')')), + HUEContrast = colors.HUELuminance > 0.22 ? dark : light, + alphaContrast = colors.rgbaMixBlack.luminance > 0.22 ? dark : light, + h = (1 - colors.hsv.h) * _cache.sliderWidth, + s = colors.hsv.s * _cache.sliderWidth, + v = (1 - colors.hsv.v) * _cache.sliderWidth, + a = alpha * _cache.alphaWidth, + t3d = _GPU ? 'translate3d' : ''; + + $('.cp-xy-slider').css({ + backgroundColor: 'rgb(' + + hueRGB.r + ',' + hueRGB.g + ',' + hueRGB.b + ')'}); + $('.cp-xy-cursor').css({ + transform: t3d + '(' + s + 'px, ' + v + 'px, 0)', + left: !_GPU ? s : '', + top: !_GPU ? v : '', + borderColor : colors.RGBLuminance > 0.22 ? dark : light + }); + $('.cp-z-cursor').css({ + transform: t3d + '(0, ' + h + 'px, 0)', + top: !_GPU ? h : '', + borderLeftColor : HUEContrast, + borderRightColor : HUEContrast + }); + $('.cp-alpha').css({backgroundColor: 'rgb(' + RGBInnerText + ')'}); + $('.cp-alpha-cursor').css({ + transform: t3d + '(' + a + 'px, 0, 0)', + left: !_GPU ? a : '', + borderTopColor : alphaContrast, + borderBottomColor : alphaContrast + }); + _options.doRender && _cache.$element.css({ + backgroundColor : RGBAText, + color: colors.rgbaMixBGMixCustom.luminance > 0.22 ? dark : light + }); + _cache.$element.val(text); + + _options.renderCallback.call( + _colorPicker, _cache.$element, toggled === true); + } + + // export as plugin to jQuery + $.fn.colorPicker = function(options) { + var $that = this, + noop = function(){}; + + options = $.extend({ + animationSpeed: 150, + GPU: true, + doRender: true, + customBG: '#FFF', + opacity: true, + renderCallback: noop, + buidCallback: noop + // css: '', + // cssAddon: '', + // margin: '', + // preventFocus: false + }, options); + + if (!_colorPicker) { // we only want one single instance... + _colorPicker = new ColorPicker(options); + + $document.on('touchstart mousedown pointerdown', function(e) { + if ($.inArray(e.target, $that) === -1 && + !$(e.target).closest(_$UI).length) { + toggle(); + } + }).on('focus', this.selector, toggle); + } + + this.colorPicker = _colorPicker; + + return this.each(function() { + var value = extractValue(this), + mode = value.split('('); + // save initial color mode and set color and bgColor + $(this).data('colorMode', mode[1] ? mode[0].substr(0, 3) : 'HEX'); + options.doRender && $(this).css({'background-color': value, + 'color': function() { + return _color.setColor(value). + rgbaMixBGMixCustom.luminance > 0.22 ? '#222' : '#ddd' + } + }); + }); + }; +})(window.jQuery, Colors); \ No newline at end of file diff --git a/jqColorPicker.js.map b/jqColorPicker.js.map new file mode 100644 index 0000000..4fd645e --- /dev/null +++ b/jqColorPicker.js.map @@ -0,0 +1 @@ +{"version":3,"file":"jqColorPicker.min.js","sources":["colors.js","jqColorPicker.js"],"names":["window","undefined","setColor","colors","color","type","save","alpha","ColorConverter","txt2color","_colors","n","limitValue","_valueRanges","convertColors","saveAsBackground","RGB","rgb","grey","_instance","options","r","g","b","equivalentGrey","Math","round","rgbaMixBlack","mixColors","rgbaMixWhite","luminance","getLuminance","customBG","rgbaMixCustom","colorObj","modes","SAVE","SMART","convert","ranges","RND","mode","from","exceptions","hsl","typ","HEX","RGB2HEX","webSave","getClosestWebColor","webSmart","saveColor","hueRGB","hue2RGB","hsv","h","background","rgbaMixBGMixCustom","WCAG2Ratio","getWCAG2Ratio","luminanceDelta","abs","hueDelta","getHueDelta","RGBLuminance","HUELuminance","convertCallback","val","out","tmp","half","rgb1","rgb2","nominal","max","normalized","div","i","length","pow","topColor","bottomColor","topAlpha","bottomAlpha","newColor","alphaTop","alphaBottom","a","lum1","lum2","ratio","value","min","s","v","l","Colors","this","valueRanges","initInstance","THIS","_options","focusInstance","option","prototype","newCol","setCustomBackground","col","txt","parts","replace","split","values","substr","m","charAt","HEX2rgb","toString","toUpperCase","parseInt","hue","mod","rgb2hsv","chroma","k","hsv2rgb","f","p","q","t","hsv2hsl","rgb2hsl","dependent","hsl2rgb","sv","sextant","fract","vsf","$","extractValue","elm","css","resolveEventType","event","originalEvent","touches","toggle","position","$this","offset","_cache","$element","preventFocus","preventDefault","_$UI","build","left","top","outerHeight","show","animationSpeed","alphaWidth","width","sliderWidth","_color","_animate","render","hide","blur","append","_css","cssAddon","_html","margin","find","opacity","parent","_GPU","GPU","buidCallback","call","_colorPicker","on","pointerdown","appendTo","document","body","e","action","className","elementOrigin","xy_slider","z_slider","$document","_pointerup","pointerup","_pointermove","off","x","pageX","y","pageY","z","toggled","HSL","dark","light","colorMode","data","isAlpha","RGBInnerText","RGBAText","text","HUEContrast","alphaContrast","t3d","backgroundColor","transform","borderColor","borderLeftColor","borderRightColor","borderTopColor","borderBottomColor","doRender","renderCallback","requestAnimationFrame","webkitRequestAnimationFrame","cb","ColorPicker","fn","colorPicker","$that","noop","extend","inArray","target","closest","selector","each","background-color","jQuery"],"mappings":"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"} \ No newline at end of file diff --git a/jqColorPicker.min.js b/jqColorPicker.min.js new file mode 100644 index 0000000..b818c97 --- /dev/null +++ b/jqColorPicker.min.js @@ -0,0 +1,4 @@ +/*! tiny colorPicker - v1.0.0 2015-02-02 */ +!function(a,b){"use strict";function c(a,c,d,f,g){if("string"==typeof c){var c=t.txt2color(c);d=c.type,n[d]=c[d],g=g!==b?g:c.alpha}else if(c)for(var h in c)a[d][h]=k(c[h]/l[d][h][1],0,1);return g!==b&&(a.alpha=+g),e(d,f?a:b)}function d(a,b,c){var d=m.options.grey,e={};return e.RGB={r:a.r,g:a.g,b:a.b},e.rgb={r:b.r,g:b.g,b:b.b},e.alpha=c,e.equivalentGrey=Math.round(d.r*a.r+d.g*a.g+d.b*a.b),e.rgbaMixBlack=i(b,{r:0,g:0,b:0},c,1),e.rgbaMixWhite=i(b,{r:1,g:1,b:1},c,1),e.rgbaMixBlack.luminance=h(e.rgbaMixBlack,!0),e.rgbaMixWhite.luminance=h(e.rgbaMixWhite,!0),m.options.customBG&&(e.rgbaMixCustom=i(b,m.options.customBG,c,1),e.rgbaMixCustom.luminance=h(e.rgbaMixCustom,!0),m.options.customBG.luminance=h(m.options.customBG,!0)),e}function e(a,b){var c,e,k,o=b||n,p=t,q=m.options,r=l,s=o.RND,u="",v="",w={hsl:"hsv",rgb:a},x=s.rgb;if("alpha"!==a){for(var y in r)if(!r[y][y]){a!==y&&(v=w[y]||"rgb",o[y]=p[v+"2"+y](o[v])),s[y]||(s[y]={}),c=o[y];for(u in c)s[y][u]=Math.round(c[u]*r[y][u][1])}x=s.rgb,o.HEX=p.RGB2HEX(x),o.equivalentGrey=q.grey.r*o.rgb.r+q.grey.g*o.rgb.g+q.grey.b*o.rgb.b,o.webSave=e=f(x,51),o.webSmart=k=f(x,17),o.saveColor=x.r===e.r&&x.g===e.g&&x.b===e.b?"web save":x.r===k.r&&x.g===k.g&&x.b===k.b?"web smart":"",o.hueRGB=t.hue2RGB(o.hsv.h),b&&(o.background=d(x,o.rgb,o.alpha))}var z,A,B,C=o.rgb,D=o.alpha,E="luminance",F=o.background;return z=i(C,{r:0,g:0,b:0},D,1),z[E]=h(z,!0),o.rgbaMixBlack=z,A=i(C,{r:1,g:1,b:1},D,1),A[E]=h(A,!0),o.rgbaMixWhite=A,q.customBG&&(B=i(C,F.rgbaMixCustom,D,1),B[E]=h(B,!0),B.WCAG2Ratio=j(B[E],F.rgbaMixCustom[E]),o.rgbaMixBGMixCustom=B,B.luminanceDelta=Math.abs(B[E]-F.rgbaMixCustom[E]),B.hueDelta=g(F.rgbaMixCustom,B,!0)),o.RGBLuminance=h(x),o.HUELuminance=h(o.hueRGB),q.convertCallback&&q.convertCallback(o,a),o}function f(a,b){var c={},d=0,e=b/2;for(var f in a)d=a[f]%b,c[f]=a[f]+(d>e?b-d:-d);return c}function g(a,b,c){return(Math.max(a.r-b.r,b.r-a.r)+Math.max(a.g-b.g,b.g-a.g)+Math.max(a.b-b.b,b.b-a.b))*(c?255:1)/765}function h(a,b){for(var c=b?1:255,d=[a.r/c,a.g/c,a.b/c],e=m.options.luminance,f=d.length;f--;)d[f]=d[f]<=.03928?d[f]/12.92:Math.pow((d[f]+.055)/1.055,2.4);return e.r*d[0]+e.g*d[1]+e.b*d[2]}function i(a,c,d,e){var f={},g=d!==b?d:1,h=e!==b?e:1,i=g+h*(1-g);for(var j in a)f[j]=(a[j]*g+c[j]*h*(1-g))/i;return f.a=i,f}function j(a,b){var c=1;return c=a>=b?(a+.05)/(b+.05):(b+.05)/(a+.05),Math.round(100*c)/100}function k(a,b,c){return a>c?c:b>a?b:a}var l={rgb:{r:[0,255],g:[0,255],b:[0,255]},hsv:{h:[0,360],s:[0,100],v:[0,100]},hsl:{h:[0,360],s:[0,100],l:[0,100]},alpha:{alpha:[0,1]},HEX:{HEX:[0,16777215]}},m={},n={},o={r:.298954,g:.586434,b:.114612},p={r:.2126,g:.7152,b:.0722},q=a.Colors=function(a){this.colors={RND:{}},this.options={color:"rgba(204, 82, 37, 0.8)",grey:o,luminance:p,valueRanges:l},r(this,a||{})},r=function(a,d){var e,f=a.options;s(a);for(var g in d)d[g]!==b&&(f[g]=d[g]);e=f.customBG,f.customBG="string"==typeof e?t.txt2color(e).rgb:e,n=c(a.colors,f.color,b,!0)},s=function(a){m!==a&&(m=a,n=a.colors)};q.prototype.setColor=function(a,d,f){return s(this),a?c(this.colors,a,d,b,f):(f!==b&&(this.colors.alpha=f),e(d))},q.prototype.setCustomBackground=function(a){return s(this),this.options.customBG="string"==typeof a?t.txt2color(a).rgb:a,c(this.colors,b,"rgb")},q.prototype.saveAsBackground=function(){return s(this),c(this.colors,b,"rgb",!0)};var t={txt2color:function(a){var b={},c=a.replace(/(?:#|\)|%)/g,"").split("("),d=(c[1]||"").split(/,\s*/),e=c[1]?c[0].substr(0,3):"rgb",f="";if(b.type=e,b[e]={},c[1])for(var g=3;g--;)f=e[g]||e.charAt(g),b[e][f]=+d[g]/l[e][f][1];else b.rgb=t.HEX2rgb(c[0]);return b.alpha=d[3]?+d[3]:1,b},RGB2HEX:function(a){return((a.r<16?"0":"")+a.r.toString(16)+(a.g<16?"0":"")+a.g.toString(16)+(a.b<16?"0":"")+a.b.toString(16)).toUpperCase()},HEX2rgb:function(a){return a=a.split(""),{r:parseInt(a[0]+a[a[3]?1:0],16)/255,g:parseInt(a[a[3]?2:1]+(a[3]||a[1]),16)/255,b:parseInt((a[4]||a[2])+(a[5]||a[2]),16)/255}},hue2RGB:function(a){var b=6*a,c=~~b%6,d=6===b?0:b-c;return{r:Math.round(255*[1,1-d,0,0,d,1][c]),g:Math.round(255*[d,1,1,1-d,0,0][c]),b:Math.round(255*[0,0,d,1,1,1-d][c])}},rgb2hsv:function(a){var b,c,d,e=a.r,f=a.g,g=a.b,h=0;return g>f&&(f=g+(g=f,0),h=-1),c=g,f>e&&(e=f+(f=e,0),h=-2/6-h,c=Math.min(f,g)),b=e-c,d=e?b/e:0,{h:1e-15>d?n&&n.hsl&&n.hsl.h||0:b?Math.abs(h+(f-g)/(6*b)):0,s:e?b/e:n&&n.hsv&&n.hsv.s||0,v:e}},hsv2rgb:function(a){var b=6*a.h,c=a.s,d=a.v,e=~~b,f=b-e,g=d*(1-c),h=d*(1-f*c),i=d*(1-(1-f)*c),j=e%6;return{r:[d,h,g,g,i,d][j],g:[i,d,d,h,g,g][j],b:[g,g,i,d,d,h][j]}},hsv2hsl:function(a){var b=(2-a.s)*a.v,c=a.s*a.v;return c=a.s?1>b?b?c/b:0:c/(2-b):0,{h:a.h,s:a.v||c?c:n&&n.hsl&&n.hsl.s||0,l:b/2}},rgb2hsl:function(a,b){var c=t.rgb2hsv(a);return t.hsv2hsl(b?c:n.hsv=c)},hsl2rgb:function(a){var b=6*a.h,c=a.s,d=a.l,e=.5>d?d*(1+c):d+c-c*d,f=d+d-e,g=e?(e-f)/e:0,h=~~b,i=b-h,j=e*g*i,k=f+j,l=e-j,m=h%6;return{r:[e,l,f,f,k,e][m],g:[k,e,e,l,f,f][m],b:[f,f,k,e,e,l][m]}}}}(window); +!function(a,b){"use strict";function c(b){return b.value||a(b).css("background-color")||"#fff"}function d(a){return a.originalEvent.touches?a.originalEvent.touches[0]:a}function e(b){var d,e=a(this);b?(d=e.offset(),r.$element=e,o.preventFocus&&b.preventDefault(),(p||f()).css({left:d.left,top:d.top+e.outerHeight(!0)}).show(o.animationSpeed,function(){r.alphaWidth=a(".cp-alpha",p).width(),r.sliderWidth=a(".cp-xy-slider",p).width(),n.setColor(c(e[0])),v(function(){l(!0)})})):a(p).hide(o.animationSpeed,function(){r.$element.blur()})}function f(){return a("head").append('"),p=a(w).css({margin:o.margin}).find(".cp-alpha").toggle(!!o.opacity).parent().show(0,function(){u=o.GPU&&""===a(this).css("transform"),o.buidCallback.call(m,a(this))}).hide().on("touchstart mousedown pointerdown",".cp-xy-slider,.cp-z-slider,.cp-alpha",g).appendTo(document.body)}function g(b){var c=this.className.replace("cp-","").replace("-","_");b.preventDefault(),r.elementOrigin=a(this).offset(),(c="xy_slider"===c?i:"z_slider"===c?j:k)(b),q.on(t,h).on(s,c)}function h(){q.off(s).off(t)}function i(a){var b=d(a),c=b.pageX-r.elementOrigin.left,e=b.pageY-r.elementOrigin.top;n.setColor({s:c/r.sliderWidth*100,v:100-e/r.sliderWidth*100},"hsv"),v(l)}function j(a){{var b=d(a).pageY-r.elementOrigin.top;n.colors.hsv}n.setColor({h:360-b/r.sliderWidth*360},"hsv"),v(l)}function k(a){var b=d(a).pageX-r.elementOrigin.left,c=b/r.alphaWidth;n.setColor({},"rgb",c>1?1:0>c?0:c),v(l)}function l(b){var c=n.colors,d=c.hueRGB,e=c.RND.rgb,f=c.RND.hsl,g="#222",h="#ddd",i=r.$element.data("colorMode"),j=1!==c.alpha,k=Math.round(100*c.alpha)/100,l=e.r+", "+e.g+", "+e.b,p="rgba("+l+", "+k+")",q="HEX"!==i||j?"rgb"===i||"HEX"===i&&j?j?p:"rgb("+l+")":"hsl"+(j?"a(":"(")+f.h+", "+f.s+"%, "+f.l+"%"+(j?", "+k:"")+")":"#"+c.HEX,s=c.HUELuminance>.22?g:h,t=c.rgbaMixBlack.luminance>.22?g:h,v=(1-c.hsv.h)*r.sliderWidth,w=c.hsv.s*r.sliderWidth,x=(1-c.hsv.v)*r.sliderWidth,y=k*r.alphaWidth,z=u?"translate3d":"";a(".cp-xy-slider").css({backgroundColor:"rgb("+d.r+","+d.g+","+d.b+")"}),a(".cp-xy-cursor").css({transform:z+"("+w+"px, "+x+"px, 0)",left:u?"":w,top:u?"":x,borderColor:c.RGBLuminance>.22?g:h}),a(".cp-z-cursor").css({transform:z+"(0, "+v+"px, 0)",top:u?"":v,borderLeftColor:s,borderRightColor:s}),a(".cp-alpha").css({backgroundColor:"rgb("+l+")"}),a(".cp-alpha-cursor").css({transform:z+"("+y+"px, 0, 0)",left:u?"":y,borderTopColor:t,borderBottomColor:t}),o.doRender&&r.$element.css({backgroundColor:p,color:c.rgbaMixBGMixCustom.luminance>.22?g:h}),r.$element.val(q),o.renderCallback.call(m,r.$element,b===!0)}var m,n,o,p,q=a(document),r={},s="touchmove mousemove pointermove",t="touchend mouseup pointerup",u=!1,v=window.requestAnimationFrame||window.webkitRequestAnimationFrame||function(a){a()},w='
',x=".cp-color-picker{position:absolute;overflow:hidden;padding:6px 6px 0;background-color:#444;color:#bbb;font-family:Arial,Helvetica,sans-serif;font-size:12px;font-weight:400;cursor:default;border-radius:5px}.cp-color-picker>div{position:relative;overflow:hidden}.cp-xy-slider{float:left;height:128px;width:128px;margin-bottom:6px;background:linear-gradient(to right,rgba(255,255,255,1)0,rgba(255,255,255,0)100%)}.cp-white{height:100%;width:100%;background:linear-gradient(to bottom,rgba(0,0,0,0)0,rgba(0,0,0,1)100%)}.cp-xy-cursor{position:absolute;top:0;width:10px;height:10px;margin:-5px;border:1px solid #fff;border-radius:100%;box-sizing:border-box}.cp-z-slider{float:right;margin-left:6px;height:128px;width:20px;background:linear-gradient(to bottom,red 0,#f0f 17%,#00f 33%,#0ff 50%,#0f0 67%,#ff0 83%,red 100%)}.cp-z-cursor{position:absolute;margin-top:-4px;width:100%;border:4px solid #fff;border-color:transparent #fff;box-sizing:border-box}.cp-alpha{clear:left;width:100%;height:16px;margin:6px 0;background:linear-gradient(to right,rgba(68,68,68,1)0,rgba(0,0,0,0)100%)}.cp-alpha-cursor{position:absolute;margin-left:-4px;height:100%;border:4px solid #fff;border-color:#fff transparent;box-sizing:border-box}",y=function(a){n=this.color=new b(a),o=n.options};y.prototype.render=l,a.fn.colorPicker=function(b){var d=this,f=function(){};return b=a.extend({animationSpeed:150,GPU:!0,doRender:!0,customBG:"#FFF",opacity:!0,renderCallback:f,buidCallback:f},b),m||(m=new y(b),q.on("touchstart mousedown pointerdown",function(b){-1!==a.inArray(b.target,d)||a(b.target).closest(p).length||e()}).on("focus",this.selector,e)),this.colorPicker=m,this.each(function(){var d=c(this),e=d.split("(");a(this).data("colorMode",e[1]?e[0].substr(0,3):"HEX"),b.doRender&&a(this).css({"background-color":d,color:function(){return n.setColor(d).rgbaMixBGMixCustom.luminance>.22?"#222":"#ddd"}})})}}(window.jQuery,Colors); +//# sourceMappingURL=jqColorPicker.js.map \ No newline at end of file diff --git a/package.json b/package.json new file mode 100644 index 0000000..4bb9cb0 --- /dev/null +++ b/package.json @@ -0,0 +1,12 @@ +{ + "name": "tiny colorPicker", + "version": "1.0.0", + "repository": { + "type": "git", + "url": "http://github.com/PitPik/tinyColorPicker.git" + }, + "devDependencies": { + "grunt": "^0.4.5", + "grunt-contrib-uglify": "^0.5.1" + } +}