{{> local_signin/header}}
<div class="login-left-sec">
   {{#exist}} <h3>Welcome back!</h3>{{/exist}}
   {{^exist}}<h3>Start Learning!</h3>{{/exist}}<p class="go_back_btn">Change number? <a href="index.php">Go back</a></p>
    <div class="form-sec">
        <form name="validate" id="otp_form" method="post" action="verify_otp.php">
            <div class="form-inner-otp-sec form-inner-sec active_pareent">
              <div class="form-inner-otp">
                <div class="col otp_disable_field phone-col">
                    {{#phone}}<span>Mobile number</span>
              <input type="text" name="phone" id="phone" class="form-control" placeholder="Enter you mobile number" value="{{phone}}">{{/phone}}
              {{#email}}<span>Email</span>
              <input type="text" class="form-control" name="email" placeholder="Enter you email id" value="{{email}}">{{/email}}
                </div>
                <div class="form-check right-btn">
                    <label class="form-check-label" id="sent_msg">
                      <img src="img/checked_icon.svg" alt="">OTP sent!
                    </label>
                </div>
              </div>
              <div class="col resend">
                <span>Enter OTP</span>
                <input type="text" id="otpinput" class="form-control" maxlength="6" name="otp" placeholder="Enter the OTP" required>
                <input type="hidden" name="userid" id="userid" value="{{userid}}">
                <input type="hidden" name="user_exist" value="{{exist}}">
                <input type="hidden" name="tableid" value="{{tableid}}">
                <input type="hidden" name="utm_source" id="utm_source" value="{{utm_source}}">
                <input type="hidden" name="utm_medium" id="utm_medium" value="{{utm_medium}}">
                <input type="hidden" name="utm_campaign" id="utm_campaign" value="{{utm_campaign}}">
              </div>
              <div class="error-msg" id="error-msg">
            </div>
              <div class="time-txt-sec">
                <p>Did not recieve OTP? <span id="time"></span></p>
              </div>
              <div class="col verify">       
               {{#exist}}<input type="submit" name="validate" id="login_upshot" class="btn btn-primary mb-2" value="Login">{{/exist}}
               {{^exist}}<input type="submit" name="validate" id="verify_upshot" class="btn btn-primary mb-2" value="Verify">{{/exist}}
              </div>
              <div class="left-sec-content">
                <p>Your personal data will be used to support your experience throughout this website, to manage access to your account, and for other purposes described in our  
                    <a href="https://herovired.com/privacy-tc/" target="_blank">privacy policy</a>.</p>
              </div>
            </div>
        </form>
    </div>
</div>
   {{> local_signin/slider}}
   {{> local_signin/footer}}


<script>


function startTimer(duration, display) {
    var start = Date.now(),
        diff,
        minutes,
        seconds;
    function timer() {
        // get the number of seconds that have elapsed since 
        // startTimer() was called
        diff = duration - (((Date.now() - start) / 1000) | 0);

        // does the same job as parseInt truncates the float
        minutes = (diff / 60) | 0;
        seconds = (diff % 60) | 0;

        minutes = minutes < 10 ? "0" + minutes : minutes;
        seconds = seconds < 10 ? "0" + seconds : seconds;

        display.textContent = minutes + ":" + seconds; 

        if (diff <= 0) {
            clearInterval($interval);
            document.getElementById('time').innerHTML = '<a href = "#" id = "resend_otp" >Resend</a>';
        }
    };
    // we don't want to wait a full second before the timer starts
    timer();
    $interval = setInterval(timer, 1000);
}

window.onload = function () {
    start_timer();
};
function start_timer() {
  var fiveMinutes = 60 * 2,
        display = document.querySelector('#time');
    startTimer(fiveMinutes, display);
}

$(document).on('click', '#resend_otp' , function() {
  // alert("hi");
  var phone_val = "{{phone}}";
  var email = "{{email}}";
  var userid = "{{userid}}";
  if (phone_val) {
      var phone_temp = phone_val;
      var phone ="+91"+phone_temp.substr(phone_temp.length - 10);
  }
  if(userid){
    $.ajax({
              url: 'ajax.php',
              method: 'post',
              async:false,
              data: {
                  'userid':  userid,
              },
              success: function (result) {
                output = JSON.parse(result);
                var eventValue = {
                      'Source': 'VLearn',
                      'UID': phone,
                      'appuid': phone,
                      'email': output.email,
                      'city': output.city,
                      'state': output.state,
                      'country': output.country,
                      'LatestProgramName': output.program_name,
                      'UserAccesstype': output.accesstype,
                      'MobileNumber':phone,
                };
            upshot.createEventByName('SIGNUP_Resend_OTP', eventValue, false);
            upshot.createEvent('UpshotEventPageView', 'SIGNUP_Resend_OTP');
            upshot.getActivity('UpshotActivityTypeAny', 'SIGNUP_Resend_OTP');
        }
    })
  }else{
        var eventValue = {
            'Source': 'VLearn',
            'UID': phone,
            'appuid':phone,
            'city': '',
            'state': '',
            'country': '',
            'email': email,
            'MobileNumber': phone,
            'LatestProgramName': '',
            'LatestCourseName':'',
            'UserAccesstype': '',
        }
        upshot.createEventByName('SIGNUP_Resend_OTP', eventValue, false);
        upshot.createEvent('UpshotEventPageView', 'SIGNUP_Resend_OTP');
        upshot.getActivity('UpshotActivityTypeAny', 'SIGNUP_Resend_OTP');
  }
 
  $.ajax({
            url:"otp_ajax.php",    //the page containing php script
            type: "post",    //request type,
            async:true,
            data: {resend: true, phone: phone_val, email: email},
            success:function(response){
              if(response){
                document.getElementById('sent_msg').innerHTML = " <img src='img/checked_icon.svg' alt=''>OTP resent";
                start_timer();
              }
                console.log(response);
            }
        });
});

$("#otp_form").submit(function(e) {
        e.preventDefault(); // avoid to execute the actual submit of the form.
        var form = $(this);
        var url = form.attr('action');
        var userid = $('#userid').val();
        var phone_val = $('#phoneNumber').val();
        if (phone_val) {
          var phone_temp = phone_val;
          var phone ="+91"+phone_temp.substr(phone_temp.length - 10);
      }
        var email = $('#emailid').val();
        if(userid){
    
        }else{
          var eventValue = {
                'Source': 'VLearn',
                'UID': phone,
                'appuid':phone,
                'city': '',
                'state': '',
                'country': '',
                'email': email,
                'MobileNumber': phone,
                'LatestProgramName': '',
                'LatestCourseName':'',
                'UserAccesstype': '',
            }
            console.log("SIGNUP_Mobile_OTP_Entered");
            upshot.createEventByName('SIGNUP_Mobile_OTP_Entered', eventValue, false);
            upshot.createEvent('UpshotEventPageView', 'SIGNUP_Mobile_OTP_Entered');
            upshot.getActivity('UpshotActivityTypeAny', 'SIGNUP_Mobile_OTP_Entered');
        }
        
        $.ajax({
           type: "POST",
           url: url,
           data: form.serialize(), // serializes the form's elements.
           success: function(result)
           {
             const obj = JSON.parse(result);
             if(obj.status == 0 && obj.userid != ""){
               //if user exists
                $.ajax({
                url: 'ajax.php',
                method: 'post',
                async:false,
                data: {
                    'userid':  userid,
                },
                  success: function (result) {
                    output = JSON.parse(result);
                    var eventValue = {
                        'Source': 'VLearn',
                        'UID': phone,
                        'appuid':phone,
                        'email': output.email,
                        'city': output.city,
                        'state': output.state,
                        'country': output.country,
                        'LatestProgramName': output.program_name,
                        'UserAccesstype': output.accesstype,
                        'MobileNumber':phone,
                        'Verification_Status': "Verified"
                    };
                      console.log("SIGNUP_Mobile_OTP_Entered");
                      upshot.createEventByName('SIGNUP_Mobile_OTP_Entered', eventValue, false);
                      upshot.createEvent('UpshotEventPageView', 'SIGNUP_Mobile_OTP_Entered');
                      upshot.getActivity('UpshotActivityTypeAny', 'SIGNUP_Mobile_OTP_Entered');
                  }
              })
              //user login
               var url = "login.php?id="+obj.userid;
               window.location.href = url;
             }else if(obj.status == 0 && obj.userid == ""){
              //upshot event for new users
              var eventValue = {
                  'Source': 'VLearn',
                  'UID': phone,
                  'appuid': phone,
                  'city': '',
                  'state': '',
                  'country': '',
                  'email': email,
                  'MobileNumber': phone,
                  'LatestProgramName': '',
                  'LatestCourseName':'',
                  'UserAccesstype': '',
                  'Verification_Status': "Verified"
              }
              console.log("SIGNUP_Mobile_OTP_Entered");
              upshot.createEventByName('SIGNUP_Mobile_OTP_Entered', eventValue, false);
              upshot.createEvent('UpshotEventPageView', 'SIGNUP_Mobile_OTP_Entered');
              upshot.getActivity('UpshotActivityTypeAny', 'SIGNUP_Mobile_OTP_Entered');
              //user sign up form for new users
              var url = "signup_form.php?id="+obj.tableid;
               window.location.href = url;
             }else{
                if(userid){
                        //if user exists
                      $.ajax({
                      url: 'ajax.php',
                      method: 'post',
                      async:false,
                      data: {
                          'userid':  userid,
                      },
                        success: function (result) {
                          output = JSON.parse(result);
                          var eventValue = {
                              'Source': 'VLearn',
                              'UID': phone,
                              'appuid':phone,
                              'email': output.email,
                              'city': output.city,
                              'state': output.state,
                              'country': output.country,
                              'LatestProgramName': output.program_name,
                              'UserAccesstype': output.accesstype,
                              'MobileNumber':phone,
                              'Verification_Status': "Incorrect"
                          };
                            console.log("SIGNUP_Mobile_OTP_Entered");
                            upshot.createEventByName('SIGNUP_Mobile_OTP_Entered', eventValue, false);
                            upshot.createEvent('UpshotEventPageView', 'SIGNUP_Mobile_OTP_Entered');
                            upshot.getActivity('UpshotActivityTypeAny', 'SIGNUP_Mobile_OTP_Entered');
                        }
                    })
                  
                }else{
                  var eventValue = {
                        'Source': 'VLearn',
                        'UID': phone,
                        'appuid':phone,
                        'city': '',
                        'state': '',
                        'country': '',
                        'email': email,
                        'MobileNumber': phone,
                        'LatestProgramName': '',
                        'LatestCourseName':'',
                        'UserAccesstype': '',
                        'Verification_Status': "Incorrect"
                    }
                    console.log("SIGNUP_Mobile_OTP_Entered");
                    upshot.createEventByName('SIGNUP_Mobile_OTP_Entered', eventValue, false);
                    upshot.createEvent('UpshotEventPageView', 'SIGNUP_Mobile_OTP_Entered');
                    upshot.getActivity('UpshotActivityTypeAny', 'SIGNUP_Mobile_OTP_Entered');
                }
               document.getElementById("error-msg").innerHTML = '<img src="img/error_icon.svg" alt="error"><label class="errors" name="error">'+obj.msg+'</label>';
             } 
           }
         });


    })


</script>