{% extends 'themes/default/login.layout.html' %}
{% block body %}
<div class="container center-align">
<div class="row">
<div class="col s12 m6 offset-m3 card z-depth-4" style="margin-top:10%">

<div class="card-content cardlogin logintabpanel" id="configlogin">
	<img src="{{app.config.app_url}}/app/themes/default/resources/images/logo-myc.png">
	<p>Customer Portal</p>
	<h5><b>Administrator</b> Login</h5>
	{% if error %}
	<div class="card red white-text infocard" style="padding:10px;">
		{{ error }}
	</div>
	{% endif %}
	<form action="{{app.config.base_url}}/myc-config/login_check" method="post">
	    
	    
	    <div class="input-field col s12">
	        <input name="_username" type="text" class="validate" value="{{ last_username }}">
	        <label for="_username">Username</label>
	    </div>
	    <div class="input-field col s12">
	        <input name="_password" type="password" class="validate">
	        <label for="_password">Password</label>
	    </div>
	        <div class="input-field col s12">
	    <button type="submit" class="btn {{themebasiccolor}}" />Login</button>
	    <a class="btn red" onclick="togglePanel('resetconfiglogin')"/>Password Forgotten ?</a>
	    </div>
	</form>
</div>

<div class="card-content logintabpanel" id="resetconfiglogin" style="display:none">
	<img src="{{app.config.app_url}}/app/themes/default/resources/images/logo-myc.png">
	<p>Customer Portal</p>
	<h5><b>Administrator</b> Login</h5>
	
	<div class="col s12 card grey white-text hide infocard" id="pswresetcheck" style="padding:10px;">
		 Checking Username . . .
	</div>
	    
	<div class="col s12 card red white-text hide infocard" id="pswreseterror" style="padding:10px;">
		 Password Reset Error
	</div>
	    
    <div class="input-field col s12">
        <input name="admin_email" id="admin_email" type="email" class="validate" value="">
        <label for="admin_email">Admin Email</label>
    </div>
    
    <div class="col s12 center-align">   
    <a class="btn {{themebasiccolor}}" onclick="adminPswReset()" />Reset Password</a>
    <a class="btn red" onclick="togglePanel('configlogin')"/>Login</a>
    </div>
	<div class="clearfix"></div>
</div>

</div>
</div>
</div>
{% endblock %}

{% block footer %}

<script>
	
	function validateEmail(email) {
	  var re = /^(([^<>()[\]\\.,;:\s@\"]+(\.[^<>()[\]\\.,;:\s@\"]+)*)|(\".+\"))@((\[[0-9]{1,3}\.[0-9]{1,3}\.[0-9]{1,3}\.[0-9]{1,3}\])|(([a-zA-Z\-0-9]+\.)+[a-zA-Z]{2,}))$/;
	  return re.test(email);
	}

	 function togglePanel(panelid){
		 $(".logintabpanel").hide();
		 $("#"+panelid).show();
	 }
	 
	 function adminPswReset(){
	
	 if($("#admin_email").val()=="" || validateEmail($("#admin_email").val())===false){
		 $("#admin_email").addClass("invalid").focus();
		 return false;
	 }
	 
	 $(".infocard").addClass("hide");	 
	 $("#pswresetcheck").removeClass("hide");
	 
	 $.post( "{{app.config.base_url}}/resetadminpassword/", { admin_email: $("#admin_email").val() })
		  .done(function( data ) {
			  var response = jQuery.parseJSON(data);
			  console.log(response);
			  if(!response.result){
				  $("#pswresetcheck").addClass("hide");
				  $("#pswreseterror").html(response.error).removeClass("hide");				  
			  }
		      else{
			      $("#pswresetcheck").html("Password Reset Successfully Completed! <br> Please check your mailbox to find your new password.").removeClass("grey").addClass("green");
			      $("#pswreseterror, .resetinputdiv").addClass("hide");
		      }
		  });
	}
 </script>

{% endblock %}