var whichBanner = 0;
var totalBanner = 0;
$(document).ready(function(){
    site_functions.init();
    popups.init();
    tooltip.init();
    totalBanners = $('#rotator img').length;
});

var site_functions = {
    init: function(){
        site_functions.tabs();
        site_functions.carousel();
        site_functions.same_address();
        site_functions.paypal();
        site_functions.back();
    },

    tabs: function(){
        $('#menu').tabs();
    },

    carousel: function(){
        if($('#carousel').length > 0){
            $('#carousel').jcarousel({
                });
        }
    },

    rotate: function(){
        setInterval('site_functions.change_banner()', 5000);
    },

    change_banner: function(){
        whichBanner = whichBanner + 1;
        if(whichBanner == totalBanners){
            whichBanner = 0;
        }
        else{
            $('#rotator img').css('display', 'none');
            $('#rotator img:eq('+ whichBanner + ')').css('display', 'block')
        }
    },

    //in billing page
    same_address: function(){
        $('#same_address').click(function(){
            if($(this).attr("checked") == true){
                $('#ctl00_ContentPlaceHolder1_ShipToAddress1').attr("value", $("#ctl00_ContentPlaceHolder1_BillToAddress1").attr("value"));
                $('#ctl00_ContentPlaceHolder1_ShipToAddress2').attr("value", $("#ctl00_ContentPlaceHolder1_BillToAddress2").attr("value"));
                $('#ctl00_ContentPlaceHolder1_ShipToCity').attr("value", $("#ctl00_ContentPlaceHolder1_BillToCity").attr("value"));
                $('#ctl00_ContentPlaceHolder1_ShipToPostalCode').attr("value", $("#ctl00_ContentPlaceHolder1_BillToPostalCode").attr("value"));
                $('#ctl00_ContentPlaceHolder1_ShipToState1').attr("selectedIndex", $("#ctl00_ContentPlaceHolder1_BillToState1").attr("selectedIndex"));
                $('#ctl00_ContentPlaceHolder1_ShipToCountry1').attr("selectedIndex", $("#ctl00_ContentPlaceHolder1_BillToCountry1").attr("selectedIndex"));
            }
            else{
                $("#ctl00_ContentPlaceHolder1_ShipToAddress1").attr("value", "");
                $("#ctl00_ContentPlaceHolder1_ShipToAddress2").attr("value", "");
                $("#ctl00_ContentPlaceHolder1_ShipToCity").attr("value", "");
                $("#ctl00_ContentPlaceHolder1_ShipToPostalCode").attr("value", "");
                $("#ctl00_ContentPlaceHolder1_ShipToState1").attr("selectedIndex", "");
                $("#ctl00_ContentPlaceHolder1_ShipToCountry1").attr("selectedIndex", "");
            }
        });
    },

    paypal: function(){
        $("#ctl00_ContentPlaceHolder1_PayType input").each(function(){
            $(this).click(function(){
                if(this.value == 1){
                    $("#paypal").css({
                        display: "none"
                    });
                }
                else{
                    $("#paypal").css({
                        display: "block"
                    });
                }
            });
        });
    },

    back: function(){
        $('.back').click(function(){
            history.back();
            return false;
        })
    }
}

