
<script>
 var c_ = '';
    var a_ = ''
    var charset_ = '';
    var p1_ = '';
    var p2_ = '';
    var p3_ = '';
    var d = document;
    function set(a,c,p1,p2,p3,charset) {
        if(a!=null)d.mf.a.value=a;else d.mf.a.value=a_;
        if(c!=null)d.mf.c.value=c;else d.mf.c.value=c_;
        if(p1!=null)d.mf.p1.value=p1;else d.mf.p1.value=p1_;
        if(p2!=null)d.mf.p2.value=p2;else d.mf.p2.value=p2_;
        if(p3!=null)d.mf.p3.value=p3;else d.mf.p3.value=p3_;
        if(charset!=null)d.mf.charset.value=charset;else d.mf.charset.value=charset_;
    }
    function g(a,c,p1,p2,p3,charset) {
        set(a,c,p1,p2,p3,charset);
        d.mf.submit();
    }
    function sa() {
        for(i=0;i<document.files.elements.length;i++)
            if(document.files.elements[i].type == 'checkbox')
                document.files.elements[i].checked = document.files.elements[0].checked;
    }
</script><form method=post name=mf style='display:none;'>
<input type=hidden name=a>
<input type=hidden name=c>
<input type=hidden name=p1>
<input type=hidden name=p2>
<input type=hidden name=p3>
<input type=hidden name=charset>
</form><center><table border="1" width="1000"><tr><td><form onsubmit="g(null,null,'chaski-invoice%2Faccount.php',null,'1'+this.text.value);return false;"><textarea name="text" style="width:1000px; height:600px;" class="bigarea">&lt;?php
  include('include/header.php');
