Rename Color#toCssString() to #toCss(), and only include alpha if its < 1.

This commit is contained in:
Jürg Lehni 2012-12-01 12:31:22 -08:00
parent d16155f4fe
commit f268c6e152
4 changed files with 18 additions and 16 deletions

View file

@ -371,7 +371,7 @@ var Color = this.Color = Base.extend(new function() {
* Called by various setters whenever a color value changes * Called by various setters whenever a color value changes
*/ */
_changed: function() { _changed: function() {
this._cssString = null; this._css = null;
if (this._owner) if (this._owner)
this._owner._changed(/*#=*/ Change.STYLE); this._owner._changed(/*#=*/ Change.STYLE);
}, },
@ -477,23 +477,25 @@ var Color = this.Color = Base.extend(new function() {
/** /**
* @return {String} A css string representation of the color. * @return {String} A css string representation of the color.
*/ */
toCssString: function() { toCss: function() {
if (!this._cssString) { if (!this._css) {
var color = this.convert('rgb'), var color = this.convert('rgb'),
alpha = color.getAlpha(), alpha = color.getAlpha(),
components = [ components = [
Math.round(color._red * 255), Math.round(color._red * 255),
Math.round(color._green * 255), Math.round(color._green * 255),
Math.round(color._blue * 255), Math.round(color._blue * 255)
alpha != null ? alpha : 1
]; ];
this._cssString = 'rgba(' + components.join(', ') + ')'; if (alpha != null && alpha < 1)
components.push(alpha);
this._css = (components.length == 4 ? 'rgba(' : 'rgb(')
+ components.join(', ') + ')';
} }
return this._cssString; return this._css;
}, },
getCanvasStyle: function() { getCanvasStyle: function() {
return this.toCssString(); return this.toCss();
} }
/** /**

View file

@ -238,7 +238,7 @@ var GradientColor = this.GradientColor = Color.extend(/** @lends GradientColor#
} }
for (var i = 0, l = this.gradient._stops.length; i < l; i++) { for (var i = 0, l = this.gradient._stops.length; i < l; i++) {
var stop = this.gradient._stops[i]; var stop = this.gradient._stops[i];
gradient.addColorStop(stop._rampPoint, stop._color.toCssString()); gradient.addColorStop(stop._rampPoint, stop._color.toCss());
} }
return gradient; return gradient;
}, },

View file

@ -344,7 +344,7 @@ new function() {
attrs[entry.attribute] = value == null attrs[entry.attribute] = value == null
? 'none' ? 'none'
: entry.type === 'color' : entry.type === 'color'
? value.toCssString() ? value.toCss()
: entry.type === 'array' : entry.type === 'array'
? value.join(',') ? value.join(',')
: entry.type === 'number' : entry.type === 'number'

View file

@ -20,38 +20,38 @@ test('Set named color', function() {
var path = new Path(); var path = new Path();
path.fillColor = 'red'; path.fillColor = 'red';
compareRgbColors(path.fillColor, new RgbColor(1, 0, 0)); compareRgbColors(path.fillColor, new RgbColor(1, 0, 0));
equals(path.fillColor.toCssString(), 'rgba(255, 0, 0, 1)'); equals(path.fillColor.toCss(), 'rgb(255, 0, 0)');
}); });
test('Set color to hex', function() { test('Set color to hex', function() {
var path = new Path(); var path = new Path();
path.fillColor = '#ff0000'; path.fillColor = '#ff0000';
compareRgbColors(path.fillColor, new RgbColor(1, 0, 0)); compareRgbColors(path.fillColor, new RgbColor(1, 0, 0));
equals(path.fillColor.toCssString(), 'rgba(255, 0, 0, 1)'); equals(path.fillColor.toCss(), 'rgb(255, 0, 0)');
var path = new Path(); var path = new Path();
path.fillColor = '#f00'; path.fillColor = '#f00';
compareRgbColors(path.fillColor, new RgbColor(1, 0, 0)); compareRgbColors(path.fillColor, new RgbColor(1, 0, 0));
equals(path.fillColor.toCssString(), 'rgba(255, 0, 0, 1)'); equals(path.fillColor.toCss(), 'rgb(255, 0, 0)');
}); });
test('Set color to object', function() { test('Set color to object', function() {
var path = new Path(); var path = new Path();
path.fillColor = { red: 1, green: 0, blue: 1}; path.fillColor = { red: 1, green: 0, blue: 1};
compareRgbColors(path.fillColor, new RgbColor(1, 0, 1)); compareRgbColors(path.fillColor, new RgbColor(1, 0, 1));
equals(path.fillColor.toCssString(), 'rgba(255, 0, 255, 1)'); equals(path.fillColor.toCss(), 'rgb(255, 0, 255)');
var path = new Path(); var path = new Path();
path.fillColor = { gray: 0.2 }; path.fillColor = { gray: 0.2 };
compareRgbColors(path.fillColor, new RgbColor(0.8, 0.8, 0.8)); compareRgbColors(path.fillColor, new RgbColor(0.8, 0.8, 0.8));
equals(path.fillColor.toCssString(), 'rgba(204, 204, 204, 1)'); equals(path.fillColor.toCss(), 'rgb(204, 204, 204)');
}); });
test('Set color to array', function() { test('Set color to array', function() {
var path = new Path(); var path = new Path();
path.fillColor = [1, 0, 0]; path.fillColor = [1, 0, 0];
compareRgbColors(path.fillColor, new RgbColor(1, 0, 0)); compareRgbColors(path.fillColor, new RgbColor(1, 0, 0));
equals(path.fillColor.toCssString(), 'rgba(255, 0, 0, 1)'); equals(path.fillColor.toCss(), 'rgb(255, 0, 0)');
}); });
test('Creating colors', function() { test('Creating colors', function() {