{% extends "base.html" %}
{% block title %}Ustawienia - /etc/hosts Manager{% endblock %}
{% block extra_css %}
  {{ super() }}
  <style>
    .tooltip-inner {
      max-width: 300px;
      text-align: left;
    }
  </style>
{% endblock %}
{% block content %}
<div class="card mb-4">
  <div class="card-header">
    <h2>Ustawienia</h2>
  </div>
  <div class="card-body">
    <form method="post">
      <div class="mb-3 form-check">
        <input type="checkbox" class="form-check-input" id="auto_deploy" name="auto_deploy" {% if settings.auto_deploy_enabled %}checked{% endif %}>
        <label class="form-check-label" for="auto_deploy">Automatyczny deploy</label>
      </div>
      <div class="mb-3">
        <label for="deploy_cron" class="form-label">Harmonogram deploy (cron)</label>
        <div class="input-group">
          <input type="text" class="form-control" id="deploy_cron" name="deploy_cron" value="{{ settings.deploy_cron }}">
          <button type="button" class="btn btn-outline-secondary" onclick="openCronModal('deploy_cron')">Generuj cron</button>
        </div>
        <small class="text-muted">Np. <code>0 0 * * *</code> – codziennie o północy</small>
      </div>
      <div class="mb-3 form-check">
        <input type="checkbox" class="form-check-input" id="auto_backup" name="auto_backup" {% if settings.auto_backup_enabled %}checked{% endif %}>
        <label class="form-check-label" for="auto_backup">Automatyczne kopie zapasowe</label>
      </div>
      <div class="mb-3">
        <label for="backup_cron" class="form-label">Harmonogram backup (cron)</label>
        <div class="input-group">
          <input type="text" class="form-control" id="backup_cron" name="backup_cron" value="{{ settings.backup_cron }}">
          <button type="button" class="btn btn-outline-secondary" onclick="openCronModal('backup_cron')">Generuj cron</button>
        </div>
        <small class="text-muted">Np. <code>0 */6 * * *</code> – co 6 godzin</small>
      </div>
      <div class="mb-3 form-check">
        <input type="checkbox" class="form-check-input" id="enable_regex_entries" name="enable_regex_entries" {% if settings.regex_deploy_enabled %}checked{% endif %}>
        <label class="form-check-label" for="enable_regex_entries">Włącz regex/CIDR deploy</label>
      </div>
      <div class="mb-3">
        <label for="backup_retention_days" class="form-label">Ilość dni przechowywania backupów</label>
        <input type="number" class="form-control" id="backup_retention_days" name="backup_retention_days" value="{{ settings.backup_retention_days }}">
      </div>
      <button type="submit" class="btn btn-primary">Zapisz ustawienia</button>
    </form>
  </div>
</div>

<!-- Modal do generowania wyrażenia CRON -->
<div class="modal fade" id="cronModal" tabindex="-1" aria-labelledby="cronModalLabel" aria-hidden="true">
  <div class="modal-dialog">
    <div class="modal-content">
      <div class="modal-header">
        <h5 class="modal-title" id="cronModalLabel">Generuj wyrażenie CRON</h5>
        <button type="button" class="btn-close" data-bs-dismiss="modal" aria-label="Zamknij"></button>
      </div>
      <div class="modal-body">
        <div class="mb-3">
          <label for="cron_minute" class="form-label">Minuta</label>
          <input type="text" class="form-control" id="cron_minute" placeholder="0-59">
        </div>
        <div class="mb-3">
          <label for="cron_hour_modal" class="form-label">Godzina</label>
          <input type="text" class="form-control" id="cron_hour_modal" placeholder="0-23">
        </div>
        <div class="mb-3">
          <label for="cron_day" class="form-label">Dzień miesiąca</label>
          <input type="text" class="form-control" id="cron_day" placeholder="1-31 lub *">
        </div>
        <div class="mb-3">
          <label for="cron_month" class="form-label">Miesiąc</label>
          <input type="text" class="form-control" id="cron_month" placeholder="1-12 lub *">
        </div>
        <div class="mb-3">
          <label for="cron_dow" class="form-label">Dzień tygodnia</label>
          <input type="text" class="form-control" id="cron_dow" placeholder="0-6 (0 = niedziela) lub *">
        </div>
      </div>
      <div class="modal-footer">
        <button type="button" class="btn btn-secondary" data-bs-dismiss="modal">Anuluj</button>
        <button type="button" class="btn btn-primary" onclick="generateCronExpression()">Generuj</button>
      </div>
    </div>
  </div>
</div>
{% endblock %}

{% block extra_js %}
  {{ super() }}
  <script>
    // Globalna zmienna, która będzie przechowywać ID pola formularza do aktualizacji
    var currentCronField = null;
    
    function openCronModal(fieldId) {
      currentCronField = fieldId;
      // Resetuj wartości w modal
      document.getElementById('cron_minute').value = "";
      document.getElementById('cron_hour_modal').value = "";
      document.getElementById('cron_day').value = "";
      document.getElementById('cron_month').value = "";
      document.getElementById('cron_dow').value = "";
      // Wyświetl modal przy użyciu Bootstrap
      var cronModal = new bootstrap.Modal(document.getElementById('cronModal'));
      cronModal.show();
    }
    
    function generateCronExpression() {
      var minute = document.getElementById('cron_minute').value || "*";
      var hour = document.getElementById('cron_hour_modal').value || "*";
      var day = document.getElementById('cron_day').value || "*";
      var month = document.getElementById('cron_month').value || "*";
      var dow = document.getElementById('cron_dow').value || "*";
      
      var cronExpression = minute + " " + hour + " " + day + " " + month + " " + dow;
      if (currentCronField) {
        document.getElementById(currentCronField).value = cronExpression;
      }
      // Zamknij modal
      var modalEl = document.getElementById('cronModal');
      var modal = bootstrap.Modal.getInstance(modalEl);
      modal.hide();
    }
  </script>
{% endblock %}