Netsyms/colorPicker
2
0
Fork 0
mirror of https://github.com/PitPik/colorPicker.git synced 2025-09-09 01:02:36 -06:00
Code Issues Releases Wiki Activity

small (V8) optimization

Browse Source
This commit is contained in:
peterd 2014-08-28 18:50:01 +02:00
parent 5ec93952c2
commit 991e805c61
2 changed files with 23 additions and 11 deletions
Show Stats Download Patch File Download Diff File Expand all files Collapse all files

6
README.md
View File

@ -1,6 +1,6 @@
# colorPicker and colors # colorPicker and colors
An advanced, fast but small **javaScript** (only, framework independent) **color picker** (or color chooser for desktop use) that uses only one javaScript (.js) file (no extra HTML, CSS, images, etc... on IE9+ and internet browsers).<br />ColorPicker works in all browsers incl. IE6+ (an extra CSS has to be made to make it work in IE6 though and some additional setTimeout tricks to make it work in IE5.5)<br /> An advanced, fast but small (46.9KB, 19.9KB gZip) **javaScript** (only, framework independent) **color picker** (or color chooser for desktop use) that uses only one javaScript (.js) file (no extra HTML, CSS, images, etc... on IE9+ and internet browsers).<br />ColorPicker works in all browsers incl. IE6+ (an extra CSS has to be made to make it work in IE6 though and some additional setTimeout tricks to make it work in IE5.5)<br />
**colorPicker.js** uses **colors.js**, a small but comprehensive tool for color conversions / calculations (WCAG 2.0, contrast, color difference, layer mix, etc.)... **colorPicker.js** uses **colors.js**, a small but comprehensive tool for color conversions / calculations (WCAG 2.0, contrast, color difference, layer mix, etc.)...
With **colors.js** (~8.7k or way smaller if other color spaces and complex calculations are taken out...) you can also build your own simpler and / or smaller color pickers quite easy as demonstrated on the [demo page](http://dematte.at/cpn).<br /> With **colors.js** (~8.7k or way smaller if other color spaces and complex calculations are taken out...) you can also build your own simpler and / or smaller color pickers quite easy as demonstrated on the [demo page](http://dematte.at/cpn).<br />
@ -64,7 +64,7 @@ var myColorPicker = new ColorPicker({
grey: ..., // see Colors... grey: ..., // see Colors...
luminance: ..., // see Colors... luminance: ..., // see Colors...
devPicker: false // uses existing HTML instead of internal template for developing devPicker: false // uses existing HTML instead of internal template for developing
renderCallback: // function(colors, mode){}, // callback on after rendering (for further rendering outside colorPicker) renderCallback: function(colors, mode){}, // callback on after rendering (for further rendering outside colorPicker)
actionCallback: function(e, action){}, // callback on any action within colorPicker (buttons, sliders, ...) actionCallback: function(e, action){}, // callback on any action within colorPicker (buttons, sliders, ...)
convertCallback: function(colors, type){}, // see Colors... convertCallback: function(colors, type){}, // see Colors...
}); });
@ -76,7 +76,7 @@ After initializing Color or ColorPicker you'll get a clean but rhich model of th
```javascript ```javascript
myColors: { myColors: {
colors: { all kinds of color values... see late}, colors: { all kinds of color values... see later},
options: { all the options you set or that are set as default... }, options: { all the options you set or that are set as default... },
__proto__: { // all methods Color uses __proto__: { // all methods Color uses
setColor: function(newCol, type, alpha) {}, setColor: function(newCol, type, alpha) {},

28
colorPicker.js
View File

@ -1142,18 +1142,30 @@
return newColor; return newColor;
} }
function color2string(color, type) { // function color2string(color, type) {
var out = [], // var out = [],
n = 0; // n = 0;
type = type || 'rgb'; // type = type || 'rgb';
while (type[n] || type.charAt(n)) { // IE7 // while (type.charAt(n)) { // IE7 // V8 type[n] ||
out.push(color[type[n] || type.charAt(n)]); // out.push(color[type.charAt(n)]);
n++; // n++;
// }
// return type + '(' + out.join(', ') + ')';
// }
function color2string(color, type) { // ~2 x faster on V8
var out = '',
t = (type || 'rgb').split(''),
n = t.length;
for ( ; n--; ) {
out = ', ' + color[t[n]] + out;
} }
return type + '(' + out.join(', ') + ')'; return (type || 'rgb') + '(' + out.substr(2) + ')';
} }
function limitValue(value, min, max) { function limitValue(value, min, max) {
// return Math.max(min, Math.min(max, value)); // faster?? // return Math.max(min, Math.min(max, value)); // faster??
return (value > max ? max : value < min ? min : value); return (value > max ? max : value < min ? min : value);