var DEBUG = true;

// SETUP
var CUSTOM_TAG_NAME = 's';
var CUSTOM_ATTRIBUTE_NAME = 'c';

// VIDEO
var VIDEO_WIDTH = 576;
var VIDEO_RATIO = 0.815;
var CUSTOM_NAME_VIDEO = 'v';

// PHOTO
var PHOTO_SIZE = 800;
var LOADING_URL = 'http://files.jl.sg/common/loading.gif';
var PHOTO_CLASS_SIZES = new Array(new Array('I', 144), new Array('B', 288), new Array('M', 288));
var PHOTO_CLASS_I_SIZE = 144;
var PHOTO_CLASS_B_SIZE = 288;
var PHOTO_CLASS_M_SIZE = 576;

// SLIDESHOW
var CUSTOM_NAME_SLIDESHOW = 'ss';

// START
initialise();

// HELPERS
function log(message)
{
	if (DEBUG)
	{
		alert(message);
	}
}
function addLoadEvent(func)
{
	var old = window.onload;
	if (typeof window.onload != 'function')
	{
		window.onload = func;
	}
	else
	{
		window.onload = function() {
			if (old)
			{
				old();
			}
			func();
    		}
  	}
}

// LOAD/INIT
function initialise()
{
	try
	{
		if (document.location.toString().indexOf('file:') > -1)
		{
		    DEBUG = true;
		}
		else
		{
		    DEBUG = false;
		}
	
		loadJs();
		loadCss();
		addLoadEvent(startLoad);
		addStartHook();
	}
	catch(ex)
	{
		log(ex);
		throw ex;
	}
}
var started = false;
function start()
{
	if (!started)
	{
		try
		{
			applyCustomTags();
			applyKeywordLinks();
		}
		catch(ex)
		{
			log(ex);
			throw ex;
		}
		started = true;
	}
}
function startLoad()
{
	try
	{
		start();
	}
	catch(ex)
	{
		log(ex);
		throw ex;
	}
}
function addStartHook()
{
	if (document.addEventListener)
	{
		document.addEventListener("DOMContentLoaded", start, false);
	}
	/*@cc_on @*/
	/*@if (@_win32)
	document.write('<script defer type="text\/javascript" src="ie_onload.js"><\/script>');
	/*@end @*/
}

// EXTERNAL JAVASCRIPT
function loadJs()
{
	if (DEBUG)
	{
		addJs('keywordlinks.js');
	}
	else
	{
		addJs('http://files.jl.sg/common/keywordlinks.js');
	}
}
function addJs(url)
{
	var tag = document.createElement('script');
	tag.type = 'text/javascript';
	tag.src = url;
	document.getElementsByTagName('head')[0].appendChild(tag);
}

// EXTERNAL CSS
function loadCss()
{
	if (DEBUG)
	{
		addCss('common.css');
	}
	else
	{
		addCss('http://files.jl.sg/common/common.css');
	}
}
function addCss(url)
{

	if(document.createStyleSheet)
	{
		document.createStyleSheet(url);
	}
	else
	{
		var tag = document.createElement('link');
		tag.rel = 'stylesheet';
		tag.href = url;
		document.getElementsByTagName('head')[0].appendChild(tag);
	}
}