var popups = {
    total : 0,
    current: 0,

    init: function(){
        popups.setup();
        popups.popup();
    },

    setup: function(){
        if($('.features:eq(0) li').length > 0){
            $('.features:eq(0) li ').each(function(i){
                $(this).attr('id', 'popup_' + i);
                popups.total = popups.total + 1;
            });
        }
    },
    
    close: function(){
        $('#close').unbind();
        $('#close').click(function(event){
            $('#popup').remove();
            $('#overlay').remove();
            return false;
        })
    },

    popup: function(){
        $('.features:eq(0) ul').click(function(event){
            var target = $(event.target);
            if($(target).attr('nodeName').toLowerCase() == 'img'){
                target = $(event.target).parent('a');    
            }
            if($(target).attr('nodeName').toLowerCase() == 'a'){
                popups.create(target);
                popups.show(target);
            }
            return false;
        })
    },

    create: function(target){
        var popup = '<div id="popup">\n\
                          <a href="#" id="previous">Previous</a>\n\
                           <a href="#" id="close"><img src="http://cdn.matrixwebs.net/matrixsuites/images/closelabel.png" alt="" /></a>\n\
                          <img src="' + $(target).attr('href')  +'" alt="" />\n\
                          <a href="#" id="next">Next</a>\n\</div>';
        $('body').append('<div id="overlay"></div>');
        $('#overlay').height($('body').get(0).scrollHeight + 'px');
        $('#wrapper').append(popup);
       
    },

    show: function(target){
        var img = new Image();
        $(img).load(function(){
            var width = $(this).attr('width');
            var height = $(this).attr('height');
            var window_width = $('body').width();
            var window_height = $(window).height();
            var scrollTop = $(window).scrollTop();
            var top = ((window_height - height) / 2) + scrollTop - 50;
            var left = (window_width - width) / 2;
            $('#popup').css('display', 'block');
            $('#popup').css('top', top);
            $('#popup').css('left', left);
            $('#overlay').css('z-index', 299);
            $('#popup').css('z-index', 300);
            popups.current = parseInt($(target).parents('li').attr('id').split('_')[1]) + 1; 
            popups.next();
            popups.previous();
            popups.close();
            
            if(popups.current == 1){
                $('#previous').css('visibility', 'hidden');
                $('#next').css('visibility', 'visible');
            }
            else if(popups.current >= popups.total){
                $('#next').css('visibility', 'hidden');
                $('#previous').css('visibility', 'visible');
            }
            else{
                $('#next').css('visibility', 'visible');
                $('#previous').css('visibility', 'visible');
            }
        }).attr({
            'src': $(target).attr('href'),
            'alt': ''
        });
    },

    next: function(){
        $('#next').unbind();
        $('#next').click(function(){
            if(popups.current < popups.total){
                var target = $('.features li:eq(' + (popups.current) + ') a:first')
                $('#popup img:eq(1)').attr('src', $(target).attr('href'));
                popups.show(target);
                popups.current = popups.current + 1;
            }
            return false;
        });
    },

    previous: function(){
        $('#previous').unbind();
        $('#previous').click(function(){
            if(popups.current > 0){
                popups.current = popups.current - 2;
                var target = $('.features li:eq(' + (popups.current) + ') a:first')
                $('#popup img:eq(1)').attr('src', $(target).attr('href'));
                popups.show(target);
                
            }
            return false;
        });
    }
}

var imageMap = {
    init: function(){
        imageMap.setup();
        imageMap.hover();
    },

    setup: function(){
        $('#mat li').each(function(){
            $('.marker', this).each(function(i){
                var rel = $(this).attr('rel');
                var x = parseInt(rel.split(',')[0]);
                var y = parseInt(rel.split(',')[1]);
                $(this).css('top', y);
                $(this).css('left', x);
                $(this).attr('id', 'tip_' + i);
            });
        });
    },

    hover: function(){
        var src = '';
        $('#mat .content').mouseover(function(event){
            var mat = $(this);
            if($(event.target).attr('nodeName').toLowerCase() == 'img' && $(event.target).parent('div').hasClass('marker')){
                var image = $(event.target);
                var target = $(event.target).parent('div');
                src = $(image).attr('src').split('/')[7];
                $(image).attr('src', 'http://cdn.matrixwebs.net/matrixsuites/images/icons/numbers/on/' + src);
                var tip = $('<div></div>').attr('class', 'tip');
                var x = parseInt($(target).css('left'));
                var y = parseInt($(target).css('top'));
                //var y = parseInt($(target).offset().top);
                window.status = y;
                x = imageMap.setMarkerPosition(x, mat);
                var span = $('span', target).html();

                $(tip).css('top', y + 40);
                $(tip).css('left', x + 30);
                $(tip).html(span);
                $(mat).append(tip);
                $(tip).show('fast');
            }
        });
        $('#mat li').mouseout(function(event){
            if($(event.target).attr('nodeName').toLowerCase() == 'img' && $(event.target).parent('div').hasClass('marker')){
                $('.tip').remove();
                var image = $(event.target);
                $(image).attr('src', 'http://cdn.matrixwebs.net/matrixsuites/images/icons/numbers/' + src);
            }
        });
    },

    setMarkerPosition: function(x, target){
        var bodyWidth = $('body').width();
        if((x + 300) > bodyWidth)
            var x = x - 320;
        return x;
    }
}

var tooltip ={
    init: function(){
        $('.tooltip').mouseover(function(event){
            var x = $(this).position().left;
            var y = $(this).position().top;
            var rel = $(this).attr('rel');
            $('#' + rel).css('left', x + 20);
            $('#' + rel).css('top', y + 20);
            $('#' + rel).css('visibility', 'visible');
        });
        $('.tooltip').mouseout(function(event){
            var rel = $(this).attr('rel');
            $('#' + rel).css('left', -500);
            $('#' + rel).css('top', 0);
            $('#' + rel).css('visibility', 'hidden');
        });
    }
}