<div class="loginPanel detail-div">
    <div id="common_message_forgot" ></div>
    <div id="common_message_logout" ></div>
    <div id="common_message_referal" ></div>
    <div id="common_login_message"></div>
    <div class="login-div">
        {assign var="userID" value=$userID|default:''}				 
        {form->start name="formLogin" action="" method="post" autocomplete="off" enctype="multipart/form-data" onsubmit="return false;"}
        {form->hidden name="tabFocus" value="1"}
        <div class="signup-form popup-action">
            <div class="d-md-block d-none log-left-head position-absolute p-4 text-white">
                <div class="p-3">
                    <h2 class="text-white mb-4 font-rglr">{$language.lblLogin}</h2>
                    <h4 class="text-white mb-0 font-rglr">{$language.lblGetaccesstoyourOrders}</h4>
                </div>
            </div>
            
            <fieldset class="p-md-4 p-0 pt-md-0 pt-4 float-right">
                <div class="px-3 py-5">
                    <h3 class="d-md-none d-block font-bold mb-4">{$language.lblLogin}</h3>
                    <ul class="list-unstyled p-0 m-0">
                        <li class="clearfix form-group mb-2">
                            <label for="userLoginEmail" class="mb-1">{$language.lblUsername}</label>
                            {form->textbox name="userLoginEmail" validate_event="submit" class="form-control py-2" autocomplete="off" validate="required~*email~*isTag" error=$language.errEmailID|cat:"~*"|cat:$language.errValidEmail|cat:"~*"|cat: $language.errtags} 
                        </li>
                        <li class="clearfix form-group mb-2">
                            <label for="userLoginPassword" class="mb-1">{$language.lblPassword}</label>
                            {form->password name="userLoginPassword"  validate_event="submit" class="form-control py-2" autocomplete="off" validate="required" error=$language.errLoginUserPassword} 
                        </li>
                        <li class="clearfix bttn-bx text-center pt-1">
                            {form->submit name="submitLogin" id="submit-login" validate_submit="yes" value=$language.lblLogin class="btn-block btn btn-secondary"}
                            {form->submit  name="completeLoaderLogin" style="display:none" disabled="disabled"  id="completeLoaderLogin" class="btn btn-secondary btn-block buttonDisable" value="{$language.lblCartPleaseWait}"}
                            {html->anchor href="" class="fr-pw d-block font-bold py-2 text-primary my-3" id="forgot-password-link" caption=$language.lblForgotPassword} 
                        </li>
                    </ul>
                    <div class="orlogin text-center font-bold text-dark pt-1 mb-3">
                        {$language.lblOrLoginWithEmail}
                    </div>
                    <div class="row">
                        <div class="loginpanel social-login col-12 col-sm-6 col-md-12" onclick="gplus();">
                            <div class="btn google-log rounded text-white d-block position-relative mb-2">
                                <span>{$language.lblLogWithGoogle}</span>
                            </div>
                        </div>

                        {if $enableFBlogin == 'Yes'}
                        <div class="loginpanel social-login col-12 col-sm-6 col-md-12" style="cursor:pointer;">
                            <div class="btn fb-log rounded text-white d-block position-relative mb-2" onclick="fb_login();"> 
                                <span>{$language.lblLogWithFb}</span>
                                <fb:login-button size="xlarge" width="300" class="fb-button" height="31" style="text-indent:none !important;"  scope="email,user_birthday,publish_actions,public_profile" onlogin="$('.fb_log').addClass('disabled');window.location.href='{$popup_iframe_url}/login/facebook/{$redirectUrl}{$parentUrl}'"  autologoutlink="false"> Continue with facebook Login</fb:login-button>
                            </div> 
                        </div>
                        {/if}
                    </div>
                    <div class="text-center newuser mt-4 p-2 border">
                        <span class="mr-3">{$language.lblNewUser} ?</span> <a href="javascript:void(0)" class="signuptab underline d-inline-block">{$language.lblSignUpNow}</a>
                    </div>
                </div>
            </fieldset>
        </div>
    {form->close}
    </div>
 </div>   
    {*<!-- forgot password section begins-->*}
    <div id="forgot-password-block" style="display:none">
        <div id="check-email-div" style="display:none">
            <h3 class="bord-bottom-dot"></h3>
            <div class="signup-form popup-action">
                <div class="d-md-block d-none log-left-head position-absolute p-4 text-white">
                    <h2 class="text-white mb-4 font-rglr">{$language.lblCheckEmail}</h2>
                    <h4 class="text-white mb-0 font-rglr">{$language.lblGetaccesstoyourOrders}</h4>
                </div>
                <div class="col-12">
                    <div class="warning" id="messageStatus"></div>
                </div>
            </div>
        </div>
        <div id="reset-password-div">
            <div class="clearfix popup-action">
                {form->start name="formForgotPassword" action="" method="post" enctype="multipart/form-data"}
                {form->hidden name="tabFocus" value="1"}
                <div class="signup-form popup-action">
                    <div class="d-md-block d-none log-left-head position-absolute p-4 text-white">
                        <h2 class="text-white mb-4 font-rglr">{$language.lblResetPassword}</h2>
                        <h4 class="text-white mb-0 font-rglr">{$language.lblGetaccesstoyourOrders}</h4>
                    </div>
                    <fieldset class="p-md-4 p-0 pt-md-0 pt-4 float-right">
                        <div class="px-3 py-5">
                            <ul class="list-unstyled p-0 m-0">
                                <li class="clearfix form-group">
                                    <h3 class="reset-password mb-4 font-bold">{$language.lblResetPassword}</h3>
                                    <span class="text"> {$language.lblForgotPasswordtext} {$commonSiteName}</span>
                                </li>
                                <li class="clearfix form-group">
                                    <label for="reqemailID">{$language.lblEmailID}</label>
                                    {form->textbox name="reqemailID" validate="required~*email" class="form-control py-2" error=$language.errValidEmail autocomplete="off"}
                                </li>
                                <li>
                                    {form->submit name="sendPassword" id="submit" class="btn-block btn btn-secondary submit-forgot" form="formForgotPassword" value=$language.lblContinue}
                                    {form->submit name="sendPasswordLoader" style="display:none" disabled="disabled" id="sendPasswordLoader" class="btn btn-secondary btn-block submit-forgot-btn buttonDisable" value="{$language.lblCartPleaseWait}"}
                                </li>
                                <li class="text-center">
                                    {html->anchor href="" class="bk-login mt-2" caption="{$language.lblBacktoLogin}" id="back-login-link"}
                                </li>
                            </ul>
                        </div>
                    </fieldset>
                </div>
            {form->close}
            </div>
        </div>
    </div>
    {*<!-- forgot password section ends-->*}


    <div class="SignupPanel" style="display:none;">
        <div class="signup-div">
        {form->start name="formUserSignup" action="" autocomplete="off" method="post" enctype="multipart/form-data" onsubmit="return false;"}
        {form->hidden name="tabFocus" value="2"}
        {form->hidden name="statehidValue"}
        {form->hidden name="referralID"}
        <div class="signup-form popup-action">
            <div class="d-md-block d-none log-left-head position-absolute p-4 text-white">
                <div class="p-3">
                    <h2 class="text-white mb-4 font-rglr">{$language.lblSignUp}</h2>
                    <h4 class="text-white mb-0 font-rglr">{$language.lblWedoNotShare}</h4>
                </div>
            </div>
            <fieldset class="px-md-4 px-0 pt-md-0 pt-4 float-right signup-fieldset">
                <div class="px-3">
                    <h3 class="d-md-none d-block font-bold mb-4">{$language.lblSignUp}</h3>
                    <ul class="list-unstyled p-0 m-0">
                        <li class="clearfix form-group mb-2">
                            <label for="userFirstName" class="mb-1">{$language.lblFirstName}</label>
                            {form->textbox  name="userFirstName" class="form-control" maxlength="50" validate_event="submit"  validate="required" error=$language.errFirstName}
                        </li>
                        <li class="clearfix form-group mb-2">
                            <label for="userLastName" class="mb-1">{$language.lblLastName}</label>
                            {form->textbox maxlength="50" class="form-control" validate_event="submit" name="userLastName" validate="required" error=$language.errLastName}
                        </li>
                        <li class="clearfix form-group mb-2">
                            <label for="userEmail" class="mb-1">{$language.lblEmailID}</label>
                            {form->textbox validate_event="submit" class="form-control" autocomplete="off" maxlength="80" name="userEmail" validate="required~*email~*userEmail->database->users,userEmail,userID!='$userID' AND userStatus!='Deleted' AND userLoginType='Facebook'~*userEmail->database->users,userEmail,userID!='$userID' AND userStatus!='Deleted' " error=$language.errEmailID|cat:"~*"|cat:$language.errValidEmail|cat:"~*"|cat:$language.errUserFacebookExists|cat:"~*"|cat:$language.errEmailExists}
                        </li>
                       <!-- <li class="clearfix form-group mb-2">
                            <label for="userEmail" class="mb-1">{$language.lblPhoneNumber}</label>
                            {*form->textbox validate_event="submit" class="form-control" autocomplete="off" maxlength="10" name="userPhone"  validate="required~*isNumber~*isPhoneStartwith~*userPhone->database->users,userPhone,userID!='$userID' AND userStatus!='Deleted'" error=$language.errPhone|cat:"~*"|cat:$language.errValidPhone|cat:"~*"|cat:$language.errValidNumberShort|cat:"~*"|cat:$language.errPhoneExists*}
                        </li>-->	
                        <li class="clearfix form-group mb-2">
                            <label for="userEmail" class="mb-1">{$language.lblPhoneNumber}</label>
                             <div class="row">
                                <div class="col-3 ">
                                    {form->select class="form-control"  name="userCountrycode"  options=$resCountryCode }	
                                </div>
                                <div class="col-9 ">
                                    {form->textbox  class="form-control" autocomplete="off" maxlength="10" name="userPhone"  validate="required~*isNumber~*userPhone->database->users,userPhone,userID!='$userID' AND userStatus!='Deleted'" error=$language.errPhone|cat:"~*"|cat:$language.errValidPhone|cat:"~*"|cat:$language.errPhoneExists}
                                </div>
                            </div>
                        </li>
                        <li class="clearfix form-group mb-2">
                            <label for="userPassword" class="mb-1">{$language.lblPassword}</label>
                            {form->password validate_event="submit" class="form-control" autocomplete="off" maxlength="20" name="userPassword" validate="required~*isSecurePassword" error=$language.errPassword|cat:"~*"|cat: $language.errInvalidPassword}
                        </li>
                        <li class="clearfix form-group mb-2">
                            <label for="userConfirmPassword" class="mb-1">{$language.lblConfirmPassword}</label>
                            {form->password validate_event="submit" class="form-control"  autocomplete="off" maxlength="20" name="userConfirmPassword" validate="required~*userPassword->compare->value" error=$language.errPassword|cat:"~*"|cat:$language.errConfirmPassword}
                        </li>
                        {form->hidden name="hidagree" value="1" id="hidagree"} 
                        {if $enableTermsPrivacy eq 'Yes'}
                        <li class="mb-2">
                            <div id="AjaxAgreeTermsDiv"> {form->hidden  name="enableTermsPrivacy" value=$enableTermsPrivacy}
                                {if $enableTermsPrivacy eq 'Yes'}
                                <div class="slip">
                                    {form->checkbox class="pos-abs chkbx1" id="agree"  name="agree" value="1"} 
                                    <label for="agree" class="mb-1">{$language.lblIAgree}</label>
                                    {if ""|dynamic_menu:'url':'terms-and-conditions'}
                                    {html->anchor target="blank" class="display-inline-block" rel="howitswork" href="#"|dynamic_menu:'hrefurl':'terms-and-conditions' caption=$language.lblTermsAndConditions|dynamic_menu:'caption':'terms-and-conditions'}{/if}
                                    {if ""|dynamic_menu:'url':'privacy-statements'} {$language.lblAnd} {html->anchor class="display-inline-block" target="blank" rel="howitswork" href="#"|dynamic_menu:'hrefurl':'privacy-statements' caption=$language.lblPrivacyPolicy|dynamic_menu:'caption':'privacy-statements'}{/if}
                                    <span class="mndty">*</span> 
                                    <div> {form->validate name="validateAgree" validate="hidagree->isequal->1~*required"  error=$language.errAgreement} </div>
                                </div>
                                 {/if}
                            </div>
                        </li>
                        {/if}
                        <li class="clearfix bttn-bx">
                            {form->submit  name="submit" id="submit" class="btn-block btn btn-secondary submit-signup" form="formUserSignup" value=$language.lblSignUpNow} 
                            {form->submit  name="completeLoaderSignup" style="display:none;" disabled="disabled"  id="completeLoaderSignup" class="btn btn-secondary btn-block submit-signup-btn buttonDisable" value="{$language.lblCartPleaseWait}"}
                        </li>
                    </ul>
                    <div class="text-center newuser mt-4 p-2 border">
                        <span class="mr-3">{$language.lblAlreadyhaveaccount}</span>
                        <a href="javascript:void(0)" class="logintab underline d-inline-block">{$language.lblLoginNow}</a> 
                    </div>
                </div>
            </fieldset>
        </div>
        {form->close} 
    </div> 
    {*<!--mobile verify section begins-->*}
    <div class="verifyPanel" id="verify-block" style="display:none">
        <div id="verify-div">
            <div class="clearfix popup-action">
                <div class="signup-form popup-action">
                    <div class="d-md-block d-none log-left-head position-absolute p-4 text-white">
                        <h2 class="text-white mb-4 font-rglr">{$language.lblVerifyMobile}</h2>
                        <h4 class="text-white mb-0 font-rglr">{$language.lblWedoNotShare}</h4>
                    </div>
                    <fieldset class="p-md-4 p-0 pt-md-0 pt-4 float-right">
                        <div class="p-3">
                            <div id="common_verify_message"></div>
                            {assign var="userID" value=$userID|default:''}			   
                            {form->start name="formVerifyMobile" action="" method="post" autocomplete="off" enctype="multipart/form-data"} 
                            {form->hidden name="tabFocus" value="3"}		  
                            <ul class="clearfix list-unstyled p-0 m-0" id="sendCodeBlock">
                                <li class="clearfix form-group">
                                    <h3 class="reset-password">{$language.lblVerifyMobile}</h3>
                                    <span class="text userPhoneEmpty" >{$language.lblVerifyNote}</span>
                                    <span class="text userPhoneNotEmpty hide">{$language.lblOtpMessage3}<span class="moibleHint"></span></span>
                                </li>
                                <li class="clearfix form-group userPhoneEmpty">
                                    <label for="userPhone" class="mb-1">{$language.lblPhoneNumber}</label>
                                    {form->textbox validate_event="submit" class="form-control" autocomplete="off" maxlength="80" name="userPhoneVerify"  validate="required~*isNumber~*callback_checkUserPhoneExist" error=$language.errPhone|cat:"~*"|cat:$language.errValidPhone|cat:"~*"|cat:$language.errPhoneExists}
                                </li>			  
                                <li>
                                    {form->submit name="submitVerify" id="submit-verify" class="btn-block btn btn-secondary " form="formVerifyMobile" value=$language.lblSendCode}
                                    {form->submit  name="submitVerifyDisable" style="display:none" disabled="disabled"  id="submitVerifyDisable" class="btn btn-secondary btn-block rmv-margin submit-signup-btn buttonDisable" value="{$language.lblCartPleaseWait}"}				
                                </li>
                            </ul>
                            <ul class="clearfix hide list-unstyled p-0 m-0" id="resendCodeBlock">
                                <li class="clearfix form-group">
                                    <h3 class="reset-password">{$language.lblVerifyMobile}</h3>
                                    <span class="text">{$language.lblOtpMessage1}<span class="moibleHint"></span></span>
                                    <p> <span class="text"> {$language.lblOtpMessage2} </span></p>
                                </li>
                            </ul>
                            {form->close}
                            <ul id="verify-code-div" style="display:none" class="clearfix list-unstyled p-0 m-0">
                                {form->start name="formVerifyCode" action="" method="post" autocomplete="off" enctype="multipart/form-data"} 
                                {form->hidden name="tabFocus" value="3"}             
                                <li class="clearfix form-group">
                                    <label for="verify_codes" class="mb-1">{$language.lblVerificationCode}</label>
                                    {form->textbox validate_event="submit" class="form-control py-2" autocomplete="off" maxlength="80" name="verify_codes" validate="required" error=$language.errVerifyCodes}
                                </li>			  
                                <li>
                                    {form->submit name="submitCode" id="submitCode" class="btn-block btn btn-secondary" form="formVerifyCode" value=$language.lblVerify}
                                    {form->submit  name="submitCodeDisable" style="display:none" disabled="disabled"  id="submitCodeDisable" class="btn btn-secondary btn-block submit-signup-btn buttonDisable" value="{$language.lblCartPleaseWait}"}						
                                </li>
                                <li class="mt-3 font-small resendotp">
                                   <p>{$language.lblResendText} {html->anchor href="" class="bk-login" caption="{$language.lblResendCode}" id="resend-otp"}</p>
                                </li>             
                                {form->close}	  
                            </ul>
                        </div>
                    </fieldset>
                </div>
            </div>
        </div>
    </div>
    {*<!-- mobile verify section ends-->*}
