/* a couple of globals to track the number if images we have tried to load and whether */
 /* we have found an image that fails to load */
 var image_load_count = 0;
 var failed_to_load_thumbnails = false;
 var failed_to_load_photos = false;
 var failed_to_load_text_thumbnails = false;
 var failed_to_load = false;
 var initialize_pages = new Array();
 var current_page = 0;
 var cookie_path = '';
 
 function set_navigation(i)
 {
    var next = i.valueOf() + 1;
    var hide_count = 0;
    if (i == 0) { 
        $("#csm5_prev").hide();        
        hide_count = hide_count + 1;
    } else {
        $("#csm5_prev").show();       
    }
    if ((i == 9) || (initialize_pages[next] == false)) {    
        $("#csm5_next").hide();    
        hide_count = hide_count + 1;
    } else {
        $("#csm5_next").show();     
    }    
    
    if (hide_count == 2) {
    
        $("#csm5").css('padding-top', '25px');
    }
    $("#csm5").show();
 }
 
 function next_page()
 {
    var current = current_page + 1;
    var next_page = current + 1; 
    var next_menu = document.getElementById("csm5_" + next_page.toString());
    var current_menu = document.getElementById("csm5_" + current.toString());
    
    current_menu.style.display = 'none';
    next_menu.style.display = 'inline';
    set_navigation( current_page + 1);
    current_page = current_page + 1;
 }
 
 function prev_page()
 {
 
    var current = current_page + 1;
    var prev_page = current - 1; 
    var prev_menu = document.getElementById("csm5_" + prev_page.toString());
    var current_menu = document.getElementById("csm5_" + current.toString());
    
    current_menu.style.display = 'none';
    prev_menu.style.display = 'inline';
    set_navigation( current_page - 1);
    current_page = current_page - 1;
 }
 
 function initialize(path)
 {
    initialize_pages[0] = true;
    initialize_pages[1] = false;
    initialize_pages[2] = false;
    initialize_pages[3] = false;
    initialize_pages[4] = false;
    initialize_pages[5] = false;
    initialize_pages[6] = false;
    initialize_pages[7] = false;
    initialize_pages[8] = false;
    initialize_pages[9] = false;
    cookie_path = path;
 }
 
 /* Every time we get an image load or error event we do some accounting */
 function handle_image_load()
 {
    /* increment the number of images that we have see thus far */
    image_load_count = image_load_count + 1;
    
    /* If this is the last image, get ready to hide the overlay... we actually */
    /* set a timeout for closing the overlay of one second.. this prevents a flicker */
    /* should the images load right after we bring up the overlay */
    if (failed_to_load_photos && failed_to_load_thumbnails) {
        setTimeout('hide_loading_overlay()', 500);
        set_navigation(0)
        $("#csm5").show();
        setCookie(cookie_path, "preloaded", 3);
    }    
 }
 
 /* cheap function to pause execution for a number of milliseconds */
 function pause(millis) 
 {
        var date = new Date();
        var curDate = null;

        do { curDate = new Date(); } 
        while(curDate-date < millis)
 } 
 
 /* Given an index, this function will show the appropriate image in the large gallery window */
 function show_image(i, j) {
 
    $(".bigphoto_text").hide();
    $(".bigphoto_images").hide();
    $(".text_thumbnails").hide();
    $("#image_" + j + "_" + i).show();
    $("#text_" + i).show()
    $("#cs_thumb_" +i).show() 
 }
 
 function select_thumbnail(i) {
    $(".cs_thumbnail").removeClass('selected_cs_thumbnail');
    $(".cs_thumbnail").addClass('unselected_cs_thumbnail');
    $("#cs_thumbnail_"+i.toString()).removeClass('unselected_cs_thumbnail');
    $("#cs_thumbnail_"+i.toString()).addClass('selected_cs_thumbnail');
    $(".selected_arrow").hide();
    $("#selected_arrow_"+i.toString()).show();
 }
 
 function select_text_thumbnail(i, j) {
    /*
    $(".cs_thumb2").hide();
    
    
    $("#thumb_"+j.toString()+"_"+i.toString()).show();
    
    alert("#thumb_"+j.toString()+"_"+i.toString());
    */
    $("div.cs_thumb2").removeClass('selected_cs_thumb2');
    $("div.cs_thumb2").addClass('unselected_cs_thumb2');
    $("#thumb_"+j.toString()+"\_"+i.toString()).removeClass('unselected_cs_thumb2');
    $("#thumb_"+j.toString()+"\_"+i.toString()).addClass('selected_cs_thumb2');   
    
 }
 
 /* Given a div (where the gallery images live, a path to the image and and index, this */
 /* will write the gallery image to a div where the display is initially set to none */
 function write_big_photo(bigphoto, path, dir, casestudy_index, image_index, max){
   
         var image = new Image(375, 412);
         var src = path + dir + casestudy_index.toString() +".jpg";

        
         /* image.onload = preload_bigphoto(src, bigphoto, i); */
         
         image.onload = function() {          
            bigphoto.innerHTML += '<img style="display: none" name="bigphoto_images" class="bigphoto_images" \
                                    id="image_' + casestudy_index.toString() + '_'+image_index.toString()+'"\
                                    alt="" height="412" src="' + this.src + '" />'; 
            handle_image_load();
            
            
                new_image_index = image_index + 1;
                if (new_image_index <= max) { 
                    write_big_photo(bigphoto, path, 'casestudy' + new_image_index.toString() + '/', casestudy_index, new_image_index, max);
                } else {
                    failed_to_load_photos = true; failed_to_load = true; handle_image_load();
                }
            
         }
         image.onerror = function() { failed_to_load_photos = true; failed_to_load = true; handle_image_load(); }
         
         image.src = src;
 }
 
 function write_thumbnail(thumbnails, base, path, i, max) {
    
        var image = new Image(60, 60);
        var src = base + path  + "1_thumb.jpg";
    
        var analytics_src = base.substring(2) + path + "1.jpg";                
        
        image.onload = function() {
            thumbnails.innerHTML +='<div onmouseover="quietPageTrack(\''+analytics_src+'\'); select_thumbnail('+ i.toString() + '); show_image('+ i.toString() +', 1);" id="cs'+i.toString()+'" class="mar_b15">\
                                        <div id="cs_thumbnail_'+i.toString()+'" class="unselected_cs_thumbnail cs_thumbnail">\
                                            <img height="60" width="60" src="'+src+'" alt=""/>\
                                        </div>\
                                        <p style="position:relative; width:100%" class="cs_tbnail_text">\
                                            <img style="display:none; position:absolute; left:15px; top:2px;" class="selected_arrow" id="selected_arrow_'+i.toString()+'" src="../images/casestudies/arrow.png">\
                                            &nbsp;CASE STUDY '+i.toString()+'\
                                        </p>\
                                    </div>';
           
                j = i + 1;
            
               var page = Math.floor(j / 4) + 1;                    
               if( (j % 4) == 2) {                        
                        initialize_pages[page-1] = true;
                    }
                    
                if (j <= max) {
                    if ( (j % 4) == 1 ) {                                    
                        var new_thumbnails = document.getElementById("csm5_" + page.toString());                                   
                        write_thumbnail(new_thumbnails,  base, 'casestudy' + j.toString() + '/', j, max);
                    } else {
                        write_thumbnail(thumbnails,  base, 'casestudy' + j.toString() + '/', j, max );
                    }
                } else {
                    failed_to_load_thumbnails = true;  failed_to_load = true; handle_image_load();
                }
        } 
        image.onerror = function() { failed_to_load_thumbnails = true;  failed_to_load = true; handle_image_load();}     
        
        image.src = src;
        
 }
 
 function write_text_thumbnails(path, i, j)
 {
     var image = new Image(60, 60);
     var src = path + j.toString() +"_thumb.jpg";
     var analytics_src = path.substring(2) + j.toString() + ".jpg";        
    
     image.onload = function() {
        $("#cs_thumb_" + i.toString()).append('<div \
            onmouseover="quietPageTrack(\''+analytics_src+'\'); select_text_thumbnail('+ i.toString() +','+j.toString()+'); show_image('+ i.toString() +', '+ j.toString() +')" id="thumb_' +j.toString() +'_'+i.toString()+'" \
            class="cs_thumb2 unselected_cs_thumb2 mar_r18" style="overflow:hidden;"> \
            <img height="60" width="60" src="'+src+'" alt=""/>\
            </div>');
        k = j +1;
        if (k <= 3) {            
            write_text_thumbnails(path, i, k)
        }
     }
     image.onerror = function() { failed_to_load_text_thumbnails = true;  failed_to_load = true; handle_image_load(); }     
     image.src  = src;
    
 }
 
 
 
 function write_text(textarea, path, dir,  i)
 {
        var src = path + dir + "description.txt";
        var thumb1 = path + dir + "1_thumb.jpg";
        var thumb2 = path + dir + "2_thumb.jpg";
        var thumb3 = path + dir + "3_thumb.jpg";
        
     $.ajax({
   type: "GET",
   url: src,
   success: function(data){
            $("#csm3").append('<p class="cs_text bigphoto_text"  name="bigphoto_text" id="text_' + i.toString() + '" style="display: none;">\
                <strong>Case Study ' + i.toString() +  '</strong><br/> ' + data + '</p>\
                <div name="text_thumbnails" id="cs_thumb_'+i.toString()+'" class="mar_t20 text_thumbnails" style="display:none">\
                </div>');
            
            write_text_thumbnails(path + dir, i, 1);
            j = i + 1;
            write_text(textarea, path, 'casestudy' + j.toString() + '/', j);
   },
   error: function(data) {
    write_big_photo_area(path, i-1);       
    write_thumbnail_area(path, i-1);    
 
    }
 });
    
    /*
        $.get(src, function(data) {
            $("#csm3").append('<p class="cs_text bigphoto_text"  name="bigphoto_text" id="text_' + i.toString() + '" style="display: none;">\
                <strong>Case Study ' + i.toString() +  '</strong><br/> ' + data + '</p>\
                <div name="text_thumbnails" id="cs_thumb_'+i.toString()+'" class="mar_t20 text_thumbnails" style="display:none">\
                </div>');
            
            write_text_thumbnails(path + dir, i, 1);
            j = i + 1;
            write_text(textarea, path, 'casestudy' + j.toString() + '/', j);
        });
      */         
 }
 
 
 
 function write_big_photo_area(path, max){
 
    var bigphoto = document.getElementById("csm4");
    bigphoto.innerHTML='<img name="bigphoto_images" class="bigphoto_images" height="412" width="376" src="../images/cs_image2.png" alt=""/></div>';
    
        for (var j = 1; j <= 3 ; j++ ) {
            write_big_photo(bigphoto, path, 'casestudy1/', j, 1, max);
        }
    
    
 }
 
 function write_thumbnail_area(path, max)
 {
 
    var thumbnails = document.getElementById("csm5_1");    
    write_thumbnail(thumbnails, path, 'casestudy1/', 1, max);   
 }

 function write_text_area(path)
 {
    var textarea = document.getElementById("csm3");
    textarea.innerHTML='<p class="cs_text bigphoto_text" name="bigphoto_text"><strong>Case Studies</strong>\
<br/>\
<br/>\
Bend River is a custom crafter of windows and doors, so there\'s no catalogue &mdash; there is only history.\
<br/>\
<br/>\
After more than a decade of success, our story is best told through case studies.  These case studies show the \
value of Bend River\'s craft &mdash; a dedication to meeting construction challenges and unique design, built to the most demanding standards.\
<br/>\
<br/>\
The case studies we present provide examples of how we have collaborated in the creation of building excellence.\
<br/>\
<br/>\
We create solutions.\
</p>';
    
        write_text(textarea, path, 'casestudy1/', 1);
        
    
   
 }
  
 function show_loading_overlay()
 {
    var preloaded = getCookie(cookie_path);  
    if ("" === preloaded) {
        var loading = document.getElementById("loading");
        $("#loading").attr('overflow', 'hidden');
        
        if ((false == failed_to_load_photos) || (false == failed_to_load_thumbnails)) {
            loading.style.display = 'inline';
        }
    }
 }
 
 function hide_loading_overlay()
 {
    var loading = document.getElementById("loading");
    loading.style.display = 'none';
 }
 

 function casestudy_gallery_init(path) {
    
    initialize(path);    
    show_loading_overlay();
    write_text_area(path);              
    
 }
 
$(document).ready(function() {
   // put all your jQuery goodness in here.
    casestudy_gallery_init('../images/casestudies/');
 });