Stringify

This commit is contained in:
Rafael Caricio 2014-09-20 11:37:41 +02:00
parent 37e8f70262
commit 3559c23b44
4 changed files with 329 additions and 54 deletions

View file

@ -9,39 +9,115 @@ GradientParser.stringify = (function() {
var visitor = {
'visit_linear-gradient': function(node) {
return visitor.visit_gradient(node);
},
'visit_repeating-linear-gradient': function(node) {
return visitor.visit_gradient(node);
},
'visit_radial-gradient': function(node) {
return visitor.visit_gradient(node);
},
'visit_repeating-radial-gradient': function(node) {
return visitor.visit_gradient(node);
},
'visit_gradient': function(node) {
var orientation = visitor.visit(node.orientation);
if (orientation) {
orientation += ', ';
}
return 'linear-gradient('+ orientation + visitor.visit(node.colorStops) + ')';
return node.type + '(' + orientation + visitor.visit(node.colorStops) + ')';
},
visit_literal: function(node) {
'visit_shape': function(node) {
var result = node.value,
at = visitor.visit(node.at),
style = visitor.visit(node.style);
if (style) {
result += ' ' + style;
}
if (at) {
result += ' at ' + at;
}
return result;
},
'visit_default-radial': function(node) {
var result = '',
at = visitor.visit(node.at);
if (at) {
result += at;
}
return result;
},
'visit_extent-keyword': function(node) {
return node.value;
},
visit_angular: function(node) {
'visit_position-keyword': function(node) {
return node.value;
},
'visit_position': function(node) {
return visitor.visit(node.value.x) + ' ' + visitor.visit(node.value.y);
},
'visit_%': function(node) {
return node.value + '%';
},
'visit_em': function(node) {
return node.value + 'em';
},
'visit_px': function(node) {
return node.value + 'px';
},
'visit_literal': function(node) {
return visitor.visit_color(node.value, node);
},
'visit_hex': function(node) {
return visitor.visit_color('#' + node.value, node);
},
'visit_rgb': function(node) {
return visitor.visit_color('rgb(' + node.value.join(', ') + ')', node);
},
'visit_rgba': function(node) {
return visitor.visit_color('rgba(' + node.value.join(', ') + ')', node);
},
'visit_color': function(resultColor, node) {
var result = resultColor,
length = visitor.visit(node.length);
if (length) {
result += ' ' + length;
}
return result;
},
'visit_angular': function(node) {
return node.value + 'deg';
},
visit_hex: function(node) {
return '#' + node.value;
},
visit_rgb: function(node) {
return 'rgb(' + node.value.join(', ') + ')';
},
visit_rgba: function(node) {
return 'rgba(' + node.value.join(', ') + ')';
},
visit_directional: function(node) {
'visit_directional': function(node) {
return 'to ' + node.value;
},
visit_array: function(elements) {
'visit_array': function(elements) {
var result = '',
size = elements.length;
@ -55,7 +131,7 @@ GradientParser.stringify = (function() {
return result;
},
visit: function(element) {
'visit': function(element) {
if (!element) {
return '';
}

View file

@ -349,39 +349,115 @@ GradientParser.stringify = (function() {
var visitor = {
'visit_linear-gradient': function(node) {
return visitor.visit_gradient(node);
},
'visit_repeating-linear-gradient': function(node) {
return visitor.visit_gradient(node);
},
'visit_radial-gradient': function(node) {
return visitor.visit_gradient(node);
},
'visit_repeating-radial-gradient': function(node) {
return visitor.visit_gradient(node);
},
'visit_gradient': function(node) {
var orientation = visitor.visit(node.orientation);
if (orientation) {
orientation += ', ';
}
return 'linear-gradient('+ orientation + visitor.visit(node.colorStops) + ')';
return node.type + '(' + orientation + visitor.visit(node.colorStops) + ')';
},
visit_literal: function(node) {
'visit_shape': function(node) {
var result = node.value,
at = visitor.visit(node.at),
style = visitor.visit(node.style);
if (style) {
result += ' ' + style;
}
if (at) {
result += ' at ' + at;
}
return result;
},
'visit_default-radial': function(node) {
var result = '',
at = visitor.visit(node.at);
if (at) {
result += at;
}
return result;
},
'visit_extent-keyword': function(node) {
return node.value;
},
visit_angular: function(node) {
'visit_position-keyword': function(node) {
return node.value;
},
'visit_position': function(node) {
return visitor.visit(node.value.x) + ' ' + visitor.visit(node.value.y);
},
'visit_%': function(node) {
return node.value + '%';
},
'visit_em': function(node) {
return node.value + 'em';
},
'visit_px': function(node) {
return node.value + 'px';
},
'visit_literal': function(node) {
return visitor.visit_color(node.value, node);
},
'visit_hex': function(node) {
return visitor.visit_color('#' + node.value, node);
},
'visit_rgb': function(node) {
return visitor.visit_color('rgb(' + node.value.join(', ') + ')', node);
},
'visit_rgba': function(node) {
return visitor.visit_color('rgba(' + node.value.join(', ') + ')', node);
},
'visit_color': function(resultColor, node) {
var result = resultColor,
length = visitor.visit(node.length);
if (length) {
result += ' ' + length;
}
return result;
},
'visit_angular': function(node) {
return node.value + 'deg';
},
visit_hex: function(node) {
return '#' + node.value;
},
visit_rgb: function(node) {
return 'rgb(' + node.value.join(', ') + ')';
},
visit_rgba: function(node) {
return 'rgba(' + node.value.join(', ') + ')';
},
visit_directional: function(node) {
'visit_directional': function(node) {
return 'to ' + node.value;
},
visit_array: function(elements) {
'visit_array': function(elements) {
var result = '',
size = elements.length;
@ -395,7 +471,7 @@ GradientParser.stringify = (function() {
return result;
},
visit: function(element) {
'visit': function(element) {
if (!element) {
return '';
}

View file

@ -9,39 +9,115 @@ GradientParser.stringify = (function() {
var visitor = {
'visit_linear-gradient': function(node) {
return visitor.visit_gradient(node);
},
'visit_repeating-linear-gradient': function(node) {
return visitor.visit_gradient(node);
},
'visit_radial-gradient': function(node) {
return visitor.visit_gradient(node);
},
'visit_repeating-radial-gradient': function(node) {
return visitor.visit_gradient(node);
},
'visit_gradient': function(node) {
var orientation = visitor.visit(node.orientation);
if (orientation) {
orientation += ', ';
}
return 'linear-gradient('+ orientation + visitor.visit(node.colorStops) + ')';
return node.type + '(' + orientation + visitor.visit(node.colorStops) + ')';
},
visit_literal: function(node) {
'visit_shape': function(node) {
var result = node.value,
at = visitor.visit(node.at),
style = visitor.visit(node.style);
if (style) {
result += ' ' + style;
}
if (at) {
result += ' at ' + at;
}
return result;
},
'visit_default-radial': function(node) {
var result = '',
at = visitor.visit(node.at);
if (at) {
result += at;
}
return result;
},
'visit_extent-keyword': function(node) {
return node.value;
},
visit_angular: function(node) {
'visit_position-keyword': function(node) {
return node.value;
},
'visit_position': function(node) {
return visitor.visit(node.value.x) + ' ' + visitor.visit(node.value.y);
},
'visit_%': function(node) {
return node.value + '%';
},
'visit_em': function(node) {
return node.value + 'em';
},
'visit_px': function(node) {
return node.value + 'px';
},
'visit_literal': function(node) {
return visitor.visit_color(node.value, node);
},
'visit_hex': function(node) {
return visitor.visit_color('#' + node.value, node);
},
'visit_rgb': function(node) {
return visitor.visit_color('rgb(' + node.value.join(', ') + ')', node);
},
'visit_rgba': function(node) {
return visitor.visit_color('rgba(' + node.value.join(', ') + ')', node);
},
'visit_color': function(resultColor, node) {
var result = resultColor,
length = visitor.visit(node.length);
if (length) {
result += ' ' + length;
}
return result;
},
'visit_angular': function(node) {
return node.value + 'deg';
},
visit_hex: function(node) {
return '#' + node.value;
},
visit_rgb: function(node) {
return 'rgb(' + node.value.join(', ') + ')';
},
visit_rgba: function(node) {
return 'rgba(' + node.value.join(', ') + ')';
},
visit_directional: function(node) {
'visit_directional': function(node) {
return 'to ' + node.value;
},
visit_array: function(elements) {
'visit_array': function(elements) {
var result = '',
size = elements.length;
@ -55,7 +131,7 @@ GradientParser.stringify = (function() {
return result;
},
visit: function(element) {
'visit': function(element) {
if (!element) {
return '';
}

View file

@ -3,6 +3,10 @@
var expect = require('expect.js');
var gradients = require('build/node');
function pprint(ast) {
console.log(JSON.stringify(ast, true, 2));
}
describe('lib/stringify.js', function () {
var subject;
@ -46,6 +50,49 @@ describe('lib/stringify.js', function () {
expect(gradients.stringify(gradients.parse(gradientDef))).to.equal(gradientDef);
});
describe('all metric values', function() {
[
'px',
'em',
'%'
].forEach(function(metric) {
var expectedResult;
describe('stringify color stop for metric '+ metric, function() {
beforeEach(function() {
expectedResult = 'linear-gradient(blue 10.3' + metric + ', transparent)';
var ast = gradients.parse(expectedResult);
subject = gradients.stringify(ast);
});
it('should result as expected', function() {
expect(subject).to.equal(expectedResult);
});
});
});
});
describe('different radial declarations', function() {
[
'ellipse farthest-corner',
'ellipse cover',
'circle cover',
'center bottom, ellipse cover',
'circle at 87.23px -58.3px'
].forEach(function(declaration) {
it('should parse ' + declaration + ' declaration', function() {
var expectedResult = 'radial-gradient(' + declaration + ', red, blue)';
var ast = gradients.parse(expectedResult);
subject = gradients.stringify(ast);
expect(subject).to.equal(expectedResult);
});
});
});
});
});