/* -----------------------------------------------------------------------------
  ModestMenus
  --------------------------------------------------------------------------- */
var siteURL = 'http://caretcake.com/';

menus.for_her = new menu("for_her", "primary", siteURL + 'website/themes/caretcake/media/images/menu-bottom-shadow.png');
menus.for_her.paddingTop(6);
menus.for_her.addOption("Bags", siteURL + "bags_for_her/");
menus.for_her.addOption("Jewelry", siteURL + "jewelry_for_her/");
menus.for_her.addOption("Shoes", siteURL + "shoes_for_her/");
menus.for_her.addOption("T-Shirts", siteURL + "t-shirts_for_her/");

menus.for_him = new menu("for_him", "primary", siteURL + 'website/themes/caretcake/media/images/menu-bottom-shadow.png');
menus.for_him.paddingTop(6);
menus.for_him.addOption("Bags", siteURL + "bags_for_him/");
menus.for_him.addOption("Shoes", siteURL + "shoes_for_him/");
menus.for_him.addOption("T-Shirts", siteURL + "t-shirts_for_him/");
menus.for_him.addOption("Ties", siteURL + "ties_for_him/");

menus.for_home = new menu("for_home", "primary", siteURL + 'website/themes/caretcake/media/images/menu-bottom-shadow.png');
menus.for_home.paddingTop(6);
menus.for_home.addOption("Coasters", siteURL + "coasters/");
menus.for_home.addOption("Magnets", siteURL + "magnets/");
menus.for_home.addOption("Mugs", siteURL + "mugs/");
menus.for_home.addOption("Pet Clothes", siteURL + "pet_clothes/");
menus.for_home.addOption("Paper Products", siteURL + "paper_products/");
menus.for_home.addOption("Steins", siteURL + "steins/");
menus.for_home.addOption("Travel Mugs", siteURL + "travel_mugs/");

menus.technology = new menu("technology", "primary", siteURL + 'website/themes/caretcake/media/images/menu-bottom-shadow.png');
menus.technology.paddingTop(6);
menus.technology.addOption("Doodle Speakers", siteURL + "doodle_speakers/");
menus.technology.addOption("Mousepads", siteURL + "mousepads/");
menus.technology.addOption("Phone Cases", siteURL + "phone_cases/");
menus.technology.addOption("Software", siteURL + "software/");
menus.technology.addOption("Tablet Cases", siteURL + "tablet_cases/");


menus.for_fun = new menu("for_fun", "primary", siteURL + 'website/themes/caretcake/media/images/menu-bottom-shadow.png');
menus.for_fun.paddingTop(6);
menus.for_fun.addOption("Bumper Stickers", siteURL + "bumper_stickers/");
menus.for_fun.addOption("Keychains", siteURL + "keychains/");
menus.for_fun.addOption("Music", siteURL + "music/");
menus.for_fun.addOption("Skateboards", siteURL + "skateboards/");


/* -----------------------------------------------------------------------------
  JQuery Slider
  --------------------------------------------------------------------------- */
// Slider
$(document).ready(function() {
    //Show the paging and activate its first link
    $(".paging").show();
    $(".paging a:first").addClass("active");

    //Get size of the image, how many images there are, then determin the size of the image reel.
    var imageWidth = $(".window").width();
    var imageSum = $(".image_reel img").size();
    var imageReelWidth = imageWidth * imageSum;

    //Adjust the image reel to its new size
    $(".image_reel").css({'width' : imageReelWidth});

    //Paging  and Slider Function
    rotate = function(){
        var triggerID = $active.attr("rel") - 1; //Get number of times to slide
        var image_reelPosition = triggerID * imageWidth; //Determines the distance the image reel needs to slide

        $(".paging a").removeClass('active'); //Remove all active class
        $active.addClass('active'); //Add active class (the $active is declared in the rotateSwitch function)

        //Slider Animation
        $(".image_reel").animate({
            left: -image_reelPosition
        }, 500 );

    };

    //Rotation  and Timing Event
    rotateSwitch = function(){
        play = setInterval(function(){ //Set timer - this will repeat itself every 7 seconds
            $active = $('.paging a.active').next(); //Move to the next paging
            if ( $active.length === 0) { //If paging reaches the end...
                $active = $('.paging a:first'); //go back to first
            }
            rotate(); //Trigger the paging and slider function
        }, 5500); //Timer speed in milliseconds (7 seconds)
    };

    rotateSwitch(); //Run function on launch

    //On Hover
    $(".image_reel a").hover(function() {
        clearInterval(play); //Stop the rotation
    }, function() {
        rotateSwitch(); //Resume rotation timer
    });

    //On Click
    $(".paging a").click(function() {
        $active = $(this); //Activate the clicked paging
        //Reset Timer
        clearInterval(play); //Stop the rotation
        rotate(); //Trigger rotation immediately
        rotateSwitch(); // Resume rotation timer
        return false; //Prevent browser jump to link anchor
    });
});



