Canvas: Update API for core changes.
- Use only one node for colors and dash-array - Update some property names to better match SVG/CSS
This commit is contained in:
parent
cc770cecb7
commit
52b89ed372
2 changed files with 47 additions and 32 deletions
|
@ -53,6 +53,31 @@ var _setColorNodes = func(nodes, color)
|
||||||
nodes[3].setDoubleValue(1);
|
nodes[3].setDoubleValue(1);
|
||||||
};
|
};
|
||||||
|
|
||||||
|
var _getColor = func(color)
|
||||||
|
{
|
||||||
|
if( size(color) == 1 )
|
||||||
|
var color = color[0];
|
||||||
|
|
||||||
|
if( typeof(color) == 'scalar' )
|
||||||
|
return color;
|
||||||
|
if( typeof(color) != "vector" )
|
||||||
|
return debug.warn("Wrong type for color");
|
||||||
|
|
||||||
|
if( size(color) < 3 or size(color) > 4 )
|
||||||
|
return debug.warn("Color needs 3 or 4 values (RGB or RGBA)");
|
||||||
|
|
||||||
|
var str = 'rgb';
|
||||||
|
if( size(color) == 4 )
|
||||||
|
str ~= 'a';
|
||||||
|
str ~= '(';
|
||||||
|
|
||||||
|
# rgb = [0,255], a = [0,1]
|
||||||
|
for(var i = 0; i < size(color); i += 1)
|
||||||
|
str ~= (i > 0 ? ',' : '') ~ (i < 3 ? int(color[i] * 255) : color[i]);
|
||||||
|
|
||||||
|
return str ~ ')';
|
||||||
|
};
|
||||||
|
|
||||||
var _arg2valarray = func
|
var _arg2valarray = func
|
||||||
{
|
{
|
||||||
var ret = arg;
|
var ret = arg;
|
||||||
|
@ -233,14 +258,10 @@ var Element = {
|
||||||
setScale: func { me._getTf().setScale(arg); return me; },
|
setScale: func { me._getTf().setScale(arg); return me; },
|
||||||
# Shortcut for getting scale
|
# Shortcut for getting scale
|
||||||
getScale: func me._getTf().getScale(),
|
getScale: func me._getTf().getScale(),
|
||||||
# Set the line/text color
|
|
||||||
#
|
|
||||||
# @param color Vector of 3 or 4 values in [0, 1]
|
|
||||||
setColor: func { _setColorNodes(me.color, arg); return me; },
|
|
||||||
# Set the fill/background/boundingbox color
|
# Set the fill/background/boundingbox color
|
||||||
#
|
#
|
||||||
# @param color Vector of 3 or 4 values in [0, 1]
|
# @param color Vector of 3 or 4 values in [0, 1]
|
||||||
setColorFill: func { _setColorNodes(me.color_fill, arg); return me; },
|
setColorFill: func me.set('fill', _getColor(arg)),
|
||||||
#
|
#
|
||||||
getBoundingBox: func()
|
getBoundingBox: func()
|
||||||
{
|
{
|
||||||
|
@ -381,10 +402,7 @@ var Map = {
|
||||||
var Text = {
|
var Text = {
|
||||||
new: func(node, id)
|
new: func(node, id)
|
||||||
{
|
{
|
||||||
var m = { parents: [Text, Element.new(node, id)] };
|
return { parents: [Text, Element.new(node, id)] };
|
||||||
m.color = _createColorNodes(m._node, "color");
|
|
||||||
m.color_fill = _createColorNodes(m._node, "color-fill");
|
|
||||||
return m;
|
|
||||||
},
|
},
|
||||||
# Set the text
|
# Set the text
|
||||||
setText: func(text)
|
setText: func(text)
|
||||||
|
@ -447,7 +465,9 @@ var Text = {
|
||||||
setMaxWidth: func(w)
|
setMaxWidth: func(w)
|
||||||
{
|
{
|
||||||
me.setDouble("max-width", w);
|
me.setDouble("max-width", w);
|
||||||
}
|
},
|
||||||
|
setColor: func me.set('fill', _getColor(arg)),
|
||||||
|
setColorFill: func me.set('background', _getColor(arg))
|
||||||
};
|
};
|
||||||
|
|
||||||
# Path
|
# Path
|
||||||
|
@ -514,14 +534,11 @@ var Path = {
|
||||||
#
|
#
|
||||||
new: func(node, id)
|
new: func(node, id)
|
||||||
{
|
{
|
||||||
var m = {
|
return {
|
||||||
parents: [Path, Element.new(node, id)],
|
parents: [Path, Element.new(node, id)],
|
||||||
_num_cmds: 0,
|
_num_cmds: 0,
|
||||||
_num_coords: 0
|
_num_coords: 0
|
||||||
};
|
};
|
||||||
m.color = _createColorNodes(m._node, "color");
|
|
||||||
m.color_fill = _createColorNodes(m._node, "color-fill");
|
|
||||||
return m;
|
|
||||||
},
|
},
|
||||||
# Remove all existing path data
|
# Remove all existing path data
|
||||||
reset: func
|
reset: func
|
||||||
|
@ -608,6 +625,17 @@ var Path = {
|
||||||
# Close the path (implicit lineTo to first point of path)
|
# Close the path (implicit lineTo to first point of path)
|
||||||
close: func me.addSegment(me.VG_CLOSE_PATH),
|
close: func me.addSegment(me.VG_CLOSE_PATH),
|
||||||
|
|
||||||
|
setColor: func me.setStroke(_getColor(arg)),
|
||||||
|
setColorFill: func me.setFill(_getColor(arg)),
|
||||||
|
|
||||||
|
setFill: func(fill)
|
||||||
|
{
|
||||||
|
me.set('fill', fill);
|
||||||
|
},
|
||||||
|
setStroke: func(stroke)
|
||||||
|
{
|
||||||
|
me.set('stroke', stroke);
|
||||||
|
},
|
||||||
setStrokeLineWidth: func(width)
|
setStrokeLineWidth: func(width)
|
||||||
{
|
{
|
||||||
me.setDouble('stroke-width', width);
|
me.setDouble('stroke-width', width);
|
||||||
|
@ -627,23 +655,12 @@ var Path = {
|
||||||
# [on1, off1, on2, ...]
|
# [on1, off1, on2, ...]
|
||||||
setStrokeDashArray: func(pattern)
|
setStrokeDashArray: func(pattern)
|
||||||
{
|
{
|
||||||
me._node.removeChildren('stroke-dasharray');
|
|
||||||
|
|
||||||
if( typeof(pattern) == 'vector' )
|
if( typeof(pattern) == 'vector' )
|
||||||
me._node.setValues({'stroke-dasharray': pattern});
|
me.set('stroke-dasharray', string.join(',', pattern));
|
||||||
else
|
else
|
||||||
debug.warn("setStrokeDashArray: vector expected!");
|
debug.warn("setStrokeDashArray: vector expected!");
|
||||||
|
|
||||||
return me;
|
return me;
|
||||||
},
|
|
||||||
# Set the fill color and enable filling this path
|
|
||||||
#
|
|
||||||
# @param color Vector of 3 or 4 values in [0, 1]
|
|
||||||
setColorFill: func { _setColorNodes(me.color_fill, arg); me.setFill(1); },
|
|
||||||
# Enable/disable filling this path
|
|
||||||
setFill: func(fill)
|
|
||||||
{
|
|
||||||
me.setBool("fill", fill);
|
|
||||||
}
|
}
|
||||||
};
|
};
|
||||||
|
|
||||||
|
|
|
@ -341,19 +341,17 @@ var parsesvg = func(group, path, options = nil)
|
||||||
}
|
}
|
||||||
|
|
||||||
parsePath(d);
|
parsePath(d);
|
||||||
|
|
||||||
|
stack[-1].set('fill', style['fill']);
|
||||||
|
|
||||||
var w = style['stroke-width'];
|
var w = style['stroke-width'];
|
||||||
stack[-1].setStrokeLineWidth( w != nil ? w : 1 );
|
stack[-1].setStrokeLineWidth( w != nil ? w : 1 );
|
||||||
stack[-1].setColor(parseColor(style['stroke']));
|
stack[-1].set('stroke', style['stroke'] or "none");
|
||||||
|
|
||||||
var linecap = style['stroke-linecap'];
|
var linecap = style['stroke-linecap'];
|
||||||
if( linecap != nil )
|
if( linecap != nil )
|
||||||
stack[-1].setStrokeLineCap(style['stroke-linecap']);
|
stack[-1].setStrokeLineCap(style['stroke-linecap']);
|
||||||
|
|
||||||
var fill = style['fill'];
|
|
||||||
if( fill != nil and fill != "none" )
|
|
||||||
stack[-1].setColorFill(parseColor(fill));
|
|
||||||
|
|
||||||
# http://www.w3.org/TR/SVG/painting.html#StrokeDasharrayProperty
|
# http://www.w3.org/TR/SVG/painting.html#StrokeDasharrayProperty
|
||||||
var dash = style['stroke-dasharray'];
|
var dash = style['stroke-dasharray'];
|
||||||
if( dash and size(dash) > 3 )
|
if( dash and size(dash) > 3 )
|
||||||
|
|
Loading…
Reference in a new issue