Place image changes

master
Mark MacKay 2021-06-09 19:13:58 -05:00
parent 37381f2ad4
commit 65ee522665
4 changed files with 89 additions and 98 deletions

View File

@ -418,11 +418,13 @@
</div>
<!-- formerly gsvg_panel -->
<div id="container_panel" class="context_panel clearfix">
<div id="svg_panel" class="context_panel clearfix">
<h4>SVG</h4>
</div>
<div id="use_panel" class="context_panel clearfix">
<div class="button" id="tool_unlink_use" data-title="Break link">Break link reference</div>
<h4>Use</h4>
<div class="button full" id="tool_unlink_use" data-title="Break link">Break use ref</div>
</div>
<div id="g_panel" class="context_panel clearfix">
@ -500,7 +502,7 @@
</div>
<div id="align_tools">
<h4>Align</h4>
<h4>Align to canvas</h4>
<div class="toolset align_buttons" id="tool_position">
<label>
<div class="col last clear" id="position_opts">

View File

@ -26,11 +26,9 @@ MD.Import = function(){
var reader = new FileReader();
reader.onloadend = function(e) {
svgCanvas.importSvgString(e.target.result, true);
svgCanvas.ungroupSelectedElement()
svgCanvas.ungroupSelectedElement()
svgCanvas.groupSelectedElements()
svgCanvas.alignSelectedElements("m", "page")
svgCanvas.alignSelectedElements("c", "page")
//svgCanvas.ungroupSelectedElement();
svgCanvas.alignSelectedElements("m", "page");
svgCanvas.alignSelectedElements("c", "page");
};
reader.readAsText(file);
}
@ -74,7 +72,7 @@ MD.Import = function(){
reader.readAsDataURL(file)
}
//editor.saveCanvas();
}
function loadSvgString(str, callback) {
@ -83,6 +81,7 @@ MD.Import = function(){
callback = callback || $.noop;
if(success) {
callback(true);
editor.saveCanvas();
} else {
$.alert("Error: Unable to load SVG data", function() {
callback(false);

View File

@ -82,7 +82,11 @@ MD.Panel = function(){
svgCanvas.pathActions.opencloseSubPath();
});
// Text Path
// Use
$("#tool_unlink_use").on("click", function(){
svgCanvas.ungroupSelectedElement();
});
function show(elem) {
$('.context_panel').hide();
@ -243,7 +247,8 @@ MD.Panel = function(){
line: ['x1','y1','x2','y2'],
text: ['x', 'y'],
'use': [],
path : []
path : [],
svg : [],
};
var el_name = elem.tagName;

View File

@ -5492,7 +5492,6 @@ var uniquifyElems = this.uniquifyElems = function(g) {
}
// remap all href attributes
var hreffers = ids[oldid]["hrefs"];
console.log(hreffers)
var k = hreffers.length;
while (k--) {
var hreffer = hreffers[k];
@ -6002,43 +6001,63 @@ this.getPaint = function(color, opac, type) {
// was obtained
// * import should happen in top-left of current zoomed viewport
this.importSvgString = function(xmlString) {
try {
// Get unique ID
var uid = svgedit.utilities.encode64(xmlString.length + xmlString).substr(0,32);
var useExisting = false;
// Look for symbol and make sure symbol exists in image
if(import_ids[uid]) {
if( $(import_ids[uid].symbol).parents('#svgroot').length ) {
useExisting = true;
}
}
var batchCmd = new BatchCommand("Import SVG");
if(useExisting) {
var symbol = import_ids[uid].symbol;
var ts = import_ids[uid].xform;
} else {
// convert string into XML document
var newDoc = svgedit.utilities.text2xml(xmlString);
this.prepareSvg(newDoc);
// import new svg document into our document
var svg;
// If DOM3 adoptNode() available, use it. Otherwise fall back to DOM2 importNode()
if(svgdoc.adoptNode) {
svg = svgdoc.adoptNode(newDoc.documentElement);
}
else {
svg = svgdoc.importNode(newDoc.documentElement, true);
}
var svg = svgdoc.adoptNode(newDoc.documentElement);
uniquifyElems(svg);
// Put all paint elems in defs
$(svg).find('linearGradient, radialGradient, pattern').appendTo(findDefs());
svg.querySelectorAll('textPath').forEach(function(el){
const href = svgCanvas.getHref(el);
if (!href) return;
const path = svgcontent.querySelector(href);
$(path).appendTo(findDefs());
const offset = el.getAttribute("startOffset");
// convert percentage based to absolute
if (offset.includes("%") && path) {
const totalLength = path.getTotalLength();
const pct = parseFloat(offset) * .01;
el.setAttribute("startOffset", (pct * totalLength).toFixed(0))
}
const tspan = el.querySelector("tspan");
const text = el.closest("text");
text.setAttributeNS(xmlns, "xml:space", "default");
if (tspan && text) {
// grab the first tspan and apply it to the text element
svgedit.sanitize.svgWhiteList()["text"].forEach(attr => {
const value = tspan.getAttribute(attr);
if (value && attr !== "id" && !attr.includes(":")) {
tspan.removeAttribute(attr);
text.setAttribute(attr, value);
}
});
tspan.setAttributeNS(xmlns, "xml:space", "preserve");
}
})
// Set ref element for <use> elements
// TODO: This should also be done if the object is re-added through "redo"
setUseData(svg);
convertGradients(svg);
// recalculate dimensions on the top-level children so that unnecessary transforms
// are removed
svgedit.utilities.walkTreePost(svgcontent, function(n){try{recalculateDimensions(n)}catch(e){console.log(e)}});
var innerw = convertToNum('width', svg.getAttribute("width")),
innerh = convertToNum('height', svg.getAttribute("height")),
innervb = svg.getAttribute("viewBox"),
@ -6050,53 +6069,19 @@ this.importSvgString = function(xmlString) {
// TODO: properly handle preserveAspectRatio
var canvasw = +svgcontent.getAttribute("width"),
canvash = +svgcontent.getAttribute("height");
// imported content should be 1/3 of the canvas on its largest dimension
// Hack to make recalculateDimensions understand how to scale
var ts = "translate(0)";
var symbol = svgdoc.createElementNS(svgns, "symbol");
var defs = findDefs();
const layer = (current_group || getCurrentDrawing().getCurrentLayer());
const g = svgdoc.createElementNS(svgns, "g");
while (svg.firstChild) {
var first = svg.firstChild;
symbol.appendChild(first);
g.appendChild(svg.firstChild);
}
var attrs = svg.attributes;
for(var i=0; i < attrs.length; i++) {
var attr = attrs[i];
symbol.setAttribute(attr.nodeName, attr.nodeValue);
}
symbol.id = getNextId();
layer.appendChild(g);
batchCmd.addSubCommand(new InsertElementCommand(g));
// Store data
import_ids[uid] = {
symbol: symbol,
xform: ts
}
findDefs().appendChild(symbol);
batchCmd.addSubCommand(new InsertElementCommand(symbol));
}
var use_el = svgdoc.createElementNS(svgns, "use");
use_el.id = getNextId();
setHref(use_el, "#" + symbol.id);
(current_group || getCurrentDrawing().getCurrentLayer()).appendChild(use_el);
batchCmd.addSubCommand(new InsertElementCommand(use_el));
clearSelection();
use_el.setAttribute("transform", ts);
recalculateDimensions(use_el);
$(use_el).data('symbol', symbol).data('ref', symbol);
addToSelection([use_el]);
// TODO: Find way to add this in a recalculateDimensions-parsable way
// if (vb[0] != 0 || vb[1] != 0)
// ts = "translate(" + (-vb[0]) + "," + (-vb[1]) + ") " + ts;
addToSelection([g]);
addCommandToHistory(batchCmd);
call("changed", [svgcontent]);