// jBoxed Lightbox
// by Tanner Hildebrand
// and BenchSketch.com
// 

(function($){
 $.fn.extend({
  jboxed : function(options) {
   
   // options
   var opts = $.extend({}, $.fn.jboxed.defaults, options);
   
   var wS=$(window).height();
   $("body").append("<div id='jbModal'></div>");
   $("body").append("<div id='jbInterface'><div id='jbInfoTop'><span id='jbLink'>Linkies</span><a id='jbClose'>close</a></div><div id='jbImage'><div id='jbImageBox'><img src=''></div></div><div id='jbInfoBottom'>Bottom Info here</div><a id='jbLeft' href='prev' class='jBoxed_swapBox' title='Skip To First'></a><a id='jbRight' href='next' class='jBoxed_swapBox' title='Skip To Last'></a></div>");
   
   // Fix Initial Position
   jMod=$("#jbModal"),full=$("#jbModal, #jbInterface");
   jMod.css({"opacity":opts.modal});
   iFace=$("#jbInterface"),iBox=$("#jbImageBox"),jImg=$("#jbImage");
   aR="#jbRight",aL="#jbLeft";
   iFace.css({"height":150,"width":150});
   iBox.css({"height":"100%","width":"100%"});
   iFace.css({"marginTop":-75,"marginLeft":-75});
   $(aR).css("marginLeft",120);
   full.hide();
   jSrc="#jbImage img";
   bInfo=$("#jbInfoBottom"),tInfo=$("#jbInfoTop");
   jLnk=$("#jbLink");
   rBi=$(aR).css("background-image");
   lBi=$(aL).css("background-image");
   // And boom goes the dynamite
   

   
   // Close
   $("#jbModal, #jbClose").click(function(){
    full.fadeOut(opts.speed);
   })
   //
   
   $(aR+", "+aL).css("opacity",0);
   $(aR).hover(function(){
		$(this).css("opacity",1);
	},function(){
		$(this).css("opacity",0);
	})
   $(aL).hover(function(){
		$(this).css("opacity",1);
	},function(){
		$(this).css("opacity",0);
	})
   
   // work gallery links
   $("#jbLink a, #jbRight, #jbLeft").live("click",function(){
	hr=$(this),hTtl=hr.attr("title"),hRel=hr.attr("Rel"),hRef=hr.attr("href");
	imageChange( hRef , hTtl , hRel );
	return false;
   })
   //
   t=this;
   // so we know what we are clicking...
   return t.each(function(){
	x=$(this);
	//when click show box
	x.click(function(){
	 rel=$(this).attr("rel"),title=$(this).attr("title"),href=$(this).attr("href");
	 showBoxed( rel , title , href );
	 return false;
	})
   })//end each
   
   // Initial click
   function showBoxed ( rel , title , href ) {
    setGallery ( rel );
	imageChange ( href , title , rel );
	full.fadeIn(opts.speed);
   }
   //
   
   // Apply the changes
   function imageChange ( src , info , gal ) {
	iImg=iBox.children("img");
	iImg.fadeOut(opts.speed).remove();
	jImg.css({"height":"100%"}),iBox.css({"height":"100%"});
	iBox.append("<img src='"+src+"' rel='curImg'>");
	iImg=iBox.children("img");
	iImg.hide();
	setInfo( info );
	setNext ( gal , iImg );
	imageLoad( iImg );
   }
   //
   
   // When image is loaded realign
   function imageLoad ( image ) {
	image.load(function(){ // when image is loaded
	 raBox(image);
	})
   }
   //
   
   // realign box
   function raBox ( ) {
	img=iBox.children("img");
	imageFit(img);
	iH=img.height();
	iW=img.width();
	iBox.css("height","100%"),jImg.css("height","100%");
	iFace.animate({"height":iH,"width":iW,"marginTop":-iH*.5-20,"marginLeft":-iW*.5},opts.speed,function(){
	 img.fadeIn(opts.speed); // when animate is done, show the image
	 jImg.css({"height":""}),iBox.css({"height":""});
	 bInfo.slideDown(opts.speed); // and slide in the info
	})
	$(aR).css({"marginLeft":iW*.5,"width":iW*.5+1,"height":iH-15,"marginTop":-iH*.5+22});
	$(aL).css({"width":iW*.5,"height":iH-15,"marginTop":-iH*.5+22});
   }
   //
   
   // fit the image to the window
   function imageFit ( image ) {
	iHt=image.height();
	 if(iHt+40>wS){
	  iFdif=iHt-wS+80;
	  image.css({"height":iHt-iFdif});
    }
   }
   //
   
   // Set the info
   // don't know why I made this a whole funtion
   function setInfo ( info ) {
	bInfo.fadeOut(opts.speed).html("<span>"+info+"</span>");   
   }
   //
   
   // function to set the gallery links
   function setGallery ( gallery ) {
	 jLnk.html("");
	 rCount=0,rString="";
	 //$("a[rel="+gallery+"]");
	 gal=t.filter("a[rel="+gallery+"]");
	 gal.each(function(){
	  rCount+=1;
	  var hr=$(this),gRef=hr.attr("href"),fTtl=hr.attr("title");
	  rString+="<a href='"+gRef+"' title='"+fTtl+"' class='jBoxed_swapBox' rel='"+gallery+"'>"+rCount+"</a> &nbsp;"
	 })
	 jLnk.html(rString);
	}
	//
   
   // Set the next and previous buttons
    function setNext ( gal , img ) {
	 lnk=jLnk.children("a");
	 iSrc=img.attr("src");
	 lngt=lnk.length;
	 nCount=0; // Set the count to zero
	 lnk.each(function(){ // go thru all
	  h=$(this); 
	  nCount+=1;
	  if(nCount==1){ 
	   frst=$(this);   
	  } // that was find the first element
	  if(h.attr("href")==iSrc){ // matched links 
	   if(nCount==1){ // matched is first
	    n=h.next("a");
		p=false;
	   } else if (nCount==lngt) { // matched is last
		p=h.prev("a");
		n=frst;
	   } else { // matched is anything else
		p=h.prev("a");
		n=h.next("a");
	   }
	  }
	  lst=$(this);
	 })
	 // if we don't have a previous link yet
	 if(!p){
	  p=lst;  
	 }
	 // and assign our variables
	 pL=p.attr("href"),pT=p.attr("title");
	 nL=n.attr("href"),nT=n.attr("title");
	 $(aR).attr({"href":nL,"title":nT});
	 $(aL).attr({"href":pL,"title":pT});
	 }
	 //
   
  } // end jBoxed    
 }); // end extend
// Plugin Defaults
 $.fn.jboxed.defaults = {
	 modal:.9,
	 speed:"slow",
	 fit:true,
	 border:1
 };
})(jQuery); // end all