/* -----------------------------------------------------------------------------
  Modals
  --------------------------------------------------------------------------- */

// Global vars
var baseURLImages = './images/';
var modalMessages = new Array();
var modalMessageTimeout;


function displayModal(divID) {
/*  This is where the message is actually displayed.  This function grabs
    whatever message is next in the queue (systemMessages[0]) and then it
    displays the message and sets nextModal() to run in 1.5 seconds.
*/

    // Get the browser dimensions (IE and Netscape-based browsers do this differently)
    var x = 0;
    var y = 0;
    if (navigator.appName.indexOf('Internet Explorer') != -1) {
        x = (document.body.clientWidth / 2) - 350;
        y = (document.body.clientHeight / 2) - 250;
        var IEVersion = parseFloat(navigator.appVersion.split('MSIE')[1]);
        if (IEVersion == 5) {
            if (document.body.scrollTop) {
                y += document.body.scrollTop;
            }
        }
        else if (IEVersion == 6) {
            if (document.documentElement.scrollTop) {
                y += document.documentElement.scrollTop;
            }
        }
        else {
        // IE7+
            y = (document.documentElement.clientHeight / 2) - 250;
            if (document.documentElement.scrollTop) {
                y += document.documentElement.scrollTop;
            }
        }
    }
    else {
        x = (window.innerWidth / 2) - 350;
        y = (window.innerHeight / 2) - 250;
        if (document.body.scrollTop) {
            y += document.body.scrollTop;
        }
    }

    // Display the message
    var object = document.getElementById(divID);
    object.style.left = x + 'px';
    object.style.top = y + 'px';
    var ieHack = document.getElementById('modals_ie_hack');
    ieHack.style.left = x + 'px';
    ieHack.style.top = y + 'px';
    ieHack.style.visibility = 'visible';
    object.style.visibility = 'visible';

}


function grayOut(vis, options) {
/*  Create a screen layer to "gray out" the main page content while the
    system msessage is being displayed.  Options is a JSON object with the
    following possible values:
    opacity:  0-100
    zindex: #
    bgcolor: (#xxxxxx)
*/

    var options = options || {};
    var zindex = options.zindex || 999;
    var opacity = options.opacity || 70;
    var opaque = (opacity / 100);
    var bgcolor = options.bgcolor || '#000000';
    var dark = document.getElementById('darkenScreenObject');
    if (!dark) {
    // The dark layer doesn't exist, it's never been created.  So we'll
    // create it here and apply some basic styles.
    // If you are getting errors in IE see: http://support.microsoft.com/default.aspx/kb/927917
        var tbody = document.getElementsByTagName("body")[0];
        var tnode = document.createElement('div');
        tnode.style.position = 'absolute';
        tnode.style.top = '0px';
        tnode.style.left = '0px';
        tnode.style.overflow = 'hidden';
        tnode.style.display = 'none';
        tnode.id = 'darkenScreenObject';
        tbody.appendChild(tnode);
        dark = document.getElementById('darkenScreenObject');
    }
    if (vis) {
    // Calculate the page width and height
        if (document.body && (document.body.scrollWidth || document.body.scrollHeight)) {
            var pageWidth = document.body.scrollWidth + 'px';
            var pageHeight = document.body.scrollHeight + 'px';
        }
        else if (document.body.offsetWidth) {
            var pageWidth = document.body.offsetWidth + 'px';
            var pageHeight = document.body.offsetHeight + 'px';
        }
        else {
            var pageWidth = '100%';
            var pageHeight = '100%';
        }
        //set the shader to cover the entire page and make it visible.
        dark.style.opacity = opaque;
        dark.style.MozOpacity = opaque;
        dark.style.filter='alpha(opacity = '+opacity+')';
        dark.style.zIndex = zindex;
        dark.style.backgroundColor = bgcolor;
        dark.style.width = pageWidth;
        dark.style.height = pageHeight;
        dark.style.display ='block';
    }
    else {
        dark.style.display = 'none';
    }
}


