<%-- 
    Document   : login
    Created on : May 22, 2019, 2:29:27 PM
    Author     : jitendra singh
--%>
<%@page contentType="text/html" pageEncoding="UTF-8"%>
<%@taglib prefix="form" uri="http://www.springframework.org/tags/form" %>
<%@taglib prefix="fn" uri="http://java.sun.com/jsp/jstl/functions"%>
<%@taglib prefix="c" uri="http://java.sun.com/jsp/jstl/core"%>
<%@taglib prefix="fmt" uri="http://java.sun.com/jsp/jstl/fmt" %>

<div id="fb-root"></div>
   
<div class="accountbox-wrapper <c:if test="${(param.login != null or param.error !=null or param.wrong != null or param.pchanged !=null) and empty pageContext.request.userPrincipal.principal.userId}">is-visible</c:if>">
    <div class="accountbox text-left">
        <ul class="nav accountbox__filters" id="myTab" role="tablist">
            <li>
                <a class="active" id="log-tab" data-toggle="tab" href="#log" role="tab" aria-controls="log" aria-selected="true">Login</a>
            </li>
        </ul>
        <c:if test="${param.login != null}">
            <div class="alert alert-success">
                <p>Registered successfully, login to enjoy your shopping.</p>
            </div>
        </c:if> 
        <c:if test="${param.error != null}">
            <div class="alert alert-danger">
                <p>Invalid username or password.</p>
            </div>
        </c:if>
        <c:if test="${param.wrong != null}">
            <div class="alert alert-danger">
                <p>Something went wrong.</p>
            </div>
        </c:if>
        <c:if test="${param.pchanged != null}">
            <div class="alert alert-success">
                <p>Successfully changed.</p>
            </div>
        </c:if>
        <div class="accountbox__inner tab-content" id="myTabContent">

            <div class="accountbox__login tab-pane fade show active" id="log" role="tabpanel" aria-labelledby="log-tab">
                <form id="loginform" class="form-vertical" action="${pageContext.request.contextPath}/" method="post">
                    
                    <div class="single-input">
                        <input type="text" class="cr-round--lg" id="ssoId" name="ssoId" placeholder="Enter email or mobile number" required>
                    </div>
                    <div class="single-input">
                        <input type="password" class="cr-round--lg" id="pwd" name="pwd" placeholder="Enter Password" required>
                        <input type="hidden" name="${_csrf.parameterName}"  value="${_csrf.token}" /> 
                    </div>
                    <div class="single-input">
                        <button type="submit" class="food__btn btn-block"><span>Login</span></button>                        
                        <a class="accountbox-trigger-signup register">Create account</a>
                        <a href="${pageContext.request.contextPath}/login?forget" class="register pull-right fp">Forget Password?</a>
                    </div>
                </form>
            </div>
            <br />
            <h6 class="text-center">OR</h6>
            <div class="accountbox-login__others">
                <div class="social-icons">
                    <div class="row">
                        <div class="col-lg-12 col-sm-6 order-2">
                             <div class="fb-login-button" data-width="315" data-size="large" data-button-type="login_with" onlogin="checkLoginState();" data-auto-logout-link="true" data-use-continue-as="true"></div>
		                   </div>
						
                        <div class="col-lg-12 col-sm-6 pt--20 order-2">
                           <div id="my-signin2"></div>	
                        </div>    
					
                    </div>
                </div>
            </div>   

            <span class="accountbox-close-button"><i class="fa fa-close"></i></span>
        </div>
    </div>
</div>        
       
<script>
<security:authorize access="!isAuthenticated()">
 function loginGoogle(profile){
            $.ajax({
              type: 'POST',
              url:  'https://blissmeal.com/user/json/login',
              headers: {"Authorization": "Basic " + btoa(profile.getId() + ":" + profile.getId())},
              success: function (res) {
				window.location.reload(true);	
              },
              error: function (res) {
				  if(res.status==401){
				  signUpGoogle(profile);
				  }
              }
          });
  }
  
    function loginFB(response){
            $.ajax({
              type: 'POST',
              url:  'https://blissmeal.com/user/json/login',
              headers: {"Authorization": "Basic " + btoa(response.id + ":" + response.id)},
              success: function (res) {
				window.location.reload(true);
              },
              error: function (res) {
				  if(res.status==401){
				  signUpFB(response);
				  }
              }
          });
  }
</security:authorize>  
function statusChangeCallback(response) {

	console.log('statusChangeCallback');
    console.log(response);
    if (response.status === 'connected') {
		<security:authorize access="!isAuthenticated()">
			setTimeout(function() { window.location.reload(true); },800);
		</security:authorize>
		testAPI();
    } 
  }
    
</script>
<script src="https://apis.google.com/js/platform.js?onload=renderButton" async defer></script>