<!doctype html>
<html lang="en">
  <head>
    <!-- load JS -->
	<script src="js/angular.min.js"></script>
    <!-- end load JS -->
  </head>
  
  <body>
    <div role="tabpanel" class="tab-pane active" id="products">
        <div class="col-lg-12 col-md-12 col-sm-12 col-xs-12 sign-in-container">
            <div class="sign-in-box">
                <h2>
                    <strong>
                        Login to Sayvour
                    </strong>
                </h2>
                
                <?php 
				if(@$_SESSION["fail"]==1){
				echo '<p class="bg-danger">Fail.Please Check your enter.</p>';
				$_SESSION["fail"]=0;
				} 
				?>
				
                <form id="signinform" ng-app="signinform"  ng-controller="Ctrl2" name="signinform" method="post" action="includes/login.php" novalidate >
                
                    <div class="controls input-group">
                        <input style="text-align:left" class="form-control" placeholder="User Name or Email" type="text" name="username" ng-model="name" ng-minlength="4" required>
                        
                        <div class="input-group-addon">
                            <span style="color:green"ng-show="signinform.username.$dirty && signinform.username.$valid">
                                OK
                            </span>
                                                
                            <span style="color:red" ng-show="signinform.username.$dirty && signinform.username.$error.minlength">
                                too short!
                            </span>
                        </div>
                    </div>
                    
                    <div class="controls input-group">
                        <input class="form-control" placeholder="Password" type="password" name="password" ng-model="password" ng-minlength="4" ng-maxlength="32" required>
                        
                        <div class="input-group-addon">
                            <span style="color:green"ng-show="signinform.password.$dirty && signinform.password.$valid">
                                OK
                            </span>

                            <span style="color:red" ng-show="signupform.password.$dirty && signupform.password.$error.maxlength">
                                Content exceeds 32 characters
                            </span>
                        
                            <span style="color:red" ng-show="signinform.password.$dirty && signinform.password.$error.minlength">
                                too short!
                            </span>
                        </div>
                    </div>

                    <div class="controls input-group">
                        <textarea class="form-control" style="display:none;" ng-model="reCaptchaCheck" required></textarea>
                    </div>
                    
                    <div class="controls input-group">
                        <div class="g-recaptcha" data-sitekey="6LenKhYUAAAAAIwseMuOsziCxRQ5bxg5-gals1Cv"></div>
                    </div>
                    
                    <div class="controls">
                        <input class="btn btn-sign-in" type="submit" name="submit" value="Login Now!" ng-disabled="signinform.$invalid">
                    </div>
                </form>
                
                <div class="links-container">
                    <a href="#sign-up" role="tab" data-toggle="tab"> Register</a><br>
                    <a href="#forgot-password" role="tab" data-toggle="tab"> Forgot password</a><br>
                </div>
            </div>
        </div>
    </div>
    
	<script>
    var app = angular.module('signinform', []);
    app.controller('Ctrl2', function($scope) {
    });
    </script>
  </body>
</html>