Starting the parser
This commit is contained in:
parent
755322fe43
commit
52d9cc44b5
2 changed files with 146 additions and 39 deletions
|
@ -19,49 +19,127 @@ var GradientParser = module.exports = (function() {
|
||||||
]
|
]
|
||||||
};
|
};
|
||||||
|
|
||||||
function Constructor() {
|
var tokens = {
|
||||||
|
linearGradient: /^linear\-gradient/i,
|
||||||
|
sideOrCorner: /^to (left (top|bottom)|right (top|bottom)|left|right|top|bottom)/i,
|
||||||
|
startCall: /^\(/,
|
||||||
|
endCall: /^\)/,
|
||||||
|
comma: /^,/
|
||||||
|
};
|
||||||
|
|
||||||
|
function Constructor(input) {
|
||||||
|
this.input = input;
|
||||||
|
this.cursor = 0;
|
||||||
}
|
}
|
||||||
|
|
||||||
var def = Constructor.prototype;
|
var def = Constructor.prototype;
|
||||||
|
|
||||||
def.parse = function(input) {
|
def.parse = function(input) {
|
||||||
return null;
|
if (input) {
|
||||||
}
|
this.input = input;
|
||||||
|
}
|
||||||
|
return this.listDefinitions();
|
||||||
|
};
|
||||||
|
|
||||||
|
def.listDefinitions = function() {
|
||||||
|
var definitions = [],
|
||||||
|
definition = this.definition();
|
||||||
|
|
||||||
|
if (definition) {
|
||||||
|
definitions.push(definition);
|
||||||
|
while (this.scan(tokens.comma)) {
|
||||||
|
definition = this.definition();
|
||||||
|
if (definition) {
|
||||||
|
definitions.push(definition);
|
||||||
|
} else {
|
||||||
|
// throw error
|
||||||
|
}
|
||||||
|
}
|
||||||
|
}
|
||||||
|
|
||||||
|
return definitions;
|
||||||
|
};
|
||||||
|
|
||||||
|
def.definition = function() {
|
||||||
|
return this.linearGradient();
|
||||||
|
};
|
||||||
|
|
||||||
|
def.linearGradient = function() {
|
||||||
|
var captures = this.scan(tokens.linearGradient),
|
||||||
|
orientation,
|
||||||
|
colorStops;
|
||||||
|
|
||||||
|
|
||||||
|
if (captures) {
|
||||||
|
this.scan(tokens.startCall);
|
||||||
|
orientation = this.orientation();
|
||||||
|
this.scan(tokens.comma);
|
||||||
|
colorStops = this.colorStops();
|
||||||
|
this.scan(tokens.endCall);
|
||||||
|
|
||||||
|
return {
|
||||||
|
type: 'linear-gradient',
|
||||||
|
orientation: orientation,
|
||||||
|
colorStops: colorStops
|
||||||
|
};
|
||||||
|
}
|
||||||
|
};
|
||||||
|
|
||||||
|
def.orientation = function() {
|
||||||
|
return this.sideOrCorner();
|
||||||
|
};
|
||||||
|
|
||||||
|
def.sideOrCorner = function() {
|
||||||
|
var captures = this.scan(tokens.sideOrCorner);
|
||||||
|
if (captures) {
|
||||||
|
return {
|
||||||
|
type: 'directional',
|
||||||
|
value: captures[1].toLowerCase()
|
||||||
|
};
|
||||||
|
}
|
||||||
|
};
|
||||||
|
|
||||||
|
def.colorStops = function() {
|
||||||
|
var literalColors = /^([a-zA-Z]+)/,
|
||||||
|
captures = this.scan(literalColors),
|
||||||
|
colors = [];
|
||||||
|
|
||||||
|
if (captures) {
|
||||||
|
colors.push(captures[0].toLowerCase());
|
||||||
|
while (this.scan(tokens.comma)) {
|
||||||
|
captures = this.scan(literalColors);
|
||||||
|
if (captures) {
|
||||||
|
colors.push(captures[0].toLowerCase());
|
||||||
|
} else {
|
||||||
|
// trow error
|
||||||
|
}
|
||||||
|
}
|
||||||
|
}
|
||||||
|
|
||||||
|
return colors;
|
||||||
|
};
|
||||||
|
|
||||||
|
def.scan = function(regexp) {
|
||||||
|
var captures,
|
||||||
|
blankCaptures;
|
||||||
|
|
||||||
|
blankCaptures = /^[\n\r\t\s]+/.exec(this.input);
|
||||||
|
if (blankCaptures) {
|
||||||
|
this.consume(blankCaptures[0].length);
|
||||||
|
}
|
||||||
|
|
||||||
|
captures = regexp.exec(this.input);
|
||||||
|
if (captures) {
|
||||||
|
this.consume(captures[0].length);
|
||||||
|
}
|
||||||
|
|
||||||
|
return captures;
|
||||||
|
};
|
||||||
|
|
||||||
|
def.consume = function(size) {
|
||||||
|
this.cursor += size;
|
||||||
|
this.input = this.input.substr(size);
|
||||||
|
};
|
||||||
|
|
||||||
return Constructor;
|
return Constructor;
|
||||||
})();
|
})();
|
||||||
|
|
||||||
|
|
||||||
var p = new GradientParser('linear-gradient(to right, transparent 10px, #c2c2c2 10px)');
|
|
||||||
var ast = p.parse();
|
|
||||||
|
|
||||||
if (ast == [
|
|
||||||
{
|
|
||||||
type: 'linear-gradient',
|
|
||||||
orientation: {
|
|
||||||
type: 'directional',
|
|
||||||
value: 'right'
|
|
||||||
},
|
|
||||||
colorStops: [
|
|
||||||
{
|
|
||||||
type: 'literal',
|
|
||||||
value: 'transparent',
|
|
||||||
length: {
|
|
||||||
value: '10',
|
|
||||||
type: 'px'
|
|
||||||
}
|
|
||||||
},
|
|
||||||
{
|
|
||||||
type: 'hex',
|
|
||||||
value: 'c2c2c2',
|
|
||||||
length: {
|
|
||||||
value: '10',
|
|
||||||
type: 'px'
|
|
||||||
}
|
|
||||||
}
|
|
||||||
]
|
|
||||||
}]) {
|
|
||||||
console.log('Done!');
|
|
||||||
} else {
|
|
||||||
console.log('Keep working...');
|
|
||||||
}
|
|
||||||
|
|
|
@ -3,6 +3,34 @@
|
||||||
var expect = require('expect.js');
|
var expect = require('expect.js');
|
||||||
var GradientParser = require('gradient-parser');
|
var GradientParser = require('gradient-parser');
|
||||||
|
|
||||||
|
// [
|
||||||
|
// {
|
||||||
|
// type: 'linear-gradient',
|
||||||
|
// orientation: {
|
||||||
|
// type: 'directional',
|
||||||
|
// value: 'right'
|
||||||
|
// },
|
||||||
|
// colorStops: [
|
||||||
|
// {
|
||||||
|
// type: 'literal',
|
||||||
|
// value: 'transparent',
|
||||||
|
// length: {
|
||||||
|
// value: '10',
|
||||||
|
// type: 'px'
|
||||||
|
// }
|
||||||
|
// },
|
||||||
|
// {
|
||||||
|
// type: 'hex',
|
||||||
|
// value: 'c2c2c2',
|
||||||
|
// length: {
|
||||||
|
// value: '10',
|
||||||
|
// type: 'px'
|
||||||
|
// }
|
||||||
|
// }
|
||||||
|
// ]
|
||||||
|
// }
|
||||||
|
// ]
|
||||||
|
|
||||||
describe('gradient-parser.js', function () {
|
describe('gradient-parser.js', function () {
|
||||||
it('should exist', function () {
|
it('should exist', function () {
|
||||||
expect(typeof GradientParser).to.equal('function');
|
expect(typeof GradientParser).to.equal('function');
|
||||||
|
@ -13,7 +41,8 @@ describe('gradient-parser.js', function () {
|
||||||
|
|
||||||
beforeEach(function() {
|
beforeEach(function() {
|
||||||
var parser = new GradientParser();
|
var parser = new GradientParser();
|
||||||
ast = parser.parse('linar-gradient(to right, transparent 10px, blue)');
|
ast = parser.parse('linear-gradient(to right bottom, red, blue)');
|
||||||
|
console.log(ast);
|
||||||
});
|
});
|
||||||
|
|
||||||
it('should get the gradient type', function () {
|
it('should get the gradient type', function () {
|
||||||
|
|
Loading…
Reference in a new issue