github/svgedit
1
0
Fork 0
Code Issues Pull Requests Actions Packages Projects Releases Wiki Activity

Fixed issue 142: Gradients taking over

Browse Source 
git-svn-id: http://svg-edit.googlecode.com/svn/trunk@505 eee81c28-f429-11dd-99c0-75d572ba1ddd
This commit is contained in:
Alexis Deveria
2009-08-31 14:54:59 +00:00
parent 97136649f7
commit f311e73f0f
1 changed files with 130 additions and 127 deletions
Download Patch File Download Diff File Expand all files Collapse all files

257
editor/svgcanvas.js
View File

@@ -541,19 +541,33 @@ function SvgCanvas(c)
var start_y = null; var start_y = null;
var current_mode = "select"; var current_mode = "select";
var current_resize_mode = "none"; var current_resize_mode = "none";
var current_fill = "#FF0000";
var current_stroke = "#000000"; var all_properties = {
var current_stroke_paint = null; shape: {
var current_fill_paint = null; fill: "#FF0000",
var current_stroke_width = 5; fill_paint: null,
var current_stroke_style = "none"; fill_opacity: 1,
var current_opacity = 1; stroke: "#000000",
var current_stroke_opacity = 1; stroke_paint: null,
var current_fill_opacity = 1; stroke_opacity: 1,
var current_text_fill = "#000000"; stroke_width: 5,
var current_text_stroke_width = 0; stroke_style: 'none',
var current_font_size = "12pt"; opacity: 1
var current_font_family = "serif"; }
};
all_properties.text = $.extend(true, {}, all_properties.shape);
$.extend(all_properties.text, {
fill: "#000000",
stroke_width: 0,
font_size: '12pt',
font_family: 'serif'
});
var cur_properties = null;
var cur_shape = all_properties.shape;
var cur_text = all_properties.text;
var freehand_min_x = null; var freehand_min_x = null;
var freehand_max_x = null; var freehand_max_x = null;
var freehand_min_y = null; var freehand_min_y = null;
@@ -1238,13 +1252,13 @@ function SvgCanvas(c)
"points": d_attr, "points": d_attr,
"id": getNextId(), "id": getNextId(),
"fill": "none", "fill": "none",
"stroke": current_stroke, "stroke": cur_shape.stroke,
"stroke-width": current_stroke_width, "stroke-width": cur_shape.stroke_width,
"stroke-dasharray": current_stroke_style, "stroke-dasharray": cur_shape.stroke_style,
"stroke-opacity": current_stroke_opacity, "stroke-opacity": cur_shape.stroke_opacity,
"stroke-linecap": "round", "stroke-linecap": "round",
"stroke-linejoin": "round", "stroke-linejoin": "round",
"opacity": current_opacity / 2 "opacity": cur_shape.opacity / 2
} }
}); });
freehand_min_x = x; freehand_min_x = x;
@@ -1267,13 +1281,13 @@ function SvgCanvas(c)
"width": 0, "width": 0,
"height": 0, "height": 0,
"id": getNextId(), "id": getNextId(),
"fill": current_fill, "fill": cur_shape.fill,
"stroke": current_stroke, "stroke": cur_shape.stroke,
"stroke-width": current_stroke_width, "stroke-width": cur_shape.stroke_width,
"stroke-dasharray": current_stroke_style, "stroke-dasharray": cur_shape.stroke_style,
"stroke-opacity": current_stroke_opacity, "stroke-opacity": cur_shape.stroke_opacity,
"fill-opacity": current_fill_opacity, "fill-opacity": cur_shape.fill_opacity,
"opacity": current_opacity / 2 "opacity": cur_shape.opacity / 2
} }
}); });
break; break;
@@ -1287,12 +1301,12 @@ function SvgCanvas(c)
"x2": x, "x2": x,
"y2": y, "y2": y,
"id": getNextId(), "id": getNextId(),
"stroke": current_stroke, "stroke": cur_shape.stroke,
"stroke-width": current_stroke_width, "stroke-width": cur_shape.stroke_width,
"stroke-dasharray": current_stroke_style, "stroke-dasharray": cur_shape.stroke_style,
"stroke-opacity": current_stroke_opacity, "stroke-opacity": cur_shape.stroke_opacity,
"fill": "none", "fill": "none",
"opacity": current_opacity / 2 "opacity": cur_shape.opacity / 2
} }
}); });
break; break;
@@ -1305,13 +1319,13 @@ function SvgCanvas(c)
"cy": y, "cy": y,
"r": 0, "r": 0,
"id": getNextId(), "id": getNextId(),
"fill": current_fill, "fill": cur_shape.fill,
"stroke": current_stroke, "stroke": cur_shape.stroke,
"stroke-width": current_stroke_width, "stroke-width": cur_shape.stroke_width,
"stroke-dasharray": current_stroke_style, "stroke-dasharray": cur_shape.stroke_style,
"stroke-opacity": current_stroke_opacity, "stroke-opacity": cur_shape.stroke_opacity,
"fill-opacity": current_fill_opacity, "fill-opacity": cur_shape.fill_opacity,
"opacity": current_opacity / 2 "opacity": cur_shape.opacity / 2
} }
}); });
break; break;
@@ -1325,13 +1339,13 @@ function SvgCanvas(c)
"rx": 0, "rx": 0,
"ry": 0, "ry": 0,
"id": getNextId(), "id": getNextId(),
"fill": current_fill, "fill": cur_shape.fill,
"stroke": current_stroke, "stroke": cur_shape.stroke,
"stroke-width": current_stroke_width, "stroke-width": cur_shape.stroke_width,
"stroke-dasharray": current_stroke_style, "stroke-dasharray": cur_shape.stroke_style,
"stroke-opacity": current_stroke_opacity, "stroke-opacity": cur_shape.stroke_opacity,
"fill-opacity": current_fill_opacity, "fill-opacity": cur_shape.fill_opacity,
"opacity": current_opacity / 2 "opacity": cur_shape.opacity / 2
} }
}); });
break; break;
@@ -1343,16 +1357,16 @@ function SvgCanvas(c)
"x": x, "x": x,
"y": y, "y": y,
"id": getNextId(), "id": getNextId(),
"fill": current_text_fill, "fill": cur_text.fill,
"stroke": current_stroke, "stroke": cur_shape.stroke,
"stroke-width": current_text_stroke_width, "stroke-width": cur_text.stroke_width,
"stroke-dasharray": current_stroke_style, "stroke-dasharray": cur_shape.stroke_style,
"stroke-opacity": current_stroke_opacity, "stroke-opacity": cur_shape.stroke_opacity,
"fill-opacity": current_fill_opacity, "fill-opacity": cur_shape.fill_opacity,
// fix for bug where text elements were always 50% opacity // fix for bug where text elements were always 50% opacity
"opacity": current_opacity, "opacity": cur_shape.opacity,
"font-size": current_font_size, "font-size": cur_text.font_size,
"font-family": current_font_family, "font-family": cur_text.font_family,
"text-anchor": "middle" "text-anchor": "middle"
} }
}); });
@@ -1799,15 +1813,15 @@ function SvgCanvas(c)
if (selectedElements[1] == null) { if (selectedElements[1] == null) {
// set our current stroke/fill properties to the element's // set our current stroke/fill properties to the element's
var selected = selectedElements[0]; var selected = selectedElements[0];
current_fill = selected.getAttribute("fill"); cur_shape.fill = selected.getAttribute("fill");
current_fill_opacity = selected.getAttribute("fill-opacity"); cur_shape.fill_opacity = selected.getAttribute("fill-opacity");
current_stroke = selected.getAttribute("stroke"); cur_shape.stroke = selected.getAttribute("stroke");
current_stroke_opacity = selected.getAttribute("stroke-opacity"); cur_shape.stroke_opacity = selected.getAttribute("stroke-opacity");
current_stroke_width = selected.getAttribute("stroke-width"); cur_shape.stroke_width = selected.getAttribute("stroke-width");
current_stroke_style = selected.getAttribute("stroke-dasharray"); cur_shape.stroke_style = selected.getAttribute("stroke-dasharray");
if (selected.tagName == "text") { if (selected.tagName == "text") {
current_font_size = selected.getAttribute("font-size"); cur_text.font_size = selected.getAttribute("font-size");
current_font_family = selected.getAttribute("font-family"); cur_text.font_family = selected.getAttribute("font-family");
} }
selectorManager.requestSelector(selected).showGrips(true); selectorManager.requestSelector(selected).showGrips(true);
@@ -1900,13 +1914,13 @@ function SvgCanvas(c)
"rx": (freehand_max_x - freehand_min_x) / 2, "rx": (freehand_max_x - freehand_min_x) / 2,
"ry": (freehand_max_y - freehand_min_y) / 2, "ry": (freehand_max_y - freehand_min_y) / 2,
"id": getId(), "id": getId(),
"fill": current_fill, "fill": cur_shape.fill,
"stroke": current_stroke, "stroke": cur_shape.stroke,
"stroke-width": current_stroke_width, "stroke-width": cur_shape.stroke_width,
"stroke-dasharray": current_stroke_style, "stroke-dasharray": cur_shape.stroke_style,
"opacity": current_opacity, "opacity": cur_shape.opacity,
"stroke-opacity": current_stroke_opacity, "stroke-opacity": cur_shape.stroke_opacity,
"fill-opacity": current_fill_opacity "fill-opacity": cur_shape.fill_opacity
} }
}); });
call("changed",[element]); call("changed",[element]);
@@ -1924,13 +1938,13 @@ function SvgCanvas(c)
"width": (freehand_max_x - freehand_min_x), "width": (freehand_max_x - freehand_min_x),
"height": (freehand_max_y - freehand_min_y), "height": (freehand_max_y - freehand_min_y),
"id": getId(), "id": getId(),
"fill": current_fill, "fill": cur_shape.fill,
"stroke": current_stroke, "stroke": cur_shape.stroke,
"stroke-width": current_stroke_width, "stroke-width": cur_shape.stroke_width,
"stroke-dasharray": current_stroke_style, "stroke-dasharray": cur_shape.stroke_style,
"opacity": current_opacity, "opacity": cur_shape.opacity,
"stroke-opacity": current_stroke_opacity, "stroke-opacity": cur_shape.stroke_opacity,
"fill-opacity": current_fill_opacity "fill-opacity": cur_shape.fill_opacity
} }
}); });
call("changed",[element]); call("changed",[element]);
@@ -1969,13 +1983,13 @@ function SvgCanvas(c)
"attr": { "attr": {
"d": d_attr, "d": d_attr,
"id": getNextId(), "id": getNextId(),
"fill": current_fill, "fill": cur_shape.fill,
"fill-opacity": current_fill_opacity, "fill-opacity": cur_shape.fill_opacity,
"stroke": current_stroke, "stroke": cur_shape.stroke,
"stroke-width": current_stroke_width, "stroke-width": cur_shape.stroke_width,
"stroke-dasharray": current_stroke_style, "stroke-dasharray": cur_shape.stroke_style,
"stroke-opacity": current_stroke_opacity, "stroke-opacity": cur_shape.stroke_opacity,
"opacity": current_opacity / 2 "opacity": cur_shape.opacity / 2
} }
}); });
// set stretchy line to first point // set stretchy line to first point
@@ -2171,7 +2185,7 @@ function SvgCanvas(c)
element = null; element = null;
} else if (element != null) { } else if (element != null) {
canvas.addedNew = true; canvas.addedNew = true;
element.setAttribute("opacity", current_opacity); element.setAttribute("opacity", cur_shape.opacity);
cleanupElement(element); cleanupElement(element);
selectorManager.update(); selectorManager.update();
canvas.addToSelection([element], true); canvas.addToSelection([element], true);
@@ -2313,28 +2327,26 @@ function SvgCanvas(c)
current_poly = null; current_poly = null;
current_poly_pts = []; current_poly_pts = [];
} }
cur_properties = (selectedElements[0] && selectedElements[0].nodeName == 'text') ? cur_text : cur_shape;
current_mode = name; current_mode = name;
}; };
this.getStrokeColor = function() { this.getStrokeColor = function() {
return current_stroke; return cur_properties.stroke;
}; };
this.setStrokeColor = function(val) { this.setStrokeColor = function(val) {
current_stroke = val; cur_shape.stroke = val;
this.changeSelectedAttribute("stroke", val); this.changeSelectedAttribute("stroke", val);
}; };
this.getFillColor = function() { this.getFillColor = function() {
return current_fill; return cur_properties.fill;
}; };
this.setFillColor = function(val) { this.setFillColor = function(val) {
if(selectedElements[0] != null && selectedElements[0].nodeName == 'text') { cur_properties.fill = val;
current_text_fill = val;
} else {
current_fill = val;
}
// take out any path/line elements when setting fill // take out any path/line elements when setting fill
var elems = []; var elems = [];
@@ -2364,15 +2376,11 @@ function SvgCanvas(c)
var addGradient = function() { var addGradient = function() {
$.each(['stroke','fill'],function(i,type) { $.each(['stroke','fill'],function(i,type) {
if(type == 'stroke' && (!current_stroke_paint || current_stroke_paint.type == "solidColor")) return; if(!cur_properties[type + '_paint'] || cur_properties[type + '_paint'].type == "solidColor") return;
if(type == 'fill' && (!current_fill_paint || current_fill_paint.type == "solidColor")) return;
var grad = canvas[type + 'Grad']; var grad = canvas[type + 'Grad'];
// find out if there is a duplicate gradient already in the defs // find out if there is a duplicate gradient already in the defs
var duplicate_grad = findDuplicateGradient(grad); var duplicate_grad = findDuplicateGradient(grad);
var defs = findDefs(); var defs = findDefs();
// no duplicate found, so import gradient into defs // no duplicate found, so import gradient into defs
if (!duplicate_grad) { if (!duplicate_grad) {
grad = defs.appendChild( svgdoc.importNode(grad, true) ); grad = defs.appendChild( svgdoc.importNode(grad, true) );
@@ -2383,7 +2391,6 @@ function SvgCanvas(c)
grad = duplicate_grad; grad = duplicate_grad;
} }
var functype = type=='fill'?'Fill':'Stroke'; var functype = type=='fill'?'Fill':'Stroke';
canvas['set'+ functype +'Color']("url(#" + grad.id + ")"); canvas['set'+ functype +'Color']("url(#" + grad.id + ")");
}); });
} }
@@ -2432,82 +2439,78 @@ function SvgCanvas(c)
}; };
this.setStrokePaint = function(p, addGrad) { this.setStrokePaint = function(p, addGrad) {
current_stroke_paint = new $.jGraduate.Paint(p); cur_properties.stroke_paint = new $.jGraduate.Paint(p);
if (current_stroke_paint.type == "solidColor") { if (cur_properties.stroke_paint.type == "solidColor") {
this.setStrokeColor("#"+current_stroke_paint.solidColor); this.setStrokeColor("#"+cur_properties.stroke_paint.solidColor);
} }
else if(current_stroke_paint.type == "linearGradient") { else if(cur_properties.stroke_paint.type == "linearGradient") {
canvas.strokeGrad = current_stroke_paint.linearGradient; canvas.strokeGrad = cur_properties.stroke_paint.linearGradient;
if(addGrad) addGradient(); if(addGrad) addGradient();
} }
else { else {
// console.log("none!"); // console.log("none!");
} }
this.setStrokeOpacity(current_stroke_paint.alpha/100); this.setStrokeOpacity(cur_properties.stroke_paint.alpha/100);
}; };
this.setFillPaint = function(p, addGrad) { this.setFillPaint = function(p, addGrad) {
// copy the incoming paint object // copy the incoming paint object
current_fill_paint = new $.jGraduate.Paint(p); cur_properties.fill_paint = new $.jGraduate.Paint(p);
if (current_fill_paint.type == "solidColor") { if (cur_properties.fill_paint.type == "solidColor") {
this.setFillColor("#"+current_fill_paint.solidColor); this.setFillColor("#"+cur_properties.fill_paint.solidColor);
} }
else if(current_fill_paint.type == "linearGradient") { else if(cur_properties.fill_paint.type == "linearGradient") {
canvas.fillGrad = current_fill_paint.linearGradient; canvas.fillGrad = cur_properties.fill_paint.linearGradient;
if(addGrad) addGradient(); if(addGrad) addGradient();
} }
else { else {
// console.log("none!"); // console.log("none!");
} }
this.setFillOpacity(current_fill_paint.alpha/100); this.setFillOpacity(cur_properties.fill_paint.alpha/100);
}; };
this.getStrokeWidth = function() { this.getStrokeWidth = function() {
return current_stroke_width; return cur_properties.stroke_width;
}; };
this.setStrokeWidth = function(val) { this.setStrokeWidth = function(val) {
if(selectedElements[0] != null && selectedElements[0].nodeName == 'text') { cur_properties.stroke_width = val;
current_text_stroke_width = val;
} else {
current_stroke_width = val;
}
this.changeSelectedAttribute("stroke-width", val); this.changeSelectedAttribute("stroke-width", val);
}; };
this.getStrokeStyle = function() { this.getStrokeStyle = function() {
return current_stroke_style; return cur_shape.stroke_style;
}; };
this.setStrokeStyle = function(val) { this.setStrokeStyle = function(val) {
current_stroke_style = val; cur_shape.stroke_style = val;
this.changeSelectedAttribute("stroke-dasharray", val); this.changeSelectedAttribute("stroke-dasharray", val);
}; };
this.getOpacity = function() { this.getOpacity = function() {
return current_opacity; return cur_shape.opacity;
}; };
this.setOpacity = function(val) { this.setOpacity = function(val) {
current_opacity = val; cur_shape.opacity = val;
this.changeSelectedAttribute("opacity", val); this.changeSelectedAttribute("opacity", val);
}; };
this.getFillOpacity = function() { this.getFillOpacity = function() {
return current_fill_opacity; return cur_shape.fill_opacity;
}; };
this.setFillOpacity = function(val) { this.setFillOpacity = function(val) {
current_fill_opacity = val; cur_shape.fill_opacity = val;
this.changeSelectedAttribute("fill-opacity", val); this.changeSelectedAttribute("fill-opacity", val);
}; };
this.getStrokeOpacity = function() { this.getStrokeOpacity = function() {
return current_stroke_opacity; return cur_shape.stroke_opacity;
}; };
this.setStrokeOpacity = function(val) { this.setStrokeOpacity = function(val) {
current_stroke_opacity = val; cur_shape.stroke_opacity = val;
this.changeSelectedAttribute("stroke-opacity", val); this.changeSelectedAttribute("stroke-opacity", val);
}; };
@@ -2609,20 +2612,20 @@ function SvgCanvas(c)
}; };
this.getFontFamily = function() { this.getFontFamily = function() {
return current_font_family; return cur_text.font_family;
}; };
this.setFontFamily = function(val) { this.setFontFamily = function(val) {
current_font_family = val; cur_text.font_family = val;
this.changeSelectedAttribute("font-family", val); this.changeSelectedAttribute("font-family", val);
}; };
this.getFontSize = function() { this.getFontSize = function() {
return current_font_size; return cur_text.font_size;
}; };
this.setFontSize = function(val) { this.setFontSize = function(val) {
current_font_size = val; cur_text.font_size = val;
this.changeSelectedAttribute("font-size", val); this.changeSelectedAttribute("font-size", val);
}; };