<? global $lang; ?>
<div id="user-panel">
  <?= \Tpl::view( 'globelus/firms/_partials/menu', [
    'active' => 'moj-profil'
  ] );?>
  </div>
  <div class="mini-box fluid">
    <div class="title">
      <?= ucfirst($lang['edycja-profilu']); ?>
    </div>
    <div class="row">
      <div class="col-12">
        <div class="content profil">
          <form method="POST" action="/globelusFirms/data_save/" enctype="multipart/form-data" id="profile_edit">
            <div class="step-title">
              <?= $lang['pracodawca-profil-krok-1-opis']; ?>
            </div>
            <div class="row">
              <div class="col-12">
                <div class="form-group row">
                  <label form="firm_name" class="col-12 col-sm-4"><?= ucfirst($lang['nazwa-firmy']); ?>:</label>
                  <div class="col-12 col-sm-8">
                    <input type="text" id="firm_name" name="firm_name" required class="form-control" value="<?= htmlspecialchars($this->g_user['firm_name']); ?>">
                  </div>
                </div>
              </div>
              <div class="col-12">
                <div class="form-group row">
                  <label form="firm_name_profile" class="col-12 col-sm-4"><?= ucfirst($lang['nazwa-firmy-publikowana-na-portalu']); ?>:</label>
                  <div class="col-12 col-sm-8">
                    <input type="text" id="firm_name_profile" name="firm_name_profile" required class="form-control" value="<?= htmlspecialchars($this->g_user['firm_name_profile']); ?>">
                  </div>
                </div>
              </div>
              <div class="col-12">
                <div class="form-group row">
                  <label form="nip" class="col-12 col-sm-4"><?= ucfirst($lang['numer-identyfikacji-podatkowej']); ?>:</label>
                  <div class="col-12 col-sm-8">
                    <input type="text" id="nip_vat" name="nip_vat" class="form-control" required value="<?= htmlspecialchars($this->g_user['nip_vat']); ?>">
                  </div>
                </div>
              </div>
            </div>
            <hr />
            <div class="step-title">
              <?= $lang['pracodawca-profil-krok-2-opis']; ?>
            </div>
            <div class="row">
              <div class="col-12 col-sm-6">
                <div class="form-group row">
                  <label form="phone" class="col-12 col-sm-4"><?= ucfirst($lang['telefon']); ?></label>
                  <div class="col-12 col-sm-8">
                    <input type="text" name="phone" class="form-control" required value="<?= htmlspecialchars($this->g_user['phone']); ?>">
                  </div>
                </div>
              </div>
              <div class="col-12 col-sm-6">
                <div class="form-group row">
                  <label form="email" class="col-12 col-sm-4"><?= ucfirst($lang['adres-email']); ?></label>
                  <div class="col-12 col-sm-8">
                    <input type="text" name="email" class="form-control" readonly="readonly" value="<?= htmlspecialchars($this->g_user['email']); ?>">
                  </div>
                </div>
              </div>
            </div>
            <div class="row">
              <div class="col-12 col-sm-6">
                <div class="form-group row">
                  <label form="www" class="col-12 col-sm-4"><?= ucfirst($lang['strona-www']); ?></label>
                  <div class="col-12 col-sm-8">
                    <input type="text" name="www" class="form-control" value="<?= htmlspecialchars($this->g_user['www']); ?>">
                  </div>
                </div>
              </div>
            </div>
            <hr />
            <div class="step-title">
              <?= $lang['pracodawca-profil-krok-3-opis']; ?>
            </div>
            <div class="row">
              <div class="col-12 col-sm-6">
                <div class="form-group row">
                  <label form="country_id" class="col-12 col-sm-4"><?= ucfirst($lang['kraj']); ?></label>
                  <div class="col-12 col-sm-8">
                    <select name="country_id" class="form-control" required placeholder="<?= $lang['kraj']; ?>">
                      <option value="">--- <?= $lang['wybierz']; ?> ---</option>
                      <?
                      $countries = \front\factory\Globelus::countries();
                      if (is_array($countries)) : foreach ($countries as $country) : ?>
                          <option value="<?= $country['id']; ?>" <? if ($this->g_user['country_id'] == $country['id']) : ?>selected="selected" <? endif; ?>><?= $country['name']; ?></option>
                      <? endforeach;
                      endif;
                      ?>
                    </select>
                  </div>
                </div>
              </div>
              <div class="col-12 col-sm-6">
                <div class="form-group row">
                  <label form="region" class="col-12 col-sm-4"><?= ucfirst($lang['region']); ?>/<?= ucfirst($lang['wojewodztwo']); ?></label>
                  <div class="col-12 col-sm-8">
                    <input type="text" name="region" required class="form-control" value="<?= htmlspecialchars($this->g_user['region']); ?>">
                  </div>
                </div>
              </div>
            </div>
            <div class="row">
              <div class="col-12 col-sm-6">
                <div class="form-group row">
                  <label form="city" class="col-12 col-sm-4"><?= ucfirst($lang['miasto']); ?></label>
                  <div class="col-12 col-sm-8">
                    <input type="text" name="city" required class="form-control" value="<?= htmlspecialchars($this->g_user['city']); ?>">
                  </div>
                </div>
              </div>
              <div class="col-12 col-sm-6">
                <div class="form-group row">
                  <label form="postal_code" class="col-12 col-sm-4"><?= ucfirst($lang['kod-pocztowy']); ?></label>
                  <div class="col-12 col-sm-8">
                    <input type="text" name="postal_code" required class="form-control" value="<?= htmlspecialchars($this->g_user['postal_code']); ?>">
                  </div>
                </div>
              </div>
            </div>
            <div class="row">
              <div class="col-12 col-sm-6">
                <div class="form-group row">
                  <label form="street" class="col-12 col-sm-4"><?= ucfirst($lang['ulica']); ?></label>
                  <div class="col-12 col-sm-8">
                    <input type="text" name="street" required class="form-control" value="<?= htmlspecialchars($this->g_user['street']); ?>">
                  </div>
                </div>
              </div>
              <div class="col-12 col-sm-6">
                <div class="form-group row">
                  <label form="apartment_number" required class="col-12 col-sm-4"><?= ucfirst($lang['nr-budynku-lokalu']); ?></label>
                  <div class="col-12 col-sm-8">
                    <input type="text" name="apartment_number" class="form-control" value="<?= htmlspecialchars($this->g_user['apartment_number']); ?>">
                  </div>
                </div>
              </div>
            </div>
            <hr />
            <div class="step-title">
              <?= $lang['pracodawca-profil-krok-4-opis']; ?>
            </div>
            <div class="row">
              <div class="col-12 col-md-6">
                <div class="form-group row">
                  <label form="logo" class="col-12 col-sm-4"><?= ucfirst($lang['logo']); ?> (max. 1mb):</label>
                  <div class="col-12 col-sm-8 pt10">
                    <input type="file" id="logo" name="logo">
                  </div>
                </div>
              </div>
              <div class="col-12 col-md-6">
                  <div class="img_logo">
                    <? if (file_exists(\front\factory\GlobelusFirms::logo_url($this->g_user['id']))) :?>
                      <img src="/logo/<?= $this->g_user['id']; ?>/<?= \S::get_token(); ?>" style="max-width: 200px;">
                      <a class="btn btn-danger img_logo_delete" href="#">Usuń zdjęcie</a>
                    <? endif; ?>
                  </div>
                </div>
            </div>
            <hr />
            <div class="step-title">
              Zdjęcie nad ogłoszeniem
              <p><span><small><strong>Uwaga! Jest to grafika dodatkowa, NIE logo, będzie widoczna automatycznie we wszystkich ogłoszeniach publikowanych z tego profilu, ale w momencie dodawania ogłoszenia będzie można ją zmienić. Zalecany rozmiar 730px x 200px.</strong></small></span></p>
            </div>
            <div class="row">
              <div class="col-12 col-md-6">
                <div class="form-group row">
                  <label form="img-header" class="col-12 col-sm-4">Zdjęcie (max. 1mb):</label>
                  <div class="col-12 col-sm-8 pt10">
                    <input type="file" id="img-header" name="img-header">
                  </div>
                </div>
              </div>
              <div class="col-12 col-md-6">
                <div class="img_header">
                  <? if (file_exists(\front\factory\GlobelusFirms::img_header_url($this->g_user['id']))) :?>
                    <img src="/img_header/<?= $this->g_user['id']; ?>/<?= \S::get_token(); ?>" style="max-width: 200px;">
                    <a class="btn btn-danger img_header_delete" href="#">Usuń zdjęcie</a>
                  <? endif; ?>
                </div>
              </div>
            </div>
            <hr />
            <hr />
            <div class="step-title">
              Zdjęcie pod ogłoszeniem
              <p>
                <span>
                  <small>
                    <strong>Uwaga! Jest to grafika dodatkowa, NIE logo, będzie widoczna automatycznie we wszystkich ogłoszeniach publikowanych z tego profilu, ale w momencie dodawania ogłoszenia będzie można ją zmienić. Zalecany rozmiar 730px x 200px.</strong>
                  </small>
                </span>
              </p>
            </div>
            <div class="row">
              <div class="col-12 col-md-6">
                <div class="form-group row">
                  <label form="img-bottom" class="col-12 col-sm-4">Zdjęcie (max. 1mb):</label>
                  <div class="col-12 col-sm-8 pt10">
                    <input type="file" id="img-bottom" name="img-bottom">
                  </div>
                </div>
              </div>
              <div class="col-12 col-md-6">
                <div class="img_bottom">
                  <? if (file_exists(\front\factory\GlobelusFirms::img_bottom_url($this->g_user['id']))) :?>
                    <img src="/img_bottom/<?= $this->g_user['id']; ?>/<?= \S::get_token(); ?>" style="max-width: 200px;">
                    <a class="btn btn-danger img_bottom_delete" href="#">Usuń zdjęcie</a>
                  <? endif; ?>
                </div>
              </div>
            </div>
            <hr />
            <div class="step-title">
              <?= ucfirst($lang['krotki-opis-firmy']); ?>
            </div>
            <div class="row">
              <div class="col-12">
                <div class="form-group row">
                  <div class="col-12">
                    <textarea name="other_information" id="other_information"><?= $this->g_user['other_information']; ?></textarea>
                  </div>
                </div>
              </div>
            </div>
            <hr />
            <div class="step-title">
              <?= ucfirst(\S::lang('osoby-do-kontaktu')); ?>
              <p><span><small>Ważna informacja: dane osób rekrutujących będą widoczne jednocześnie we wszystkich ogłoszeniach publikowanych z tego profilu, ale w momencie dodawania ogłoszenia będzie można je zedytować.</small></span></p>
            </div>
            <div class="row">
              <div class="col-12 col-md-6">
                <div class="row">
                  <div class="col-12">
                    <div class="form-group row">
                      <label form="contact_person_1" class="col-12 col-sm-4"><?= ucfirst($lang['osoba-do-kontaktu']); ?>:</label>
                      <div class="col-12 col-sm-8">
                        <input type="text" class="form-control" name="contact_person_1" value="<?= htmlspecialchars($this->g_user['contact_person_1']); ?>">
                      </div>
                    </div>
                  </div>
                </div>
                <div class="row">
                  <div class="col-12">
                    <div class="form-group row">
                      <label form="email_1" class="col-12 col-sm-4"><?= ucfirst($lang['email']); ?>:</label>
                      <div class="col-12 col-sm-8">
                        <input type="text" class="form-control" name="email_1" value="<?= htmlspecialchars($this->g_user['email_1']); ?>">
                      </div>
                    </div>
                  </div>
                </div>
                <div class="row">
                  <div class="col-12">
                    <div class="form-group row">
                      <label form="phone_1" class="col-12 col-sm-4"><?= ucfirst($lang['telefon']); ?>:</label>
                      <div class="col-12 col-sm-8">
                        <input type="text" class="form-control" name="phone_1" value="<?= htmlspecialchars($this->g_user['phone_1']); ?>">
                      </div>
                    </div>
                  </div>
                </div>
              </div>
              <div class="col-12 col-md-6">
                <div class="row">
                  <div class="col-12">
                    <div class="form-group row">
                      <label form="contact_person_2" class="col-12 col-sm-4"><?= ucfirst($lang['osoba-do-kontaktu']); ?>:</label>
                      <div class="col-12 col-sm-8">
                        <input type="text" class="form-control" name="contact_person_2" value="<?= htmlspecialchars($this->g_user['contact_person_2']); ?>">
                      </div>
                    </div>
                  </div>
                </div>
                <div class="row">
                  <div class="col-12">
                    <div class="form-group row">
                      <label form="email_2" class="col-12 col-sm-4"><?= ucfirst($lang['email']); ?>:</label>
                      <div class="col-12 col-sm-8">
                        <input type="text" class="form-control" name="email_2" value="<?= htmlspecialchars($this->g_user['email_2']); ?>">
                      </div>
                    </div>
                  </div>
                </div>
                <div class="row">
                  <div class="col-12">
                    <div class="form-group row">
                      <label form="phone_2" class="col-12 col-sm-4"><?= ucfirst($lang['telefon']); ?>:</label>
                      <div class="col-12 col-sm-8">
                        <input type="text" class="form-control" name="phone_2" value="<?= htmlspecialchars($this->g_user['phone_2']); ?>">
                      </div>
                    </div>
                  </div>
                </div>
              </div>
            </div>
            <div class="row">
              <div class="col-12 col-md-6">
                <div class="form-group row">
                  <div class="col-12 mt20">
                    <a href="/panel-pracodawcy/profil" class="btn btn-danger mr15"><?= ucfirst($lang['anuluj']); ?></a>
                    <input type="submit" value="<?= ucfirst($lang['zatwierdz-zmiany']); ?>" class="btn btn-success">
                  </div>
                </div>
              </div>
            </div>
          </form>
        </div>
      </div>
    </div>
  </div>
