<%@ Page Language="C#" AutoEventWireup="true" CodeBehind="default.aspx.cs" Inherits="Web.m._default" %>
<!DOCTYPE html>
<html>
<head id="Head1" runat="server">
    <title></title>
<meta name="format-detection" content="telephone=no" />
<meta http-equiv="X-UA-Compatible" content="IE=edge,chrome=1">
<meta name="viewport" content="width=device-width, initial-scale=1.0, user-scalable=no, minimum-scale=1.0, maximum-scale=1.0">
<meta name="apple-mobile-web-app-capable" content="yes">
<meta name="apple-mobile-web-app-status-bar-style" content="black">
<link type="text/css" rel="stylesheet" href="/css/reset.css" />
<link type="text/css" rel="stylesheet" href="/css/base.css" />
<script type="text/javascript" src="/js/touch.js"></script>
<script type="text/ecmascript" src="/js/md5.js"></script>
<script src="/js/modernizr.custom.js"></script>
 <script type="text/javascript">
        window.onload = function () {

            var oInput = document.getElementById('tbPassword');
            oInput.value = '';
            oInput.onkeyup = function () {
                //强度状态设为默认
                document.getElementById('tbPassword').style.color = "grey";
                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:
                            document.getElementById('tbPassword').style.color = "red";
                            break;
                        case 2:
                            document.getElementById('tbPassword').style.color = "orange";
                            break;
                        case 3:
                            document.getElementById('tbPassword').style.color = "blue";
                            break;
                        case 4:
                            document.getElementById('tbPassword').style.color = "green";
                            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 class="bg15">
    <form id="form1" runat="server">

    <div class ="biaoti">  <asp:Label ID="biaoti" runat="server"></asp:Label><asp:Label ID="biaoti2" runat="server"></asp:Label></div>
   <section id="container">
<figure>
    <div class ="login ">

        <asp:TextBox ID="tbUserName" runat="server"
            CssClass="login-field login-field-username" type="text"
            placeholder="人员编号/登录名/邮箱/电话" autocapitalize="off" autocomplete="off"
            autocorrect="off" MaxLength="25"></asp:TextBox>


    </div>
    <div class ="login ">

        <asp:TextBox ID="tbPassword" runat="server" onblur="cal()" onfocus="c()"
            CssClass="login-field login-field-password" type="password" placeholder="输入密码"
            autocomplete="off" style="left: -1px; top: 1px"></asp:TextBox>


    </div>
</figure>

   <div class="tab-iteam" >
    <div class="tab-iteam-con">
    	<div class="con" style="margin-top:30px">
        <asp:LinkButton ID="lbLogin" 
                runat="server" CssClass="more" onclick="lbLogin_Click" 
                ValidationGroup="wan">登  录</asp:LinkButton>
		</div>
    </div>
</div>
          <div class ="login " style =" margin-top :30px; font-size :11px; text-align :left ">
             <a href ="forget/default.aspx" target ="_blank" >找回密码...</a>     </div>
    <div class ="login " >
                                <asp:RequiredFieldValidator ID="RequiredFieldValidator1" runat="server" 
                                    ControlToValidate="tbUserName" Display="Dynamic" ErrorMessage="请输入登录名。" 
                                    ValidationGroup="wan" ForeColor="Red"></asp:RequiredFieldValidator>
                                <asp:RegularExpressionValidator ID="RegularExpressionValidator2" runat="server" 
                                    ControlToValidate="tbUserName" Display="Dynamic" ErrorMessage="登录名不合规范。" 
                                    ValidationExpression="^[^%&gt;&lt;'&amp;*=!&quot;?]{2,25}$" 
                                    ValidationGroup="wan" ForeColor="Red"></asp:RegularExpressionValidator>
                                <asp:RequiredFieldValidator ID="RequiredFieldValidator2" runat="server" 
                                    ControlToValidate="tbPassword" Display="Dynamic" ErrorMessage="请输入密码。" 
                                    ValidationGroup="wan" ForeColor="Red"></asp:RequiredFieldValidator>
                             </div>
    </section><!--summary end-->
   </form>

<script>
    document.write('<script src=js/' +
('__proto__' in {} ? 'zepto.custom' : 'jquery') +
'.js><\/script>')
</script>

<!-- Include the plugin. Yay! -->
<script src="/js/hideShowPassword.min.js" charset="gbk"></script>

<script>
    // Example 2
    $('#tbPassword').hideShowPassword({
        // Make the password visible right away.
        show: false,
        // Create the toggle goodness.
        innerToggle: true,
        // Give the toggle a custom class so we can style it
        // separately from the previous example.
        toggleClass: 'my-toggle-class',
        // Don't show the toggle until the input triggers
        // the 'focus' event.
        hideToggleUntil: 'focus',
        // Enable touch support for toggle.
        touchSupport: Modernizr.touch
    });
</script>
</body>
</html>

<script type="text/javascript">  
    function cal() {
        var t1 = document.getElementById("<%=tbPassword.ClientID%>").value;
        if (t1.trim().length > 5) {
            var hash = hex_md5(t1);
            var tbcolor = document.getElementById('tbPassword').style.color;
            switch (tbcolor) {
                case 'red':
                    hash = hash + '1';
                    break;
                case 'orange':
                    hash = hash + '2';
                    break;
                case 'blue':
                    hash = hash + '3';
                    break;
                case 'green':
                    hash = hash + '4';
                    break;
            }
            document.getElementById("<%=tbPassword.ClientID%>").value = hash;
        }
        else {
            if (document.getElementById("<%=tbUserName.ClientID%>").value != "")
            alert("请输入正确的密码");
        }
    }
</script>  
<script type="text/javascript">  
    function c() {
        document.getElementById("<%=tbPassword.ClientID%>").value = "";
    }
</script>  