AaronDavidNewman / Smoosic

A music notation editor written in javascript
Other
98 stars 14 forks source link

xmlns for SVG missing? #26

Closed rkr1209 closed 4 years ago

rkr1209 commented 4 years ago

Hi @AaronDavidNewman !

could it be possible that xmlns="http://www.w3.org/2000/svg" is missing? https://github.com/AaronDavidNewman/Smoosic/blob/242dd11f9c0f70fd68d7f1225c398a7a0ac12623/build/smoosic.js#L4673-L4681

Would need this for saving SVG and displaying them again in browser. Chrome for example doesn't display inline SVG without the xmlns attribute.

svg.setAttributeNS('http://www.w3.org/2000/xmlns/', 'xmlns', 'http://www.w3.org/2000/svg');

Best

AaronDavidNewman commented 4 years ago

Hi, if I understand your issue: namespaces of elements are handled differently than namespaces of attributes. So you need to add the svg namespace to the svg element itself and any elements inside

   document.createElementNS('http://www.w3.org/2000/svg', 'svg');  // or linearGradient, g, text etc

, but you use setAttributeNs('',...) with empty namespace to add attributes to it. You need to create the attribute for all child elements inside the svg element, otherwise xml will generate another namespace basically cancelling out the first one.

Saving SVG is definitely in the short list of things to do, so maybe I can just add a button to the menu for that.

rkr1209 commented 4 years ago

Hi @AaronDavidNewman ,

thanks. I have already solved the problem and posted my suggested line of code here. Maybe you want to add it :-)

AaronDavidNewman commented 4 years ago

I'm glad you fixed your problem, but I doubt namespace attributes had anything to do with it. I am able to serialize and parse the xml, and then post it back to the DOM, without all that.

var sss = new XMLSerializer()
var str = sss.serializeToString($('.musicContainer svg')[0]);
var pp = new DOMParser();
var ns = pp.parseFromString(str,'text/xml')
$('.musicContainer')[0].append(ns.rootElement);

Adding the namespace to the attributes doesn't hurt, but it is redundant because according to XML spec:

"A default namespace declaration applies to all unprefixed element names within its scope."

btw I am working on some graphical tools so that producing the translation JSON is easier for you and other translators. I hope it makes it more fun than editing a huge JSON file manually :)