<!DOCTYPE html>
<html class="login-bg">
<head>
<title><?=$title?></title>

<meta name="viewport" content="width=device-width, initial-scale=1.0" />
<meta http-equiv="Content-Type" content="text/html; charset=utf-8" />
<meta http-equiv="X-UA-Compatible" content="IE=edge,Chrome=1" />

<!-- bootstrap -->
<link href="View/public/css/bootstrap/bootstrap.css" rel="stylesheet" />
<link href="View/public/css/bootstrap/bootstrap-responsive.css"
	rel="stylesheet" />
<link href="View/public/css/bootstrap/bootstrap-overrides.css"
	type="text/css" rel="stylesheet" />
<link rel="stylesheet" type="text/css" href="View/public/css/layout.css" />
<link rel="stylesheet" type="text/css"
	href="View/public/css/elements.css" />
<link rel="stylesheet" type="text/css" href="View/public/css/icons.css" />
<link rel="stylesheet" type="text/css"
	href="View/public/css/lib/font-awesome.css" />
<link rel="stylesheet" href="View/public/css/compiled/signup.css"
	type="text/css" media="screen" />
<style type="text/css">
.yz {
	display: none;
}

.iModal {
	position: static;
	width: 95%;
	margin: auto auto;
	padding: 0;
}
</style>
<!--[if lt IE 9]>
		<script src="http://html5shim.googlecode.com/svn/trunk/html5.js"></script>
		<![endif]-->
