Curly Logo now on Safari 3

I finally got sick and tired of Firefox and knuckled down to make Curly Logo work on Safari. So now it does. Safari version 3.0.3 anyway (sorry, it really does need SVG so anything earlier is a no go). Let me know if you see anything that looks like a bug.

Getting it working on Safari just entailed smoothing over a few differences between Firefox and Safari:

• Some CSS issue that still mystifies me. Basically Safari was displaying the main div 0 pixels wide. Web Inspector showed me what was going on straight away. I bodged that («width: 97%;» in the CSS).
• The lines output by Curly Logo weren’t being broken, everything was stuck together on one line. Turns out Firefox was letting me get away with creating (XHTML) p nodes by using “document.createElement” whereas I should really be using the XML approved “document.createElementNS” to create nodes from the XHTML namespace. So now I do.
• Tooltips weren’t working. Basically same as previous issue. Tooltips only appear on XHTML nodes correctly created using “document.createElementNS”.
• Firefox let me use the SVG DOM to edit the matrix components of an SVG transform. This was how the turtle moved. Doesn’t work on Safari. Specifically the setMatrix method of SVGTransform doesn’t seem to do anything on Safari (filed as bug 16075). I have to use the much more primitive method of treating the transform attribute of an SVG g element as a string and using «turtle.element.setAttribute(’transform’, ‘blah blah blah’)» which works just fine. How naïve of me to expect to use the more refined parts of the DOM.
• A maths cock-up that is too hilarious to contain in this small blog article, so I punted it to a later article.