function modal(contentID) {
/*  Given an ID that matches some hidden div in the page using the modal
    library, display the contents of that div as this page in the modal.
*/

    grayOut(true,{'opacity':'70'})
    displayModal(contentID);

}


function closemodal(divID) {
/*  Close the modal screen and turn the grayout off. */

    var object = document.getElementById(divID);
    object.style.visibility = 'hidden';
    var ieHack = document.getElementById('modals_ie_hack');
    ieHack.style.visibility = 'hidden';
    grayOut(false);

}


/* -----------------------------------------------------------------------------
  Modals
  Smooth Scroller Script, version 1.0.1
  (c) 2007 Dezinerfolio Inc. <midart@gmail.com>
  For details, please check the website : http://dezinerfolio.com/
  --------------------------------------------------------------------------- */

Scroller = {
	// control the speed of the scroller.
	// dont change it here directly, please use Scroller.speed=50;
	speed:10,

	// returns the Y position of the div
	gy: function (d) {
		gy = d.offsetTop
		if (d.offsetParent) while (d = d.offsetParent) gy += d.offsetTop
		return gy
	},

	// returns the current scroll position
	scrollTop: function (){
		body=document.body
	    d=document.documentElement
	    if (body && body.scrollTop) return body.scrollTop
	    if (d && d.scrollTop) return d.scrollTop
	    if (window.pageYOffset) return window.pageYOffset
	    return 0
	},

	// attach an event for an element
	// (element, type, function)
	add: function(event, body, d) {
	    if (event.addEventListener) return event.addEventListener(body, d,false)
	    if (event.attachEvent) return event.attachEvent('on'+body, d)
	},

	// kill an event of an element
	end: function(e){
		if (window.event) {
			window.event.cancelBubble = true
			window.event.returnValue = false
      		return;
    	}
	    if (e.preventDefault && e.stopPropagation) {
	      e.preventDefault()
	      e.stopPropagation()
	    }
	},
	
	// move the scroll bar to the particular div.
	scroll: function(d){
		i = window.innerHeight || document.documentElement.clientHeight;
		h=document.body.scrollHeight;
		a = Scroller.scrollTop()
		if(d>a)
			if(h-d>i)
				a+=Math.ceil((d-a)/Scroller.speed)
			else
				a+=Math.ceil((d-a-(h-d))/Scroller.speed)
		else
			a = a+(d-a)/Scroller.speed;
		window.scrollTo(0,a)
	  	if(a==d || Scroller.offsetTop==a)clearInterval(Scroller.interval)
	  	Scroller.offsetTop=a
	},
	// initializer that adds the renderer to the onload function of the window
	init: function(){
		Scroller.add(window,'load', Scroller.render)
	},

	// this method extracts all the anchors and validates then as # and attaches the events.
	render: function(){
		a = document.getElementsByTagName('a');
		Scroller.end(this);
		window.onscroll
	    for (i=0;i<a.length;i++) {
	      l = a[i];
	      if(l.href && l.href.indexOf('#') != -1 && ((l.pathname==location.pathname) || ('/'+l.pathname==location.pathname)) ){
	      	Scroller.add(l,'click',Scroller.end)
	      		l.onclick = function(){
	      			Scroller.end(this);
		        	l=this.hash.substr(1);
		        	 a = document.getElementsByTagName('a');
				     for (i=0;i<a.length;i++) {
				     	if(a[i].name == l){
				     		clearInterval(Scroller.interval);
				     		Scroller.interval=setInterval('Scroller.scroll('+Scroller.gy(a[i])+')',10);
						}
					}
				}
	      	}
		}
	}
}
// invoke the initializer of the scroller
Scroller.init();