</div>
<link class="footer" rel="stylesheet" type="text/css" href="/libraries/framework/vendor/plugins/datepicker/css/bootstrap-datetimepicker.css">
<link class="footer" rel="stylesheet" type="text/css" href="/plugins/selectize/css/selectize.bootstrap3.css">
<link class="footer" rel="stylesheet" type="text/css" href="/plugins/summernote/summernote-lite.css">
<script class="footer" type="text/javascript" src="/plugins/summernote/summernote-lite.js"></script>
<script class="footer" type="text/javascript" src="/plugins/summernote/lang/summernote-pl-PL.js"></script>
<script class="footer" type="text/javascript" src="/libraries/framework/vendor/plugins/moment/moment.js"></script>
<script class="footer" type="text/javascript" src="/libraries/framework/vendor/plugins/moment/pl.js"></script>
<script class="footer" type="text/javascript" src="/libraries/framework/vendor/plugins/datepicker/js/bootstrap-datetimepicker.js"></script>
<script class="footer" type="text/javascript" src="/plugins/selectize/js/selectize.js"></script>
<script class="footer" type="text/javascript">

  // Sprawdzanie proporcji width / height
  function isValidRatio({ width, height }) {
    const ratio = width / height;
    return ratio >= 2.6667 && ratio <= 8.0;
  }

  function getImageSize(file) {
    return new Promise((resolve, reject) => {
      const img = new Image();
      img.onload = function () {
        resolve({ width: this.naturalWidth, height: this.naturalHeight });
      };
      img.onerror = reject;

      const reader = new FileReader();
      reader.onload = function (e) {
        img.src = e.target.result;
      };
      reader.readAsDataURL(file);
    });
  }

  function showAlert(message) {
    $.alert({
      title: '<?= ucfirst($lang['blad']); ?>',
      icon: 'fa fa-exclamation',
      content: message,
      type: 'blue',
      closeIcon: true,
      closeIconClass: 'fa fa-close',
      typeAnimated: true,
      animation: 'opacity',
      autoClose: 'confirm|10000',
      columnClass: 'large',
      theme: 'modern',
      buttons: {
        confirm: {
          text: '<?= $lang['zamknij']; ?>',
          btnClass: 'btn-blue',
          keys: ['enter'],
          action: function () {}
        }
      }
    });
  }

  $('body').on('submit', '#profile_edit', function(e) {
    e.preventDefault();

    const logoInput = $('#logo')[0];
    const headerInput = $('#img-header')[0];
    const bottomInput = $('#img-bottom')[0];

    if (
      logoInput &&
      logoInput.files &&
      logoInput.files.length &&
      logoInput.files[0].size >= 125000
    ) {
      showAlert('<?= $lang['plik-logo-jest-zbyt-duzy']; ?>');
      return;
    }

    const imageChecks = [];

    if (headerInput && headerInput.files && headerInput.files.length) {
      imageChecks.push(getImageSize(headerInput.files[0]).then(size => {
        if (!isValidRatio(size)) {
          showAlert( 'Zdjęcie nad ogłoszeniem ma nieprawidłowe proporcje. Proporcje obrazu muszą mieścić się w przedziale 2.66:1 i 8:1.' );
          throw new Error('header');
        }
      }));
    }

    if (bottomInput && bottomInput.files && bottomInput.files.length) {
      imageChecks.push(getImageSize(bottomInput.files[0]).then(size => {
        if (!isValidRatio(size)) {
          showAlert( 'Zdjęcie pod ogłoszeniem ma nieprawidłowe proporcje. Proporcje obrazu muszą mieścić się w przedziale 2.66:1 i 8:1.' );
          throw new Error('bottom');
        }
      }));
    }

    Promise.allSettled(imageChecks).then(results => {
      const hasError = results.some(r => r.status === 'rejected');

      if (hasError) {
        // showAlert( 'Wybrany obraz jest nieprawidłowy. Propocje obrazu muszą mieścić się w przedziale 2.66:1 i 8:1.' );
        return;
      }

      e.target.submit();
    });
  });

  $(function() {
    $('#other_information').summernote({
      height: 200,
      lang: 'pl-PL',
      toolbar: [
        ['font', ['bold', 'underline', 'clear']],
        ['para', ['ul', 'ol', 'paragraph']],
        ['table', ['table']]
      ]
    });

    $('#text').summernote({
      height: 200,
      lang: 'pl-PL',
      toolbar: [
        ['style', ['bold', 'italic', 'underline', 'clear']],
        ['font', ['strikethrough', 'superscript', 'subscript']],
        ['fontsize', ['fontsize']],
        ['height', ['height']],
        ['color', ['color']],
        ['para', ['ul', 'ol', 'paragraph']],
        ['table', ['table']]
      ]
    });

    $('body').on(click_event, '.input-icon .fa', function() {
      $(this).parent().children('input').focus();
    });

    $('body').on(click_event, '#inexperience', function() {
      if ($(this).is(':checked'))
        $('.positions_0 input, .positions_0 select').removeAttr('required').attr('readonly', 'readonly');
      else
        $('.positions_0 input, .positions_0 select').attr('required', 'required').removeAttr('readonly');
    });

    $('input[type="text"].date').datetimepicker({
      format: "YYYY-MM-DD",
      pickTime: false
    });

    $('.countries').selectize({
      maxItems: 6
    });
  });

  /*usuwanie loga */
  $( function()
  {
    $( 'body' ).on( click_event, '.img_logo_delete', function()
    {
      $.alert(
      {
        title: '<?= ucfirst( $lang['potwierdz'] );?>',
        icon: 'fa fa-exclamation',
        content: 'Czy napewno chcesz usunąć logo?',
        closeIcon: true,
        closeIconClass: 'fa fa-close',
        typeAnimated: true,
        animation: 'opacity',
        columnClass: 'large',
        theme: 'modern',
        buttons:
        {
          cancel:
          {
            text: '<?= $lang['anuluj'];?>',
            action: function() {}
          },
          confirm:
          {
            text: '<?= $lang['zatwierdz'];?>',
            btnClass: 'btn-blue',
            keys: ['enter'],
            action: function()
            {
              $.ajax(
              {
                type: 'POST',
                url: '/globelusFirms/delete_logo/',
                data:
                  {
                    user_id: <?= $this -> g_user['id'];?>
                  },
                beforeSend: function() {},
                success: function( response )
                {
                  var data = jQuery.parseJSON( response );
                  if ( data.result == 'ok' ) {
                    const img_logo = document.querySelector(".img_logo");
                    img_logo.classList.add("img-hide");
                  }
                }
              });
            }
          }
        }
      });
    });
  });

