$(document).ready(function() {
	$('#wrapper > ul:not(.example) li').wrapInner('<span style="color: #000;"></span>');
	$('#wrapper > ul:not(.example)').css('color', '#d00');
	
	$('#wrapper > ol:not(.example) li').wrapInner('<span style="color: #000;"></span>');
	$('#wrapper > ol:not(.example)').css('color', '#d00');
	$('#wrapper > ol:not(.example)').css('font-weight', 'bold');
	$('#wrapper > ol:not(.example)').css('font-family', 'arial');

	$('blockquote').prepend('<div class="ldquo"><span>&ldquo;</span></div>');
	/*$('blockquote').append('<div class="rdquo"><span>&rdquo;</span></div>');*/

	$('blockquote p:last-child').append('<span class="rdquo">&rdquo;</span>');
	$('blockquote p:last-child').css('margin-bottom', 0);
	
	$('blockquote ul:last-child li:last-child').append('<span class="rdquo">&rdquo;</span>');
	$('blockquote ul:last-child li:last-child').css('margin-bottom', 0);

	$('blockquote[cite]').each(function() {
		var cite = $(this).attr('cite');

		if (cite.substr(0, 7) == 'http://')
		{
			cite = cite.substr(7);
		}

		var p = cite.indexOf("/");
		
		if (p != -1)
		{
			cite = cite.substr(0, p);
		}

		$(this).append('<p class="citation"><a href="' + $(this).attr('cite') + '">' + cite + '</a></p>');
	});

	$('p.intro').each(function() {
		var t = $(this).html();
		var add = '<div class="intro-drop-cap">';
		add += '<span>' + t.substr(0, 1) + '</span>';
		add += '</div>';
		$(this).before(add);
		$(this).html(t.substr(1));
	});


	$('table.mono td').each(function() {
        	var str = $(this).html();
	        var newstr = '';

		for (i = 0; i < str.length; i++)
		{
			newstr += str[i] == ' ' ? '<span>' + str[i] + '</span>' : str[i];
		}

		$(this).html(newstr);
	});

/*
	$('div.example').mouseover(function() {
		var eg = $(this).next('.example');
		$(this).find('h1').css('background-color', '#CEE14B');
	        $(this).find('h2').css('background-color', '#EFE6CE');
	        $(this).find('p').css('background-color', '#ffc');
	        $(this).find('*').not('div').css('outline', '1px solid #ddd');
	});
						
	$('div.example').mouseout(function() {
	        $(this).find('h1').css('background-color', 'transparent');
	        $(this).find('h2').css('background-color', 'transparent');
	        $(this).find('p').css('background-color', 'transparent');
	        $(this).find('*').css('outline', 'none');
      	});
*/
});

currentVal = [];

function value_switcher(prop, values, def, iid)
{
	currentVal[prop] = def ? def : 0;
	iid = iid ? iid : '#first';
	$(iid).before('<p style="float: left; margin-top: 0; margin-right: 1em;">' + prop + ':</p><ul id="values"></ul>');

	for (val in values)
	{
		var id = "switch_" + prop + "_" + val;
		$('#values').append('<li id="' + id + '">' + values[val] + '</li>')

		$('#' + id).click(function()
		{
			var i = this.id.substring(8 + prop.length);
			$(this).addClass("selected");

			$('#switch_' + prop + "_" + currentVal[prop]).removeClass("selected");

			currentVal[prop] = i;

			$(iid).css(prop, values[i]);
			$('#css').html(iid + " { " + prop + ": " + values[i] + "; }");
		});
	}

	$('#switch_' + prop + "_" + currentVal[prop]).addClass("selected");
	$(iid).css(prop, values[currentVal[prop]]);
	markup = "<p class='css-sample-caption'>Current style is:</p>";
	markup += "<pre id='css'>" + id + " { " + prop + ": " + values[currentVal[prop]] + "; }</pre>";
	$(iid).before(markup);

	$('#switcher').click(function()
	{
		// Go to next value in list; wrap round
		currentVal[prop] = (currentVal[prop] = values.length - 1) ? 0 : currentVal[prop] + 1;

		$(iid).css(prop, values[currentVal[prop]]);
		$('#css').html(iid + " { " + prop + ": " + values[currentVal[prop]] + "; }");
	});
}