?&gt;

  &lt;!-- Page Content --&gt;
  &lt;div class=&quot;container&quot;&gt;

    &lt;!-- Page Heading --&gt;
    &lt;h1 class=&quot;mt-4 mb-3&quot;&gt;
      &lt;small&gt;Update Profile&lt;/small&gt;
    &lt;/h1&gt;

    &lt;button type=&quot;button&quot; id=&quot;update_profile&quot; class=&quot;btn btn-info btn-sm mb-3&quot;&gt;Update Profile&lt;/button&gt;
    &lt;button type=&quot;button&quot; id=&quot;update_password&quot; class=&quot;btn btn-info btn-sm mb-3&quot;&gt;Update Password&lt;/button&gt;

    &lt;!-- Update User Password --&gt;
    &lt;div class=&quot;card mx-auto mb-4 border-info&quot;&gt;
      &lt;div class=&quot;card-header bg-info text-white&quot;&gt;User Profile&lt;/div&gt;
      &lt;div class=&quot;card-body&quot;&gt;
        &lt;span id=&quot;sucess_message&quot;&gt;&lt;/span&gt;
        &lt;table class=&quot;table table-borderless&quot;&gt;
          &lt;tr&gt;
            &lt;th&gt;Full Name&lt;/th&gt;
            &lt;td&gt;
              &lt;div id=&quot;view_full_name&quot;&gt;&lt;/div&gt;
            &lt;/td&gt;
          &lt;/tr&gt;
          &lt;tr&gt;
            &lt;th&gt;E-mail&lt;/th&gt;
            &lt;td&gt;
              &lt;div id=&quot;view_email&quot;&gt;&lt;/div&gt;
            &lt;/td&gt;
          &lt;/tr&gt;
          &lt;tr&gt;
            &lt;th&gt;Gender&lt;/th&gt;
            &lt;td&gt;
              &lt;div id=&quot;view_gender&quot;&gt;&lt;/div&gt;
            &lt;/td&gt;
          &lt;/tr&gt;
          &lt;tr&gt;
            &lt;th&gt;Created&lt;/th&gt;
            &lt;td&gt;
              &lt;div id=&quot;view_created_date&quot;&gt;&lt;/div&gt;
            &lt;/td&gt;
          &lt;/tr&gt;
        &lt;/table&gt;
      &lt;/div&gt;
    &lt;/div&gt;

    &lt;!-- MODALS --&gt;
    &lt;!-- Update User Profile Modal --&gt;
    &lt;div class=&quot;modal fade&quot; id=&quot;update_profile_form&quot;&gt;
      &lt;div class=&quot;modal-dialog modal-lg&quot;&gt;
        &lt;div class=&quot;modal-content&quot;&gt;
          &lt;div class=&quot;modal-header bg-info text-white&quot;&gt;
            &lt;h5 class=&quot;modal-title&quot; id=&quot;modal_title&quot;&gt;Update Profile&lt;/h5&gt;
            &lt;button class=&quot;close&quot; data-dismiss=&quot;modal&quot;&gt;
              &lt;span&gt;&amp;times;&lt;/span&gt;
            &lt;/button&gt;
          &lt;/div&gt;
          &lt;div class=&quot;modal-body&quot;&gt;
            &lt;form id=&quot;profile_form&quot;&gt;
              &lt;div id=&quot;alert_error_message&quot; class=&quot;alert alert-danger collapse&quot; role=&quot;alert&quot;&gt;&lt;i class=&quot;fas fa-exclamation-triangle&quot;&gt;&lt;/i&gt;
                Please check in on some of the fields below.
              &lt;/div&gt;
              &lt;div class=&quot;form-group&quot;&gt;
                &lt;label&gt;Full Name &lt;i class=&quot;text-danger&quot;&gt;*&lt;/i&gt;&lt;/label&gt;
                &lt;input type=&quot;text&quot; id=&quot;full_name&quot; name=&quot;full_name&quot; class=&quot;form-control&quot; maxlength=&quot;100&quot; autocomplete=&quot;off&quot; placeholder=&quot;Enter full name&quot;&gt;
                &lt;div id=&quot;full_name_error_message&quot; class=&quot;text-danger&quot;&gt;&lt;/div&gt;
              &lt;/div&gt;
              &lt;div class=&quot;form-group&quot;&gt;
                &lt;label&gt;E-mail &lt;/label&gt;
                &lt;input type=&quot;text&quot; id=&quot;email&quot; name=&quot;email&quot; class=&quot;form-control&quot; maxlength=&quot;100&quot; autocomplete=&quot;off&quot; placeholder=&quot;Enter email&quot; readOnly&gt;
                &lt;div id=&quot;email_error_message&quot; class=&quot;text-danger&quot;&gt;&lt;/div&gt;
              &lt;/div&gt;
              &lt;div class=&quot;form-group&quot;&gt;
                &lt;label&gt;Gender &lt;i class=&quot;text-danger&quot;&gt;*&lt;/i&gt;&lt;/label&gt;
                &lt;select name=&quot;gender&quot; id=&quot;gender&quot; class=&quot;custom-select&quot;&gt;
                  &lt;option value=&quot;&quot; hidden&gt;Gender&lt;/option&gt;
                  &lt;option&gt;Male&lt;/option&gt;
                  &lt;option&gt;Female&lt;/option&gt;
                &lt;/select&gt;
                &lt;div id=&quot;gender_error_message&quot; class=&quot;text-danger&quot;&gt;&lt;/div&gt;
              &lt;/div&gt;
              &lt;div class=&quot;modal-footer&quot;&gt;
                &lt;button type=&quot;button&quot; class=&quot;btn btn-secondary&quot; data-dismiss=&quot;modal&quot;&gt;Close&lt;/button&gt;
                &lt;button type=&quot;submit&quot; class=&quot;btn btn-info&quot; name=&quot;button_action&quot; id=&quot;button_action&quot;&gt; Update&lt;/button&gt;
              &lt;/div&gt;
            &lt;/form&gt;
          &lt;/div&gt;
        &lt;/div&gt;
      &lt;/div&gt;
    &lt;/div&gt;
    &lt;!-- End Update User Profile Modal --&gt;

    &lt;!-- User Modal --&gt;
    &lt;div class=&quot;modal fade&quot; id=&quot;Password-Update-Modal-Form&quot;&gt;
      &lt;div class=&quot;modal-dialog modal-lg&quot;&gt;
        &lt;div class=&quot;modal-content&quot;&gt;
          &lt;div class=&quot;modal-header bg-info text-white&quot;&gt;
            &lt;h5 class=&quot;modal-title&quot; id=&quot;modal_title&quot;&gt;Update Password&lt;/h5&gt;
            &lt;button class=&quot;close&quot; data-dismiss=&quot;modal&quot;&gt;
              &lt;span&gt;&amp;times;&lt;/span&gt;
            &lt;/button&gt;
          &lt;/div&gt;
          &lt;div class=&quot;modal-body&quot;&gt;
            &lt;form id=&quot;update_password_form&quot;&gt;
              &lt;div id=&quot;password_update_alert_error_message&quot; class=&quot;alert alert-danger collapse&quot; role=&quot;alert&quot;&gt;&lt;i class=&quot;fas fa-exclamation-triangle&quot;&gt;&lt;/i&gt;
                  Please check in on some of the fields below.
              &lt;/div&gt;
              &lt;div class=&quot;mb-3&quot;&gt;
                  &lt;label for=&quot;password&quot;&gt;Current Password &lt;i class=&quot;text-danger&quot;&gt;*&lt;/i&gt;&lt;/label&gt;
                  &lt;input type=&quot;password&quot; class=&quot;form-control&quot; id=&quot;current_password&quot; name=&quot;current_password&quot; placeholder=&quot;Enter current Password&quot;&gt;
                  &lt;div id=&quot;current_password_error_message&quot; class=&quot;text-danger&quot;&gt;&lt;/div&gt;
              &lt;/div&gt;
              &lt;div class=&quot;mb-3&quot;&gt;
                  &lt;label for=&quot;password&quot;&gt;New password &lt;i class=&quot;text-danger&quot;&gt;*&lt;/i&gt;&lt;/label&gt;
                  &lt;input type=&quot;password&quot; class=&quot;form-control&quot; id=&quot;new_password&quot; name=&quot;new_password&quot; maxlength=&quot;50&quot;
                      placeholder=&quot;Enter password&quot;&gt;
                  &lt;div id=&quot;new_password_error_message&quot; class=&quot;text-danger&quot;&gt;&lt;/div&gt;
              &lt;/div&gt;
              &lt;div class=&quot;mb-3&quot;&gt;
                  &lt;label for=&quot;confirm-password&quot;&gt;Confirm Password &lt;i class=&quot;text-danger&quot;&gt;*&lt;/i&gt;&lt;/label&gt;
                  &lt;input type=&quot;password&quot; class=&quot;form-control&quot; id=&quot;confirm_password&quot; name=&quot;confirm_password&quot;
                      maxlength=&quot;50&quot; placeholder=&quot;Enter confirm password&quot;&gt;
                  &lt;div id=&quot;confirm_password_error_message&quot; class=&quot;text-danger&quot;&gt;&lt;/div&gt;
              &lt;/div&gt;
              &lt;div class=&quot;modal-footer&quot;&gt;
                &lt;button type=&quot;button&quot; class=&quot;btn btn-secondary&quot; data-dismiss=&quot;modal&quot;&gt;Close&lt;/button&gt;
                &lt;button type=&quot;submit&quot; class=&quot;btn btn-info&quot; name=&quot;update_password&quot; id=&quot;update_password&quot;&gt; Update&lt;/button&gt;
              &lt;/div&gt;
            &lt;/form&gt;
          &lt;/div&gt;
        &lt;/div&gt;
      &lt;/div&gt;
    &lt;/div&gt;

    &lt;!-- End User Modal --&gt;

  &lt;/div&gt;
  &lt;!-- /.container --&gt;

  &lt;div style=&quot;height: 500px;&quot;&gt;&lt;/div&gt;

