/*jquery.lazypic
1/11/2010
*/
(function($) {
$.fn.lazypic=function(o){
		
       options = $.extend({}, defaults, o || {});
                     _init();
       dbox=$.extend({},{
             captionholder:$("#lazy_caption"),
             loader:$('#lazy_loader'),
             image:$('#lazy_image'),
             previous:$('#lazy_previous'),
             next:$('#lazy_next'),
             wrapper:$('.'+options.imageholder),
             prevImg:-1,
             actImg:0,
             nextImg:1,
             startImg:1,
             loaderdim:{width:options.ajaxwidth,height:options.ajaxheight}
       },defaults); 
		 
		  outerwidth=dbox.image.outerWidth();
        outerheight=dbox.image.outerHeight();
        dbox.wrapper.css({width:outerwidth});  
        dbox.loader.css({top:outerheight/2,left:outerwidth/2});
		 
		 
       var pictures=new Array();
       caption=$('#lazy_caption');
       dbox.next.bind("click",function(e){showHelper(dbox.nextImg,pictures);return false;});
       dbox.previous.bind("click",function(e){showHelper(dbox.prevImg,pictures);return false;}); 
       		
       		if ($(this).length>0){
       		startImg = $(this)[dbox.startImg];
       		//first let's load the starting image, outside the loop so we avoid waiting for it while the other pictures load
      		var apic={
       			idto:dbox.startImg,
					href:startImg.href,
       			caption:startImg.title||starImg.text()||startImg,
       			loaded:false,
       			width:0,
       			height:0
       		}
       		pictures[dbox.startImg]=apic;
				showHelper(dbox.startImg,pictures); //show the picture. it will load it in the process
				}
       return this.each(function(id){
       	 	//lets give a click event to every thumbnail picture in the slider
                var apic={idto:id,href:this.href,caption:this.title || $(this).text() || this.href,loaded:false,width:0,height:0};
                pictures[id]=apic;
					 $(this).bind("click",function(e){showHelper(id,pictures);return false;});
       });
};
var defaults={
        ajaxwidth:32,  //sirina na ajax slikata
        ajaxheight:32, //visina na ajax slikata
        imageholder:"lazy_imageholder",
        ajaxloader:"templates/prezident/images/ajax-loader.gif"
};
function getType(url){
                var urlString = /\.jpg$|\.jpeg$|\.png$|\.gif$|\.bmp$/;
                var urlType = url.toLowerCase().match(urlString);
                return urlType;
            };
function printobj(object){
                var pr='';
                for (var key in object) {
                pr=pr+key+': '+object[key]+'<br>';
                }
               return pr;
            };
function viewport(){
                return {
                    x: $(window).scrollLeft(),
                    y: $(window).scrollTop(),
                    cx: $(window).width(),
                    cy: $(window).height()
                };
            };
function prepareHelper(imgobj,action){
          switch (action){
              case 'show':
                 var dimensions={width:imgobj.width,height:imgobj.height};
					  position(dimensions,imgobj);
                 this.caption.html('<span>'+imgobj.caption+'</span>');
                 this.caption.show();
                 
               break;
              case 'loading':
              		dbox.loader.show();
              		$('#lazy_caption').hide();
              break;
          }
};
function showHelper(actImg,pictures){
               

                var imgobj=pictures[actImg]!=undefined?pictures[actImg]:'nopic';
                
                if (getType(imgobj.href)){
              	  prepareHelper(imgobj,'loading');
                  if (imgobj.loaded){
                       prepareHelper(imgobj,'show');
                        dbox.actImg=imgobj.idto;
                        var prevImg=dbox.actImg-1;
                        var nextImg=dbox.actImg+1;
								preloadNext(nextImg,pictures);
                        preloadPrev(prevImg,pictures);
                    }
                     else{
                         loadImg(actImg,pictures);
                     }
                }

             };
function loadImg(actImg,pictures,action){
           if (typeof action=='undefined') action='loading';
                     var imgobj=pictures[actImg]!=undefined?pictures[actImg]:'nopic';
                      
                      if (getType(imgobj.href)){
                      if (!imgobj.loaded){
                            var img=new Image();
                            img.onload=function(){
                                    imgobj.loaded=true;
                                    imgobj.width=this.width;
                                    imgobj.height=this.height;
                                    if (action!='preload') showHelper(actImg,pictures);
                                    img.onload=function(){};
                            }
                            img.src=imgobj.href;
                        }
                    }
};
function preloadNext(nextImg,pictures){
    var nextPic=pictures[nextImg];
               if (nextPic!=undefined){
                   dbox.next.show();
                   if (!(getType(nextPic.href))){
                        preloadNext(nextImg+1,pictures);
                        //dbox.next.hide();
                    }
                    else{
                      dbox.nextImg=nextPic.idto;
                      loadImg(dbox.nextImg,pictures,'preload');
                      //dbox.next.show();
                    }
                }
                else{
                    dbox.next.hide();
                }
};
function preloadPrev(prevImg,pictures){
    var prevPic=pictures[prevImg];
            if(prevPic!=undefined){
                dbox.previous.show();
                if(!(getType(prevPic.href))){
                    preloadPrev(prevImg-1,pictures);
                }
                else{
                    dbox.prevImg=prevPic.idto;
                    loadImg(dbox.prevImg,pictures,'preload');
                }
            }
            else{
                dbox.previous.hide();
            }
};
function preload(actImg,pictures){
        var imgobj=pictures[actImg]!=undefined?pictures[actImg]:'nopic';
        
};
function position(dimensions,imgobj){
              var de = document.documentElement;
              var w = self.innerWidth || (de&&de.clientWidth) || document.body.clientWidth;
              var pos=viewport();
              dimensions.width=dimensions.width>0?dimensions.width:options.ajaxwidth;
              dimensions.height=dimensions.height>0?dimensions.height:options.ajaxheight-22;
              outerwidth=dbox.image.outerWidth();
              outerheight=dbox.image.outerHeight();
              	dbox.wrapper.css({width:outerwidth});  
         	  	dbox.loader.css({top:outerheight/2,left:outerwidth/2});
				  	
				  	img=new Image();
				  	img.onload=function(){
				  	  	dbox.image.children("img").attr({src:imgobj.href});
				  	  						dbox.image.children("img").animate({width:(dimensions.width),height:(dimensions.height)},{
						duration:300,complete:function(){					}
						});	
						   dbox.image.css({width:(dimensions.width),height:(dimensions.height)});
						   dbox.loader.hide();
						   outerwidth=dbox.image.outerWidth();
            			dbox.wrapper.css({width:outerwidth}); 
					}
					img.src=imgobj.href;
					




};

function _init()
{
			$("."+options.imageholder)
			.append("<div id='lazy_loader'></div>")
			.append("<div class='contr'><div id='lazy_previous' class='ctrbtns'><a href='#'>претходна</a></div><div id='lazy_next' class='ctrbtns'><a href='#'>следна</a></div></div>")
			.append("<div id='lazy_image'><img src='' alt='' /><div id='lazy_caption'></div></div>")
			
    
};
})(jQuery);