// CUSTOM TAGS
function applyCustomTags()
{
	applySlideShows();
	applyVideos();
	applyImageLinks();
	applyImageSizes();
}
function getCustomTags(customName)
{
	var result = new Array();
	var tags = document.getElementsByTagName(CUSTOM_TAG_NAME);
	for(i=0; i<tags.length; i++)
	{
		var t = tags[i];
		if (t.attributes.length == 1)
		{
			if (t.attributes[0].value == customName)
			{
				result[result.length] = t;
			}
		}
	}
	
	return result;
}
function applyVideos()
{
	var tags = getCustomTags(CUSTOM_NAME_VIDEO);
	for(i=0; i<tags.length; i++)
	{
		var t = tags[i];
		var inner = t.innerHTML;
		t.innerHTML = '';
		
		var parent = t.parentNode;
		
		var video = inner.replace(/^(.*docid=)(.*)$/i, '$2');
		
		var videoFrame = document.createElement('div');
		videoFrame.className = 'V';
		videoFrame.style.width = VIDEO_WIDTH;
		videoFrame.style.height = (parseInt(videoFrame.style.width) * VIDEO_RATIO);
				
		var tag = document.createElement('embed');
		tag.id = 'VideoPlayback';
		tag.type = 'application/x-shockwave-flash';
		tag.src = 'http://video.google.com/googleplayer.swf?docId='+ video +'';
		tag.flashvars = '';
		tag.style.width = parseInt(videoFrame.style.width);
		tag.style.height = parseInt(videoFrame.style.height);
		
		videoFrame.appendChild(tag);
		
		parent.replaceChild(videoFrame, t);
	}
}
function applySlideShows()
{
	var tags = getCustomTags(CUSTOM_NAME_SLIDESHOW);
	for(i=0; i<tags.length; i++)
	{
		var t = tags[i];
		var inner = t.innerHTML;
		t.innerHTML = '';

		var place = document.createElement('iframe');
		place.src = '#';
		place.width = 576;
		place.height = 432;
		place.className = 'SS';
		place.style.display = 'block';
		t.appendChild(place);
		
		var url = inner;
		var frame = document.createElement('iframe');
		frame.name = 'slideshow'+ i +'';
		frame.src = url;
		frame.width = 576;
		frame.height = 432;
		frame.className = 'SS';
		frame.style.display = 'none';
		frame.framePosition = window.frames.length;
		t.appendChild(frame);

		var f = window.frames[frame.name];
		
		if (frame.onload)
		{
		    frame.style.display = 'block';
		    place.style.display = 'none';
		}
		else
		{
			var loaded = false;
			frame.onload = function() {
				try
				{
				    // if it has already loaded, then it must be reloading, maybe to a different URL, so force it back to the slideshow
				    if (loaded)
				    {
					    f.location.href = url;
				    }
				    frame.style.display = 'block';
				    place.style.display = 'none';
				    loaded = true;
				}
				catch(ex)
				{
				    log(ex);
				    throw ex;
				}
			}
    		}
    	}
}
function applyImageLinks()
{
	var tags = document.getElementsByTagName('img');
	for(i=0; i<tags.length; i++)
	{
		var t = tags[i];
		var src = t.src;

		var url = '';
		
		if (url.indexOf('.jpg') > -1)
		{
			url = src.replace(/^(.*\/)(s\d{2,3})(\/.*.jpg)$/i, '$1s'+ PHOTO_SIZE +'$3');
		}
		else if (url.indexOf('.png') > -1)
		{
			url = src.replace(/^(.*\/)(s\d{2,3})(\/.*.png)$/i, '$1s'+ PHOTO_SIZE +'$3');
		}
		else if (url.indexOf('.gif') > -1)
		{
			url = src.replace(/^(.*\/)(s\d{2,3})(\/.*.gif)$/i, '$1s'+ PHOTO_SIZE +'$3');
		}
		
		var parent = t.parentNode;
		
		var img = t.cloneNode(true);
		img.title = 'Click to view larger version';
		
		var href = document.createElement('a');
		href.href = 'javascript:showImage(\''+ url +'\');';
		href.appendChild(img);
		
		parent.replaceChild(href, t);
	}
}
function applyImageSizes()
{	
	var tags = document.getElementsByTagName('img');
	for(i=0; i<tags.length; i++)
	{
		var t = tags[i];
		var src = t.src;
		var cssName = t.className;
		var url = src;

		var size = getImageSizeForClass(cssName);

		if (size > 0)
		{
			if (url.indexOf('.jpg') > -1)
			{
				url = url.replace(/^(.*\/)(s\d{2,3})(\/.*.jpg)$/i, '$1s'+ size +'$3');
			}
			else if (url.indexOf('.png') > -1)
			{
				url = url.replace(/^(.*\/)(s\d{2,3})(\/.*.png)$/i, '$1s'+ size +'$3');
			}
			else if (url.indexOf('.gif') > -1)
			{
				url = url.replace(/^(.*\/)(s\d{2,3})(\/.*.gif)$/i, '$1s'+ size +'$3');
			}
		}

		t.src = url;
	}
}

