$def with(datesort, Data, isconnect, refreshstatus)
<!DOCTYPE html PUBLIC "-//W3C//DTD XHTML 1.0 Transitional//EN" "http://www.w3.org/TR/xhtml1/DTD/xhtml1-transitional.dtd">
<html xmlns="http://www.w3.org/1999/xhtml">
<head>
	<meta http-equiv="Content-Type" content="text/html; charset=utf-8" />
	<title>photo</title>
	<link href="/static/style/album.css" type="text/css" rel="stylesheet" />
	<link href="/static/style/color.css" type="text/css" rel="stylesheet" />
	<link rel="stylesheet" href="/static/style/jquery.Jcrop.css" type="text/css" />
	<script src="/static/js/jquery-1.7.1.min.js" type="text/javascript"></script>
	
	<script type="text/javascript" src="/static/js/jquery.artDialog.source.js?skin=aero"></script>
	<script type="text/javascript" src="/static/js/jquery.rotate.1-1.js"></script>
	<script src="/static/js/jquery.colorbox.js" type="text/javascript"></script>
	<script src="/static/js/lrtk.js" type="text/javascript"></script>
	<script src="/static/js/jquery.tools.min.js" type="text/javascript"></script>
	<script src="/static/js/Photo.js" type="text/javascript"></script>
	<script type="text/javascript" src="/static/js/jquery.Jcrop.js"></script>
	<script type="text/javascript" src="/static/js/plantform.js"></script>
	
	<script src="/static/js/showTip.js" type="text/javascript"></script>
	<script type="text/javascript">