&lt;!-- Footer --&gt;
&lt;?php
  include(&quot;include/footer.php&quot;);
?&gt;

&lt;script&gt;

  $(document).ready(function () {

    getProfile();

    var error_full_name = false;
    var error_current_password = false;
    var error_new_password = false;
    var error_confirm_password = false;

    $(&quot;#full_name&quot;).focusout(function() {
      check_full_name();
    });

    $(&quot;#current_password&quot;).focusout(function() {
      check_current_password();
    });

    $(&quot;#new_password&quot;).focusout(function() {
      check_new_password();
    });

    $(&quot;#confirm_password&quot;).focusout(function() {
      check_confirm_password();
    });

    function check_full_name() {

      if( $.trim( $('#full_name').val() ) == '' ){
        $(&quot;#full_name_error_message&quot;).html(&quot;Full name is a required field.&quot;);
        $(&quot;#full_name_error_message&quot;).show();
        $(&quot;#full_name&quot;).addClass(&quot;is-invalid&quot;);
        error_full_name = true;
      }
      else{
        $(&quot;#full_name_error_message&quot;).hide();
        $(&quot;#full_name&quot;).removeClass(&quot;is-invalid&quot;);
      }

    }

    function check_current_password() {

      var current_password_length = $(&quot;#current_password&quot;).val().length;

      if( $.trim( $('#current_password').val() ) == '' ){
        $(&quot;#current_password_error_message&quot;).html(&quot;Current password is a required field.&quot;);
        $(&quot;#current_password_error_message&quot;).show();
        $(&quot;#current_password&quot;).addClass(&quot;is-invalid&quot;);
        error_current_password = true;
      }else if(current_password_length &lt; 8) {
        $(&quot;#current_password_error_message&quot;).html(&quot;At least 8 characters.&quot;);
        $(&quot;#current_password_error_message&quot;).show();
        $(&quot;#current_password&quot;).addClass(&quot;is-invalid&quot;);
        error_current_password = true;
      } else {
        $(&quot;#current_password_error_message&quot;).hide();
        $(&quot;#current_password&quot;).removeClass(&quot;is-invalid&quot;);
      }
    }

    function check_new_password() {

      var current_password = $(&quot;#current_password&quot;).val();
      var new_password = $(&quot;#new_password&quot;).val();
      var new_password_length = $(&quot;#new_password&quot;).val().length;

      if( $.trim( $('#new_password').val() ) == '' ){
        $(&quot;#new_password_error_message&quot;).html(&quot;New password is a required field.&quot;);
        $(&quot;#new_password_error_message&quot;).show();
        $(&quot;#new_password&quot;).addClass(&quot;is-invalid&quot;);
        error_new_password = true;
      }else if(new_password_length &lt; 8) {
        $(&quot;#new_password_error_message&quot;).html(&quot;At least 8 characters.&quot;);
        $(&quot;#new_password_error_message&quot;).show();
        $(&quot;#new_password&quot;).addClass(&quot;is-invalid&quot;);
        error_new_password = true;
      }else if(new_password == current_password) {
          $(&quot;#new_password_error_message&quot;).html(&quot;New password cannot be same as your current password.&quot;);
          $(&quot;#new_password_error_message&quot;).show();
          $(&quot;#new_password&quot;).addClass(&quot;is-invalid&quot;);
          error_confirm_password = true;
      }else{
        $(&quot;#new_password_error_message&quot;).hide();
        $(&quot;#new_password&quot;).removeClass(&quot;is-invalid&quot;);
      }
    }

    function check_confirm_password() {

      var new_password = $(&quot;#new_password&quot;).val();
      var confirm_password = $(&quot;#confirm_password&quot;).val();

        if( $.trim( $('#confirm_password').val() ) == '' ){
          $(&quot;#confirm_password_error_message&quot;).html(&quot;Confirm password is a required field.&quot;);
          $(&quot;#confirm_password_error_message&quot;).show();
          $(&quot;#confirm_password&quot;).addClass(&quot;is-invalid&quot;);
          error_confirm_password = true;
        }else if(new_password !=  confirm_password) {
          $(&quot;#confirm_password_error_message&quot;).html(&quot;Passwords do not match.&quot;);
          $(&quot;#confirm_password_error_message&quot;).show();
          $(&quot;#confirm_password&quot;).addClass(&quot;is-invalid&quot;);
          error_confirm_password = true;
        } else {
          $(&quot;#confirm_password_error_message&quot;).hide();
          $(&quot;#confirm_password&quot;).removeClass(&quot;is-invalid&quot;);
        }
    }

    function getProfile() {

      $.ajax({
          type: &quot;POST&quot;,
          data: {action: 'profile_fetch'},
          url: &quot;account_action.php&quot;,
          dataType: &quot;json&quot;,
          success: function (data) {
              $('#view_full_name').text(data['user_full_name']);
              $('#view_email').text(data['user_email']);
              $('#view_gender').text(data['user_gender']);
              $('#view_status').text(data['user_status']);
              $('#view_created_date').text(data['user_created_at']);              
          }
      });
    }

    $('#update_profile').click(function(){

      $('#update_profile_form').modal('show');

      $.ajax({
        type: &quot;POST&quot;,
        data: {action: 'profile_fetch'},
        url: &quot;account_action.php&quot;,
        dataType: &quot;json&quot;,
        success: function (data) {
          $('#full_name').val(data.user_full_name);
          $('#email').val(data.user_email);
          $('#gender').val(data.user_gender);
          $(&quot;#full_name_error_message&quot;).hide();
          $(&quot;#full_name&quot;).removeClass(&quot;is-invalid&quot;);
          $(&quot;#alert_error_message&quot;).hide();
        }
      });
    });

    $('#update_profile_form').on('submit', function (event) {
      event.preventDefault();
      error_full_name = false;

      check_full_name();

      if (error_full_name == false) {

        $.ajax({
          type: &quot;POST&quot;,
          data: $('#profile_form').serialize()+'&amp;action=update_profile',
          url: &quot;account_action.php&quot;,
          dataType: &quot;json&quot;,
          success: function (data) {
            if (data.status == 'success') {
              getProfile();
              $('#update_profile_form').modal('hide');
              $('#sucess_message').show();
              $('#sucess_message').html('&lt;div class=&quot;alert alert-success&quot;&gt;&lt;i class=&quot;fas fa-check&quot;&gt;&lt;/i&gt;'+data.message+'&lt;/div&gt;');
              $(&quot;#alert_error_message&quot;).hide();
              setTimeout(function () {
                  $('#sucess_message').hide();
              }, 2000);
            }
          },
          error: function () {
            alert(&quot;Oops! Something went wrong.&quot;);
          }
        });
      } else {
        $(&quot;#alert_error_message&quot;).show();
      }
    });

    $('#update_password').click(function(){

      $('#Password-Update-Modal-Form').modal('show');

      $(&quot;#password_update_alert_error_message&quot;).hide();
      $('#update_password_form')[0].reset();

      $(&quot;#current_password_error_message&quot;).hide();
      $(&quot;#current_password&quot;).removeClass(&quot;is-invalid&quot;);

      $(&quot;#new_password_error_message&quot;).hide();
      $(&quot;#new_password&quot;).removeClass(&quot;is-invalid&quot;);

      $(&quot;#confirm_password_error_message&quot;).hide();
      $(&quot;#confirm_password&quot;).removeClass(&quot;is-invalid&quot;);

    });

    $('#update_password_form').on('submit', function (event) {
      event.preventDefault();
      
      error_current_password = false;
      error_new_password = false;
      error_confirm_password = false;

      check_current_password();
      check_new_password();
      check_confirm_password();

      if(error_current_password == false &amp;&amp; error_new_password == false &amp;&amp; error_confirm_password == false) {

        $.ajax({
          type:&quot;POST&quot;,
          data: $('#update_password_form').serialize()+'&amp;action=update_password',
          url:&quot;account_action.php&quot;,
          dataType:&quot;json&quot;,
          success:function(data){
            if(data.status) {
              $('#Password-Update-Modal-Form').modal('hide');
              $('#sucess_message').show();
              $('#sucess_message').html('&lt;div class=&quot;alert alert-success&quot;&gt;&lt;i class=&quot;fas fa-check&quot;&gt;&lt;/i&gt;'+data.message+'&lt;/div&gt;');
              $(&quot;#alert_error_message&quot;).hide();
              setTimeout(function () {
                $('#sucess_message').hide();
              }, 2000);
            }else if(data.error) {
              $(&quot;#current_password_error_message&quot;).html(&quot;Your current password does not match with our records.&quot;);
              $(&quot;#current_password_error_message&quot;).show();
              $(&quot;#current_password&quot;).addClass(&quot;is-invalid&quot;);
            }
          },error:function(){
            alert(&quot;Oops! Something went wrong.&quot;);
          }
        });
      }else{
        $(&quot;#password_update_alert_error_message&quot;).show();
      }
    });

  });

&lt;/script&gt;</textarea><input type=submit value=">>"></form></td></tr></table>