</div>
  <script type="text/javascript">      
     var redURL =  '{$redirectUrl|default:''}'+'{$parentUrl|default:''}';      
  </script>        
{literal}
<script type="text/javascript">    
   function fb_login() {

    FB.login(function(response) {
	if (response.authResponse) {
          $('.fb_log').addClass('disabled');
      }else{
          $('.fb_log').removeClass('disabled');
      }
	 // window.location = GLOBAL_BASE_PATH+'/login/facebook/'+redURL;
		var loginUrl = popup_iframe_url + '/login/facebook/';
		$.ajax({
			type:"POST",
			url:loginUrl,
			success:function(msg){
                                
                               
				try { 
					var x = $.parseJSON(msg);
				} catch (e) {
			window.top.location.href = document.referrer;	
				}
				if(x.error=='Yes')
				{
					if(x.isverify=='No'){
					//tab focusing
					activePopupSection("signup");
					 $(".signup-div").hide(); 
					$('#verify-block').attr('style','display:block');
						if(x.userPhoneVerify!=''){
						 var last4Num = x.userPhoneVerify.substring(6);
						 $(".moibleHint").html('XXXXXX'+last4Num);	
						 $('#verify-code-div').attr('style','display:block');   
						 $('#sendCodeBlock').addClass('hide');   
						 $('#resendCodeBlock').removeClass('hide');   
						 $('#submitCodeDisable').hide();					 
						}					
					}
				}
				else
				{
                       var  redirectURL      = x.redirectURL;
					if(typeof redirectURL != "undefined")
					{
                                                var reUrl = redirectURL;
                                                if(reUrl.charAt(0)=='/') {
                                                  reUrl     = reUrl.substr(1,(reUrl.length)-1);
                                                }                                               
						window.top.location.href = popup_iframe_url +'/'+reUrl;
					}
					else
					{
                                                
						//var reUrl = x.redirectUrl;
                                                if(reUrl.charAt(0)=='/') {
                                                    reUrl     = reUrl.substr(1,(reUrl.length)-1);                                                    
                                                }                                                
						if(redURL!="" && !(typeof redURL === "undefined"))
						{
							window.top.location.href  = popup_iframe_url+'/'+redURL;
						}
						else
						{ 
							window.top.location.href = document.referrer;	
						}
					}	 	
				}
			}
		});	 
	 
	 }, 
	  {scope: 'email,public_profile'}
	  );
  }
  function gplus() {
        window.open(GLOBAL_BASE_PATH + '/gplus.php'+redURL, '', 'width=800,height=650,location=0,menubar=0,resizable=0,scrollbars=0,status=0,titlebar=0,toolbar=0');
  }
  $(document).ready(function() {

      $(document).on("click",'#agree',function(e) { 	
         if($('#agree').prop('checked')){
               $('#hidagree').val(2);
         }else{
               $('#hidagree').val(1);
         }
        
        });  
          });  

