$(document).ready(function(){
    //BEGIN:  popup divs
    $('a[class*=facebox]').facebox({}) 
    //END:  popup divs

    //BEGIN:  used for gallery scroll
    var id = "0";
    $(".scrollarrow").click(function(){ 
        id = $(this).attr("id");
        if (id.toString() == "leftarrow"){
            $("#gallery").animate({marginLeft: "0px"}, 450);
            $("#leftarrow").fadeOut(350, function(){
                $("#rightarrow").fadeIn(350);  
            });
            
            return false;                      
        }
        if (id.toString() == "rightarrow"){
            $("#gallery").animate({marginLeft: "-359px"}, 450);
            $("#rightarrow").fadeOut(350, function(){
                $("#leftarrow").fadeIn(350);  
            });       
            return false;            
        }
    });
    //END:  used for gallery
    
    //BEGIN:  used for product specs interface
    dropdownstatus();
    function dropdownstatus()
    {
        $(".product_option_row select").each(function(){ //disabling disabled fields visually for safari since it doesn't happen automatically
            if($(this).attr('disabled') == true){
                $(this).css("backgroundColor","#d4d0c8");
                $(this).css("color","#6f686a");
            }
        });
        //alert ('in here');
    }

    $('.product_option #DdlSize').change(function() { //loads colors if size was clicked
        $('#DdlColor').attr('disabled','disabled');
        $('#DdlQuantity').attr('disabled','disabled');        
        $("#DdlColor option:contains(COLOR)").attr("selected", true);
        $("#DdlQuantity option:contains(QUANTITY)").attr("selected", true);
        dropdownstatus(); //apply disabled styles based on which fields are disabled    
        if($('.product_option #DdlSize').find('option').attr('selected') == false){ //actual size was clicked
            $('#size_header_error').animate({left: '-185px'}, 200);
            $('#size_header').fadeIn(660);                     
            $('#colorsloading').show();
            $('#form2').submit();
        }
    });
    $('.product_option #DdlColor').change(function() {
        $('#DdlQuantity').attr('disabled','disabled');
        $("#DdlQuantity option:contains(QUANTITY)").attr("selected", true);
        dropdownstatus(); //apply disabled styles based on which fields are disabled    
        if($('.product_option #DdlColor').find("option").attr('selected') == false){ //actual color was clicked
            $('#color_header_error').animate({left: "-185px"}, 200);
            $('#color_header').fadeIn(660);
            $('#quantityloading').show();
            $('#form2').submit();
        }
    });
    $('.product_option #DdlQuantity').change(function() {
        if($('.product_option #DdlQuantity').find("option").attr('selected') == false){ //actual quantity was clicked
            $('#quantity_header_error').animate({left: "-185px"}, 200);
            $('#quantity_header').fadeIn(660);
        }
    });
    $('#BtnAddCart').click(function() { //add to cart was clicked, check for errors
        if($('.product_option #DdlSize').find("option").attr('selected') == true){ //and... size was not selected
            $('#size_header').fadeOut(720);
            $('#size_header_error').fadeOut(80);
            $('#size_header_error').fadeIn(80);
            $('#size_header_error').fadeOut(80);
            $('#size_header_error').fadeIn(80);
            $('#size_header_error').animate({left: "0px"}, 200 );	
        }else{ //size was selected, then check colors
            if($('.product_option #DdlColor').find("option").attr('selected') == true){ //... color was not selected
                $('#color_header').fadeOut(720);
                $('#color_header_error').fadeOut(80);
                $('#color_header_error').fadeIn(80);
                $('#color_header_error').fadeOut(80);
                $('#color_header_error').fadeIn(80);
                $('#color_header_error').animate({left: "0px"}, 200 );	
            }else{ //color was selected, then check quantity
                if($('.product_option #DdlQuantity').find("option").attr('selected') == true){ //... quantity was not selected
                    $('#quantity_header').fadeOut(720);
                    $('#quantity_header_error').fadeOut(80);
                    $('#quantity_header_error').fadeIn(80);
                    $('#quantity_header_error').fadeOut(80);
                    $('#quantity_header_error').fadeIn(80);
                    $('#quantity_header_error').animate({left: "0px"}, 200 );	
                }else{ //quantity was selected, then ok to submit form
                    $('#BtnAddCart').hide(); //hide to avoid duplicate submissions
                    $('#BtnAddingCart').show(); //show unusable button to avoid duplicate submissions
                    $('#addtocartloading').show(); //show loading
                    $('#form2').submit(); //submit form
                }                                  
            }      
        }                        
    });                        
    //END:  used for product specs interface
    
    //BEGIN:  cart animations
    $('#product_added').hide()
    $('#product_added').fadeIn(1000)
    $('#shopcart').hide()
    $('#shopcart').fadeIn(1000)    
    $('.remove_cart').click(function() { //remove cart was clicked
         $(this).parent('.swimsuit_remove').find(".loading").show();
         $(this).parent('.swimsuit_remove').parent('.tablecartrow').find(".swimsuit_price div").fadeOut(200);                          
         $(this).parent('.swimsuit_remove').parent('.tablecartrow').find(".swimsuit_quantity div").fadeOut(400);
         $(this).parent('.swimsuit_remove').parent('.tablecartrow').find(".swimsuit_color div").fadeOut(600);                        
         $(this).parent('.swimsuit_remove').parent('.tablecartrow').find(".swimsuit_size div").fadeOut(800);                         
         $(this).parent('.swimsuit_remove').parent('.tablecartrow').find(".swimsuit_name div").fadeOut(1000);                                          
    });    
    //END:  end cart animations

    //BEGIN:  topnav animations
    var growspeed = 85;
    var shrinkspeed = 85;
    var topmargin = "-2px";
    $("#nav_home").hover(
        function () {
            $(this).find('div').stop().animate({
                fontSize: "22px",
                marginLeft: "-8px",
                marginTop: topmargin
            }, growspeed);
        }, 
        function () {
            $(this).find('div').stop().animate({
                fontSize: "15px",
                marginLeft: "0px",
                marginTop: "0px"
            }, shrinkspeed);
        }
    );
    $("#nav_collection").hover(
        function () {
            $(this).find('div').stop().animate({
                fontSize: "22px",
                marginLeft: "-18px",
                marginTop: topmargin
            }, growspeed);
        }, 
        function () {
            $(this).find('div').stop().animate({
                fontSize: "15px",
                marginLeft: "0px",
                marginTop: "0px"
            }, shrinkspeed);
        }
    );
    $("#nav_chart").hover(
        function () {
            $(this).find('div').stop().animate({
                fontSize: "22px",
                marginLeft: "-17px",
                marginTop: topmargin
            }, growspeed);
        }, 
        function () {
            $(this).find('div').stop().animate({
                fontSize: "15px",
                marginLeft: "0px",
                marginTop: "0px"
            }, shrinkspeed);
        }
    );
    $("#nav_cart").hover(
        function () {
            $(this).find('div').stop().animate({
                fontSize: "22px",
                marginLeft: "-16px",
                marginTop: topmargin
            }, growspeed);
        }, 
        function () {
            $(this).find('div').stop().animate({
                fontSize: "15px",
                marginLeft: "0px",
                marginTop: "0px"
            }, shrinkspeed);
        }
    );
    //END:  topnav animations

    //BEGIN:  horizontal collection
    var opacitylvl = .50
    $("#photo_slices div.horiz_photo:nth(0)").fadeTo(1, opacitylvl);
    $("#photo_slices div.horiz_photo:nth(2)").fadeTo(1, opacitylvl);
    $("#photo_slices div.horiz_photo").hover(
        function () {
            $(this).fadeTo(45, 0.75);
        }, 
        function () {
            //$(this).fadeTo(300, 1);
            $("#photo_slices div.horiz_photo:nth(0)").fadeTo(45, opacitylvl);
            $("#photo_slices div.horiz_photo:nth(1)").fadeTo(45, 1);
            $("#photo_slices div.horiz_photo:nth(2)").fadeTo(45, opacitylvl);  
        }
    );     
    $(".next_right").click(function(){
        $("#photo_slices div.horiz_photo:nth(3)").animate({ //fades out div 4 before it appears
            opacity: "0"
        }, 150, 'jswing');        
        $("#photo_slices div:first").animate({ //moves first div 200 px to left
            marginLeft: "-200px",
            opacity: "0"
        }, 300, 'jswing');
        $("#photo_slices div.horiz_photo:nth(1)").fadeTo(350, opacitylvl); //fade 2nd div to .5 because it's moving to 1st div's position
        $("#photo_slices div.horiz_photo:nth(2)").fadeTo(350, 1); //show 3rd div at 100% because it moved into 2nd div's spot      
        $("#photo_slices div.horiz_photo:nth(3)").fadeTo(850, opacitylvl); //fade 4th div from 0 to .5 because it is now in 3rd div's spot
        setTimeout("$('#photo_slices div:first').appendTo('#photo_slices');", 300); //after 300 ms, append original first div (which is now hidden) to end of divs... which are also unseen due to overflow:hidden
        $("#photo_slices div:first").animate({ //change margin from -200px to 103px and opacity to 100% for first div (which is now appended to the end)... at this point it still think it's the first div because it's fucking retarded.
            marginLeft: "102px",
            opacity: "1"
        }, 1, 'jswing');  
        return false;
    });    
    $(".next_left").click(function(){
        $('#photo_slices div.horiz_photo:last').css({'marginLeft' : '-405px'});
        $('#photo_slices div.horiz_photo:last').fadeTo(1, 0);
        $('#photo_slices div.horiz_photo:nth(2)').fadeTo(150, 0); //fade out the one that moves off screen
        setTimeout("$('#photo_slices div.horiz_photo:last').prependTo('#photo_slices');", 1);    
        $("#photo_slices div.horiz_photo:last").animate({marginLeft: "102px"}, {queue:false, duration:460}, "jswing").animate({opacity: opacitylvl}, 1000, "jswing");
        $('#photo_slices div.horiz_photo:nth(0)').fadeTo(350, 1);
        $('#photo_slices div.horiz_photo:nth(1)').fadeTo(350, opacitylvl);        
        return false;    
    });        
    //END:  horizontal collection

});