JavaScript to make Q, ABBR and ACRONYM
work properly in Internet Explorer

This document is linked from
http://www.ookingdom.com/design/phrase

====================================================

The scripts in this document were used on The Oo Kingdom
from October 15, 2003 until February 2, 2004, when they
were removed in favor of manual curly quotation marks
(replacing the Q tags) and ACRONYM tags (replacing all
ABBR tags). The reason for the "backward" switch was that
Internet Explorer would reload images after running the
script, causing an annoying flicker during page load.

====================================================

Use the following script to isolate Internet Explorer browsers.
If this is not done, other browsers may choke on the main script.
The document.all catches all IE 4, 5 and 6 but also Opera 7,
which doesn't need the main script anyway, and it will cause
the pages to render horribly (trust me). The document.bgColor
is only used to exclude Opera 7.

====================================================

// Send phrase element script to IE 4, 5 and 6
if (document.all && document.bgColor) {
document.write('<scr'+'ipt type="text\/javascript" src="'+dir+'ie.js"><\/scr'+'ipt>');
}

====================================================

What follows is the main script, which I have named ie.js.
The ABBR and ACRONYM portion was taken from Jacques Distler's page at
http://golem.ph.utexas.edu/~distler/blog/archives/000218.html
with my own minor modifications. (The final version of the script
appears at the bottom of this document; I combined everything into
one operation and removed the comment lines, dramatically decreasing
the size of the script and making it run more quickly.)

====================================================

function fixIE() {
var BodySource, reg

BodySource = document.body.innerHTML;
// IE6 won't supply quotation marks with Q,
// so replace the tags with quotation marks.

// Find Q tags with attributes (use class="nested" for nested quotes)
reg = /<Q([^>]+)>([^<]+)<\/Q>/g;
BodySource = BodySource.replace(reg, '&#8216;$2&#8217;');

// Find nested Q elements containing one other element (with or without attributes)
// You can choose different elements if you like, as long as the sets match.
reg = /<Q([^>]+)>([^<]*)<(ABBR|ACRONYM|EM|STRONG|CITE|DFN|SPAN|CODE)([^>]*)>([^<]+)<\/(ABBR|ACRONYM|EM|STRONG|CITE|DFN|SPAN|CODE)>([^<]*)<\/Q>/g;
BodySource = BodySource.replace(reg, '&#8216;$2<$3$4>$5</$6>$7&#8217;');

// Now replace other Q tags with quotes.
// The SPAN class="end" is for styling,
// for quotes that continue into the next paragraph.
BodySource = BodySource.replace(/<Q>/g, '&#8220;').replace(/<\/Q>/g, '<SPAN class="end">&#8221;</SPAN>');

// Wrap content of ABBR or ACRONYM elements containing TITLE attribute
// with <SPAN class="abbr"> which can then be styled for IE.
reg = /<(ABBR|ACRONYM)([^>]+)>([^<]+)<\/(ABBR|ACRONYM)>/g;
BodySource = BodySource.replace(reg, '<$1$2><SPAN class=\"abbr\" $2>$3</SPAN></$4>');

// now replace original HTML with amended HTML
document.body.innerHTML = BodySource;
}

window.onload = function(){fixIE()};

====================================================

Following is the final version of ie.js:

====================================================

function fixIE() {
document.body.innerHTML=document.body.innerHTML.replace(/<Q([^>]+)>([^<]+)<\/Q>/g, '&#8216;$2&#8217;').replace(/<Q([^>]+)>([^<]*)<(ABBR|ACRONYM|EM|STRONG|CITE|DFN|SPAN|CODE)([^>]*)>([^<]+)<\/(ABBR|ACRONYM|EM|STRONG|CITE|DFN|SPAN|CODE)>([^<]*)<\/Q>/g, '&#8216;$2<$3$4>$5</$6>$7&#8217;').replace(/<Q>/g, '&#8220;').replace(/<\/Q>/g, '<SPAN class="end">&#8221;</SPAN>').replace(/<(ABBR|ACRONYM)([^>]+)>([^<]+)<\/(ABBR|ACRONYM)>/g, '<$1$2><SPAN class="abbr" $2>$3</SPAN></$4>');
}

window.onload = function(){fixIE()};