/**
 * Javascript - jQuery enabled
 * 
 * @package WPFramework
 * @subpackage Media
 */


// Dropdown menu using superfish
jQuery(document).ready(function($) {
	$('ul.superfish').superfish({ 
		delay:       200,                            // one second delay on mouseout 
		animation:   {'marginLeft':'0px',opacity:'show'},  // fade-in and slide-down animation 
		speed:       'fast',                          // faster animation speed
		onBeforeShow: function(){ this.css('marginLeft','20px'); }, 			
		autoArrows:  true,                           // disable generation of arrow mark-up 
		dropShadows: false                            // disable drop shadows 
	});
	//.find('> li > ul').prepend('<span class="top-arrow"></span>');
	
	var pagemenuwidth = $("ul.nav").width();
	var pagemleft = Math.round((804 - pagemenuwidth) / 2) + 55;
	if (pagemenuwidth < 804) $("ul.nav").css('padding-left',pagemleft);
	
	$('ul.superfish ul a').hover(function(){
		$(this).parent('li').stop().animate({paddingLeft:'23px'},300);
	},function(){
		$(this).parent('li').stop().animate({paddingLeft:'17px'},300);
	});
 
	//jQuery(".nav > li > a > span.sf-sub-indicator").parent().attr("href","#"); 
	
	$('#catalyst')
		.sprite({fps: 8, no_of_frames: 1})
		.spRandom({
			top: 80,
			left: 10,
			right: 60,
			bottom: 100,
			speed: 3000,
			pause: 300
		}).active(); 

	var randNum = Math.floor(Math.random()* 24) + 12;
	$('#meerkat').meerkat({
	background:  function() {
		var xWhichMeerkat = Math.floor(Math.random()*7);
		var xChoices = ['frank', 'house', 'mummy', 'phantom', 'vampire', 'werewolf', 'vampire']; 
		var xChosen = xChoices[xWhichMeerkat];
		var xMeerkatPath = 'url(/images/meerkat-' + xChosen + '.png) no-repeat left top';
		return (xMeerkatPath);
	}, 
	height: '200px',
	width: '960px',
	position: 'bottom',
	close: '.close-meerkat',
	dontShowAgain: '.dont-show',
	animationIn: 'fade',
	animationSpeed: 500,
	delay: randNum,
	timer: 10 
	 
	}); 
	
	
	// add 3d shadow to portfolio large screen img
	$(".mtc_portfolio img").wrap("<div class='shadow'></div>");
	
	
	//random change header based on date, if not specific, then a month theme image - but only on 33% random chance
	 
	var xChangeHeader = Math.floor(Math.random()*100);
	 
	if (xChangeHeader < 50) {
		var d=new Date();
		theMonth=d.getMonth()+1;
		if (theMonth < 10){
			theMonth = "0" + theMonth;
		}

		theDay = d.getDate();	 
		if (theDay < 10){
			theDay = "0" + theDay;
		}
		  
 		
		$('#header-inner').css('background-image', 'url(/images/bg-header-' + theMonth +'.png)');
	 
	
	}
	
	
	
	$("#pagecornr").hover(function() {
		$("#pagecornr img , .bg_msg").stop()
			.animate({
				width: '307px', 
				height: '319px'
			}, 500); 
		} , function() {
		$("#pagecornr img").stop() 
			.animate({
				width: '50px', 
				height: '52px'
			}, 220);
		$(".bg_msg").stop() 
			.animate({
				width: '50px', 
				height: '50px'
			}, 200);
 
    	});
	
});

var scrolltotop={
			//startline: Integer. Number of pixels from top of doc scrollbar is scrolled before showing control
			//scrollto: Keyword (Integer, or "Scroll_to_Element_ID"). How far to scroll document up when control is clicked on (0=top).
			setting: {startline:350, scrollto: 0, scrollduration:800, fadeduration:[500, 100]},
			controlHTML: '<img src="/wp-content/themes/mtc2010/library/media/images/up.png" />', //HTML for control, which is auto wrapped in DIV w/ ID="topcontrol"
			controlattrs: {offsetx:5, offsety:5}, //offset of control relative to right/ bottom of window corner
			anchorkeyword: '#top', //Enter href value of HTML anchors on the page that should also act as "Scroll Up" links

			state: {isvisible:false, shouldvisible:false},

			scrollup:function(){
				if (!this.cssfixedsupport) //if control is positioned using JavaScript
					this.control.css({opacity:0}) //hide control immediately after clicking it
				var dest=isNaN(this.setting.scrollto)? this.setting.scrollto : parseInt(this.setting.scrollto)
				if (typeof dest=="string" && jQuery('#'+dest).length==1) //check element set by string exists
					dest=jQuery('#'+dest).offset().top
				else
					dest=0
				this.body.animate({scrollTop: dest}, this.setting.scrollduration);
			},

			keepfixed:function(){
				var window=jQuery(window)
				var controlx=window.scrollLeft() + window.width() - this.control.width() - this.controlattrs.offsetx
				var controly=window.scrollTop() + window.height() - this.control.height() - this.controlattrs.offsety
				this.control.css({left:controlx+'px', top:controly+'px'})
			},

			togglecontrol:function(){
				var scrolltop=jQuery(window).scrollTop()
				if (!this.cssfixedsupport)
					this.keepfixed()
				this.state.shouldvisible=(scrolltop>=this.setting.startline)? true : false
				if (this.state.shouldvisible && !this.state.isvisible){
					this.control.stop().animate({opacity:1}, this.setting.fadeduration[0])
					this.state.isvisible=true
				}
				else if (this.state.shouldvisible==false && this.state.isvisible){
					this.control.stop().animate({opacity:0}, this.setting.fadeduration[1])
					this.state.isvisible=false
				}
			},
			
			init:function(){
				jQuery(document).ready(function($){
					var mainobj=scrolltotop
					var iebrws=document.all
					mainobj.cssfixedsupport=!iebrws || iebrws && document.compatMode=="CSS1Compat" && window.XMLHttpRequest //not IE or IE7+ browsers in standards mode
					mainobj.body=(window.opera)? (document.compatMode=="CSS1Compat"? $('html') : $('body')) : $('html,body')
					mainobj.control=$('<div id="topcontrol">'+mainobj.controlHTML+'</div>')
						.css({position:mainobj.cssfixedsupport? 'fixed' : 'absolute', bottom:mainobj.controlattrs.offsety, right:mainobj.controlattrs.offsetx, opacity:0, cursor:'pointer'})
						.attr({title:'Scroll Back to Top'})
						.click(function(){mainobj.scrollup(); return false})
						.appendTo('body')
					if (document.all && !window.XMLHttpRequest && mainobj.control.text()!='') //loose check for IE6 and below, plus whether control contains any text
						mainobj.control.css({width:mainobj.control.width()}) //IE6- seems to require an explicit width on a DIV containing text
					mainobj.togglecontrol()
					$('a[href="' + mainobj.anchorkeyword +'"]').click(function(){
						mainobj.scrollup()
						return false
					})
					$(window).bind('scroll resize', function(e){
						mainobj.togglecontrol()
					})
				})
			}
		}

		scrolltotop.init()