Parse rgb/rgba colors
This commit is contained in:
parent
034a0ae448
commit
dbb8d02775
|
@ -34,7 +34,10 @@ module.exports = (function() {
|
||||||
endCall: /^\)/,
|
endCall: /^\)/,
|
||||||
comma: /^,/,
|
comma: /^,/,
|
||||||
hexColor: /^\#([0-9a-fA-F]+)/,
|
hexColor: /^\#([0-9a-fA-F]+)/,
|
||||||
literalColor: /^([a-zA-Z]+)/
|
literalColor: /^([a-zA-Z]+)/,
|
||||||
|
rgbColor: /^rgb/i,
|
||||||
|
rgbaColor: /^rgba/i,
|
||||||
|
number: /^(([0-9]*\.[0-9]+)|([0-9]+\.?))/
|
||||||
};
|
};
|
||||||
|
|
||||||
var input = '',
|
var input = '',
|
||||||
|
@ -85,6 +88,24 @@ module.exports = (function() {
|
||||||
}
|
}
|
||||||
|
|
||||||
function matchGradient(gradientType, pattern, orientationMatcher) {
|
function matchGradient(gradientType, pattern, orientationMatcher) {
|
||||||
|
return matchCall(pattern, function(captures) {
|
||||||
|
orientation = orientationMatcher();
|
||||||
|
if (orientation) {
|
||||||
|
if (!scan(tokens.comma)) {
|
||||||
|
error('Missing comma before color stops');
|
||||||
|
}
|
||||||
|
}
|
||||||
|
|
||||||
|
colorStops = matchListing(matchColorStop);
|
||||||
|
return {
|
||||||
|
type: gradientType,
|
||||||
|
orientation: orientation,
|
||||||
|
colorStops: colorStops
|
||||||
|
};
|
||||||
|
});
|
||||||
|
}
|
||||||
|
|
||||||
|
function matchCall(pattern, callback) {
|
||||||
var captures = scan(pattern),
|
var captures = scan(pattern),
|
||||||
orientation,
|
orientation,
|
||||||
colorStops;
|
colorStops;
|
||||||
|
@ -94,27 +115,13 @@ module.exports = (function() {
|
||||||
error('Missing (');
|
error('Missing (');
|
||||||
}
|
}
|
||||||
|
|
||||||
orientation = orientationMatcher();
|
result = callback(captures);
|
||||||
if (orientation) {
|
|
||||||
if (!scan(tokens.comma)) {
|
|
||||||
error('Missing comma before color stops');
|
|
||||||
}
|
|
||||||
}
|
|
||||||
|
|
||||||
colorStops = matchColorStops();
|
|
||||||
if (!colorStops.length) {
|
|
||||||
error('Missing color definitions');
|
|
||||||
}
|
|
||||||
|
|
||||||
if (!scan(tokens.endCall)) {
|
if (!scan(tokens.endCall)) {
|
||||||
error('Missing )');
|
error('Missing )');
|
||||||
}
|
}
|
||||||
|
|
||||||
return {
|
return result;
|
||||||
type: gradientType,
|
|
||||||
orientation: orientation,
|
|
||||||
colorStops: colorStops
|
|
||||||
};
|
|
||||||
}
|
}
|
||||||
}
|
}
|
||||||
|
|
||||||
|
@ -143,23 +150,23 @@ module.exports = (function() {
|
||||||
}
|
}
|
||||||
}
|
}
|
||||||
|
|
||||||
function matchColorStops() {
|
function matchListing(matcher) {
|
||||||
var color = matchColorStop(),
|
var captures = matcher(),
|
||||||
colors = [];
|
result = [];
|
||||||
|
|
||||||
if (color) {
|
if (captures) {
|
||||||
colors.push(color);
|
result.push(captures);
|
||||||
while (scan(tokens.comma)) {
|
while (scan(tokens.comma)) {
|
||||||
color = matchColorStop();
|
captures = matcher();
|
||||||
if (color) {
|
if (captures) {
|
||||||
colors.push(color);
|
result.push(captures);
|
||||||
} else {
|
} else {
|
||||||
error('One extra comma');
|
error('One extra comma');
|
||||||
}
|
}
|
||||||
}
|
}
|
||||||
}
|
}
|
||||||
|
|
||||||
return colors;
|
return result;
|
||||||
}
|
}
|
||||||
|
|
||||||
function matchColorStop() {
|
function matchColorStop() {
|
||||||
|
@ -174,8 +181,10 @@ module.exports = (function() {
|
||||||
}
|
}
|
||||||
|
|
||||||
function matchColor() {
|
function matchColor() {
|
||||||
return matchLiteralColor() ||
|
return matchHexColor() ||
|
||||||
matchHexColor();
|
matchRGBAColor() ||
|
||||||
|
matchRGBColor() ||
|
||||||
|
matchLiteralColor();
|
||||||
}
|
}
|
||||||
|
|
||||||
function matchLiteralColor() {
|
function matchLiteralColor() {
|
||||||
|
@ -200,6 +209,28 @@ module.exports = (function() {
|
||||||
}
|
}
|
||||||
}
|
}
|
||||||
|
|
||||||
|
function matchRGBColor() {
|
||||||
|
return matchCall(tokens.rgbColor, function() {
|
||||||
|
return {
|
||||||
|
type: 'rgb',
|
||||||
|
value: matchListing(matchNumber)
|
||||||
|
};
|
||||||
|
});
|
||||||
|
}
|
||||||
|
|
||||||
|
function matchRGBAColor() {
|
||||||
|
return matchCall(tokens.rgbaColor, function() {
|
||||||
|
return {
|
||||||
|
type: 'rgba',
|
||||||
|
value: matchListing(matchNumber)
|
||||||
|
};
|
||||||
|
});
|
||||||
|
}
|
||||||
|
|
||||||
|
function matchNumber() {
|
||||||
|
return scan(tokens.number)[1];
|
||||||
|
}
|
||||||
|
|
||||||
function matchLength() {
|
function matchLength() {
|
||||||
return matchMetric(tokens.pixelValue, 'px') ||
|
return matchMetric(tokens.pixelValue, 'px') ||
|
||||||
matchMetric(tokens.percentageValue, '%') ||
|
matchMetric(tokens.percentageValue, '%') ||
|
||||||
|
|
|
@ -171,7 +171,9 @@ describe('gradient-parser.js', function () {
|
||||||
|
|
||||||
[
|
[
|
||||||
{type: 'literal', unparsedValue: 'red', value: 'red'},
|
{type: 'literal', unparsedValue: 'red', value: 'red'},
|
||||||
{type: 'hex', unparsedValue: '#c2c2c2', value: 'c2c2c2'}
|
{type: 'hex', unparsedValue: '#c2c2c2', value: 'c2c2c2'},
|
||||||
|
{type: 'rgb', unparsedValue: 'rgb(243, 226, 195)', value: ['243', '226', '195']},
|
||||||
|
{type: 'rgba', unparsedValue: 'rgba(243, 226, 195)', value: ['243', '226', '195']}
|
||||||
].forEach(function(color) {
|
].forEach(function(color) {
|
||||||
describe('parse color type '+ color.type, function() {
|
describe('parse color type '+ color.type, function() {
|
||||||
beforeEach(function() {
|
beforeEach(function() {
|
||||||
|
@ -181,7 +183,7 @@ describe('gradient-parser.js', function () {
|
||||||
|
|
||||||
it('should parse value', function() {
|
it('should parse value', function() {
|
||||||
expect(subject.type).to.equal(color.type);
|
expect(subject.type).to.equal(color.type);
|
||||||
expect(subject.value).to.equal(color.value);
|
expect(subject.value).to.eql(color.value);
|
||||||
});
|
});
|
||||||
});
|
});
|
||||||
});
|
});
|
||||||
|
|
Loading…
Reference in a new issue