function getImageSizeForClass(cssName)
{
	var size = 0;
	eval('try{ size = PHOTO_CLASS_'+ cssName +'_SIZE; }catch(ex){}');
	return size;
}
// DISPLAY IMAGE
var imageContainer = null;
function showImage(url)
{
	var imageFrame = document.getElementById('imageFrame');
	if (imageFrame == null)
	{		
		var imageFrame = document.createElement('div');
		imageFrame.id = 'imageFrame';
		imageFrame.className = 'IF';
		
		var imageFrameLink = document.createElement('a');
		imageFrameLink.href = 'javascript:hideImage();';
		imageFrameLink.title = 'Click to close';
		imageFrameLink.className = 'IF';
		imageFrame.appendChild(imageFrameLink);
		
		imageContainer = document.createElement('img');
		imageContainer.src = LOADING_URL;
		imageContainer.className = 'IC';
		imageFrameLink.appendChild(imageContainer);
		
		var parent = document.getElementsByTagName('body')[0];
		parent.appendChild(imageFrame);
	}
	imageFrame.style.display = 'block';
	positionImage();
	
	hidePage();
	changeOpacity(100, imageFrame);
	
	imageContainer.src = url;
}
function hideImage()
{
	var imageFrame = document.getElementById('imageFrame');
	if (imageFrame != null)
	{
		imageFrame.style.display = 'none';
		imageContainer.src = LOADING_URL;
	}
	
	
	showPage();
	changeOpacity(100, imageFrame);
}
function positionImage()
{
	var imageFrame = document.getElementById('imageFrame');
	if (imageFrame != null)
	{
		var scrollTop = Math.max(document.body.scrollTop, document.documentElement.scrollTop);
		imageFrame.style.top = scrollTop + 'px';
	}
	
}

// OPACITY
function changeOpacity(opacity, tag) {
    var tag = tag.style;
    tag.opacity = (opacity / 100);
    tag.MozOpacity = (opacity / 100);
    tag.KhtmlOpacity = (opacity / 100);
    tag.filter = "alpha(opacity=" + opacity + ")";
}
function hidePage()
{
	changePageOpacity(30);
}
function showPage()
{
	changePageOpacity(100);
}
function changePageOpacity(opacity)
{
	var body = document.getElementsByTagName("body")[0];

	var tags = body.childNodes;
	for(var i=0; i<tags.length; i++)
	{
	    var t = tags[i];
	    try
	    {
	    	changeOpacity(opacity, t);
	    }
	    catch(ex)
	    {
	    }
	}
}


// KEYWORD LINKS
var keywordLinks = new Array();
function KeywordLink(keyword, url)
{
    this.Keyword = keyword;
    this.Url = url;
}
function addKeywordLink(keyword, url)
{
    var keywordLink = new KeywordLink(keyword, url);
    keywordLinks[keywordLinks.length] = keywordLink;
}

function applyKeywordLinks()
{
    var body = document.getElementsByTagName("body")[0];
    applyKeywordLinksToElement(body);
}
var appliedElements = new Array();
function applyKeywordLinksToElement(tag)
{
    var tags = tag.childNodes;
    for(var i=0; i<tags.length; i++)
    {
        var t = tags[i];
        if (t.innerHTML != null
        && t.innerHTML != ''
        && !hasBeenApplied(t))
        {
            if (t.href == null)
            {
                applyKeywordLinksToElement(t);
            }
        }
    }
    
    var html = tag.innerHTML;
    if (html.indexOf('<!') != 0)
    {
	for(var i=0; i<keywordLinks.length; i++)
	{
		var k = keywordLinks[i];
		var match = ''+  k.Keyword +'';
		var matchPattern = '([ .?!()])('+ match +')([ .?!()])';
		var replacePattern = '$1<a target="_blank" title="Opens in a new page" href="'+ k.Url +'">$2</a>$3'
		if (html.indexOf(match) > -1)
		{
			html = html.replace(new RegExp(matchPattern, 'g'), replacePattern);
		}
	}
    
    	tag.innerHTML = html;
    }

    appliedElements[appliedElements.length] = tag;
}
function hasBeenApplied(tag)
{
    for(var i=0; i<appliedElements.length; i++)
    {
        var t = appliedElements[i];
        if (t == tag)
        {
            return true;
        }
    }
    return false;
}