var inSelect='<div class="select"><span class=""></span><input type="checkbox" /></div>';
var delExpoFlag = false;
var setwallFlag = false;
var isconnectFlag = $isconnect;
var refreshStatus = '$refreshstatus';
$$(function(){
	if (refreshStatus == "Start"){
		$$('.operaterefresh li[rel=addFlag]').removeClass().addClass('refreshing');	
	}else{
		$$('.operaterefresh li[rel=addFlag]').removeClass('refreshing');	
	}

	if(isconnectFlag == 1){
		$$('.operateUl li[rel=addFlag]').removeClass('disabled');
		$$('.operaterefresh li[rel=addFlag]').removeClass('disabled');
	}else{
		$$('.operateUl li[rel=addFlag]').removeClass().addClass('disabled');
		$$('.operaterefresh li[rel=addFlag]').removeClass().addClass('disabled');
	}
	
	$$('.operaterefresh li').hover(function(){
		if (isconnectFlag == 0) return false;
		$$(this).addClass('hover').siblings().removeClass('hover');	
	}, function(){
		$$(this).removeClass('hover');
	}).mousedown(function(){
		if (isconnectFlag == 0) return false;
		$$(this).removeClass('hover').addClass('down');
	}).mouseup(function(){
		if (isconnectFlag == 0) return false;
		$$(this).removeClass('down');
	})

	$$('.operateUl li').hover(function() {
		if(($$(this).attr('rel') == "needFlag" && !delExpoFlag) || ($$(this).attr('rel') == "needwallflag" && !setwallFlag) || ($$(this).attr('rel') == "addFlag" && isconnectFlag == 0)) return false;
		$$(this).addClass('hover').siblings().removeClass('hover');						  
	}, function(){
		$$(this).removeClass('hover');
	}).mousedown(function(){
		if(($$(this).attr('rel') == "needFlag" && !delExpoFlag) || ($$(this).attr('rel') == "needwallflag" && !setwallFlag) || ($$(this).attr('rel') == "addFlag" && isconnectFlag == 0)) return false;
		$$(this).removeClass('hover').addClass('down');
	}).mouseup(function(){
		if(($$(this).attr('rel') == "needFlag" && !delExpoFlag) || ($$(this).attr('rel') == "needwallflag" && !setwallFlag) || ($$(this).attr('rel') == "addFlag" && isconnectFlag == 0)) return false;
		$$(this).removeClass('down');
	})
	
	$$('.albumPic').hover(function(){
	    if($$(this).find('input').length == 0){ //判断是否已经存在div.select
			$$(this).find('a').after(inSelect);
		}
		$$(this).addClass('hover')
		//$$(this).find('.playBto').addClass('hover');
		$$('.select span').hover(function(){
			$$(this).addClass('hover');	
		}, function(){
			$$(this).removeClass('hover');
		})
	},function(){
		//$$(this).find('.playBto').removeClass('hover');
		$$(this).removeClass('hover');
		var len = $$(this).parent('td').find("input:checked").length;
		if(len == 0){	
			$$(this).find('.select').remove();
		}
	})
	
	$$('.select span').live('click',function(){
			if($$(this).hasClass('selected')){
				$$(this).siblings(':checkbox')[0].checked = false;
				$$(this).removeClass('selected');
				$$(this).parents('tr').siblings('tr').find('a').removeClass('selected').siblings('input')[0].checked = false;
				var len = $$(this).parents('td').find("input:checked").length;
				var selectall = $$(".select input:checked").length;
				if(selectall == 0){
					$$(this).parents('td').find('.select').remove();
					delExpoFlag = false;
				}else{
					delExpoFlag = true;
				}
				
			}else{
				$$(this).addClass('selected');
				$$(this).siblings(':checkbox')[0].checked = true;
				$$(this).parents('td').find('.albumPic').each(function(){
					 if($$(this).find('input').length == 0){//判断是否已经存在div.select
						$$(this).find('a').after(inSelect);						
					}
				})
				delExpoFlag = true;
				var len = $$(this).parents('td').find("input:checked").length;
				var lenTotal = $$(this).parents('td').find("input").length;
				if(len == lenTotal) $$(this).parents('tr').siblings('tr').find('a').addClass('selected').siblings('input')[0].checked = true;
			}
			if(delExpoFlag){
				$$('.operateUl li[rel=needFlag]').removeClass('disabled');
			}else{
				$$('.operateUl li[rel=needFlag]').removeClass().addClass('disabled');
			}
			
			var selectall = $$(".select input:checked").length;
			setwallFlag = selectall == 1 ? true : false;
			var subLen = $$('.subClasses input:checked').length;
			var lenAll = $$('.subClasses input').length;
			if(setwallFlag){
				$$('.operateUl li[rel=needwallflag]').removeClass('disabled');				
			}else{
				$$('.operateUl li[rel=needwallflag]').removeClass().addClass('disabled');
			}
			$$('#selectAll a')[subLen == lenAll ? 'addClass' : 'removeClass']('selected').siblings('input')[0].checked = subLen == lenAll ? true : false;		
	})
	$$('.selectAll a').hover(function(){
		$$(this).addClass('hover')
	},function(){
		$$(this).removeClass('hover')
	})
	/*单个文件夹的全选*/
	$$('.subClasses a').click(function(){
		$$(this).parents('tr').siblings().find('.select').remove();
		if(!$$(this).hasClass('selected')){
			$$(this).parents('tr:eq(1)').siblings('tr').find('.albumPic a').after(inSelect);
			$$(this).parents('tr:eq(1)').siblings('tr').find('.select span').addClass('selected');
			$$(this).parents('tr:eq(1)').siblings('tr').find('.select input').each(function(){
				$$(this)[0].checked = true;								 
			})
			$$(this).siblings(':checkbox')[0].checked = true;
			$$(this).addClass('selected');
		}else{
			$$(this).siblings(':checkbox')[0].checked = false;
			$$(this).removeClass('selected');
		}
		var len = $$('div.albumPic').find("input:checked").length;
		delExpoFlag = len == 0 ? false : true;
		if(delExpoFlag){
				$$('.operateUl li[rel=needFlag]').removeClass('disabled');
			}else{
				$$('.operateUl li[rel=needFlag]').removeClass().addClass('disabled');
		}
		
		var selectall = $$(".select input:checked").length;
		setwallFlag = selectall == 1 ? true : false;
		if(setwallFlag){
				$$('.operateUl li[rel=needwallflag]').removeClass('disabled');
			}else{
				$$('.operateUl li[rel=needwallflag]').removeClass().addClass('disabled');
			}
		var subLen = $$('.subClasses input:checked').length;
		var lenAll = $$('.subClasses input').length;
		$$('#selectAll a')[subLen == lenAll ? 'addClass' : 'removeClass']('selected').siblings('input')[0].checked = subLen == lenAll ? true : false;
	})
	/*全选*/
	$$('#selectAll a').click(function(){
		$$('.select').remove();
		if($$(this).hasClass('selected')){
			$$('.subClasses a').removeClass('selected');
			$$('.subClasses input').each(function(){
				$$(this)[0].checked = false;
			})
			
			$$(this).siblings(':checkbox')[0].checked = false;
			$$(this).removeClass('selected');
		}else{
			$$('.albumPic a').after(inSelect);	
			$$('.select span').addClass('selected');
			$$('.select input').each(function(){
				$$(this)[0].checked = true;								 
			})
			$$('.subClasses a').addClass('selected');
			$$('.subClasses input').each(function(){
				$$(this)[0].checked = true;
			})
			
			$$(this).siblings(':checkbox')[0].checked = true;
			$$(this).addClass('selected');
		}
			
		var selectall = $$(".select input:checked").length;
		
		delExpoFlag = selectall != 0 ? true:false
		setwallFlag = selectall == 1 ? true : false;
		
		if(delExpoFlag){
				$$('.operateUl li[rel=needFlag]').removeClass('disabled');
			}else{
				$$('.operateUl li[rel=needFlag]').removeClass().addClass('disabled');
		}
		if(setwallFlag){
				$$('.operateUl li[rel=needwallflag]').removeClass('disabled');
			}else{
				$$('.operateUl li[rel=needwallflag]').removeClass().addClass('disabled');
			}			
	})	
	
/*	$$.easing.bouncy = function (x, t, b, c, d) {
		  var s = 1.70158;        
		  if ((t/=d/2) < 1) 
		  return c/2*(t*t*(((s*=(1.525))+1)*t - s)) + b;        
		  return c/2*((t-=2)*t*(((s*=(1.525))+1)*t + s) + 2) + b;    
	}
	 
	$$.tools.tooltip.addEffect("bouncy", function(done) {
		  this.getTip().animate({top: '+=0'}, 
		  100, 
		  'bouncy', 
		  done).show();	}, function(done) {	    
		  this.getTip().animate({top: '-=0'}, 
		  0, 
		  'bouncy', function()  {
		  $$(this).hide();		
		  done.call();	    
		  });	
	});
	$$("img[title]").tooltip({effect: 'bouncy'});*/
	$$("div.albumPic").each(function(){
	    $$(this).tinyTips();
	})
	 
	 $$(".group1").colorbox({rel:'group1',
					title:" ",
					slideshow:true,
					slideshowAuto:false,
					previous:"$trans('PhotoView_Web_Colorbox_Up')",
					next:"$trans('PhotoView_Web_Colorbox_Down')",close:"关闭",
					slideshowStart:"$trans('PhotoView_Web_Colorbox_Play')",
					slideshowStop:"$trans('PhotoView_Web_Colorbox_Stop')",
					current:"{current} / {total}",
					transition:"fade",
					scalePhotos:true,
					preloading:false,
					maxWidth:'100%',
					maxHeight:'100%',
					imgError:"$trans('PhotoView_Web_Colorbox_ImageError')",
					scrolling: false,
					onOpen:function(){  },

					onLoad:function(){ },

					onComplete:function(){  },

					onCleanup:function(){  },

					onClosed:function(){ }

				});
})