</head>
<body>
	<div class="header">
		<a href="index.html"> <img src="/View/public/img/logo.png"
			class="logo" />
		</a>
		<!-- scripts -->
	</div>
	<form name="from1">
		<div class="container">
			<div class="row-fluid" id="container">
				<div class="modal iModal items page">
					<div class="modal-header">
						<h3>第一步</h3>
					</div>
					<div class="modal-body">
						<input id="email" class="span12" type="text"
							placeholder="请输入邮箱地址..." /> <a class="btn btn-primary pull-right"
							onclick="check()" id="send">发送验证码</a>
						<div id="msg"></div>
						<div class="email-wrapper hidden">
							<input class="span8" type="text" id="key" name="key"
								placeholder="请输入验证码..." /> <input type="button"
								class="btn btn-primary pull-right" value="验证邮箱"
								onclick="statu_mail()">
						</div>
					</div>
					<div class="modal-footer">
						<a class="pull-left" href="signin.html">已经有了帐号?点击这里登陆</a> <input
							type="button" class="next right btn btn-primary pull-right"
							value="下一步">
					</div>
				</div>

				<div class="modal iModal items hidden page">
					<div class="modal-header">
						<h3>第二步</h3>
					</div>
					<div class="modal-body">
						<input class="span12" type="text" placeholder="玩家账号" id="username"
							disabled='disabled' name='user'> <input class="span12"
							type="text" placeholder="新的密码" id="pass1" name='pass' /> <input
							class="span12" type="text" placeholder="重复输入密码" id="pass2" />
					</div>
					<div class="modal-footer">
						<a class="pull-left" href="signin.html">已经有了帐号?点击这里登陆</a> <input
							type="button" class="next right btn btn-primary pull-right"
							value="下一步">
					</div>
				</div>


				<div class="modal iModal hidden items page">
					<div class="modal-header">
						<h3>第三步</h3>
					</div>
					<div class="modal-body">
						<em>点击确定完成密码更换操作。</em>
					</div>
					<div class="modal-footer">
						<a class="pull-left" href="signin.html">已经有了帐号?点击这里登陆</a> <input
							type="button" class="next btn  btn-primary " id="sub"
							onclick="updatepass()" value="确定" />
					</div>
				</div>

			</div>
		</div>
	</form>
	<script src="View/public/js/jquery-1.7.2.min.js"></script>
	<script src="View/public/js/bootstrap.min.js"></script>
	<script src="View/public/js/theme.js"></script>
	<script src="View/public/js/scrollable.js"></script>
	<script type="text/javascript">
			function check(){
				var Regex = /^(?:\w+\.?)*\w+@(?:\w+\.)*\w+$/;
				var email = $("#email").val();
				if(email==""){
					alert("请输入邮箱地址！");
					return false;
					}else if(!Regex.test(email)){
			                alert("邮箱格式不对");
			                $('#email').val("");
			                return false;
			    }
				$.ajax({type:"GET", data:{mail:email}, dataType:"json", url:"<?=Url('retrieve','checkmail')?>", cache:false,
					success:function(i){
						switch(i.status){
							case "success":
			                $.each(i.info,function(c,b){
								    $.ajax({ type:"GET", data:{mail:email}, dataType:"json", url:"<?=Url('retrieve','send')?>",  
			                        success:function(t){
									  switch(t.status){
										  case "success" :
										    $('.email-wrapper').eq(0).removeClass("hidden").show();
			                                $("#username").val(b.username);
											$("#send").eq(0).addClass('yz');
											$("#email").attr("disabled","disabled");
											$('div#msg').eq(0).html("邮件已发送").clearQueue().fadeIn().fadeOut(2000);
											
											//$("#status").html("邮箱验证成功<br>当前邮箱绑定帐号:<div id='account'>"+b.username+"</div>");
										  break;
										  case "error" : alert("验证邮件发送失败"); return; break;
									    }  
								    }					   
							    })
							})
							break;
							case "error": alert(i.info); return; break;
						}
					}
				})	
			}
			function statu_mail(){
				if($("#key").val() == ""){
					alert("验证码不能为空");
					return;
				}
				$.ajax({ url:"<?=Url('retrieve','status')?>", type:"POST", data:{mail:$("#email").val(), key:$("#key").val()}, dataType:"json",
					success:function(r){
						switch(r.status){
						   case "success": 
						        alert(r.info);
								$("#statu").eq(0).addClass('yz'); 
								$("#step").eq(0).removeClass("yz").clearQueue().fadeIn(2000);
								$("#key").attr("disabled","disabled");
							break;
			               case "error": alert(r.info); return; break;			   
						}			
					}
				})
			}
			function load(){
			    var html = '<div style="float:center">游戏账号:<div id="name">'+$("#username").val()+'<input type="hidden" id="hidden_name" value="'+$("#username").val()+'"></div><br>'+
				           '更改后的密码:<div id="password">'+$("#pass").val()+'<input type="hidden" id="hidden_pass" value="'+$("#pass").val()		+'"></div></div>';
				$("#info").append(html);

			}
			function updatepass(){
					$.ajax({
			    	   type:"POST",
			    	   data:{user:$("#hidden_name").val(),mail:$("#email").val(),type:"forge",pass:$("#hidden_pass").val()},
			    	   dataType:"json",
			    	   url:'<?=Url('user_public','forge')?>',
			    	   success:function(data){
						   switch(data.status){
							   case "success": alert(data.info);  window.location.href = "<?=Url('index','login')?>"; break;
							   case "error": alert(data.info); return false; break;
					        }
			            }
					})
			}
			$(function(){
				$(".container").scrollable({
					onSeek:function(event,i){
						$(".iModal").addClass("hidden").eq(i).removeClass("hidden");
					},
					onBeforeSeek:function(event,i){
						switch(i){
							case 1 : 
				              var Regex = /^(?:\w+\.?)*\w+@(?:\w+\.)*\w+$/;
				              var email = $("#email").val();
				              if(email==""){ alert("请输入邮箱地址！"); return false;}
							  else if(!Regex.test(email)){ alert("邮箱格式不对");  $('#email').val(""); return false; }
							  else if($("#key").val() == ""){ alert("请输入验证码！"); return false; }
							break;
							case 2 :
							   var pass = $("#pass1").val();
							   var pass1 = $("#pass2").val();
							    if(pass==""){ alert("请输入密码！"); return false;
							    }else if(pass1 != pass){ alert("两次密码不一致！"); return false;
							    }else if(pass.length < 6){ alert("密码长度不能低于6位"); return false;}
								load();
							break;
							case 3 :

							break;
						}
					}
				});
			});
		   
		</script>
</body>
</html>