$(document).ready(function($) {
    
    /* --------------------------------------------
     * INITIATE KWICKS SLIDER ON HOMEPAGE
     * -------------------------------------------*/
    $('ul.sf-menu').superfish();
    $('.kwicks').kwicks({
        max : 420,
        duration: 400,
        spacing : 0
    });
    
    /* --------------------------------------------
     * CONTACT US PAGE FORMS
     * -------------------------------------------*/
    $("#leftForm").validate();
    $("#joburgForm").validate();
    $("#capetownForm").validate();
    $("#joburgSubmitBtn").click(function(){

         if($("#joburgForm").valid()){
             $("#joburgForm").submit();
         }
    });
    $("#capetownSubmitBtn").click(function(){

         if($("#capetownForm").valid()){
             $("#capetownForm").submit();
         }
    });
    
    /* --------------------------------------------
     * BRIEF US FORMS - SUBMIT FORMS.
     * -------------------------------------------*/
    $(".leftBtn").click(function(){

         if($("#leftForm").valid()){
             $("#leftForm").submit();
         }
    });
    $("#rightForm").validate();
    $(".rightBtn").click(function(){

         if($("#rightForm").valid()){
             $("#rightForm").submit();
         }
     });
     

     /* --------------------------------------------
     * INITIATE FORMS ON QUOTE PAGE.
     * -------------------------------------------*/
     $( "#form_left" ).change(function(){
        if($(this).is(':checked'))  {
            $( "#leftForm").css("display", "block");
            $( "#rightForm").css("display", "none");
        }
    });
    $( "#form_right" ).change(function(){
        if($(this).is(':checked'))  {
            $( "#rightForm").css("display", "block");
            $( "#leftForm").css("display", "none");
        }
    });
            
//        if($("#form_left").is(':checked'))  {
//             $( "#leftForm").css("display", "block");
//             $( "#rightForm").css("display", "none");
//         } else if($("#form_right").is(':checked')) {
//            $( "#rightForm").css("display", "block");
//            $( "#leftForm").css("display", "none");
//         }
        $( "#rFrom" ).datepicker();
        $( "#rTo" ).datepicker();
        $( "#lFrom" ).datepicker();
        $( "#lTo" ).datepicker();
    
    /* --------------------------------------------
     * INITIATE CSS OVERLAY
     * -------------------------------------------*/
    $('.jqmClose').click(function(){
        $('.jqmOverlay').css('display' , 'none');
        $('.branchCT').css('display' , 'none');
        $('.branchJHB').css('display' , 'none');
        $('.thankModal').css('display' , 'none');
    });

    $('a#jhb').click(function(){
       $('.jqmOverlay').css('display' , 'block');
       $('.branchJHB').css('display' , 'block');
    });
    $('a#capeTown').click(function(){
       $('.jqmOverlay').css('display' , 'block');
       $('.branchCT').css('display' , 'block');
    });
    
    /* --------------------------------------------
     * INITIATE GALLERY VIEWER ON GALLERY PAGE
     * -------------------------------------------*/
    // We only want these styles applied when javascript is enabled
    $('div.navigation').css({'width' : '390px', 'float' : 'left'});
    $('div.content').css('display', 'block');

    // Initially set opacity on thumbs and add
    // additional styling for hover effect on thumbs
    var onMouseOutOpacity = 0.67;
    jQuery('#thumbs ul.thumbs li').opacityrollover({
        mouseOutOpacity:   onMouseOutOpacity,
        mouseOverOpacity:  1.0,
        fadeSpeed:         'fast',
        exemptionSelector: '.selected'
    });

    // Initialize Advanced Galleriffic Gallery
    var gallery = $('#thumbs').galleriffic({
        delay:                     2500,
        numThumbs:                 16,
        preloadAhead:              10,
        enableTopPager:            false,
        enableBottomPager:         true,
        maxPagesToShow:            7,
        imageContainerSel:         '#slideshow',
        controlsContainerSel:      '#controls',
        captionContainerSel:       '#caption',
        loadingContainerSel:       '#loading',
        renderSSControls:          true,
        renderNavControls:         true,
        playLinkText:              'Play Slideshow',
        pauseLinkText:             'Pause Slideshow',
        prevLinkText:              'Previous Photo',
        nextLinkText:              'Next Photo',
        nextPageLinkText:          'Next',
        prevPageLinkText:          'Prev',
        enableHistory:             false,
        autoStart:                 false,
        syncTransitions:           true,
        defaultTransitionDuration: 500,
        onSlideChange:             function(prevIndex, nextIndex) {
            // 'this' refers to the gallery, which is an extension of $('#thumbs')
            this.find('ul.thumbs').children()
                .eq(prevIndex).fadeTo('fast', onMouseOutOpacity).end()
                .eq(nextIndex).fadeTo('fast', 1.0);
        },
        onPageTransitionOut:       function(callback) {
            this.fadeTo('fast', 0.0, callback);
        },
        onPageTransitionIn:        function() {
            this.fadeTo('fast', 1.0);
        }
    });
});

     // ====================================================
     // scroll background
     // ====================================================
     var scrollSpeed = 200;       // Speed in milliseconds
     var step = 1;               // How many pixels to move per step
     var current = 0;            // The current pixel row
     var sliderCurrent = 0;
     var imageWidth = 1257;     // Background image height
 
     //The pixel row where to start a new loop
     function scrollBg(){
         //Go to next pixel row.
         current += step;
         //If at the end of the image, then go to the top.
         if (current == imageWidth){
             current = 0;
         }
//         if(waveCurrent == imageWidth){
//             waveCurrent = 0;
//         }
         //Set the CSS of the header.
         $('#contains, #sliderInnerBackground, #sliderInnerBackgroundSmall, #footerInnerBackground').css("background-position",current+"px 0");
     }
     //Calls the scrolling function repeatedly
     var init = setInterval("scrollBg()", scrollSpeed);