<%@ page language="C#" autoeventwireup="true" inherits="admin_focus_myfocus, DianCMS" enableviewstatemac="false" enableEventValidation="false" viewStateEncryptionMode="Never" %>
<%@ Import Namespace="D.Common" %>
<!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 runat="server">
    <title></title>
    <link id="CssName" rel="stylesheet" type="text/css" runat="server" />
    <script src="../../js/myfocus-2.0.4.min.js" type="text/javascript"></script>

</head>
<body>
    <form id="form1" runat="server">
    <table class="border" cellspacing="1" cellpadding="0" width="99%" border="0" align="center"
        style="margin-top: 5px;">
        <tr>
            <td class="bqleft">在模板中引入js库：</td>
            <td class="bqright"><font color=red><b>&lt;script src=&quot;<%=Param.ApplicationRootPath %>/js/myfocus-2.0.4.min.js&quot; type=&quot;text/javascript&quot;&gt;&lt;/script&gt;</b></font></td>
        </tr>
        <tr>
            <td class="bqleft">应用效果：</td>
            <td class="bqright">
                <div id="focus_box">
                    <div id="focus" style="width: 400px; height: 200px;">
                        <div class="loading">
                            <img src="../../js/mf-pattern/loading.gif"
                                alt="请稍候..." /></div>
                        <!--载入画面(可删除)-->
                        <div class="pic">
                            <!--图片列表-->
                            <ul>
                                <li><a href="javascript:">
                                    <img src="image/1a.jpg" thumb=""
                                        alt="图片1说明" text="图片1更详细的描述文字" /></a></li>
                                <li><a href="javascript:">
                                    <img src="image/2a.jpg" thumb=""
                                        alt="图片2说明" text="图片2更详细的描述文字" /></a></li>
                                <li><a href="javascript:">
                                    <img src="image/3a.jpg" thumb=""
                                        alt="图片3说明" text="图片3更详细的描述文字" /></a></li>
                                <li><a href="javascript:">
                                    <img src="image/4a.jpg" thumb=""
                                        alt="图片4说明" text="图片4更详细的描述文字" /></a></li>
                                <li><a href="javascript:">
                                    <img src="image/5a.jpg" thumb=""
                                        alt="图片5说明" text="图片5更详细的描述文字" /></a></li>
                            </ul>
                        </div>
                    </div>
                </div>
            </td>
        </tr>
        <tr>
            <td class="bqleft">
                风格应用选择：
            </td>
            <td class="bqright">
                <asp:DropDownList ID="focus_pattern" runat="server">
                    <asp:ListItem Value="mF_fscreen_tb">mF_fscreen_tb</asp:ListItem>
                    <asp:ListItem Value="mF_YSlider">mF_YSlider</asp:ListItem>
                    <asp:ListItem Value="mF_luluJQ">mF_luluJQ</asp:ListItem>
                    <asp:ListItem Value="mF_51xflash">mF_51xflash</asp:ListItem>
                    <asp:ListItem Value="mF_expo2010">mF_expo2010</asp:ListItem>
                    <asp:ListItem Value="mF_games_tb">mF_games_tb</asp:ListItem>
                    <asp:ListItem Value="mF_ladyQ">mF_ladyQ</asp:ListItem>
                    <asp:ListItem Value="mF_liquid">mF_liquid</asp:ListItem>
                    <asp:ListItem Value="mF_liuzg">mF_liuzg</asp:ListItem>
                    <asp:ListItem Value="mF_pithy_tb">mF_pithy_tb</asp:ListItem>
                    <asp:ListItem Value="mF_qiyi">mF_qiyi</asp:ListItem>
                    <asp:ListItem Value="mF_quwan">mF_quwan</asp:ListItem>
                    <asp:ListItem Value="mF_rapoo">mF_rapoo</asp:ListItem>
                    <asp:ListItem Value="mF_sohusports">mF_sohusports</asp:ListItem>
                    <asp:ListItem Value="mF_taobao2010">mF_taobao2010</asp:ListItem>
                    <asp:ListItem Value="mF_taobaomall">mF_taobaomall</asp:ListItem>
                    <asp:ListItem Value="mF_tbhuabao">mF_tbhuabao</asp:ListItem>
                    <asp:ListItem Value="mF_pconline">mF_pconline</asp:ListItem>
                    <asp:ListItem Value="mF_peijianmall">mF_peijianmall</asp:ListItem>
                    <asp:ListItem Value="mF_classicHC">mF_classicHC</asp:ListItem>
                    <asp:ListItem Value="mF_classicHB">mF_classicHB</asp:ListItem>
                    <asp:ListItem Value="mF_slide3D">mF_slide3D</asp:ListItem>
                    <asp:ListItem Value="mF_kiki">mF_kiki</asp:ListItem>
                    <asp:ListItem Value="mF_fancy">mF_fancy</asp:ListItem>
                    <asp:ListItem Value="mF_dleung">mF_dleung</asp:ListItem>
                    <asp:ListItem Value="mF_shutters">mF_shutters</asp:ListItem>
                    <asp:ListItem Value="mF_kdui" Selected="True">mF_kdui</asp:ListItem>
                </asp:DropDownList>
            </td>
        </tr>
        <tr>
            <td class="bqleft">
                数据来源：
            </td>
            <td class="bqright">
                <asp:DropDownList ID="dropModel" runat="server" AutoPostBack="True" 
                    onselectedindexchanged="dropModel_SelectedIndexChanged">
                </asp:DropDownList>
            </td>
        </tr>
        <tr>
            <td class="bqleft">
                图片字段：
            </td>
            <td class="bqright">
                <asp:DropDownList ID="dropPicField" runat="server">
                </asp:DropDownList>
            </td>
        </tr>
        <tr>
            <td class="bqleft">
                标题字段：
            </td>
            <td class="bqright">
                <asp:DropDownList ID="dropTitle" runat="server">
                </asp:DropDownList> 标题字符数：<asp:TextBox ID="txtTitleLength" runat="server" CssClass="in1" Text="25" Columns="3"></asp:TextBox> 字符
            </td>
        </tr>
        <tr>
            <td class="bqleft">
                详细描述字段：
            </td>
            <td class="bqright">
                <asp:DropDownList ID="dropContent" runat="server">
                </asp:DropDownList> 描述字符数：<asp:TextBox ID="txtContentLength" runat="server" CssClass="in1" Text="30" Columns="5"></asp:TextBox>字符
            </td>
        </tr>
        <tr>
            <td class="bqleft">
                链接方式：
            </td>
            <td class="bqright">
                <asp:DropDownList ID="dropLink" runat="server">
                    <asp:ListItem Value="0">按模型链接</asp:ListItem>
                </asp:DropDownList>
            </td>
        </tr>
        <tr>
            <td class="bqleft">
                调用条数：
            </td>
            <td class="bqright">
                <asp:TextBox ID="txtInfoNum" runat="server" Text="5" CssClass="in1" Columns="15"></asp:TextBox>条
            </td>
        </tr>
        <tr>
            <td class="bqleft">
                焦点图盒子ID：
            </td>
            <td class="bqright">
                <asp:TextBox ID="txtHeZiId" runat="server" Text="myFocus" CssClass="in1"></asp:TextBox>
            </td>
        </tr>
        <tr>
            <td class="bqleft">
                焦点图盒子大小：
            </td>
            <td class="bqright">
                <asp:TextBox ID="txtHeZiDaXiao" runat="server" CssClass="in1" Columns="25" Text="width:400px;height:220px"></asp:TextBox>不设置请为空。<br />1、不设置则需要在css样式中定义#myFocus的大小。<br />2、填写：width:400px;height:220px
            </td>
        </tr>
        <tr>
            <td class="bqleft">
                切换时间间隔：
            </td>
            <td class="bqright">
                <asp:TextBox ID="txtTime" runat="server" Text="3" CssClass="in1"></asp:TextBox>秒
            </td>
        </tr>
        <tr>
            <td class="bqleft">
                触发切换模式：
            </td>
            <td class="bqright">
                <asp:RadioButtonList ID="radiotrigger" runat="server" RepeatDirection="Horizontal">
                <asp:ListItem Value="click" Selected="True">鼠标点击</asp:ListItem>
                    <asp:ListItem Value="mouseover">鼠标悬停</asp:ListItem>
                </asp:RadioButtonList>
            </td>
        </tr>
        <tr>
            <td class="bqleft">
                图片区域：
            </td>
            <td class="bqright">宽度：
                <asp:TextBox ID="txtPicWidth" runat="server" CssClass="in1" Columns="5"></asp:TextBox>px 高度：<asp:TextBox ID="txtPicHeight" runat="server" CssClass="in1" Columns="5"></asp:TextBox>px
                <br />不填写，图片大小将和盒子区域大小相同。
            </td>
        </tr>
        <tr>
            <td class="bqleft">
                文字层高度：
            </td>
            <td class="bqright">
                <asp:TextBox ID="txtFontHeight" runat="server" CssClass="in1"></asp:TextBox>px 'default'为默认高度，0为隐藏
            </td>
        </tr>
        <tr>
            <td class="bqleft">
                是否启用Loading：
            </td>
            <td class="bqright">
                <asp:RadioButtonList ID="radioLoading" runat="server" RepeatDirection="Horizontal">
                    <asp:ListItem Value="0" Selected="True">关闭</asp:ListItem>
                    <asp:ListItem Value="1">开启</asp:ListItem>
                </asp:RadioButtonList>
            </td>
        </tr>
        <tr>
            <td class="bqleft">
            </td>
            <td class="bqright" height="50">
                <asp:Button ID="Button1" runat="server" Text=" 确认添加 " CssClass="btn radius30 pad_0_30" 
                    onclick="Button1_Click"/>
            </td>
        </tr>
    </table>

    <script>
        var $id = function(id) { return document.getElementById(id) };
        var oriHtml = $id('focus_box').innerHTML;
        function resetHTML() {//还原
            $id('focus_box').innerHTML = oriHtml;
            var css = document.getElementsByTagName('style')[0];
            css.parentNode.removeChild(css);
        }
        function pageInit() {
            var pattern = location.href.split('pattern=')[1];
            if (pattern) $id('focus_pattern').value = pattern;
            myFocus.set({ id: 'focus', pattern: $id('focus_pattern').value });
        }
        pageInit();
        $id('focus_pattern').onchange = function() {
            if (this.value === 'more') {//更多风格
                location.href = 'more.html';
                return;
            }
            resetHTML();
            myFocus.set({ id: 'focus', pattern: this.value, loadIMGTimeout: 0,wrap:false });
        }
    </script>

    </form>
</body>
</html>
