|
|
|
|
@@ -16,7 +16,41 @@ svgEditor.addExtension("eyedropper", function(S) {
|
|
|
|
|
currentStyle = {fillPaint: "red", fillOpacity: 1.0,
|
|
|
|
|
strokePaint: "black", strokeOpacity: 1.0,
|
|
|
|
|
strokeWidth: 5, strokeDashArray: null,
|
|
|
|
|
opacity: 1.0 };
|
|
|
|
|
opacity: 1.0,
|
|
|
|
|
strokeLinecap: 'butt',
|
|
|
|
|
strokeLinejoin: 'miter',
|
|
|
|
|
};
|
|
|
|
|
|
|
|
|
|
function getStyle(opts) {
|
|
|
|
|
// if we are in eyedropper mode, we don't want to disable the eye-dropper tool
|
|
|
|
|
var mode = svgCanvas.getMode();
|
|
|
|
|
if (mode == "eyedropper") return;
|
|
|
|
|
|
|
|
|
|
var elem = null;
|
|
|
|
|
var tool = $('#tool_eyedropper');
|
|
|
|
|
// enable-eye-dropper if one element is selected
|
|
|
|
|
if (opts.elems.length == 1 && opts.elems[0] &&
|
|
|
|
|
$.inArray(opts.elems[0].nodeName, ['svg', 'g', 'use']) == -1)
|
|
|
|
|
{
|
|
|
|
|
elem = opts.elems[0];
|
|
|
|
|
tool.removeClass('disabled');
|
|
|
|
|
// grab the current style
|
|
|
|
|
currentStyle.fillPaint = elem.getAttribute("fill") || "black";
|
|
|
|
|
currentStyle.fillOpacity = elem.getAttribute("fill-opacity") || 1.0;
|
|
|
|
|
currentStyle.strokePaint = elem.getAttribute("stroke");
|
|
|
|
|
currentStyle.strokeOpacity = elem.getAttribute("stroke-opacity") || 1.0;
|
|
|
|
|
currentStyle.strokeWidth = elem.getAttribute("stroke-width");
|
|
|
|
|
currentStyle.strokeDashArray = elem.getAttribute("stroke-dasharray");
|
|
|
|
|
currentStyle.strokeLinecap = elem.getAttribute("stroke-linecap");
|
|
|
|
|
currentStyle.strokeLinejoin = elem.getAttribute("stroke-linejoin");
|
|
|
|
|
currentStyle.opacity = elem.getAttribute("opacity") || 1.0;
|
|
|
|
|
}
|
|
|
|
|
// disable eye-dropper tool
|
|
|
|
|
else {
|
|
|
|
|
tool.addClass('disabled');
|
|
|
|
|
}
|
|
|
|
|
|
|
|
|
|
}
|
|
|
|
|
|
|
|
|
|
return {
|
|
|
|
|
name: "eyedropper",
|
|
|
|
|
@@ -33,33 +67,8 @@ svgEditor.addExtension("eyedropper", function(S) {
|
|
|
|
|
}],
|
|
|
|
|
|
|
|
|
|
// if we have selected an element, grab its paint and enable the eye dropper button
|
|
|
|
|
selectedChanged: function(opts) {
|
|
|
|
|
// if we are in eyedropper mode, we don't want to disable the eye-dropper tool
|
|
|
|
|
var mode = svgCanvas.getMode();
|
|
|
|
|
if (mode == "eyedropper") return;
|
|
|
|
|
|
|
|
|
|
var elem = null;
|
|
|
|
|
var tool = $('#tool_eyedropper');
|
|
|
|
|
// enable-eye-dropper if one element is selected
|
|
|
|
|
if (opts.elems.length == 1 && opts.elems[0] &&
|
|
|
|
|
$.inArray(opts.elems[0].nodeName, ['svg', 'g', 'use']) == -1)
|
|
|
|
|
{
|
|
|
|
|
elem = opts.elems[0];
|
|
|
|
|
tool.removeClass('disabled');
|
|
|
|
|
// grab the current style
|
|
|
|
|
currentStyle.fillPaint = elem.getAttribute("fill") || "black";
|
|
|
|
|
currentStyle.fillOpacity = elem.getAttribute("fill-opacity") || 1.0;
|
|
|
|
|
currentStyle.strokePaint = elem.getAttribute("stroke");
|
|
|
|
|
currentStyle.strokeOpacity = elem.getAttribute("stroke-opacity") || 1.0;
|
|
|
|
|
currentStyle.strokeWidth = elem.getAttribute("stroke-width");
|
|
|
|
|
currentStyle.strokeDashArray = elem.getAttribute("stroke-dasharray");
|
|
|
|
|
currentStyle.opacity = elem.getAttribute("opacity") || 1.0;
|
|
|
|
|
}
|
|
|
|
|
// disable eye-dropper tool
|
|
|
|
|
else {
|
|
|
|
|
tool.addClass('disabled');
|
|
|
|
|
}
|
|
|
|
|
},
|
|
|
|
|
selectedChanged: getStyle,
|
|
|
|
|
elementChanged: getStyle,
|
|
|
|
|
|
|
|
|
|
mouseDown: function(opts) {
|
|
|
|
|
var mode = svgCanvas.getMode();
|
|
|
|
|
@@ -81,6 +90,8 @@ svgEditor.addExtension("eyedropper", function(S) {
|
|
|
|
|
if (currentStyle.strokeWidth) change(target, "stroke-width", currentStyle.strokeWidth);
|
|
|
|
|
if (currentStyle.strokeDashArray) change(target, "stroke-dasharray", currentStyle.strokeDashArray);
|
|
|
|
|
if (currentStyle.opacity) change(target, "opacity", currentStyle.opacity);
|
|
|
|
|
if (currentStyle.strokeLinecap) change(target, "stroke-linecap", currentStyle.strokeLinecap);
|
|
|
|
|
if (currentStyle.strokeLinejoin) change(target, "stroke-linejoin", currentStyle.strokeLinejoin);
|
|
|
|
|
|
|
|
|
|
addToHistory(new ChangeElementCommand(target, changes));
|
|
|
|
|
}
|
|
|
|
|
|