<%@ page language="C#" autoeventwireup="true" inherits="V5Shop.Admin.Template_Style_Operate, V5Shop.Shop.Template" enableviewstatemac="false" enableEventValidation="false" viewStateEncryptionMode="Never" %>
<%@ Register Src="control/PageBottom.ascx" TagName="PageBottom" TagPrefix="uc1" %>
<%@ Register Assembly="V5Shop.Control" Namespace="V5Shop.Control" TagPrefix="cc1" %>
<!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">
    <title>页面详细</title>
<link href="css/css.css" rel="stylesheet" type="text/css">
<link href="css/css_list.css" rel="stylesheet" type="text/css">
<link href="css/control.css" rel="stylesheet" type="text/css">
<script type="text/javascript" language="javascript" src="js/Common.js"></script>
<script type="text/javascript" src="editor/fckeditor.js"></script>
</head>
<body>
    <form id="form1" runat="server">
    <div id="Review" style="width:380px; display:none;z-index:10000; border:solid 1px black; position:absolute; top:30px; left:350px; background-color:White;" onclick="this.draging = true">
        <div class="OperateTitleView">
            <div style="font-weight:bold; float:left;">【 样式效果预览 】</div>
            <div style="font-weight:bold; float:right;"><span style="cursor:move;" onmousedown="StartMove(this)" onmousemove="MoveObj(this)" onmouseup="EndMove()" onmouseout="EndMove()" title="按住对此窗体进行拖动">【 拖动 】</span></div>
            <div style="font-weight:bold; float:right;"><span onclick="Resume()" style="cursor:pointer;" title="点击隐藏预览栏">【 隐藏 】</span></div>
        </div>
        <div id="Review_Content" style="display:block;"></div>
    </div>
    
        <div class="OperateTitle">
            <div>
                <asp:Label ID="lblTitleAdd" runat="server" Text="【 样式添加 】"></asp:Label> 
                <asp:Label ID="lblTitleEdit" runat="server" Text="【 样式编辑 】" Visible="false"></asp:Label> 
                <a href="Template_Style_Manage.aspx" title="返回样式列表">返回列表</a>
            </div>
        </div>
        
        <div>
        <table id="OperateTable" width="100%" border="0" align="center" cellpadding="0" cellspacing="0">
            <tr>
                <td width="20%" height="30" align="right">
                    <asp:Label ID="Label1" runat="server" Text="模板名称："></asp:Label> 
                </td>
                <td align=left>
                    <%=tplname %>
                </td>
            </tr>
            <tr>
                <td align="right" height="30" width="20%">
                    <asp:Label ID="Label2" runat="server" Text="样式类型："></asp:Label>
                </td>
                <td align="left">
                    <asp:DropDownList ID="ddlStyleCategory" runat="server" AutoPostBack="true" OnSelectedIndexChanged="ddlStyleCategory_SelectedIndexChanged" Width="150px"></asp:DropDownList>
                </td>
            </tr>
            <tr id="SelfPage">
                <td width="20%" height="30" align="right">
                    <asp:Label ID="lblTitle" runat="server" Text="样式名称："></asp:Label> 
                </td>
                <td align=left>
                    <asp:TextBox ID="txtTitle" runat="server" Width="300px" MaxLength="100"></asp:TextBox>  
                    <asp:RequiredFieldValidator ID="RequiredFieldValidator1" runat="server" ControlToValidate="txtTitle" ErrorMessage="文件名不能为空" Display="Dynamic"></asp:RequiredFieldValidator>
                    (请输入文件名即可，所有样式页面文件都为.html格式)
                </td>
            </tr>
            <script>
                function HiddenField(obj){
                    var value = obj.value;
                    document.getElementById("SelectPage").style.display = value == "0" ? "" : "none";
                    document.getElementById("SelfPage").style.display = value == "1" ? "" : "none";
                    InitTrClass();
                }
            </script>
            
            <tr>
                <td width="20%" height="30" align="right">
                    <asp:Label ID="Label3" runat="server" Text="插入样式："></asp:Label> 
                </td>
                <td align=left>
                    <input id="button_ms" runat="server" value="商品字段" type="button" class="button" onClick="OpenDialogLable('Template_Style_Manage_Dialog.aspx',550,550);" />
                    <input id="button_as" runat="server" value="文章字段" type="button" class="button" onClick="OpenDialogLable('Template_Style_Article_Dialog.aspx',600,600);" />
                    <input id="button_ns" runat="server" value="公告字段" type="button" class="button" onClick="OpenDialogLable('Template_Style_Notice_Dialog.aspx',600,600);" />
                    <input id="button_bs" runat="server" value="品牌字段" type="button" class="button" onClick="OpenDialogLable('Template_Style_Brand_Dialog.aspx',600,600);" />
                    <input id="button_ds" runat="server" value="导购字段" type="button" class="button" onClick="OpenDialogLable('Template_Style_Guide_Dialog.aspx',600,600);" />
                    <input id="button_ls" runat="server" value="礼品字段" type="button" class="button" onClick="OpenDialogLable('Template_Style_Gift_Dialog.aspx',600,600);" />
                    <input id="button_gs" runat="server" value="团购字段" type="button" class="button" onClick="OpenDialogLable('Template_Style_Group_Dialog.aspx',600,600);" />
                    <input id="button_ss" runat="server" value="夺宝奇兵字段" type="button" class="button" onClick="OpenDialogLable('Template_Style_Snatch_Dialog.aspx',600,600);" />
                    <input id="button_hs" runat="server" value="活动字段" type="button" class="button" onClick="OpenDialogLable('Template_Style_Activity_Dialog.aspx',600,600);" />
                    <input id="button_fs" runat="server" value="感言字段" type="button" class="button" onClick="OpenDialogLable('Template_Style_Feeling_Dialog.aspx',600,600);" />
                    <input id="button_ys" runat="server" value="优惠卷字段" type="button" class="button" onClick="OpenDialogLable('Template_Style_Coupon_Dialog.aspx',600,600);" />
                    <input id="button_pub" runat="server" value="综合类字段" type="button" class="button" onClick="OpenDialogLable('Template_Style_Common_Dialog.aspx',700,730);" />
                    <input value="全局" type="button" class="button" onClick="OpenDialogLable('Template_Style_Public_Dialog.aspx',550,560);" />
                    <input value="FORM表单" type="button" class="button" onClick="OpenDialogLable('Template_Style_FormInfo_Dialog.aspx',550,560);" />
                    &nbsp;&nbsp;&nbsp;&nbsp;    
                    <asp:Label ID="Label4" runat="server" Text="插入图片："></asp:Label> 
                    <input value="选择图片" type="button" class="button" onClick="OpenDialogPage();" />
                </td>
            </tr>
            
            <tr>
                <td height="30" align="right">
                    <asp:Label ID="lblContent" runat="server" Text="页面内容："></asp:Label> 
                </td>
                <td align=left>
                    <cc1:FCKeditor ID="fckcontent" runat="server" width="600px"></cc1:FCKeditor>
                </td>
            </tr>
            <tr>
                <td height="30" align="right"></td>
                <td align=left>
                    <asp:Button ID="btnAdd" runat="server" Text="确定" OnClick="btnAdd_Click" class="button"/>
                    <asp:Button ID="btnEdit" runat="server" Text="更新" OnClick="btnEdit_Click" Visible="False" class="button"/>
                    <input id="iptReset" runat="server" type="reset" value="重置" class="button"/>    
                    <input id="Button1" runat="server" type="button" value="返回列表" onclick="window.location.href='Template_Style_Manage.aspx'" class="button"/>    
                    <input id="Button2" runat="server" type="button" value="预览效果" onclick="ViewEffect()" class="button"/>    
                </td>
            </tr>
        </table>  
        
        
        <script type="text/javascript">
            //加TABLE样式
            InitTrClass();

            //打开标签选择对话框
            function OpenDialogLable(url, w, h){
                if (navigator.appVersion.indexOf("MSIE") == -1){
                    this.returnAction=function(strResult){
                        if(strResult!=null){
                            var oEditor = FCKeditorAPI.GetInstance('fckcontent'); 
                            oEditor.InsertHtml(strResult) 
                        }
                    }
                    window.open(url + '?d=' + Date(),'newWin','modal=yes,width='+w+',height='+h+',top=200,left=300,resizable=no,scrollbars=no');
                    return;
                }else{
                    var GetValue = showModalDialog(url + '?d=' + Date(), null, 'dialogWidth:'+w+'px; dialogHeight:'+h+'px;');
                    if (GetValue != null) {
                        var oEditor = FCKeditorAPI.GetInstance('fckcontent');
                        if(GetValue.indexOf("###") != -1){
                            var htmltext = oEditor.EditorDocument.selection.createRange().htmlText;
                            if(typeof(htmltext) != "undefined" && htmltext != "")
                                oEditor.InsertHtml(GetValue.replace("###", htmltext));
                        }else{
                            oEditor.InsertHtml(GetValue);
                        }
                    } 
                }
            }
            
            //打开模式对话框（图片选择）
            function OpenDialogPage(){
                if (navigator.appVersion.indexOf("MSIE") == -1){
                    this.returnAction=function(strResult){
                        if(strResult!=null){
                            var oEditor = FCKeditorAPI.GetInstance('fckcontent'); 
                            oEditor.InsertHtml(GetValue) 
                        }
                    }
                    window.open('Template_Picture_Manage_Dialog.aspx?d=' + Date(),'newWin','modal=yes,width=550,height=550,top=200,left=300,resizable=no,scrollbars=no');
                    return;
                }else{
                    var GetValue = showModalDialog('Template_Picture_Manage_Dialog.aspx?d=' + Date(),'','dialogWidth:550px;dialogHeight:550px;')
                    if (GetValue != null) {
                        var oEditor = FCKeditorAPI.GetInstance('fckcontent'); 
                            oEditor.InsertHtml("<img src='/v5shop/" + GetValue + "'>");
                    } 
                }
            }
            
            //插入选中样式字段
            function ChooseMallsField(txt){
                var oEditor = FCKeditorAPI.GetInstance('fckcontent'); 
                oEditor.InsertHtml(txt);
            }
            
            //定义即时获取全局变量
            var isnow = 0;
            //预览样式
            function ViewEffect(){
                var obj = document.getElementById("Review");
                obj.style.display = "block";
                //document.getElementById("AlphaField").style.display = "";
                isnow = 1;
                GetHtmlNow();
            }
            
            //显示预览
            function ShowView(){
                var obj = document.getElementById("Review_Content");
                var oEditor = FCKeditorAPI.GetInstance('fckcontent'); 
                var EditorHtml = ConvertTag(oEditor.GetXHTML(true));
                obj.innerHTML = EditorHtml;
            }
            
            //即时浏览效果
            function GetHtmlNow(){
                ShowView();
                if(isnow == 1){
                    setTimeout('GetHtmlNow()', 1000);
                }
            }
            
            //fck加载完毕事件
            function FCKeditor_OnComplete(oFCKeditor)   {
                ViewEffect();
            } 
            
            //预览样式返回
            function Resume(){
                var obj = document.getElementById("Review");
                obj.style.display = "none";
                document.getElementById("AlphaField").style.display = "none";
                isnow = 0;
            }
            
            //替换图片中的标签
            function ConvertTag(str){
                var reg = new RegExp("(\{MS\:SrcDetail\})","gi");
                str = str.replace(reg, "../UploadFile/TmpProduct.gif");
                reg = new RegExp("(\{MS\:Name\})","gi");
                str = str.replace(reg,"测试商品名称");
                reg = new RegExp("(\{MS\:Date\})","gi");
                str = str.replace(reg,"2008-8-8");
                reg = new RegExp("(\{MS\:ID\})","gi");
                str = str.replace(reg,"2008");
                reg = new RegExp("(\{MS\:Number\})","gi");
                str = str.replace(reg,"NO.0011");
                return str;
            }
            
            var down = false;
            var mouseOffset = null;
            //拖动脚本
            function StartMove(obj){
                var DragObj = obj.parentNode.parentNode.parentNode; 
                mouseOffset = getMouseOffset(DragObj, getEvent());
                down = true;
            }
            
            function EndMove(){
                down = false;
            }
            
            function getEvent(){
                var   i   =   0;
                if(document.all) return   window.event;
                func = getEvent.caller;
                while(func != null){
                    var   arg0 = func.arguments[0];
                    if(arg0){
                        if(arg0.constructor == MouseEvent){
                            return   arg0;
                        }
                    }
                    func = func.caller;
                }
                return   null;
            }
            
            function MoveObj(obj){
                if(down){
                    var DragObj = obj.parentNode.parentNode.parentNode; 
                    var mousePos = mouseCoords(getEvent());
                    DragObj.style.position = 'absolute';
                    DragObj.style.top      = mousePos.y - mouseOffset.y;
                    DragObj.style.left     = mousePos.x - mouseOffset.x;
                }
            }
            
            function mouseCoords(ev){
                if(ev.pageX || ev.pageY){
                    return {x:ev.pageX, y:ev.pageY};
                }
                return {
                    x:ev.clientX + document.body.scrollLeft - document.body.clientLeft,
                    y:ev.clientY + document.body.scrollTop  - document.body.clientTop
                };
            }
            
            function getMouseOffset(target, ev){
                var docPos    = getPosition(target);
                var mousePos  = mouseCoords(ev);
                return {x:mousePos.x - docPos.x, y:mousePos.y - docPos.y};
            }
            
            function getPosition(e){
                var left = 0;
                var top  = 0;

                while (e.offsetParent){
                    left += e.offsetLeft;
                    top  += e.offsetTop;
                    e     = e.offsetParent;
                }

                left += e.offsetLeft;
                top  += e.offsetTop;

                return {x:left, y:top};
            }
        </script> 

    </div>
    <uc1:PageBottom ID="PageBottom1" runat="server" />
    </form>
</body>
</html>