Add button 'Copy SVG to clipboard'

[svenhb]

It would be useful to copy the generated SVG to the clipboard instead of saving it, because pasting the SVG into the target program is much quicker...

This could be useful: https://stackoverflow.com/questions/400212/how-do-i-copy-to-the-clipboard-in-javascript

[svenhb]

I also figured out, that the order of the attributes is important in function 'resetSVG()':

Old:     mainpath.setAttributeNS(null, "style", "stroke-width: 2px; fill: none; stroke: " + (config.Inverted?"white":"black"))
New:     mainpath.setAttributeNS(null, "style", "stroke:" + (config.Inverted?"white":"black")+";stroke-width:0.2mm;fill:none;") 

Otherwise I get '2px' as color name - strange. Some how a bug inside c# XElement.

My working code for copy to clipboard looks like this:

    function copytoclipboard(){
        const svgString = '<?xml version="1.0" standalone="no"?>\r\n'	//<!DOCTYPE svg PUBLIC "-//W3C//DTD SVG 1.1//EN" "http://www.w3.org/Graphics/SVG/1.1/DTD/svg11.dtd">\r\n'
        + (new XMLSerializer()).serializeToString(svg);

        navigator.clipboard.writeText(svgString);
    }

[mitxela]

Sure, I could add this.

It's suspicious if the style depends on the order. They're separate properties so I wouldn't have thought it would matter - unlike, for instance, CSS border, which is a shorthand for a bunch of border properties, so it's conceivable that setting a new border could overwrite an earlier, more specific border-color. But SVG stroke and stroke-width are separate.

What are you pasting the SVGs into?

[svenhb]

Yes it is really wired, I assume it depends on C# XElement, because i can't find a problem in my code ;-) I paste SVGs to my https://github.com/svenhb/GRBL-Plotter