function KeyDownFunction()
	{
	if (typeof window.event != 'undefined') {  
	           document.onkeydown = function() {  
	             var type = event.srcElement.type;  
	             var code = event.keyCode;  
	             return ((code != 8 && code != 13) ||  
	                     (type == 'text' && code != 13 ) ||  
	                     (type == 'textarea') ||  
	                     (type == 'submit' && code == 13))  
	           }  
	         } else { // FireFox/Others  
	           document.onkeypress = function(e) {  
	   
	             var type = e.target.localName.toLowerCase();  
	             var code = e.keyCode;  
	             if ((code != 8 && code != 13) ||  
	                 (type == 'input' && code != 13 ) ||  
	                 (type == 'textarea') ||  
	                 (type == 'submit' && code == 13)) {  
	                 return true;  
	             } else {  
	                 return false ;  
	             }  
	           }  
	         } 
	}
	
</script>
</head>
<body style="overflow:hidden" oncontextmenu="return false" onselectstart="return false" onkeydown="KeyDownFunction()">
	<div id="musicListWrap">
    	<div class="operateBar">
			<div id="selectAll" class="selectAll"><a class=""></a><input type="checkbox" /></div>
        	<ul class="operateUl">
            	<li class="disabled" id="addPhoto" rel="addFlag"><span><em class="addIcon"></em>$trans('PhotoView_Web_AddPhoto')</span></li>
                <li class="disabled" id="expo" rel="needFlag"><span>$trans('PhotoView_Web_Export')</span></li>
                <li class="disabled" id="delete" rel="needFlag"><span>$trans('PhotoView_Web_Delete')</span></li>
                <!--<li class="disabled" id="play" rel="addFlag"><span><em class="dropDownIcon"></em>$trans('PhotoView_Web_Play')</span></li>-->
				<li class="disabled" id="wallpaper" rel="needwallflag"><span>$trans('PhotoView_Web_SetWallPaper')</span></li>
			</ul>
			<ul class="operaterefresh">
                <li id="refresh" rel="addFlag"></li>
            </ul>
        </div>
        <div class="wrapAuto">
        <!-- Classification 1 start  -->
        <div class="imageblock">
		$for date in datesort:
			<table width="100%" border="0" cellpadding="0" cellspacing="0">
				<tbody>
					<tr>
						<td>
							<table class="classification" width="100%" border="0" cellpadding="0" cellspacing="0">
								<tbody>
									<tr>
										<td>
											<div class="selectAll subClasses"><a class=""></a><input type="checkbox" /></div> &nbsp; $date
										</td>
									</tr>
								</tbody>
							</table>
						</td>
					</tr>
					<tr>
						<td class='pic'>
							$for item in Data[date]:
								<div class="albumPic" id=$item[4] rel="$item[2]<br/>$item[3]" name='$item[1].split(".")[0]' type='$item[1].split(".")[-1]'>
									<a class="group1" href="/Photo/Photo/GetImageByID/$(item[4]).jpg">
										<img src=$item[0] width="96" height="96"/>
									</a>
								</div>
						</td>
					</tr> 
				</tbody>
			</table>
        <!-- Classification 1 end  -->
        </div>
        </div>		
	</div>
