<%@ Page Language="vb" AutoEventWireup="false" CodeBehind="Admin_SceneryPic.aspx.vb" Inherits="TourEx.Web.Admin_SceneryPic" %>
<%@ Import Namespace="TourEx.BLL" %>
<!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 id="Head1" runat="server">
<meta http-equiv="Content-Type" content="text/html; charset=utf-8" />
<title>无标题页</title>
<link rel="stylesheet" type="text/css" href="Css/Style.css"/>
<script type="text/javascript" src="../Sys/Js/jquery.js"></script>
<script type="text/javascript" src="../sys/js/AlertWindow.js"></script>
<link href="../sys/css/jquery-ui-1.7.2.custom.css" rel="Stylesheet" type="text/css" /> 
<link href="../sys/css/jquery.cropzoom.css" rel="Stylesheet" type="text/css" /> 
<script type="text/javascript" src="../sys/js/jquery-ui-1.8.2.custom.js"></script>
<script type="text/javascript" src="../sys/js/jquery.cropzoom.js"></script>
</head>
<body>
<ul class="navLocation">
	<li>您当前位置：<a href="Admin_Main.aspx">首页</a> > <a href="Admin_SceneryList.aspx">景区管理</a> > 添加景区图片</li>
</ul>
<form runat="server" id="TourExForm" method="post" onsubmit="return CheckForm();">
<div class="infoBox">
<table width="100%" border="0" cellpadding="0" cellspacing="0">
    <asp:HiddenField ID="P_RanNum" runat="server"  />
    <asp:HiddenField ID="P_Ups" runat="server" Value="0"  />
	<tr>
		<td class="infoBoxTd" width="120px">景区名称：</td>
		<td><asp:Label ID="SceneryName" runat="server" Text=""></asp:Label></td>
	</tr>
	<tr>
		<td class="infoBoxTd">上传图片：</td>
		<td>
		<iframe src="" id="upload" width="230" height="25" scrolling="No" frameborder="0"></iframe>
	    <div id="Preview"></div>
			
		</td>
	</tr>
	<tr>
		<td class="infoBoxTd">&nbsp;</td>
		<td>
			<asp:Button ID="Button1" runat="server" Text="确定" CssClass="formInput01" />
		</td>
	</tr>
</table>
</div>
</form>
<div id="promptWindow" style="display:none;">
    <div id="crop_container" style="width:500px"></div>
	<div style="background:#fff;padding:8px 0;text-align:center;"><input name="crop" type="button" id="crop" class="formInput03" value="确定" /> <input name="restore" class="formInput04" type="button" id="restore" value="还原" /> <input type="button" class="formInput04" value="关闭" onclick="HideWindow()"/></div>
</div>
<script type="text/javascript">
	<!--//
	var UpFolder='<%=UpFolder%>';
	var MaxW,MaxH,M='?'+Math.random();
	MaxW = <%=WebCache.Sys.Read("SceneryReviews")(4)%>;
	MaxH = <%=WebCache.Sys.Read("SceneryReviews")(5)%>;
    function ShowCropZoom(id)
    {
        var pic=UpFolder+$('#P_Pic_'+id).val()+M;
        var Img = new Image();
        Img.onreadystatechange = function ()
        {
            ShowWindow();
            cropzoom=null;
            var H,W,P,SZ;
            W=MaxW/Img.width==MaxH/Img.height?MaxW:MaxW+100;//如果比率相同
            P=MaxW/W;
            H=MaxH/P;
            SZ=W/Img.width*100;
            var cropzoom = $('#crop_container').cropzoom({
                width:W,height:H,bgColor: '#CCC',enableRotation:true,enableZoom:true,zoomSteps:1,rotationSteps:1,
                selector:{centered:true,borderColor:'blue',borderColorHover:'yellow',startWithOverlay:false,hideOverlayOnDragAndResize:true,
	              showPositionsOnDrag:false,w:MaxW,h:MaxH,maxWidth:MaxW,maxHeight:MaxH
                },
                image:{
                    source:pic,width:Img.width,height:Img.height,minZoom:10,maxZoom:200,startZoom:SZ,snapToContainer:false
                }
            });
            $('#crop').unbind("click").click(function(){ 
                cropzoom.send('ProcessImage.ashx','POST',{'t':'Scenery'},function(rta){
                    if(rta.substring(0,4)=='Err:')
                    {
                        alert(rta.substring(3));HideWindow();
                    }else{
                        if($('#P_Preview_'+id).val()==0)$('#P_Preview_'+id).val(1);
                        M='?'+Math.random()
                        $('#P_Pic'+id).attr('src',UpFolder+rta+M);
                        HideWindow();
                    }
                });
            });
            $('#restore').unbind("click").click(function(){
                cropzoom.restore();
            });
            $('div[id$="_selector"]').unbind("dblclick").dblclick(function(){$('#crop').click();});
        }
        Img.src = pic;
    }
	$("#upload").attr("src","<%=WebPath%>Sys/UpLoad.aspx?t=Scenery&r="+$("#P_RanNum").val());
    function UpReturn(err,msg)
    {
	    if(err!=''){alert(err);return;}
	    var ups = parseInt($('#P_Ups').val());
	    $('#P_Ups').val(ups+1)
	    var p=$('#P_Pic').val();
	    if(p==''){p=msg;}else{p+=','+msg;}$('#P_Pic').val(p);
	    $("#Preview").append('<div class="addPic"><div class="addPics"><img src="'+UpFolder+msg+M+'" id="P_Pic'+ups+'" width="100"/><input name="P_Pic_'+ups+'" id="P_Pic_'+ups+'" type="hidden" value="'+msg+'" /><span><input name="P_Preview_'+ups+'" id="P_Preview_'+ups+'" type="hidden" value="0" /><input name="P_Title_'+ups+'" id="P_Title_'+ups+'" type="text" /></span><span><a href="javascript:;" onclick="DelPic('+ups+');">删除</a> | <a href="javascript:;" onclick="ShowCropZoom('+ups+');">裁剪</a></span></div></div>');
        var img = new Image();
        img.onreadystatechange = function ()
        {
            if(MaxW/img.width==MaxH/img.height)
            $('#P_Preview_'+ups).val('1');
        }
        img.src = UpFolder+msg+M;
    }
    function DelPic(s)
    {
	    var ups = parseInt($('#P_Ups').val());
	    for(var i=s;i<ups-1;i++)
	    {
		    var img=$('#P_Pic_'+(i+1)).val();
		    $('#P_Title_'+i).val($('#P_Title_'+(i+1)).val()).prev('img').attr('src',UpFolder+img);
		    $('#P_Pic_'+s).val(img);
	    }
	    ups--;
	    $('#P_Ups').val(ups);
	    $('#P_Title_'+ups).parent().remove();
    }
   function CheckForm()
   {
	    for(var i=0;i<$('input[name^="P_Title_"]').length;i++)
	    {
	        if($('#P_Title_'+i).val()=='')
            {
                alert('请填写图片名称！');return false;
            }else if($('#P_Preview_'+i).val()=='0'){
                alert('请裁剪图片！');return false;
            }
	    }
	    return true;
   }
	//-->
</script>
</body>
</html>
