// Make sure DOM is ready
$(document).ready(function()
{
	/*
	 *
	 * Colour Picker
	 *
	 */

	// creat colour picker on the fly
/*
	$('#menu_bg_colour_selector').ColorPicker({
		onShow: function (colpkr) {
			$(colpkr).fadeIn(500);
			return false;
		},
		onHide: function (colpkr) {
			$(colpkr).fadeOut(500);
			return false;
		},
		onChange: function (hsb, hex, rgb) {
			$('#menu_bg_colour_selector div').css('backgroundColor', '#' + hex);
		 	// change real menu above
			$('#nav').css('backgroundColor', '#' + hex);
			$('#nav a').css('backgroundColor', '#' + hex);
			// send to corresponding text-box
			$('#menu_bg_colour').val('#' + hex);
		}
	});
	
	$('#menu_font_colour_selector').ColorPicker({
		onShow: function (colpkr) {
			$(colpkr).fadeIn(500);
			return false;
		},
		onHide: function (colpkr) {
			$(colpkr).fadeOut(500);
			return false;
		},
		onChange: function (hsb, hex, rgb) {
			$('#menu_font_colour_selector div').css('backgroundColor', '#' + hex);
		 	// change real menu above
			$('#nav a').css('color', '#' + hex);
			// send to corresponding text-box
			$('#menu_font_colour').val('#' + hex);
		}
	});

	$('#menu_hover_bg_colour_selector').ColorPicker({
		onShow: function (colpkr) {
			$(colpkr).fadeIn(500);
			return false;
		},
		onHide: function (colpkr) {
			$(colpkr).fadeOut(500);
			return false;
		},
		onChange: function (hsb, hex, rgb) {
			$('#menu_hover_bg_colour_selector div').css('backgroundColor', '#' + hex);
		 	// change real menu above
			// can not support this for hovering yet
			// send to corresponding text-box
			$('#menu_hover_bg_colour').val('#' + hex);
		}
	});

	$('#menu_hover_font_colour_selector').ColorPicker({
		onShow: function (colpkr) {
			$(colpkr).fadeIn(500);
			return false;
		},
		onHide: function (colpkr) {
			$(colpkr).fadeOut(500);
			return false;
		},
		onChange: function (hsb, hex, rgb) {
			$('#menu_hover_font_colour_selector div').css('backgroundColor', '#' + hex);
		 	// change real menu above
			// can not support this for hovering yet
			// send to corresponding text-box
			$('#menu_hover_font_colour').val('#' + hex);
		}
	});

	$('#menu_border_colour_selector').ColorPicker({
		onShow: function (colpkr) {
			$(colpkr).fadeIn(500);
			return false;
		},
		onHide: function (colpkr) {
			$(colpkr).fadeOut(500);
			return false;
		},
		onChange: function (hsb, hex, rgb) {
			$('#menu_border_colour_selector div').css('backgroundColor', '#' + hex);
		 	// change real menu above
			$('#nav a').css('border-color', '#' + hex);
			// send to corresponding text-box
			$('#menu_border_colour').val('#' + hex);
		}
	});
*/
	// change border on-the-fly
	$('#menu_border_thickness_selector').change(function(){
		$('#nav a').css('border-width',$(this).val());
	});

	// toggle for customizing colour scheme
	$('#activate_colourpicker_div').click(function(){
		$('#colourpicker_div').slideToggle(250);
	});
		
	/*
	 *
	 * Menu
	 *
	 */

	// find all anchors with ids that begin with 'activate-'
	$("a[id*='activate-']").each(function(i){
		// create toggle
		$(this).click(function(){ 
			$('#toggle1-'+i).slideToggle(250);
			$('#toggle2-'+i).slideToggle(250);
			$('#activate-'+i+' span').toggle();
		});
	});

	// CSS menu hack
	$(" #nav ul ").css({display: "none"}); // Opera Fix
	$(" #nav li").hover(function(){
		$(this).find('ul:first').css({visibility: "visible",display: "none"}).show(250);
	},function(){
		$(this).find('ul:first').css({visibility: "hidden"});
	});

}); // end "Make sure DOM is ready"