function set_loadBox(div,callback,htmlonly)
	{
		var loadboxhtml = '<span style="vertical-align:middle;"><div style="padding-bottom:1px;background-color:#ffffff;vertical-align:middle;height:100%;width:98%;border:1px solid #cccccc;font-size:10px" align="left"><img style="width:10%" src="/img/frontend/loader.gif"/>&nbsp;loading...</div></span>';
		var loadboxflash = ''
			+ '<div style="width:100%;height:100%;" align="left"><object classid="clsid:d27cdb6e-ae6d-11cf-96b8-444553540000" codebase="http://download.macromedia.com/pub/shockwave/cabs/flash/swflash.cab#version=9,0,0,0" width="37" height="40" id="pre-loader" align="middle"> '
			+ '	<param name="allowScriptAccess" value="sameDomain" /> '
			+ '	<param name="allowFullScreen" value="false" /> '
			+ '	<param name="movie" value="/swf/pre-loader.swf" /><param name="quality" value="high" /><param name="bgcolor" value="#ffffff" />	<embed src="/swf/pre-loader.swf" quality="high" bgcolor="#ffffff" width="37" height="40" name="pre-loader" align="middle" allowScriptAccess="sameDomain" allowFullScreen="false" type="application/x-shockwave-flash" pluginspage="http://www.macromedia.com/go/getflashplayer" /> '
			+ '	</object></div>';
			
		if (htmlonly==true)
		{
			$(div).html(loadboxhtml);
		}
		else
		{
			$(div).html(loadboxflash);
		}
		
		if (callback)
		{
			callback();
		}
	}

$(function () {

	function set_loadBox(div,callback,htmlonly)
	{
		var loadboxhtml = '<span style="vertical-align:middle;"><div style="padding-bottom:1px;background-color:#ffffff;vertical-align:middle;height:100%;width:98%;border:1px solid #cccccc;font-size:10px" align="left"><img style="width:10%" src="/img/frontend/loader.gif"/>&nbsp;loading...</div></span>';
		var loadboxflash = ''
			+ '<div style="width:100%;height:100%;" align="left"><object classid="clsid:d27cdb6e-ae6d-11cf-96b8-444553540000" codebase="http://download.macromedia.com/pub/shockwave/cabs/flash/swflash.cab#version=9,0,0,0" width="37" height="40" id="pre-loader" align="middle"> '
			+ '	<param name="allowScriptAccess" value="sameDomain" /> '
			+ '	<param name="allowFullScreen" value="false" /> '
			+ '	<param name="movie" value="/swf/pre-loader.swf" /><param name="quality" value="high" /><param name="bgcolor" value="#ffffff" />	<embed src="/swf/pre-loader.swf" quality="high" bgcolor="#ffffff" width="37" height="40" name="pre-loader" align="middle" allowScriptAccess="sameDomain" allowFullScreen="false" type="application/x-shockwave-flash" pluginspage="http://www.macromedia.com/go/getflashplayer" /> '
			+ '	</object></div>';
			
		if (htmlonly==true)
		{
			$(div).html(loadboxhtml);
		}
		else
		{
			$(div).html(loadboxflash);
		}
		
		if (callback)
		{
			callback();
		}
	}
	
	// handle click on images to load sub content
	$("#ARTICLEcarousel_slider li a").bind('click', function () {

		set_loadBox("#articledetail");
		$("#articledetail").load($(this).attr('href'), function() {});
		return false;
	});
	
	/*
	 * setup archive-year-search
	 */
	$("#rak-year-search").bind ('change', function () {

		// update month selector
		var value = $(this).val();
		
		if (Number(value))
		{
			set_loadBox("#div-rak-month-search");
			$("#div-rak-month-search").load('/currentissue/render_rak_month_search/' + value, function () {});
		}
		else
		{
			set_loadBox("#div-rak-month-search");
			$("#div-rak-month-search").load('/currentissue/render_rak_month_search/', function () {});
		}
	});
	
	$("#rak-month-search").bind ('change', function () {
														
		// update archive box with new date selection
		
		var value = $(this).val();
		
		if (Number(value))
		{
			// store value
		}
	});
	
	$('#button-soek-rak').bind ('click', function () {
		var value = $(this).val();

		if (document.location)
		{
			// redirect to refresh/reload page
			document.location = '/archive/search/'+$("#rak-year-search").val()+'/'+$("#rak-month-search").val();
			return false;
		}
	});
	
});