/**
 *
 * XHTML 1.1 Ruby markup suffers from the "browsers don't always bother to obey CSS" problem.
 * The standard way to visualise ruby is by making the ruby code an inline table, and bottom
 * aligning it. However, not all browsers understand "bottom". or "baseline". This javascript
 * will try to make sure the ruby placement is correct for all major browsers by detecting the
 * browser, and modifying the ruby CSS rules accordingly.
 *
 * - Mike "Pomax" Kamermans
 */

// ----------------------------------------------------------------------------------------------------------------------
// CSS MANIPULATION
//
// based on http://www.hunlock.com/blogs/Totally_Pwn_CSS_with_Javascript
// ----------------------------------------------------------------------------------------------------------------------

function getCSSRule(ruleName, deleteFlag) {
	ruleName=ruleName.toLowerCase();
	if (document.styleSheets) {
		for (var i=0; i<document.styleSheets.length; i++) {
			var styleSheet=document.styleSheets[i];
			var ii=0;
			var cssRule=false;
			do {
				if (styleSheet.cssRules) { cssRule = styleSheet.cssRules[ii]; }
				else { cssRule = styleSheet.rules[ii]; }
				if (cssRule)  {
					if (cssRule.selectorText.toLowerCase()==ruleName) {
						if (deleteFlag=='delete') {
							if (styleSheet.cssRules) { styleSheet.deleteRule(ii); }
							else { styleSheet.removeRule(ii); }
							return true; }
						else { return cssRule; }}}
				ii++;
			}
			while (cssRule) }}
	return false;}

function killCSSRule(ruleName) { return getCSSRule(ruleName,'delete'); }

function addCSSRule(ruleName) {
	if (document.styleSheets) {
		if (!getCSSRule(ruleName)) {
			if (document.styleSheets[0].addRule) { document.styleSheets[0].addRule(ruleName, null,0); }
			else { document.styleSheets[0].insertRule(ruleName+' { }', 0); }}}
	return getCSSRule(ruleName); }

// ----------------------------------------------------------------------------------------------------------------------
// Ruby alignment code
// ----------------------------------------------------------------------------------------------------------------------

/**
 * Check which browser render engine we're dealing with
 */
function getBrowser()
{
	var opera="opera"; var ie="ie"; var gecko="gecko"; var chrome = "chrome"; var browser="unknown";
	if (window.opera) { browser = opera; }
	else if (Array.every) { browser = gecko; }
	else if (document.all) { browser = ie; }
	else if (window.chrome) { browser = chrome; }
	return browser;
}
	
/**
 * Different browsers (of fucking course) do different things when using named vertical alignments.
 * So, even though it's highly undesirable, browser-dependent corrections.
 */
function fixRubyAlignment()
{
	// Webkit and Gecko browsers align properly on "bottom", but other browsers do not...
	var browser = getBrowser();
	var rubyrule = getCSSRule("ruby");

	// if we're rendering for IE, then annoyingly 'bottom' doesn't align properly. However, we can use 'baseline' instead, and all is well
	if(browser=="ie") { rubyrule.style.verticalAlign = "baseline";	}	
	// Opera (9.5x) is even more annoying. Neither "bottom" nor "baseline" does what it's supposed to do, so we're left with value (em) manipulation instead.
	else if(browser=="opera") { rubyrule.style.verticalAlign = "1.3em"; }
	 
	 // Chrome 4.x doesn't support ruby unless IT gets to call the CSS shots
	else if(browser=="chrome") {
		killCSSRule('rp');
		killCSSRule('rt');
		killCSSRule('rb');
		killCSSRule('ruby'); }
	// if we don't know what browser this is, assume "bottom" works. If it doesn't, their fault.
	else { rubyrule.style.verticalAlign = "bottom"; }
}


// ----------------------------------------------------------------------------------------------------------------------
// DokuWiki code
// ----------------------------------------------------------------------------------------------------------------------

/**
 * lets dokuwiki schedule the javascript call
 */
addInitEvent(function(){ fixRubyAlignment(); });