// Main JavaScript Files
$(document).ready(function() {
  // Stuff to do as soon as the DOM is ready;
  
  var slides = '';
  // open all external links in a separate window...
  $("a[href^=http://]").attr("target","_blank");
  $("a[rel~='external']").attr("target","_blank");
  // undefined links on the Clients page
  $("#clients a[href=#]").click(function() {
    alert("This link is not yet defined."); return false;
  });  
  // we have to identify those pesky Windoze browsers, with all their bugs/issues
  if(navigator.appVersion.indexOf("Win")!=-1){
    if($.browser.mozilla){ var is_win_moz  = true; }else{ var is_win_moz  = false; }
    if($.browser.msie)   { var is_win_msie = true; }else{ var is_win_msie = false; }
    if(is_win_msie && /MSIE 6.0/.test(navigator.userAgent) ) { var is_win_msie_6 = true }else { var is_win_msie_6 = false; }
    // var ie6 = $.browser.msie && /MSIE 6.0/.test(navigator.userAgent);
  } 
  
  // Win Firefox can't handle letter-spacing on the nav, so remove it.
  // if(($.browser.mozilla) && (navigator.appVersion.indexOf("Win")!=-1) ){
  if(is_win_moz){ $('#nav p a').css({'letter-spacing': '0em'}); }
  
  // throw a dialog for msie6
  // if(is_win_msie_6){ alert("THIS IS A CRAPPY BLOODY BROWSER!!!"); }
  
  
  // Cycle Plugin: Defining options
  var cycle_opts = {
     delay:       5000,       // Delay first slide by 5 seconds :additional delay (in ms) for first transition (hint: can be negative)
     timeout:     6000,       // milliseconds between slide transitions (0 to disable auto advance)
     speed:       100,        // speed of the transition (any valid fx speed value) 
     next:        '#next',    // id of element to use as click trigger for next slide 
     prev:        '#prev',    // id of element to use as click trigger for previous slide 
     // height:      650,        // container height 
     slideExpr:   '.image',   // 
     counter:     1,          // turn on counter
     before:      cycle_onBefore,
     after:       cycle_onAfter,
     containerResize: 0   // resize container to fit largest slide
   };
   
   // Cycle Plugin: turn off the slideshow when clicking the next/prev buttons 
   $("#next,#prev").click(function() {
     $('#slideshow .pics').cycle('pause'); $('#pause_play').html("<span>P</span>LAY"); return false;
   });
   
   // Cycle Plugin: onBefore method that handles 
   function cycle_onBefore(curr, next, opts, fwd) {
      // look for the slides_arr object and loop through it
      if(typeof(slides_arr) != "undefined"){
        // handle looping around
        var num_slides = slides_arr.length;
        if(fwd){ // going forwards
          var curr_slide_num = opts.nextSlide + 1;
          if(curr_slide_num == num_slides){ curr_slide_num = '0'; }
        }else{ // going backwards, cycle knows num of slides since they are in DOM already only loading in the .src image file
          var curr_slide_num = opts.nextSlide; 
        }
        $('#' + slides_arr[curr_slide_num].id).attr('src', slides_arr[curr_slide_num].src);
      }
      
      
      
      // ensure the image is centered correctly.
      if(is_win_msie_6){
        $(this).css({left: '30%', marginLeft: -$(this).width()/2 });
        // $(this).css({left: '10%', marginLeft: -($(this).width()/2 - $(this).width()/3) });
      }else{
        $(this).css({left: '50%', marginLeft: -$(this).width()/2});
        // $(this).css({top: '50%', marginTop: -$(this).height()/2});
      }
      
      // }
      // resize the containing slideshow box
      $('#slideshow').css({height: $(this).height() + 1});
   }; 
   
   // Cycle Plugin: onAfter method that handles...
   function cycle_onAfter(curr, next, opts, fwd){
     // enable the bookmark image functionality
     img_ref = $(this).find("img").attr('id');
     $('#bookmark').attr({'href': '/photo/'+img_ref, 'title': 'Image: ' + img_ref + ' | NancyHoney.com', 'rel' : 'external'});
   }
   
   // Cycle Plugin: start the slideshow
   var ss = $('#slideshow .pics').cycle(cycle_opts);
   
   // Cycle Plugin: enable toggle slideshow mechanism
   $('#pause_play').click( function() {
     // need to use RegExp here, since M$IE somehow makes the HTML uppercase.
     var btn_rgx = /<span>P<\/span>AUSE/i; // NB! the i flag on the regex
     if ($('#pause_play').html().match(btn_rgx)){
       $('#slideshow .pics').cycle('pause'); $('#pause_play').html("<span>P</span>LAY"); return false;
     }else{ // with instant resume => true
       $('#slideshow .pics').cycle('resume',true); $('#pause_play').html("<span>P</span>AUSE"); return false; 
     };
   });
   // show & hide the controls div when mousing over the slideshow
   // $('#main-content').hover( function() { $('#controls').fadeTo('slow',0.4); }, function() { $('#controls').fadeTo('slow',0.1); } );
   // $('#main-content').hover( function() { $('#controls').fadeTo("slow", 1); }, function() { $('#controls').fadeTo("slow", 0.2); } );
   // $('#controls').hover( function() { $('#controls').fadeTo("fast", 1.0); }, function() { $('#controls').fadeTo("slow", 0.3); } );
   
   // enable viewing the website in fullscreen mode
   $('#fullscreen').click(function() {
     if (screen.availWidth > 1024){
       window.moveTo(0,0);
       window.resizeTo(screen.availWidth,screen.availHeight);
     }else{
       alert("Your screen is too small");
       var config_str = "left=0,screenX=0,top=0,screenY=0";
       if (window.screen) {
         var ah = screen.availHeight; var aw = screen.availWidth;
         config_str += ",height=" + ah + ",innerHeight=" + ah + ",width=" + aw + ",innerWidth=" + aw; } else {
         config_str += ",resizable"; // so the user can resize the window manually
       }
       window.open(location.href, 'maximise_fullscreen', config_str);
     }
     return false; 
    });
    
    
    // onImagesLoad plugin code
    // attach directly to each image within each .imageSection 
    $('#slides img').onImagesLoad({ itemCallback: itemImagesLoaded, selectorCallback: selectorImagesLoaded }); 
    // itemImagesLoaded (the itemCallback) is invoked once for each individual image that loads 
    // i.e. the itemCallback will be invoked "$('#slides img').length" times 
    function itemImagesLoaded(domObject){ 
      // $(domObject).siblings('.loading').css("display", "none");
    } 
    // selectorImagesLoaded (the selectorCallback) is invoked only once: when all images that 
    // $('#slides img') encapsulates have loaded 
    function selectorImagesLoaded($selector){ 
      $('#controls ul').append('<li class="all-loaded">- - -&nbsp;<br>\nALL IMAGES<br>LOADED</li>');
    }
    
});