<%@ Page Language="C#" AutoEventWireup="true" CodeBehind="staffpassword.aspx.cs" Inherits="Web.yw.staffpassword" %>
<%@ Register src="../share/foot.ascx" tagname="foot" tagprefix="uc1" %>
<!DOCTYPE html>
<html xmlns="http://www.w3.org/1999/xhtml">
<head runat="server">
<meta http-equiv="Content-Type" content="text/html; charset=utf-8"/>
    <title></title>
        <link href="../css/css.css" rel="stylesheet" type="text/css" />
        <style type="text/css">
        .default {display: inline-block;width: 70px;height: 30px;line-height: 30px;background: #ddd;text-align: center;margin: 4px 2px;background: #eeeeee;}
        .weak {display: inline-block;width: 70px;height: 30px;line-height: 30px;background: #ddd;text-align: center;margin: 4px 2px;background: #FF0000;}
        .medium {display: inline-block;width: 70px;height: 30px;line-height: 30px;background: #ddd;text-align: center;margin: 4px 2px;background: #FF9900;}
        .strong {display: inline-block;width: 70px;height: 30px;line-height: 30px;background: #ddd;text-align: center;margin: 4px 2px;background: #33CC00;}
        .spana {display: inline-block;width: 70px;height: 30px;line-height: 30px;background: #ddd;text-align: center;margin: 4px 2px;}
    </style>
    <script type="text/javascript">
        window.onload = function(){

            var oInput = document.getElementById('tbEditPassword1');
            oInput.value = '';
            oInput.onkeyup = function(){
                //强度状态设为默认
                span0.className = span1.className = span2.className = "default";
                var pwd = this.value;
                var result = 0;
                for(var i = 0, len = pwd.length; i < len; ++i){
                    result |= charType(pwd.charCodeAt(i));
                }

                var level = 0;
                //对result进行四次循环，计算其level
                for(var i = 0; i <= 4; i++){
                    if(result & 1){
                        level ++;
                    }
                    //右移一位
                    result = result >>> 1;
                }

                if(pwd.length >= 6){
                    switch (level) {
                        case 1:

                            span0.className = "weak";
                            break;
                        case 2:

                            span0.className = "medium";
                            span1.className = "medium";
                            break;
                        case 3:
                        case 4:


                            span0.className = "strong";
                            span1.className = "strong";
                            span2.className = "strong";
                            break;
                    }
                }
            }
        }
        /*
            定义一个函数，对给定的数分为四类(判断密码类型)，返回十进制1，2，4，8
            数字 0001 -->1  48~57
            小写字母 0010 -->2  97~122
            大写字母 0100 -->4  65~90
            特殊 1000 --> 8 其它
        */
        function charType(num){
            if(num >= 48 && num <= 57){
                return 1;
            }
            if (num >= 97 && num <= 122) {
                return 2;
            }
            if (num >= 65 && num <= 90) {
                return 4;
            }
            return 8;
        }
    </script>
</head>
<body>
    <form id="form1" runat="server">
    <div id="main-c" style ="height :96%; ">
<div id="main-c-01"><asp:Label ID="biaoti" runat="server"></asp:Label></div>
<div id="main-c-02">
<div id="main-c-02-01">
<table width="800" border="0" align="right" cellpadding="0" cellspacing="0">
  <tr>
    <td width="785" height="40" align="right">    <asp:Label ID="lbStaffinfo" runat="server"></asp:Label></td>
    <td width="15" align="right">&nbsp;</td>
  </tr>
</table>
</div></div>
<div id="main-c-03">
<!--栏目开始 -->
            <!--这里添加内容 -->
            <div style = " width :800px; margin-left :auto ; margin-right :auto ; text-align :left; margin-top :10px; font-size :large ; font-weight :bold; text-align :center  ">修改密码</div>
            <table  style =" width :800px; margin-left :auto ; margin-right :auto " border = "1" class ="table " cellpadding ="0" cellspacing ="0"  >
                <tr>
                    <td class ="tabletd_right " style ="width:120px; padding-top :10px; padding-bottom :10px">
                        人员编号</td>
                    <td class ="tabletd_left ">
                               <asp:Label ID="lbEditLoginId" runat="server"></asp:Label>
                                                        </td>
                </tr>
                <tr>
                    <td class ="tabletd_right" style ="padding-top :10px; padding-bottom :10px">姓名</td>
                    <td class ="tabletd_left ">
                        <asp:Label ID="lbEditName" runat="server"></asp:Label>
                    </td>
                </tr>
                <tr>
                    <td class ="tabletd_right" style ="padding-top :10px; padding-bottom :10px">新密码</td>
                    <td class ="tabletd_left">

                                    <asp:TextBox ID ='tbEditPassword1' runat="server" MaxLength="20"  Height ="20px" 
                 TextMode="Password"         name="tbEditPassword1"   Width="240px"></asp:TextBox>
                         &nbsp;<asp:RequiredFieldValidator 
                             ID="RequiredFieldValidator15" runat="server" 
                            ControlToValidate="tbEditPassword1" Display="Dynamic" ErrorMessage="密码不能为空。" 
                            ValidationGroup="Edit" ForeColor="Red"></asp:RequiredFieldValidator>
                   <div id ="psdnote"  runat ="server"  style ="padding-top :10px">密码不少于6位。</div>  
                    </td>
                </tr>
                <tr>
                    <td class ="tabletd_right" style ="padding-top :10px; padding-bottom :10px">
        <label for="">密码强度</label></td>
                    <td class ="tabletd_left">
                     <span id="span0" class ="spana">弱</span><span id="span1"  class ="spana">中</span><span id="span2"  class ="spana">强</span>
      </td>
                </tr>
                <tr>
                    <td class ="tabletd_right" style ="padding-top :10px; padding-bottom :10px">重复密码</td>
                    <td class ="tabletd_left">
                            <asp:TextBox ID="tbEditPassword2" runat="server" MaxLength="20"  Height ="20px" Width="240px"
                        TextMode="Password"></asp:TextBox>&nbsp;<asp:RequiredFieldValidator 
                             ID="RequiredFieldValidator16" runat="server" 
                            ControlToValidate="tbEditPassword2" Display="Dynamic" ErrorMessage="密码不能为空。" 
                            ValidationGroup="Edit" ForeColor="Red"></asp:RequiredFieldValidator>
                        <asp:CompareValidator ID="CompareValidator1" runat="server" 
                            ControlToCompare="tbEditPassword1" ControlToValidate="tbEditPassword2" 
                            Display="Dynamic" ErrorMessage="两次输入密码不一致。" ValidationGroup="Edit" 
                            ForeColor="Red"></asp:CompareValidator>
                    </td>
                </tr>
                <tr>
                    <td class ="tabletd_right " style ="padding-top :10px; padding-bottom :10px">
        <asp:Label ID="lbEditId" runat="server" Visible="False"></asp:Label>
                    </td>
                    <td class ="tabletd_left">
                        <asp:Button ID="btEditPasswordOK" runat="server" Text="提交修改" onclick="btEditPasswordOK_Click" 
                              ValidationGroup="Edit" />
                    </td>
                </tr>
            </table>
            <div style =" margin-bottom :50px">     </div>
<!--栏目结束 -->
</div>
</div>
<div id="footer-a" style ="height :20px ;font-size:12px">  <uc1:foot id="foot2" runat="server" /></div>
    </form>
</body>
</html>