/*usuwanie zdjecia header */
  $( function()
  {
    $( 'body' ).on( click_event, '.img_header_delete', function()
    {
      $.alert(
      {
        title: '<?= ucfirst( $lang['potwierdz'] );?>',
        icon: 'fa fa-exclamation',
        content: 'Czy napewno chcesz usunąć zdjęcie górne?',
        closeIcon: true,
        closeIconClass: 'fa fa-close',
        typeAnimated: true,
        animation: 'opacity',
        columnClass: 'large',
        theme: 'modern',
        buttons:
        {
          cancel:
          {
            text: '<?= $lang['anuluj'];?>',
            action: function() {}
          },
          confirm:
          {
            text: '<?= $lang['zatwierdz'];?>',
            btnClass: 'btn-blue',
            keys: ['enter'],
            action: function()
            {
              $.ajax(
              {
                type: 'POST',
                url: '/globelusFirms/delete_img_header/',
                data:
                  {
                    user_id: <?= $this -> g_user['id'];?>
                  },
                beforeSend: function() {},
                success: function( response )
                {
                  var data = jQuery.parseJSON( response );
                  if ( data.result == 'ok' ) {
                    const img_header = document.querySelector(".img_header");
                    img_header.classList.add("img-hide");
                  }
                }
              });
            }
          }
        }
      });
    });
  });

