<div class="list-group">
   <div class="list-group-item"><i class="fa fa-fw fa-user"></i> <?php echo $wo['lang']['profile_setting']; ?> <?php if(Wo_IsAdmin($wo['user']['user_id']) === true) { ?><a href="<?php echo $wo['setting']['url'];?>">(<?php echo $wo['setting']['name'];?>)</a><?php } ?></div>
   <div class="setting-well">
   <form  method="post" class="form-horizontal setting-profile-form" enctype="multipart/form-data">
      <fieldset>
         <div class="setting-profile-alert setting-update-alert"></div>
         <!-- Text input-->
         <div class="form-group">
            <label class="col-md-2" for="first_name"><?php echo $wo['lang']['first_name']; ?></label>  
            <div class="col-md-6">
               <input id="first_name" name="first_name" type="text" class="form-control input-md" value="<?php echo $wo['setting']['first_name'];?>">
            </div>
         </div>
         <!-- Text input-->
         <div class="form-group">
            <label class="col-md-2" for="last_name"><?php echo $wo['lang']['last_name']; ?></label>  
            <div class="col-md-6">
               <input id="last_name" name="last_name" type="text" class="form-control input-md" value="<?php echo $wo['setting']['last_name'];?>">
            </div>
         </div>
         
         <!-- Textarea -->
         <div class="form-group">
            <label class="col-md-2" for="about"><?php echo $wo['lang']['about_me']; ?></label>
            <div class="col-md-6">             
               <textarea class="form-control" id="about" name="about" cols="20" rows="3"><?php echo $wo['setting']['about'];?></textarea>
            </div>
         </div>
         <!-- Text input-->
         <div class="form-group">
            <label class="col-md-2" for="address"><?php echo $wo['lang']['location']; ?></label>  
            <div class="col-md-6">
               <input id="address" name="address" type="text" class="form-control input-md" value="<?php echo $wo['setting']['address'];?>">
            </div>
         </div>
         <!-- Text input-->
         <div class="form-group">
            <label class="col-md-2" for="website"><?php echo $wo['lang']['website']; ?></label>  
            <div class="col-md-6">
               <input id="website" name="website" type="text" class="form-control input-md" value="<?php echo $wo['setting']['website'];?>">
            </div>
         </div>
         <!-- Text input-->
         <div class="form-group">
            <label class="col-md-2" for="school"><?php echo $wo['lang']['school']; ?></label>  
            <div class="col-md-6">
               <input id="school" name="school" type="text" class="form-control input-md" value="<?php echo $wo['setting']['school'];?>">
            </div>
         </div>
         <!-- Text input-->
         <div class="form-group">
            <label class="col-md-2" for="working"><?php echo $wo['lang']['working_at']; ?></label>  
            <div class="col-md-3">
               <input id="working" name="working" type="text" class="form-control input-md" value="<?php echo $wo['setting']['working'];?>">
               <span class="help-block">(e.g Apple)</span>
            </div>
            <div class="col-lg-3">
               <input id="working_link" name="working_link" type="text" class="form-control input-md" value="<?php echo $wo['setting']['working_link'];?>">
               <span class="help-block"><?php echo $wo['lang']['company_website']; ?></span>
            </div>
         </div>
         
         <!-- Select Basic -->
         <div class="form-group">
            <label class="col-md-2" for="relationship"><?php echo $wo['lang']['relationship']; ?></label>
            <div class="col-md-6">
               <select id="relationship" name="relationship" class="form-control">
                  <option value="0"><?php echo $wo['lang']['none']; ?></option>
                  <?php 
                  foreach ($wo['relationship'] as $relationship_ids => $relationship) { 
                    $relationship_id = $wo['setting']['relationship_id'];
                    $selected_relationship = ($relationship_ids == $relationship_id) ? ' selected' : '' ;
                  ?>
                  <option value="<?php echo $relationship_ids;?>" <?php echo $selected_relationship;?> ><?php echo $relationship;?></option>
                  <?php } ?>
               </select>
            </div>
         </div>
         <hr>
         <div class="form-group last-btn">
            <label class="col-md-2"></label>  
            <div class="col-sm-3">
               <button type="submit" class="form-control btn-main">
               <i class="fa fa-floppy-o progress-icon" data-icon="floppy-o"></i> <?php echo $wo['lang']['save']; ?>
               </button>
            </div>
         </div>
         <input type="hidden" name="user_id" id="user-id" value="<?php echo $wo['setting']['user_id'];?>">
      </fieldset>
   </form>
</div>
</div>

<script type="text/javascript">
$(function() {
  $('form.setting-profile-form').ajaxForm({
    url: Wo_Ajax_Requests_File() + '?f=update_profile_setting',
    beforeSend: function() {
      Wo_progressIconLoader($('form.setting-profile-form').find('button'));
    },
    success: function(data) {
      if (data.status == 200) {
        <?php if($wo['user']['user_id'] == $wo['setting']['user_id']) { ?>
        if (data.first_name != '' || data.last_name != '') {
          $('[id^=user-full-name]').text(data.first_name + ' ' + data.last_name);
        }
        <?php } ?>
        scrollToTop();
        $('.setting-profile-alert').html('<div class="alert alert-success">' + data.message + '</div>');
        $('.alert-success').fadeIn('fast', function() {
          $(this).delay(2500).slideUp(500, function() {
            $(this).remove();
          });
        });
      } else if (data.errors) {
        var errors = data.errors.join("<br>");
        scrollToTop();
        $('.setting-profile-alert').html('<div class="alert alert-danger">' + errors + '</div>');
        $('.alert-danger').fadeIn(300);
      }
      Wo_progressIconLoader($('form.setting-profile-form').find('button'));
    }
  });
});
  var pac_input = document.getElementById('address');
  (function pacSelectFirst(input) {
    // store the original event binding function
    var _addEventListener = (input.addEventListener) ? input.addEventListener : input.attachEvent;
    function addEventListenerWrapper(type, listener) {
      // Simulate a 'down arrow' keypress on hitting 'return' when no pac suggestion is selected,
      // and then trigger the original listener.
      if(type == "keydown") {
        var orig_listener = listener;
        listener = function (event) {
          var suggestion_selected = $(".pac-item-selected").length > 0;
          if(event.which == 13 && !suggestion_selected) {
            var simulated_downarrow = $.Event("keydown", {
              keyCode: 40,
              which: 40
            });
            orig_listener.apply(input, [simulated_downarrow]);
          }
          orig_listener.apply(input, [event]);
        };
      }
      // add the modified listener
      _addEventListener.apply(input, [type, listener]);
    }
    if(input.addEventListener)
      input.addEventListener = addEventListenerWrapper;
    else if(input.attachEvent)
      input.attachEvent = addEventListenerWrapper;
  })(pac_input);

  $(function () {
     var autocomplete = new google.maps.places.Autocomplete(pac_input);
  });
</script>