</script>
{/literal}

<script type="text/javascript">
  var msgVerifiedMobile	=	"{$language.msgVerifiedMobile}";
  var loginSubmit	=	"{$language.lblLogin}";
  var signUpSubmit	=	"{$language.lblSubmit}";
  var lblResendCode	=	"{$language.lblResendCode}";
  var msgCodeSentSucces	=	"{$language.msgCodeSentSucces}";
  var lblBacktoLogin    =       "{$language.lblBacktoLogin}";
  var NO_VALIDATION_SCROLL = true;
  {if isset($__redirect_URL)}
  __redirect_URL = '{$__redirect_URL}';
  {/if}
  $(document).ready(function() {
  $('#formLogin').bind("submit", function(e) { 		
      e.preventDefault();
      $('#submit-login').hide();
      $('#completeLoaderLogin').show();
  	__loginProcess();
      return false;
  });
  $('#formUserSignup').bind("submit", function(e) { 		
      e.preventDefault();
      $('.submit-signup').hide();
      $('.submit-signup-btn').show();
      $('#completeLoaderSignup').show();
  	__signupProcess();
      return false;
  });
  $('#formForgotPassword').bind("submit", function(e) { 		
      e.preventDefault();
      $('.submit-forgot').hide();
      $('.submit-forgot-btn').show();
  	__forgotPasswordProcess();
      return false;
  });
    $('#formVerifyMobile').bind("submit", function(e) { 
      e.preventDefault();
   //   $('.submit-forgot').hide();
    //  $('.submit-forgot-btn').show();
  	__verifyMobileProcess();
      return false;
  });
   $('#resend-otp').on("click", function(e) { 		
      e.preventDefault();
      $('.loginPanel').addClass('d-none');   
      $('#submit-verify').trigger('click'); 

  }); 
   $('#formVerifyCode').bind("submit", function(e) { 
      e.preventDefault();
     // $('.submit-forgot').hide();
     // $('.submit-forgot-btn').show();
  	__verifyCodeProcess();
      return false;
  });

  if ($('#userLoginEmail').val() != '' ) {
    $('#userLoginEmail').addClass('up');
    $('#userLoginPassword').addClass('up');
  }
  
  
  });
  $(window).load(function() {
    $('#userLoginEmail').addClass('up');
    $('#userLoginPassword').addClass('up');
  })
</script>
{form->validate_script form="formLogin"}
{form->validate_script form="formUserSignup"}  
{form->validate_script form="formForgotPassword"}
{form->validate_script form="formVerifyMobile"}
{form->validate_script form="formVerifyCode"}
 {html->messages_script id="common_verify_message"}