/*usuwanie zdjecia bottom */
  $( function()
  {
    $( 'body' ).on( click_event, '.img_bottom_delete', function()
    {
      $.alert(
      {
        title: '<?= ucfirst( $lang['potwierdz'] );?>',
        icon: 'fa fa-exclamation',
        content: 'Czy napewno chcesz usunąć zdjęcie dolne?',
        closeIcon: true,
        closeIconClass: 'fa fa-close',
        typeAnimated: true,
        animation: 'opacity',
        columnClass: 'large',
        theme: 'modern',
        buttons:
        {
          cancel:
          {
            text: '<?= $lang['anuluj'];?>',
            action: function() {}
          },
          confirm:
          {
            text: '<?= $lang['zatwierdz'];?>',
            btnClass: 'btn-blue',
            keys: ['enter'],
            action: function()
            {
              $.ajax(
              {
                type: 'POST',
                url: '/globelusFirms/delete_img_bottom/',
                data:
                  {
                    user_id: <?= $this -> g_user['id'];?>
                  },
                beforeSend: function() {},
                success: function( response )
                {
                  var data = jQuery.parseJSON( response );
                  if ( data.result == 'ok' ) {
                    const img_bottom = document.querySelector(".img_bottom");
                    img_bottom.classList.add("img-hide");
                  }
                }
              });
            }
          }
        }
      });
    });
  });
</script>

