(function($) {
	$.fn.piroBox = function(opt) {
		opt = jQuery.extend({
		my_speed : null,
		close_speed : 0,
		bg_alpha : 0.5,
		scrollImage : null,
		pirobox_next : 'piro_next_out',
		pirobox_prev :  'piro_prev_out',
		radius : 4,
		close_all : '.piro_close,.piro_overlay',
		slideShow : null,
		slideSpeed : null //slideshow duration in seconds
		}, opt);		
		function start_pirobox() {
			var corners = 
				'<tr>'+					   
				'<td colspan="3" class="pirobox_up"></td>'+
				'</tr>'+	
				'<tr>'+	
				'<td class="t_l"></td>'+
				'<td class="t_c"></td>'+
				'<td class="t_r"></td>'+
				'</tr>'+
				'<tr>'+
				'<td class="c_l"></td>'+
				'<td class="c_c"><span><span></span></span><div></div></td>'+
				'<td class="c_r"></td>'+
				'</tr>'+
				'<tr>'+
				'<td class="b_l"></td>'+
				'<td class="b_c"></td>'+
				'<td class="b_r"></td>'+
				'</tr>'+
				'<tr>'+
				'<td colspan="3" class="pirobox_down"></td>'+
				'</tr>';
			var window_height =  $(window).height();
			var bg_overlay = $(jQuery('<div class="piro_overlay"></div>').hide().css({'opacity':+opt.bg_alpha,'height':window_height+'px'}));
			var main_cont = $(jQuery('<table class="pirobox_content" cellpadding="0" cellspacing="0"></table>'));
			var caption = $(jQuery('<div class="caption"></div>').css({'opacity':'0.8','-moz-border-radius':opt.radius+'px','-khtml-border-radius':opt.radius+'px','-webkit-border-radius':opt.radius+'px','border-radius':opt.radius+'px'}));
			var piro_nav = $(jQuery('<div class="piro_nav"></div>'));
			var piro_close = $(jQuery('<div class="piro_close"></div>'));
			var piro_play = $(jQuery('<a href="#play" class="play"></a>'));
			var piro_stop = $(jQuery('<a href="#stop" class="stop"></a>'));
			var piro_prev = $(jQuery('<a href="#prev" class="'+opt.pirobox_prev+'"></a>'));
			var piro_next = $(jQuery('<a href="#next" class="'+opt.pirobox_next+'"></a>'));
			var piro_test = $(jQuery('<div class="piro_test"></div>'));
			var piro_test1=$(jQuery('<div style="background-color:#000000;width:250px;height:75px;position:absolute;z-index:100000"></div>')).css("opacity",0.9);
			var piro_replay=$(jQuery("<div class='piro_replay'><div style='margin-top:5px'>重新瀏覽</div></div>"));
			var piro_lastclose=$(jQuery("<div class='piro_lastclose'><div style='margin-top:5px'>關閉</div></div>"));
		    var play_piro=false;
			piro_test.append(piro_test1);
			piro_test.append("<div style='position:absolute;z-index:100000;color:#ffffff;margin-left:40px;margin-top:10px;font-size:13px'>已經瀏覽到最後一張，你可以</div>").append(piro_replay).append(piro_lastclose);

			var piro_countimg=0;
			var countimg=new Array();
			var lastimg=0;
			var imgarr=new Array();
			var imgtype="single";
			var singleimgarr=new Array();
			var number;
			var imgsrc=new Array();
			var imgclose=false;
			var imgreset="";		
				
		    $("#demo img").each(function(index){
		         imgsrc[index]=this.src.replace("thumb","").replace("..",".");
		         var indexof=imgsrc[index].lastIndexOf("icon",imgsrc[index].length);
		         imgsrc[index]=(imgsrc[index].substring(0,indexof)+imgsrc[index].substring(indexof,imgsrc[index].length).replace("icon","")).replace("..",".");
		        
		    });
		    $("#demo a").each(function(index){
		        $(this).attr("href",imgsrc[index]);
		        $(this).attr("class","pirobox_gall");
		    })
		

			$('body').append(bg_overlay).append(main_cont).append(piro_test);
			main_cont.append(corners);
			$('.pirobox_up').append(piro_close);
			$('.pirobox_down').append(piro_nav);
//			$('.c_c').append(piro_play);		

//			piro_play.hide();
			piro_nav.append(piro_prev).append(piro_next).append(caption);
			
			if(piro_prev.is('.piro_prev_out') || piro_next.is('.piro_next_out')){
				$('body').append(piro_prev).append(piro_next);
				piro_prev.add(piro_next).hide()
				
			}else{
				piro_nav.append(piro_prev).append(piro_next);				
				
			}
			var my_nav_w = piro_prev.width();
			main_cont.hide();
			var my_gall_classes = $("a[class^='pirobox_gall']");
			var map = new Object();
				for (var i=0; i<my_gall_classes.length; i++) {
					var it=$(my_gall_classes[i])
					map['a.'+it.attr('class')]=0;
				}
			var gall_settings = new Array();
				for (var key in map) {
					gall_settings.push(key);
					if($(key).length === 1){//check on set of images

					}
				}
							
			$(my_gall_classes).each(function(rev){this.rev = rev+0;		   
		      
		       imgarr[this.rev]=$(this).attr("href");
		     
			});
			var piro_gallery = $(my_gall_classes);		
		
			
			for (var i=0; i<gall_settings.length; i++) {
			    var strpage="";			   
					$(gall_settings[i]).each(function(rel){					   
					this.rel=rel+1;
                    this.land=i;                    
                    strpage +="<a name='pagecount' class='pagecount' href="+this.href+" title="+this.rel+" rev="+this.rev+" style='margin-right:5px;font-size:15px;'>"+this.rel+"</a>";
                    });
                    countimg[i]=strpage;
                    
					var add_first = $(gall_settings[i]+':first').addClass('first');
					var add_last = $(gall_settings[i]+':last').addClass('last');
				}		
			
			
			$.fn.fixPNG = function() {
				return this.each(function () {
					var image = $(this).css('backgroundImage');
					
					if (image.match(/^url\(["']?(.*\.png)["']?\)$/i)) {
						image = RegExp.$1;
						$(this).css({
							'backgroundImage': 'none',
							'filter': "progid:DXImageTransform.Microsoft.AlphaImageLoader(enabled=true, sizingMethod=" + ($(this).css('backgroundRepeat') == 'no-repeat' ? 'crop' : 'scale') + ", src='" + image + "')"
						}).each(function () {
							var position = $(this).css('position');
							if (position != 'absolute' && position != 'relative')
								$(this).css('position', 'relative');
						});
					}
				});
			};
			$(window).resize(function(){
				var new_w_bg = document.documentElement.scrollHeight;
				
				bg_overlay.css({'visibility':'visible','height':+ (new_w_bg+100) +'px'});				  
			});	
			
			piro_prev.add(piro_next).bind('click',function(c) {
				c.preventDefault();	
				var image_count = parseInt($(piro_gallery).filter('.item').attr('rev'));
				var start = $(this).is('.piro_prev_out,.piro_prev') ? $(piro_gallery).eq(image_count - 1) : $(piro_gallery).eq(image_count + 1);
                number=start.attr("rel");
                imgreset=start.attr("href");
                  piro_close.add(caption).add(piro_next).add(piro_prev).css('visibility','hidden');
	            load_img(start.attr("href"));
	             $('.pagecount').css('color','#fffff7')
	            $('.pagecount[title='+start.attr("rel")+']').css("color","#ffff00");	          	
	            piroboxstate(start); 
			});
			
			
			

			

			
			
			$(piro_gallery).each(function(index) {
				
					var item=$(this);
					item.bind("click",function(){
					    piro_open(item.attr('href'));
                        var this_url = item.attr('href');
					
						var descr = item.attr('title');	
						number = item.attr('rel');			            
		              
						if( descr == ""){
						caption.html('<p style="height:20px"><em id="emtitle" style="font-size:13px;font-style:normal "></em><br id="brem"/><em class="number">' + countimg[this.land] + '</em><a href='+ this_url +' class="link_to" target="_blank" title="Open Image in a new window"></a></p>');
						}else{
						caption.html('<p style="height:40px;"><em id="emtitle" style="font-size:15px;font-style:normal">'+ descr+'</em><br/><em class="number" style="top:22px">' + countimg[this.land] + '</em><a href='+ this_url +' class="link_to" target="_blank" title="Open Image in a new window"></a></p>');
						}
						 
						$("a[name=pagecount]").each(function(index){
						    						  
						    var pageitem=$(this);
						    if(number==this.title)
						        $(this).css("color","#ffff00");
						    pageitem.bind('click',function(e){
						        e.preventDefault();

						        var count=0;
						        $("a[name=pagecount]").css('color','#FFFFF7');
						        $(this).css('color','#FFFF00');
						        var image_count=this.title;
						      	   					      					      
						       if(image_count!=number)
						       {
						         piro_close.add(caption).add(piro_next).add(piro_prev).css('visibility','hidden');										               
						         number=this.title;						                               
                                 var picitem=$(my_gall_classes[this.rev]);                 
                                 load_img(picitem.attr("href"));
                                 
                                 piroboxstate(picitem);                                                  

						       }		        
				               
						       
						    });
						});
						 piroboxstate(item); 
					     return false;
					});		
				});
				var piroboxstate=function(item)	{
				  
				     var emtitle=item.attr("title");
				   
				 if(emtitle=="")
				 {
				    $(".caption p").css("height","40px");
				    
				 }
				   $("#emtitle").html(emtitle);
				  $("#emtitle").css("color","#ffffff");
				 
				    if(item.is('.last')){						   					   
						   lastimg=1
						   if(play_piro==true)
						   {
						    piro_test.fadeIn(1000);
						    piro_test.fadeOut(5000);
						    play_piro=false;
						   }
						   
						}else{						    
						    piro_test.hide();
						    lastimg=0;						    
							}				
						if(item.is('.first')){
							piro_prev.hide();
							piro_next.show();		
						}else{
							piro_next.add(piro_prev).show();		  
						}
						if(item.is('.last')){						   
							piro_prev.show();
							piro_next.hide();			  
						}
						if(item.is('.last') && item.is('.first') ){
							piro_prev.add(piro_next).hide();
							$('.number').hide();
						}					
							$(piro_gallery).filter('.item').removeClass('item');
							item.addClass('item');
							$('.c_c').removeClass('unique');
				
				}
       

				//加載圖片框架
				var piro_open = function(my_url) {
				        imgclose=false;
				        bg_overlay.css("height",document.documentElement.scrollHeight)
				   		   
					    piro_close.add(caption).add(piro_next).add(piro_prev).css('visibility','hidden');
						$('.c_c div').children().remove();
						main_cont.css({marginTop : parseInt($(document).scrollTop())-(200/1.9)});
						main_cont.show();
						var main_cont_h = $(main_cont).height();
					    main_cont.css({marginTop : parseInt($(document).scrollTop())-(main_cont_h/1.9)});					
				        $('.c_c div').append('<p class="err_mess"><a href="#close" class="close_pirobox">關閉圖片</a></p>');
					    $('.close_pirobox').bind('click',function() {
					         $(opt.close_all).click();
					    });
						bg_overlay.fadeIn(300,function(){
					        load_img(my_url);
						});														
				}
				
				
			
				//加載圖片
				var load_img = function(my_url) {
				  			   
				    				                   
				    if(main_cont.is('.loading')) {return;}				   
				    main_cont.addClass('loading');			   
				    var img = new Image();			    			     
				    $('.link_to').attr("href",my_url);
				    
				    img.onerror=function (){
				        $('.c_c div').children().remove();
					    var main_cont_h = $(main_cont).height();
					    main_cont.css({marginTop : parseInt($(document).scrollTop())-(main_cont_h/1.9)});
					    piro_test.css({marginTop : parseInt($(document).scrollTop())-(main_cont_h/1.9)});
				        $('.c_c div').append('<p class="err_mess">圖片加載失敗:&nbsp;<a href="#close" class="close_pirobox">強制關閉</a></p>');
					    $('.close_pirobox').bind('click',function() {
						    $('.err_mess').remove();
						    piro_test.hide();
						    $('.c_c div').children().remove();
						    main_cont.add(bg_overlay).fadeOut(opt.close_speed);
						    main_cont.removeClass('loading');						
					        return false;
					        });							   			
				    };
				
				//imgload
                img.onload=function(){
                    $('.c_c div img').remove(); 
                    if(imgclose)
                        return;
                    if(img==null)
                        return;
                    var imgH = img.height;
					var imgW = img.width;
					if(imgW<50||imgW==null||imgW=="")
					    imgW=500;
					if(imgH<50||imgH==null||imgH=="")
					    imgH=400;									
					var main_cont_h = $(main_cont).height();
					var w_H = 600;
					var w_W = 700;				   
					if(imgH+100 > w_H || imgW+100 > w_W)
					{					  
						var new_img_W = imgW;
						var new_img_H = imgH;
						var _x = (imgW + 250)/w_W;
						var _y = (imgH + 250)/w_H;
						if ( _y > _x )
						{
							new_img_W = Math.round(imgW * (1/_y));
							new_img_H = Math.round(imgH * (1/_y));
					    } 
					    else 
					    {
						    new_img_W = Math.round(imgW * (1/_x));
						    new_img_H = Math.round(imgH * (1/_x));
						}
						imgH += new_img_H;
						imgW += new_img_W;					
						piro_test.css('margin-top',parseInt($(document).scrollTop())-(new_img_H/1.9)-20+(new_img_H/2));
						$(img).height(new_img_H).width(new_img_W).hide();
                        $('.c_c div').css({height:new_img_H+'px',width:new_img_W+'px'});
                        main_cont.css({
                            height:(new_img_H+20)+'px',
                            width:(new_img_W+20)+'px',
                            marginLeft:'-'+((new_img_W)/2+10)+'px',
                            marginTop:parseInt($(document).scrollTop())-(new_img_H/1.9)-20+'px'
                            });
                        $('.piro_nav,.caption').css({width:(500)+'px'});
                        $('.piro_nav').css('margin-left','-250px');
                        var caption_height=caption.height();
                        caption.css('bottom','-'+(caption_height+5)+'px');
                        $('.c_c div').append(img);
                        piro_close.css('display','block');
                        piro_next.add(piro_prev).add(piro_close).css('visibility','visible');
                        caption.css({'visibility':'visible','display':'block'});
                        $(img).show();
                        main_cont.removeClass('loading');						
				}
				else
				{
				    piro_test.css('margin-top',parseInt($(document).scrollTop())-(imgH/1.9)-20+(imgH/2));
					$(img).height(imgH).width(imgW).hide();
                    $('.c_c div').css({height:imgH+'px',width:imgW+'px'});                    

                    main_cont.css({
                        height:(imgH+20)+'px',
                        width:(imgW+20)+'px',
                        marginLeft:'-'+((imgW)/2+10)+'px',
                        marginTop:parseInt($(document).scrollTop())-(imgH/1.9)-20+'px'
                    });
                     $('.piro_nav,.caption').css({width:(500)+'px'});//imgW
			        $('.piro_nav').css('margin-left','-250px');//imgW+5/2
				    var caption_height = caption.height();
				    caption.css({'bottom':'-'+(caption_height+5)+'px'});
                     $('.c_c div').append(img);
				    piro_close.css('display','block');
				    piro_next.add(piro_prev).add(piro_close).css('visibility','visible');
				    caption.css({'visibility':'visible','display':'block'});
				    $(img).show();
			        main_cont.removeClass('loading');

				  }	
               }
               img.src=my_url;
               
                 $(opt.close_all).bind('click',function(c) {
      
                    imgclose=true;                 
		            img=null;		        
		            piro_test.hide();				
				    c.preventDefault();
				    piro_close.add(bg_overlay).add(main_cont).add(caption).add(piro_next).add(piro_prev).fadeOut(opt.close_speed);
				    main_cont.removeClass('loading');
				    $(piro_gallery).children().removeAttr('class');
				    piro_next.add(piro_prev).css('width',my_nav_w+'px').hide();
				    $('.stop').remove();
//				    $('.c_c div img').remove();
				    				
				  });

		}
                 
	         
				    $.browser.msie6 =($.browser.msie && /MSIE 6\.0/i.test(window.navigator.userAgent));
					if( $.browser.msie6 && !/MSIE 8\.0/i.test(window.navigator.userAgent)) {
						$('.t_l,.t_c,.t_r,.c_l,.c_r,.b_l,.b_c,.b_r,a.piro_next, a.piro_prev,a.piro_prev_out,a.piro_next_out,.c_c,.piro_close,a.play,a.stop').fixPNG();
						
					}
				   
			}
		start_pirobox();
	}
})(jQuery);