Fixed issue 449: Gradients are not inverted when an element is flipped

git-svn-id: http://svg-edit.googlecode.com/svn/trunk@1795 eee81c28-f429-11dd-99c0-75d572ba1ddd
master
Alexis Deveria 2010-10-12 20:09:37 +00:00
parent 8c43ffa9d0
commit 1afd4224af
2 changed files with 65 additions and 34 deletions

View File

@ -677,7 +677,8 @@
// called when any element has changed
var elementChanged = function(window,elems) {
if(svgCanvas.getMode() == "select") {
var mode = svgCanvas.getMode();
if(mode === "select") {
setSelectMode();
}
@ -708,6 +709,12 @@
// text element was previously in focus
updateContextPanel();
// In the event a gradient was flipped:
if(selectedElement && mode === "select") {
paintBox.fill.update();
paintBox.stroke.update();
}
svgCanvas.runExtensions("elementChanged", {
elems: elems
});
@ -1308,39 +1315,8 @@
var updateToolbar = function() {
if (selectedElement != null && ['use', 'image', 'foreignObject', 'g', 'a'].indexOf(selectedElement.tagName) === -1) {
// For fill and stroke
for(var i = 0; i < 2; i++) {
var isFill = i === 0;
var type = isFill ? 'fill': 'stroke';
var paintOpacity = parseFloat(selectedElement.getAttribute(type + "-opacity"));
if (isNaN(paintOpacity)) {
paintOpacity = 1.0;
}
var defColor = isFill ? "black" : "none";
var paintColor = selectedElement.getAttribute(type) || defColor;
// prevent undo on these canvas changes
svgCanvas.setColor(type, paintColor, true);
svgCanvas.setPaintOpacity(type, paintOpacity, true);
paintOpacity *= 100;
var paint = getPaint(paintColor, paintOpacity, type);
// update the rect inside #fill_color/#stroke_color
paintBox[type].setPaint(paint);
// if(paint.type.indexOf('Gradient') >= 0) {
// var elem = paint[paint.type];
// if(elem) {
// elem.id = 'gradbox_' + type;
// $("#" + type + "_color defs").empty().append(elem);
// paint_rect.attr('fill', 'url(#gradbox_' + type + ')');
// }
// }
}
paintBox.fill.update(true);
paintBox.stroke.update(true);
$('#stroke_width').val(selectedElement.getAttribute("stroke-width")||1).change();
$('#stroke_style').val(selectedElement.getAttribute("stroke-dasharray")||"none").change();
@ -3282,6 +3258,29 @@
}
}
this.update = function(apply) {
if(!selectedElement) return;
var type = this.type;
var paintOpacity = parseFloat(selectedElement.getAttribute(type + "-opacity"));
if (isNaN(paintOpacity)) {
paintOpacity = 1.0;
}
var defColor = type === "fill" ? "black" : "none";
var paintColor = selectedElement.getAttribute(type) || defColor;
if(apply) {
svgCanvas.setColor(type, paintColor, true);
svgCanvas.setPaintOpacity(type, paintOpacity, true);
}
paintOpacity *= 100;
var paint = getPaint(paintColor, paintOpacity, type);
// update the rect inside #fill_color/#stroke_color
this.setPaint(paint);
}
this.prep = function() {
var ptype = this.paint.type;

View File

@ -3018,6 +3018,38 @@ var remapElement = this.remapElement = function(selected,changes,m) {
assignAttributes(selected, changes, 1000, true);
}
box = getBBox(selected);
for(var i = 0; i < 2; i++) {
var type = i === 0 ? 'fill' : 'stroke';
var attrVal = selected.getAttribute(type);
if(attrVal && attrVal.indexOf('url(') === 0) {
if(m.a < 0 || m.d < 0) {
var grad = getRefElem(attrVal);
var newgrad = grad.cloneNode(true);
if(m.a < 0) {
//flip x
var x1 = newgrad.getAttribute('x1');
var x2 = newgrad.getAttribute('x2');
newgrad.setAttribute('x1', -(x1 - 1));
newgrad.setAttribute('x2', -(x2 - 1));
}
if(m.d < 0) {
//flip y
var y1 = newgrad.getAttribute('y1');
var y2 = newgrad.getAttribute('y2');
newgrad.setAttribute('y1', -(y1 - 1));
newgrad.setAttribute('y2', -(y2 - 1));
}
newgrad.id = getNextId();
findDefs().appendChild(newgrad);
selected.setAttribute(type, 'url(#' + newgrad.id + ')');
}
}
}
var elName = selected.tagName;
if(elName === "g" || elName === "text" || elName === "use") {