This is a proof of concept. I’ve gotten it to work on Firefox, and believe similar techniques would work on Opera and nightlies of WebKit. It does not add MathML or SVG support to browsers that don’t already have it, it merely enables browsers which already recognize these grammars in XHTML5 to render similar structures when found in HTML4 documents.
Instructions:
Copy the script to your web server. If you hotlink, you will be banned.
Insert a call to this script in your HTML4 page. Example:
<script src="mathmlAndSvgForHTML4.js"></script>
Ensure that the empty tag syntax of XML is not used; replace all such occurrences with a pair of start and end tags
Ensure that all MathML character entity references are replaced with their equivalent numeric character references or the Unicode character itself.
To get it working in Opera 9 I made some minor modifications to your script. First you can’t use _proto_, commenting that line out makes the script continue. Then in the copy children for-loop you check the nodeNames in uppercase. It seems the nodeNames are in lowercase in Opera, and commenting out the uppercasing makes it work nicely.
What should that test be? After brief testing in opera, I found that the source object is an HTMLUnknownElement, but that test wasn’t the way to verify it.
I’d love to have a single version that supported both browsers, but I would prefer to have a version of that test (possibly with an || involved) instead of dropping that entirely. The reason is for forward compatibility: in the event that one or both browsers ever support MathML in HTML4 directly, I’d like my script to automatically be disabled.
The casing issue is definitely something that can be handled.
Now fast-forward a couple of years. XHTML was the W3C’s baby. But with a not-particularly-long snippet of JavaScript, Sam Ruby has kicked the chair out from under XHTML. Actually, that’s not really the right image. Imagine a man with a chiseled jaw...
The W3C is a source of irritation to many web-developers. It seems to produce heinously complex specification solving problems nobody has. It’s tackling issues such as the semantic web, when much “simpler” issues such as, say, the...
HTML, SVG, and MathML The Beginning of the End | Musings “Sam Ruby has been busy. He’s been lobbying for changes in the HTML5 Specification which will, ultimately, enable embedding of MathML and SVG in HTML5 documents.” (tags:...
In a matter of a weekend; rusty on COM, unfamiliar with the Mozilla codebase, class libraries, build process, trace facilities, test suites, and debugging aids; and therefore armed only with make, vi, and fprintf; I came up with this mode...
[more]
I am in the middle of preparing1 a couple of SVG flow charts. They’re vector, so obviously I prefer them to image files. What I am not sure though is how to embed them within XHTML correctly. So far, I’ve looked at Adobe’s page,...
I really appreciated the tip on embedding SVG... and thought I would share what I did with it.
My current project is a supply chain management application that interfaces with Google maps for some segmentation/registration logic. As part of this, I have to also integrate with dot to create graphs that manage hierarchical topologies within the data... some of which I have to display on the page.
I had just about resigned myself to popping up another window and putting SVG into it (or creating PNG files that I then loaded into image tags), when I found this article.
As a result - I am using an Ajax updater to make a request to a perl script - that generates a dot graph (using GraphViz). I then pass the as_svg() result through this filter:
sub svgProcessor
{
my ($result) = shift @_;
if ( $result =~ /<svg/ ) {
$result = ‘<svg’ . $';
}
while ( $result =~ /(<([^< ]+)( .*)(\/\>))/i) {
$result = $` . “<$2$3></$2>” . $';
}
return ($result);
}
to handle the empty-tag syntax... and return it back in the return... amazingly enough it works like a champ. Thanks!
Demo Notes: Requires the Silverlight plugin to see the silverlight rendering, and a browser that supports SVG to see the SVG rendering. This is a work in progress. Conversion of many SVG features ...
[more]
Slides from a presentation that I should be giving in just over two hours. For those interested in the sausage making: script, source, css, js. The server script provides a dual purpose: it can be run as a CGI during development, ...
[more]
updated: Cross-browser implementation of progress element
What an amazing coincidence: the Webkit nightly contained a first implementation of the progress element. I created an application to test the element. It works as I expected, and is somewhat accessible, though Mac’s VoiceOver would only voice the...
This example may be useful for you, explanation . SVG rendering support on load time and MIME text/html is a supported feature of ItsNat Java web framework, anyway it was inspired on this JS code , the latter can be useful for you in your context...