<script language="javascript">
$$(document).ready(function(){

	$$('.wrapAuto').height($$(window).height() - 45);
	$$('.imageblock').height($$('.imageblock').height() + 60);
	
	$$(window).resize(function() {	
		$$('.wrapAuto').height($$(window).height() -45);
		$$('.imageblock').height('auto')
		$$('.imageblock').height($$('.imageblock').height() + 60);
	})

//添加
	 $$("#addPhoto").click(function(){
		var data = {};
		data.file= [];
		
		$$.post("/Photo/Add",data,function(){
				
		})
	 })	
//导出
	$$("#expo").click(function(){
		if(!delExpoFlag) return false;
		var data = {};
		data.indexes = [];
		$$(".select input:checked").each(function(){
			var index = $$(this).parents("div.albumPic").attr("id");
			data.indexes.push(index);
		})
		$$.post("/Photo/Export",data,function(){
				
		})
	 })
//删除
	$$("#delete").click(function(){
		if(!delExpoFlag) return false;
		/*var data = {};
		data.indexes = [];
		$$(".select input:checked").each(function(){
			var index = $$(this).parents("div.albumPic").attr("id");
			data.indexes.push(index);
			$$(this).parents("div.albumPic").remove();
		})*/
		art.dialog({
			title: "$trans('PhotoView_Web_DELDLG_Title')",
			content:"$trans('PhotoView_Web_DELDLG_Content')",
			okVal: "$trans('PB_BUTTON_OK')",
			cancelVal: "$trans('PBMainView_WEB_CANCEL')",
			icon: "question",
			lock: true,
			background:'#fff',
			opacity: 0.7,
			ok:function(){
				
				var data = {};
				data.indexes = [];
				$$(".select input:checked").each(function(){
					var index = $$(this).parents("div.albumPic").attr("id");
					data.indexes.push(index);
					//$$(this).parents("div.albumPic").remove();
				})
				
				$$.post("/Photo/Del",data,function(){
					
				})
			},
			cancel: true
		})
	 })
//设为壁纸
	$$("#wallpaper").click(function(){
		if(!setwallFlag) return false;

		var data = {};
		data.indexes = [];
		$$(".select input:checked").each(function(){
			var index = $$(this).parents("div.albumPic").attr("id");
			data.indexes.push(index);
		})
		
		$$.post("/Photo/SetWallPaper",data,function(){
		})

	 })
//刷新
	$$("#refresh").click(function(){
		if(isconnectFlag == 0) return false;
		//window.location.reload();
		$$(this).removeClass().addClass('refreshing');
		var data = {};
		data.file= [];
		$$.post("/Photo/Refresh",data,function(){		
		})
		
		/*refrshdDia = art.dialog({
		title:	"刷新数据",
		content: "正在获取数据",
		icon: "loading",
		lock: true,
		background:'#fff',
		opacity: 0.7
		})*/
		setTimeout("LoadRefreshStatus()",1000);
		
	})
})

function LoadRefreshStatus(){
	$$.getJSON('/Photo/Photo/RefreshStatus?now='+ new Date().getTime(), function(result){
		if(result == "Finished") {
			//refrshdDia.close();
			$$(this).removeClass().addClass('refresh');
		}
		else{
			setTimeout("LoadRefreshStatus()",1000);
		}
	})
}
//幻灯片播放
	$$('#play').click(function(){
		var ev = document.createEvent('MouseEvents');
		ev.initEvent('click', false, true);
		$$('.albumPic').first()[0].dispatchEvent(ev);
	})
</script>
</body>
</html>
