/*
Wine Knot website scripts, Requires jQuery

2010-06-04T14:34:02-08:00 - Modified for php changes made: always use anchors around
                    images, so there is no longer a NOSCRIPT section.
2009-03-10T10:15:23PST - separated from the html
*/
// for jsLint:
/*global com $ */

var com = com || {};
com.SplendidSpider = window.com.SplendidSpider || {};
com.SplendidSpider.wineKnot = {

   // not using this yet, thoughts for future expansion
   itemDesc: function( itemNum, options ){
      var defaults = {
         imgFront: "",
         imgBack: ""
      };

      this.itemNumber = itemNum || -1;
      this.image = {
         frontImg: "21",
         frontCap: "",
         backImg: "",
         backCap: "",
         otherImg: ""
      };
   },
   // end of: not using this yet, thoughts for future expansion
   
   wkImgNames: [],
   // This gets replaced with an absolute path
   wkImgThumbPath: "bagImage/",
   
   saveImagenames: function( fullImageListStr ){
   
      this.wkImgNames = fullImageListStr.split( ',' );
   },
   
   // Images
   _newImage: function( imgSrc ) {
   
      var tempImg = new Image();
      tempImg.src = imgSrc;
      return tempImg;
   },
   
   fsImages: [],
   
   // called through setTimeout, so can't use "this"
   // Let the browser use it's cache, it should be able to find them.
   // That way I don't have to worry about checking if these are loaded
   //  when I try to use them.
   preloadFullSize: function(){

      var wk = window.com.SplendidSpider.wineKnot;
      var iCount;

      for( iCount=0; iCount < wk.wkImgNames.length; iCount++ ){
         wk.fsImages[ wk.wkImgNames[ iCount ] ] = ( wk._newImage( wk.wkImgThumbPath + '/' + wk.wkImgNames[ iCount ] ) );
      }
      
   }
};




// When the page is ready
$(document).ready(function(){

  var wk = com.SplendidSpider.wineKnot;
  // show js only content
  $( ".jsBlockEnable" ).css( { "display": "block" } );
  $( ".jsInlineEnable" ).css( { "display": "inline" } );

  // only make the div big if JavaScript is enabled
  $("#bigDisplay").css( { "margin": "20px auto" } );
  // $("#largerMessage").css( { "display": "block" } );
  $("#theBigPicture").css( { "width": "480px", "height": "640px", "margin": "0px auto", "z-index": "1" } );
  $("#theBigPicture").css( { "background": "url(bagImage/100_2052-480.JPG) no-repeat scroll 0% 0%" } );
  $("#theBigPicture").css( { "border": "3px solid #182640" } );
  $("#theBigPicture").draggable();
  // make it look moveable
  $("#theBigPicture").hover(
        function () {
          $(this).css( { "cursor": "Move" } );
        },
        function () {
          $(this).css( { "cursor": "Default" } );
        }
  );
  
  
  // This is probably not needed since the 6/4 rewrite
  $("#thumbs > img").click( function(event){
    
    // get the image name (and relative path)
    var src = $(this).attr( "src" );
    src = src.replace( "thumb_", "" );
    
    //$("#theBigPicture").css( "background", "url(" +  src +  ")" );
    // Stop the link click from doing its normal thing
    return false;
  });
  
  // This replaces the function above that uses img for the click
  $("#thumbs > a").click( function(event){
    // get the image name (and relative path)
    var src = $(this).attr( "href" );
    // drop the thumb part
    src = src.replace( "thumb_", "" );
    // fix url if it has spaces
    src = src.replace( " ", "%20" );
    //alert( src );
    $("#theBigPicture").css( "background", "url(" +  src +  ")" );
    return false;
  });
  


  // make it look clickable
  $("#thumbs > img").hover(
        function () {
          $(this).css( { "cursor": "Pointer" } );
        },
        function () {
          $(this).css( { "cursor": "Default" } );
        }
  );

  
  // load the full size images
  setTimeout( com.SplendidSpider.wineKnot.preloadFullSize, 50 );

});