2011-07-01 06:17:45 -04:00
|
|
|
/*
|
2013-01-28 21:03:27 -05:00
|
|
|
* Paper.js - The Swiss Army Knife of Vector Graphics Scripting.
|
2011-07-01 06:17:45 -04:00
|
|
|
* http://paperjs.org/
|
|
|
|
*
|
2014-01-03 19:47:16 -05:00
|
|
|
* Copyright (c) 2011 - 2014, Juerg Lehni & Jonathan Puckey
|
|
|
|
* http://scratchdisk.com/ & http://jonathanpuckey.com/
|
2011-07-01 06:17:45 -04:00
|
|
|
*
|
|
|
|
* Distributed under the MIT license. See LICENSE file for details.
|
|
|
|
*
|
|
|
|
* All rights reserved.
|
|
|
|
*/
|
|
|
|
|
2011-03-08 20:25:50 -05:00
|
|
|
module('Color');
|
2011-02-19 10:48:59 -05:00
|
|
|
|
|
|
|
test('Set named color', function() {
|
|
|
|
var path = new Path();
|
|
|
|
path.fillColor = 'red';
|
2013-04-08 03:19:47 -04:00
|
|
|
compareColors(path.fillColor, new Color(1, 0, 0));
|
2013-06-18 18:59:28 -04:00
|
|
|
equals(path.fillColor.toCSS(), 'rgb(255,0,0)');
|
2011-02-19 10:48:59 -05:00
|
|
|
});
|
|
|
|
|
|
|
|
test('Set color to hex', function() {
|
|
|
|
var path = new Path();
|
|
|
|
path.fillColor = '#ff0000';
|
2013-04-08 03:19:47 -04:00
|
|
|
compareColors(path.fillColor, new Color(1, 0, 0));
|
2013-06-18 18:59:28 -04:00
|
|
|
equals(path.fillColor.toCSS(), 'rgb(255,0,0)');
|
2011-02-19 10:48:59 -05:00
|
|
|
|
|
|
|
var path = new Path();
|
|
|
|
path.fillColor = '#f00';
|
2013-04-08 03:19:47 -04:00
|
|
|
compareColors(path.fillColor, new Color(1, 0, 0));
|
2013-06-18 18:59:28 -04:00
|
|
|
equals(path.fillColor.toCSS(), 'rgb(255,0,0)');
|
2011-02-19 10:48:59 -05:00
|
|
|
});
|
|
|
|
|
|
|
|
test('Set color to object', function() {
|
|
|
|
var path = new Path();
|
|
|
|
path.fillColor = { red: 1, green: 0, blue: 1};
|
2013-04-08 03:19:47 -04:00
|
|
|
compareColors(path.fillColor, new Color(1, 0, 1));
|
2013-06-18 18:59:28 -04:00
|
|
|
equals(path.fillColor.toCSS(), 'rgb(255,0,255)');
|
2011-02-19 10:48:59 -05:00
|
|
|
|
|
|
|
var path = new Path();
|
|
|
|
path.fillColor = { gray: 0.2 };
|
2013-04-08 03:19:47 -04:00
|
|
|
compareColors(path.fillColor, new Color(0.2));
|
2013-06-18 18:59:28 -04:00
|
|
|
equals(path.fillColor.toCSS(), 'rgb(51,51,51)');
|
2011-02-19 10:48:59 -05:00
|
|
|
});
|
|
|
|
|
|
|
|
test('Set color to array', function() {
|
|
|
|
var path = new Path();
|
|
|
|
path.fillColor = [1, 0, 0];
|
2013-04-08 03:19:47 -04:00
|
|
|
compareColors(path.fillColor, new Color(1, 0, 0));
|
2013-06-18 18:59:28 -04:00
|
|
|
equals(path.fillColor.toCSS(), 'rgb(255,0,0)');
|
2011-02-19 10:48:59 -05:00
|
|
|
});
|
|
|
|
|
2013-04-08 23:57:17 -04:00
|
|
|
test('Creating Colors', function() {
|
2014-01-04 12:16:52 -05:00
|
|
|
compareColors(new Color(), new Color(0, 0, 0),
|
|
|
|
'Color with no arguments should be black');
|
|
|
|
|
|
|
|
compareColors(new Color('black'), new Color(0, 0, 0),
|
|
|
|
'Color from name (black)');
|
|
|
|
|
|
|
|
compareColors(new Color('red'), new Color(1, 0, 0),
|
|
|
|
'Color from name (red)');
|
2011-07-07 10:09:02 -04:00
|
|
|
|
2013-04-08 03:19:47 -04:00
|
|
|
compareColors(new Color('#ff0000'), new Color(1, 0, 0),
|
|
|
|
'Color from hex code');
|
2011-07-07 10:09:02 -04:00
|
|
|
|
2013-11-23 18:02:13 -05:00
|
|
|
compareColors(new Color('rgb(255, 0, 0)'), new Color(1, 0, 0),
|
|
|
|
'Color from RGB code');
|
|
|
|
|
|
|
|
compareColors(new Color('rgba(255, 0, 0, 0.5)'), new Color(1, 0, 0, 0.5),
|
|
|
|
'Color from RGBA code');
|
|
|
|
|
2013-04-08 03:19:47 -04:00
|
|
|
compareColors(new Color({ red: 1, green: 0, blue: 1}),
|
|
|
|
new Color(1, 0, 1), 'Color from rgb object literal');
|
2011-03-08 20:25:50 -05:00
|
|
|
|
2013-04-08 03:19:47 -04:00
|
|
|
compareColors(new Color({ gray: 0.2 }),
|
2013-04-08 10:07:41 -04:00
|
|
|
new Color(0.2), 'Color from gray object literal');
|
2011-03-08 20:25:50 -05:00
|
|
|
|
2013-04-08 03:19:47 -04:00
|
|
|
compareColors(new Color({ hue: 0, saturation: 1, brightness: 1}),
|
|
|
|
new Color(1, 0, 0).convert('hsb'), 'Color from hsb object literal');
|
2011-03-08 20:25:50 -05:00
|
|
|
|
2013-04-08 03:19:47 -04:00
|
|
|
compareColors(new Color([1, 0, 0]), new Color(1, 0, 0),
|
2013-04-23 10:29:30 -04:00
|
|
|
'RGB Color from array');
|
2011-07-07 10:09:02 -04:00
|
|
|
|
2013-04-08 03:19:47 -04:00
|
|
|
compareColors(new Color([1]), new Color(1),
|
|
|
|
'Gray Color from array');
|
2011-03-08 20:25:50 -05:00
|
|
|
});
|
|
|
|
|
2013-04-08 23:57:17 -04:00
|
|
|
test('Deprecated Colors Constructors', function() {
|
|
|
|
|
2013-07-02 10:53:58 -04:00
|
|
|
compareColors(new paper.RgbColor('#ff0000'), new Color(1, 0, 0),
|
2013-04-08 23:57:17 -04:00
|
|
|
'Color from hex code');
|
|
|
|
|
2013-07-02 10:53:58 -04:00
|
|
|
compareColors(new paper.RgbColor(1, 0, 1),
|
2013-04-08 23:57:17 -04:00
|
|
|
new Color(1, 0, 1), 'Color from rgb object literal');
|
|
|
|
|
2013-07-02 10:53:58 -04:00
|
|
|
compareColors(new paper.GrayColor(0.2),
|
2013-04-08 23:57:17 -04:00
|
|
|
new Color(0.2), 'Color from gray object literal');
|
|
|
|
|
2013-07-02 10:53:58 -04:00
|
|
|
compareColors(new paper.HsbColor(0, 1, 1),
|
2013-04-08 23:57:17 -04:00
|
|
|
new Color(1, 0, 0).convert('hsb'), 'Color from hsb object literal');
|
|
|
|
|
2013-07-02 10:53:58 -04:00
|
|
|
compareColors(new paper.RgbColor([1, 0, 0]), new Color(1, 0, 0),
|
2013-04-08 23:57:17 -04:00
|
|
|
'Rgb Color from array');
|
|
|
|
|
2013-07-02 10:53:58 -04:00
|
|
|
compareColors(new paper.GrayColor([1]), new Color(1),
|
2013-04-08 23:57:17 -04:00
|
|
|
'Gray Color from array');
|
|
|
|
});
|
|
|
|
|
2013-04-08 03:19:47 -04:00
|
|
|
test('Get gray from RGB Color', function() {
|
2013-04-07 13:03:51 -04:00
|
|
|
var color = new Color(1, 0.5, 0.2);
|
2013-04-08 23:20:47 -04:00
|
|
|
compareNumbers(color.gray, 0.6152);
|
2011-02-19 10:48:59 -05:00
|
|
|
|
2013-04-07 13:03:51 -04:00
|
|
|
var color = new Color(0.5, 0.2, 0.1);
|
2013-04-08 23:20:47 -04:00
|
|
|
compareNumbers(color.gray, 0.27825);
|
2011-02-19 10:48:59 -05:00
|
|
|
});
|
|
|
|
|
2013-04-08 03:19:47 -04:00
|
|
|
test('Get gray from HSB Color', function() {
|
2013-04-08 23:57:17 -04:00
|
|
|
var color = new Color({hue: 0, saturation: 0, brightness: 0.2 });
|
2013-04-08 23:20:47 -04:00
|
|
|
compareNumbers(color.gray, 0.19998);
|
2011-03-08 20:25:50 -05:00
|
|
|
});
|
|
|
|
|
2013-04-08 03:19:47 -04:00
|
|
|
test('Get red from HSB Color', function() {
|
2013-04-08 23:57:17 -04:00
|
|
|
var color = new Color({hue: 0, saturation: 1, brightness: 1 });
|
2011-03-08 20:25:50 -05:00
|
|
|
compareNumbers(color.red, 1);
|
|
|
|
});
|
|
|
|
|
2013-04-08 03:19:47 -04:00
|
|
|
test('Get hue from RGB Color', function() {
|
2013-04-07 13:03:51 -04:00
|
|
|
var color = new Color(1, 0, 0);
|
2011-03-08 20:25:50 -05:00
|
|
|
compareNumbers(color.hue, 0);
|
2011-07-07 10:09:02 -04:00
|
|
|
compareNumbers(color.saturation, 1);
|
2011-03-08 20:25:50 -05:00
|
|
|
});
|
|
|
|
|
2011-02-19 10:48:59 -05:00
|
|
|
test('Gray Color', function() {
|
2013-04-08 03:19:47 -04:00
|
|
|
var color = new Color(1);
|
2013-04-08 23:20:47 -04:00
|
|
|
compareNumbers(color.gray, 1, 'color.gray');
|
|
|
|
compareNumbers(color.red, 1, 'color.red');
|
|
|
|
compareNumbers(color.blue, 1, 'color.blue');
|
2011-07-07 10:09:02 -04:00
|
|
|
|
2011-02-19 10:48:59 -05:00
|
|
|
color.red = 0.5;
|
2013-04-08 23:20:47 -04:00
|
|
|
compareNumbers(color.gray, 0.85045, 'color.gray');
|
2011-02-19 10:48:59 -05:00
|
|
|
|
|
|
|
color.green = 0.2;
|
2013-04-08 03:19:47 -04:00
|
|
|
|
2013-04-08 23:20:47 -04:00
|
|
|
compareNumbers(color.red, 0.5, 'color.red');
|
|
|
|
compareNumbers(color.green, 0.2, 'color.green');
|
|
|
|
compareNumbers(color.blue, 1, 'color.blue');
|
2013-04-08 03:19:47 -04:00
|
|
|
|
2013-04-08 23:20:47 -04:00
|
|
|
compareNumbers(color.gray, 0.38085, 'color.gray');
|
2011-02-19 10:48:59 -05:00
|
|
|
});
|
|
|
|
|
|
|
|
test('Converting Colors', function() {
|
2013-04-07 13:03:51 -04:00
|
|
|
var rgbColor = new Color(1, 0.5, 0.2);
|
2013-04-08 23:20:47 -04:00
|
|
|
compareNumbers(rgbColor.gray, 0.6152);
|
2013-04-08 03:19:47 -04:00
|
|
|
var grayColor = new Color(0.2);
|
2013-04-08 23:20:47 -04:00
|
|
|
compareColors(grayColor.convert('rgb'), new Color(0.2, 0.2, 0.2));
|
|
|
|
compareColors(grayColor.convert('hsb'), { hue: 0, saturation: 0, brightness: 0.2 });
|
2013-04-08 03:19:47 -04:00
|
|
|
compareColors(new Color(1, 0, 0).convert('hsb'), { hue: 0, saturation: 1, brightness: 1 });
|
2011-02-24 07:00:46 -05:00
|
|
|
});
|
|
|
|
|
2013-04-08 03:19:47 -04:00
|
|
|
test('Setting Color#gray', function() {
|
2013-04-07 13:03:51 -04:00
|
|
|
var color = new Color(1, 0.5, 0.2);
|
2011-02-24 07:00:46 -05:00
|
|
|
color.gray = 0.1;
|
2013-04-08 03:19:47 -04:00
|
|
|
compareColors(color, new Color(0.1));
|
2011-03-08 20:25:50 -05:00
|
|
|
});
|
|
|
|
|
2013-04-08 03:19:47 -04:00
|
|
|
test('Setting Color#red', function() {
|
|
|
|
var color = new Color({ hue: 180, saturation: 0, brightness: 0 });
|
2011-03-08 20:25:50 -05:00
|
|
|
color.red = 1;
|
2013-04-08 10:07:41 -04:00
|
|
|
compareColors(color, new Color(1, 0, 0));
|
2011-03-08 20:25:50 -05:00
|
|
|
});
|
|
|
|
|
2013-04-08 03:19:47 -04:00
|
|
|
test('Setting Color#gray', function() {
|
|
|
|
var color = new Color({ hue: 180, saturation: 0, brightness: 0 });
|
2011-03-08 20:25:50 -05:00
|
|
|
color.gray = 0.5;
|
2013-04-08 03:19:47 -04:00
|
|
|
compareColors(color, new Color(0.5));
|
2011-05-15 08:11:35 -04:00
|
|
|
});
|
|
|
|
|
|
|
|
test('Color.read(channels)', function() {
|
|
|
|
var color = Color.read([0, 0, 1]);
|
2013-04-08 03:19:47 -04:00
|
|
|
compareColors(color, new Color(0, 0, 1));
|
2011-05-21 07:34:27 -04:00
|
|
|
});
|
|
|
|
|
|
|
|
test('Cloning colors', function() {
|
2013-04-07 13:03:51 -04:00
|
|
|
var color = new Color(0, 0, 0);
|
2011-05-21 07:34:27 -04:00
|
|
|
equals(function() {
|
|
|
|
return color.clone() != color;
|
|
|
|
}, true);
|
|
|
|
|
|
|
|
equals(function() {
|
2013-04-07 13:03:51 -04:00
|
|
|
return new Color(color) != color;
|
2011-05-21 07:34:27 -04:00
|
|
|
}, true);
|
2011-05-21 11:25:05 -04:00
|
|
|
});
|
|
|
|
|
|
|
|
test('Color#convert', function() {
|
2013-04-07 13:03:51 -04:00
|
|
|
var color = new Color(0, 0, 0);
|
2011-05-21 11:25:05 -04:00
|
|
|
var converted = color.convert('rgb');
|
|
|
|
equals(function() {
|
|
|
|
return converted !== color;
|
|
|
|
}, true);
|
|
|
|
equals(function() {
|
2011-05-21 15:02:06 -04:00
|
|
|
return converted.equals(color);
|
2011-05-21 11:25:05 -04:00
|
|
|
}, true);
|
2011-08-13 09:25:29 -04:00
|
|
|
});
|
|
|
|
|
|
|
|
test('Saturation from black rgb', function() {
|
|
|
|
equals(function() {
|
2013-04-08 03:19:47 -04:00
|
|
|
return new Color(0, 0, 0).saturation === 0;
|
2011-08-13 09:25:29 -04:00
|
|
|
}, true);
|
2013-06-28 10:19:53 -04:00
|
|
|
});
|
|
|
|
|
|
|
|
test('Color#add', function() {
|
|
|
|
var color = new Color(0, 1, 1);
|
|
|
|
compareColors(color.add([1, 0, 0]), [1, 1, 1]);
|
2014-01-04 12:16:52 -05:00
|
|
|
compareColors(color.add([1, 0.5, 0]), [1, 1.5, 1]);
|
2013-06-28 10:19:53 -04:00
|
|
|
var color = new Color(0, 0.5, 0);
|
|
|
|
compareColors(color.add(0.5), [0.5, 1, 0.5]);
|
|
|
|
});
|
|
|
|
|
|
|
|
test('Color#subtract', function() {
|
|
|
|
var color = new Color(0, 1, 1);
|
|
|
|
compareColors(color.subtract([0, 1, 1]), [0, 0, 0]);
|
|
|
|
compareColors(color.subtract([0, 0.5, 1]), [0, 0.5, 0]);
|
|
|
|
var color = new Color(1, 1, 1);
|
|
|
|
compareColors(color.subtract(0.5), [0.5, 0.5, 0.5]);
|
|
|
|
});
|
|
|
|
|
|
|
|
test('Color#multiply', function() {
|
|
|
|
var color = new Color(1, 0.5, 0.25);
|
|
|
|
compareColors(color.multiply([0.25, 0.5, 1]), [0.25, 0.25, 0.25]);
|
|
|
|
var color = new Color(1, 1, 1);
|
|
|
|
compareColors(color.multiply(0.5), [0.5, 0.5, 0.5]);
|
2013-06-28 10:59:33 -04:00
|
|
|
var color = new Color(0.5, 0.5, 0.5);
|
|
|
|
compareColors(color.multiply(2), [1, 1, 1]);
|
2013-06-28 10:19:53 -04:00
|
|
|
});
|
|
|
|
|
2013-06-28 10:59:33 -04:00
|
|
|
test('Color#divide', function() {
|
|
|
|
var color = new Color(1, 1, 1);
|
|
|
|
compareColors(color.divide([1, 2, 4]), [1, 0.5, 0.25]);
|
|
|
|
var color = new Color(1, 0.5, 0.25);
|
2014-01-04 12:16:52 -05:00
|
|
|
compareColors(color.divide(0.25), [4, 2, 1]);
|
2013-06-28 10:59:33 -04:00
|
|
|
var color = new Color(1, 1, 1);
|
|
|
|
compareColors(color.divide(4), [0.25, 0.25, 0.25]);
|
|
|
|
});
|
2013-06-28 10:19:53 -04:00
|
|
|
|
|
|
|
|
|
|
|
|