ashatora/openlayers
1
0
Fork 0
Code Issues Pull Requests Projects Releases Wiki Activity

Named exports from ol/color module

Browse Source
This commit is contained in:
Marc Jansen
2017-12-19 13:56:54 +01:00
parent afa99f5788
commit 295c2973b5
11 changed files with 95 additions and 108 deletions
Download Patch File Download Diff File Expand all files Collapse all files

73
src/ol/color.js
View File

@@ -3,7 +3,6 @@
*/
import {assert} from './asserts.js';
import _ol_math_ from './math.js';
var _ol_color_ = {};
/**
@@ -12,7 +11,7 @@ var _ol_color_ = {};
* @type {RegExp}
* @private
*/
_ol_color_.HEX_COLOR_RE_ = /^#(?:[0-9a-f]{3,4}){1,2}$/i;
var HEX_COLOR_RE_ = /^#(?:[0-9a-f]{3,4}){1,2}$/i;
/**
@@ -21,23 +20,7 @@ _ol_color_.HEX_COLOR_RE_ = /^#(?:[0-9a-f]{3,4}){1,2}$/i;
* @type {RegExp}
* @private
*/
_ol_color_.NAMED_COLOR_RE_ = /^([a-z]*)$/i;
/**
* Return the color as an array. This function maintains a cache of calculated
* arrays which means the result should not be modified.
* @param {ol.Color|string} color Color.
* @return {ol.Color} Color.
* @api
*/
_ol_color_.asArray = function(color) {
if (Array.isArray(color)) {
return color;
} else {
return _ol_color_.fromString(/** @type {string} */ (color));
}
};
var NAMED_COLOR_RE_ = /^([a-z]*)$/i;
/**
@@ -46,34 +29,34 @@ _ol_color_.asArray = function(color) {
* @return {string} Rgba string.
* @api
*/
_ol_color_.asString = function(color) {
export function asString(color) {
if (typeof color === 'string') {
return color;
} else {
return _ol_color_.toString(color);
return toString(color);
}
};
}
/**
* Return named color as an rgba string.
* @param {string} color Named color.
* @return {string} Rgb string.
*/
_ol_color_.fromNamed = function(color) {
function fromNamed(color) {
var el = document.createElement('div');
el.style.color = color;
document.body.appendChild(el);
var rgb = getComputedStyle(el).color;
document.body.removeChild(el);
return rgb;
};
}
/**
* @param {string} s String.
* @return {ol.Color} Color.
*/
_ol_color_.fromString = (
export var fromString = (
function() {
// We maintain a small cache of parsed strings. To provide cheap LRU-like
@@ -116,7 +99,7 @@ _ol_color_.fromString = (
}
}
}
color = _ol_color_.fromStringInternal_(s);
color = fromStringInternal_(s);
cache[s] = color;
++cacheSize;
}
@@ -126,20 +109,34 @@ _ol_color_.fromString = (
})();
/**
* Return the color as an array. This function maintains a cache of calculated
* arrays which means the result should not be modified.
* @param {ol.Color|string} color Color.
* @return {ol.Color} Color.
* @api
*/
export function asArray(color) {
if (Array.isArray(color)) {
return color;
} else {
return fromString(/** @type {string} */ (color));
}
}
/**
* @param {string} s String.
* @private
* @return {ol.Color} Color.
*/
_ol_color_.fromStringInternal_ = function(s) {
function fromStringInternal_(s) {
var r, g, b, a, color, parts;
if (_ol_color_.NAMED_COLOR_RE_.exec(s)) {
s = _ol_color_.fromNamed(s);
if (NAMED_COLOR_RE_.exec(s)) {
s = fromNamed(s);
}
if (_ol_color_.HEX_COLOR_RE_.exec(s)) { // hex
if (HEX_COLOR_RE_.exec(s)) { // hex
var n = s.length - 1; // number of hex digits
var d; // number of digits per channel
if (n <= 4) {
@@ -167,38 +164,39 @@ _ol_color_.fromStringInternal_ = function(s) {
color = [r, g, b, a / 255];
} else if (s.indexOf('rgba(') == 0) { // rgba()
parts = s.slice(5, -1).split(',').map(Number);
color = _ol_color_.normalize(parts);
color = normalize(parts);
} else if (s.indexOf('rgb(') == 0) { // rgb()
parts = s.slice(4, -1).split(',').map(Number);
parts.push(1);
color = _ol_color_.normalize(parts);
color = normalize(parts);
} else {
assert(false, 14); // Invalid color
}
return /** @type {ol.Color} */ (color);
};
}
/**
* TODO this function is only used in the test, we probably shouldn't export it
* @param {ol.Color} color Color.
* @param {ol.Color=} opt_color Color.
* @return {ol.Color} Clamped color.
*/
_ol_color_.normalize = function(color, opt_color) {
export function normalize(color, opt_color) {
var result = opt_color || [];
result[0] = _ol_math_.clamp((color[0] + 0.5) | 0, 0, 255);
result[1] = _ol_math_.clamp((color[1] + 0.5) | 0, 0, 255);
result[2] = _ol_math_.clamp((color[2] + 0.5) | 0, 0, 255);
result[3] = _ol_math_.clamp(color[3], 0, 1);
return result;
};
}
/**
* @param {ol.Color} color Color.
* @return {string} String.
*/
_ol_color_.toString = function(color) {
export function toString(color) {
var r = color[0];
if (r != (r | 0)) {
r = (r + 0.5) | 0;
@@ -213,5 +211,4 @@ _ol_color_.toString = function(color) {
}
var a = color[3] === undefined ? 1 : color[3];
return 'rgba(' + r + ',' + g + ',' + b + ',' + a + ')';
};
export default _ol_color_;
}

4
src/ol/colorlike.js
View File

@@ -1,7 +1,7 @@
/**
* @module ol/colorlike
*/
import _ol_color_ from './color.js';
import {asString} from './color.js';
/**
@@ -13,7 +13,7 @@ export function asColorLike(color) {
if (isColorLike(color)) {
return /** @type {string|CanvasPattern|CanvasGradient} */ (color);
} else {
return _ol_color_.asString(/** @type {ol.Color} */ (color));
return asString(/** @type {ol.Color} */ (color));
}
}

4
src/ol/format/KML.js
View File

@@ -5,7 +5,7 @@ import {inherits} from '../index.js';
import _ol_Feature_ from '../Feature.js';
import _ol_array_ from '../array.js';
import {assert} from '../asserts.js';
import _ol_color_ from '../color.js';
import {asArray} from '../color.js';
import FeatureFormat from '../format/Feature.js';
import XMLFeature from '../format/XMLFeature.js';
import XSD from '../format/XSD.js';
@@ -2090,7 +2090,7 @@ KML.prototype.readProjection;
* @private
*/
KML.writeColorTextNode_ = function(node, color) {
var rgba = _ol_color_.asArray(color);
var rgba = asArray(color);
var opacity = (rgba.length == 4) ? rgba[3] : 1;
var abgr = [opacity * 255, rgba[2], rgba[1], rgba[0]];
var i;

8
src/ol/render/canvas/PolygonReplay.js
View File

@@ -2,7 +2,7 @@
* @module ol/render/canvas/PolygonReplay
*/
import {inherits} from '../../index.js';
import _ol_color_ from '../../color.js';
import {asString} from '../../color.js';
import _ol_geom_flat_simplify_ from '../../geom/flat/simplify.js';
import _ol_render_canvas_ from '../canvas.js';
import _ol_render_canvas_Instruction_ from '../canvas/Instruction.js';
@@ -91,7 +91,7 @@ _ol_render_canvas_PolygonReplay_.prototype.drawCircle = function(circleGeometry,
// always fill the circle for hit detection
this.hitDetectionInstructions.push([
_ol_render_canvas_Instruction_.SET_FILL_STYLE,
_ol_color_.asString(_ol_render_canvas_.defaultFillStyle)
asString(_ol_render_canvas_.defaultFillStyle)
]);
if (state.strokeStyle !== undefined) {
this.hitDetectionInstructions.push([
@@ -133,7 +133,7 @@ _ol_render_canvas_PolygonReplay_.prototype.drawPolygon = function(polygonGeometr
// always fill the polygon for hit detection
this.hitDetectionInstructions.push([
_ol_render_canvas_Instruction_.SET_FILL_STYLE,
_ol_color_.asString(_ol_render_canvas_.defaultFillStyle)]
asString(_ol_render_canvas_.defaultFillStyle)]
);
if (state.strokeStyle !== undefined) {
this.hitDetectionInstructions.push([
@@ -165,7 +165,7 @@ _ol_render_canvas_PolygonReplay_.prototype.drawMultiPolygon = function(multiPoly
// always fill the multi-polygon for hit detection
this.hitDetectionInstructions.push([
_ol_render_canvas_Instruction_.SET_FILL_STYLE,
_ol_color_.asString(_ol_render_canvas_.defaultFillStyle)
asString(_ol_render_canvas_.defaultFillStyle)
]);
if (state.strokeStyle !== undefined) {
this.hitDetectionInstructions.push([

6
src/ol/render/webgl/CircleReplay.js
View File

@@ -3,7 +3,7 @@
*/
import {getUid, inherits} from '../../index.js';
import _ol_array_ from '../../array.js';
import _ol_color_ from '../../color.js';
import {asArray} from '../../color.js';
import {intersects} from '../../extent.js';
import _ol_obj_ from '../../obj.js';
import _ol_geom_flat_transform_ from '../../geom/flat/transform.js';
@@ -387,7 +387,7 @@ _ol_render_webgl_CircleReplay_.prototype.setFillStrokeStyle = function(fillStyle
strokeStyleColor = strokeStyle.getColor();
if (!(strokeStyleColor instanceof CanvasGradient) &&
!(strokeStyleColor instanceof CanvasPattern)) {
strokeStyleColor = _ol_color_.asArray(strokeStyleColor).map(function(c, i) {
strokeStyleColor = asArray(strokeStyleColor).map(function(c, i) {
return i != 3 ? c / 255 : c;
}) || _ol_render_webgl_.defaultStrokeStyle;
} else {
@@ -403,7 +403,7 @@ _ol_render_webgl_CircleReplay_.prototype.setFillStrokeStyle = function(fillStyle
var fillStyleColor = fillStyle ? fillStyle.getColor() : [0, 0, 0, 0];
if (!(fillStyleColor instanceof CanvasGradient) &&
!(fillStyleColor instanceof CanvasPattern)) {
fillStyleColor = _ol_color_.asArray(fillStyleColor).map(function(c, i) {
fillStyleColor = asArray(fillStyleColor).map(function(c, i) {
return i != 3 ? c / 255 : c;
}) || _ol_render_webgl_.defaultFillStyle;
} else {

4
src/ol/render/webgl/LineStringReplay.js
View File

@@ -3,7 +3,7 @@
*/
import {getUid, inherits} from '../../index.js';
import _ol_array_ from '../../array.js';
import _ol_color_ from '../../color.js';
import {asArray} from '../../color.js';
import {intersects} from '../../extent.js';
import _ol_geom_flat_orient_ from '../../geom/flat/orient.js';
import _ol_geom_flat_transform_ from '../../geom/flat/transform.js';
@@ -647,7 +647,7 @@ _ol_render_webgl_LineStringReplay_.prototype.setFillStrokeStyle = function(fillS
var strokeStyleColor = strokeStyle.getColor();
if (!(strokeStyleColor instanceof CanvasGradient) &&
!(strokeStyleColor instanceof CanvasPattern)) {
strokeStyleColor = _ol_color_.asArray(strokeStyleColor).map(function(c, i) {
strokeStyleColor = asArray(strokeStyleColor).map(function(c, i) {
return i != 3 ? c / 255 : c;
}) || _ol_render_webgl_.defaultStrokeStyle;
} else {

4
src/ol/render/webgl/PolygonReplay.js
View File

@@ -3,7 +3,7 @@
*/
import {getUid, inherits} from '../../index.js';
import _ol_array_ from '../../array.js';
import _ol_color_ from '../../color.js';
import {asArray} from '../../color.js';
import {intersects} from '../../extent.js';
import _ol_obj_ from '../../obj.js';
import _ol_geom_flat_contains_ from '../../geom/flat/contains.js';
@@ -1048,7 +1048,7 @@ _ol_render_webgl_PolygonReplay_.prototype.setFillStrokeStyle = function(fillStyl
var fillStyleColor = fillStyle ? fillStyle.getColor() : [0, 0, 0, 0];
if (!(fillStyleColor instanceof CanvasGradient) &&
!(fillStyleColor instanceof CanvasPattern)) {
fillStyleColor = _ol_color_.asArray(fillStyleColor).map(function(c, i) {
fillStyleColor = asArray(fillStyleColor).map(function(c, i) {
return i != 3 ? c / 255 : c;
}) || _ol_render_webgl_.defaultFillStyle;
} else {

5
src/ol/style/Fill.js
View File

@@ -2,7 +2,7 @@
* @module ol/style/Fill
*/
import {getUid} from '../index.js';
import _ol_color_ from '../color.js';
import {asString} from '../color.js';
/**
* @classdesc
@@ -76,8 +76,7 @@ _ol_style_Fill_.prototype.getChecksum = function() {
) {
this.checksum_ = getUid(this.color_).toString();
} else {
this.checksum_ = 'f' + (this.color_ ?
_ol_color_.asString(this.color_) : '-');
this.checksum_ = 'f' + (this.color_ ? asString(this.color_) : '-');
}
}

5
src/ol/style/Icon.js
View File

@@ -4,7 +4,7 @@
import {getUid, inherits} from '../index.js';
import ImageState from '../ImageState.js';
import {assert} from '../asserts.js';
import _ol_color_ from '../color.js';
import {asArray} from '../color.js';
import _ol_events_ from '../events.js';
import EventType from '../events/EventType.js';
import IconAnchorUnits from '../style/IconAnchorUnits.js';
@@ -101,8 +101,7 @@ var _ol_style_Icon_ = function(opt_options) {
* @private
* @type {ol.Color}
*/
this.color_ = options.color !== undefined ? _ol_color_.asArray(options.color) :
null;
this.color_ = options.color !== undefined ? asArray(options.color) : null;
/**
* @private

4
src/ol/style/IconImageCache.js
View File

@@ -1,7 +1,7 @@
/**
* @module ol/style/IconImageCache
*/
import _ol_color_ from '../color.js';
import {asString} from '../color.js';
/**
* Singleton class. Available through {@link ol.style.iconImageCache}.
@@ -36,7 +36,7 @@ var IconImageCache = function() {
* @return {string} Cache key.
*/
function getKey(src, crossOrigin, color) {
var colorString = color ? _ol_color_.asString(color) : 'null';
var colorString = color ? asString(color) : 'null';
return crossOrigin + ':' + src + ':' + colorString;
}

86
test/spec/ol/color.test.js
View File

@@ -1,4 +1,10 @@
import _ol_color_ from '../../../src/ol/color.js';
import {
asArray,
asString,
fromString,
normalize,
toString
} from '../../../src/ol/color.js';
describe('ol.color', function() {
@@ -6,27 +12,27 @@ describe('ol.color', function() {
it('returns the same for an array', function() {
var color = [1, 2, 3, 0.4];
var got = _ol_color_.asArray(color);
var got = asArray(color);
expect(got).to.be(color);
});
it('returns an array given an rgba string', function() {
var color = _ol_color_.asArray('rgba(1,2,3,0.4)');
var color = asArray('rgba(1,2,3,0.4)');
expect(color).to.eql([1, 2, 3, 0.4]);
});
it('returns an array given an rgb string', function() {
var color = _ol_color_.asArray('rgb(1,2,3)');
var color = asArray('rgb(1,2,3)');
expect(color).to.eql([1, 2, 3, 1]);
});
it('returns an array given a hex string', function() {
var color = _ol_color_.asArray('#00ccff');
var color = asArray('#00ccff');
expect(color).to.eql([0, 204, 255, 1]);
});
it('returns an array given a hex string with alpha', function() {
var color = _ol_color_.asArray('#00ccffb0');
var color = asArray('#00ccffb0');
expect(color).to.eql([0, 204, 255, 176 / 255]);
});
@@ -36,17 +42,17 @@ describe('ol.color', function() {
it('returns the same for a string', function() {
var color = 'rgba(0,1,2,0.3)';
var got = _ol_color_.asString(color);
var got = asString(color);
expect(got).to.be(color);
});
it('returns a string given an rgba array', function() {
var color = _ol_color_.asString([1, 2, 3, 0.4]);
var color = asString([1, 2, 3, 0.4]);
expect(color).to.eql('rgba(1,2,3,0.4)');
});
it('returns a string given an rgb array', function() {
var color = _ol_color_.asString([1, 2, 3]);
var color = asString([1, 2, 3]);
expect(color).to.eql('rgba(1,2,3,1)');
});
@@ -54,82 +60,68 @@ describe('ol.color', function() {
describe('fromString()', function() {
before(function() {
sinon.spy(_ol_color_, 'fromStringInternal_');
});
after(function() {
var spy = _ol_color_.fromStringInternal_;
spy.restore();
});
it('can parse 3-digit hex colors', function() {
expect(_ol_color_.fromString('#087')).to.eql([0, 136, 119, 1]);
expect(fromString('#087')).to.eql([0, 136, 119, 1]);
});
it('can parse 4-digit hex colors', function() {
expect(_ol_color_.fromString('#0876')).to.eql([0, 136, 119, 102 / 255]);
expect(fromString('#0876')).to.eql([0, 136, 119, 102 / 255]);
});
it('can parse 6-digit hex colors', function() {
expect(_ol_color_.fromString('#56789a')).to.eql([86, 120, 154, 1]);
expect(fromString('#56789a')).to.eql([86, 120, 154, 1]);
});
it('can parse 8-digit hex colors', function() {
expect(_ol_color_.fromString('#56789acc')).to.eql([86, 120, 154, 204 / 255]);
expect(fromString('#56789acc')).to.eql([86, 120, 154, 204 / 255]);
});
it('can parse rgb colors', function() {
expect(_ol_color_.fromString('rgb(0, 0, 255)')).to.eql([0, 0, 255, 1]);
expect(fromString('rgb(0, 0, 255)')).to.eql([0, 0, 255, 1]);
});
it('ignores whitespace before, between & after numbers (rgb)', function() {
expect(_ol_color_.fromString('rgb( \t 0 , 0 \n , 255 )')).to.eql(
expect(fromString('rgb( \t 0 , 0 \n , 255 )')).to.eql(
[0, 0, 255, 1]);
});
it('can parse rgba colors', function() {
// opacity 0
expect(_ol_color_.fromString('rgba(255, 255, 0, 0)')).to.eql(
expect(fromString('rgba(255, 255, 0, 0)')).to.eql(
[255, 255, 0, 0]);
// opacity 0.0 (simple float)
expect(_ol_color_.fromString('rgba(255, 255, 0, 0.0)')).to.eql(
expect(fromString('rgba(255, 255, 0, 0.0)')).to.eql(
[255, 255, 0, 0]);
// opacity 0.0000000000000000 (float with 16 digits)
expect(_ol_color_.fromString('rgba(255, 255, 0, 0.0000000000000000)')).to.eql(
expect(fromString('rgba(255, 255, 0, 0.0000000000000000)')).to.eql(
[255, 255, 0, 0]);
// opacity 0.1 (simple float)
expect(_ol_color_.fromString('rgba(255, 255, 0, 0.1)')).to.eql(
expect(fromString('rgba(255, 255, 0, 0.1)')).to.eql(
[255, 255, 0, 0.1]);
// opacity 0.1111111111111111 (float with 16 digits)
expect(_ol_color_.fromString('rgba(255, 255, 0, 0.1111111111111111)')).to.eql(
expect(fromString('rgba(255, 255, 0, 0.1111111111111111)')).to.eql(
[255, 255, 0, 0.1111111111111111]);
// opacity 1
expect(_ol_color_.fromString('rgba(255, 255, 0, 1)')).to.eql(
expect(fromString('rgba(255, 255, 0, 1)')).to.eql(
[255, 255, 0, 1]);
// opacity 1.0
expect(_ol_color_.fromString('rgba(255, 255, 0, 1.0)')).to.eql(
expect(fromString('rgba(255, 255, 0, 1.0)')).to.eql(
[255, 255, 0, 1]);
// opacity 1.0000000000000000
expect(_ol_color_.fromString('rgba(255, 255, 0, 1.0000000000000000)')).to.eql(
expect(fromString('rgba(255, 255, 0, 1.0000000000000000)')).to.eql(
[255, 255, 0, 1]);
// with 30 decimal digits
expect(_ol_color_.fromString('rgba(255, 255, 0, 0.123456789012345678901234567890)')).to.eql(
expect(fromString('rgba(255, 255, 0, 0.123456789012345678901234567890)')).to.eql(
[255, 255, 0, 0.123456789012345678901234567890]);
});
it('ignores whitespace before, between & after numbers (rgba)', function() {
expect(_ol_color_.fromString('rgba( \t 0 , 0 \n , 255 , 0.4711 )')).to.eql(
expect(fromString('rgba( \t 0 , 0 \n , 255 , 0.4711 )')).to.eql(
[0, 0, 255, 0.4711]);
});
it('caches parsed values', function() {
var spy = _ol_color_.fromStringInternal_;
var count = spy.callCount;
_ol_color_.fromString('aquamarine');
expect(spy.callCount).to.be(count + 1);
_ol_color_.fromString('aquamarine');
expect(spy.callCount).to.be(count + 1);
it.skip('caches parsed values', function() {
// TODO is this untestable with named exports?
});
it('throws an error on invalid colors', function() {
@@ -137,7 +129,7 @@ describe('ol.color', function() {
var i, ii;
for (i = 0, ii < invalidColors.length; i < ii; ++i) {
expect(function() {
_ol_color_.fromString(invalidColors[i]);
fromString(invalidColors[i]);
}).to.throwException();
}
});
@@ -147,11 +139,11 @@ describe('ol.color', function() {
describe('normalize()', function() {
it('clamps out-of-range channels', function() {
expect(_ol_color_.normalize([-1, 256, 0, 2])).to.eql([0, 255, 0, 1]);
expect(normalize([-1, 256, 0, 2])).to.eql([0, 255, 0, 1]);
});
it('rounds color channels to integers', function() {
expect(_ol_color_.normalize([1.2, 2.5, 3.7, 1])).to.eql([1, 3, 4, 1]);
expect(normalize([1.2, 2.5, 3.7, 1])).to.eql([1, 3, 4, 1]);
});
});
@@ -159,15 +151,15 @@ describe('ol.color', function() {
describe('toString()', function() {
it('converts valid colors', function() {
expect(_ol_color_.toString([1, 2, 3, 0.4])).to.be('rgba(1,2,3,0.4)');
expect(toString([1, 2, 3, 0.4])).to.be('rgba(1,2,3,0.4)');
});
it('rounds to integers if needed', function() {
expect(_ol_color_.toString([1.2, 2.5, 3.7, 0.4])).to.be('rgba(1,3,4,0.4)');
expect(toString([1.2, 2.5, 3.7, 0.4])).to.be('rgba(1,3,4,0.4)');
});
it('sets default alpha value if undefined', function() {
expect(_ol_color_.toString([0, 0, 0])).to.be('rgba(0,0,0,1)');
expect(toString([0, 0, 0])).to.be('rgba(0,0,0,1)');
});
});