{% extends "base.html" %}
{% block title %}Edytuj serwer - /etc/hosts Manager{% endblock %}
{% block extra_css %}
  {{ super() }}
  <style>
    .tooltip-inner {
      max-width: 300px;
      text-align: left;
    }

    /* Domyślnie ukrywamy te kontenery. JS je włącza zależnie od opcji. */
    #hostPortFields,
    #userPassFields,
    #sshKeyFields,
    #daemonFields {
      display: none;
    }
  </style>
{% endblock %}

{% block content %}
<div class="card mb-4">
  <div class="card-header">
    <h2>Edytuj serwer</h2>
  </div>
  <div class="card-body">
    <form method="POST" action="{{ url_for('edit_server', id=host.id) }}">

      <!-- 1) Platforma (Linux / Mikrotik) -->
      <div class="mb-3">
        <label for="host_type" class="form-label">Platforma (system)</label>
        <select name="host_type" id="host_type" class="form-select" required onchange="toggleSystemOptions()">
          <option value="linux" {% if host.type == 'linux' %}selected{% endif %}>Linux</option>
          <option value="mikrotik" {% if host.type == 'mikrotik' %}selected{% endif %}>Mikrotik</option>
        </select>
      </div>

      <!-- 2) Metoda uwierzytelniania -->
      <div class="mb-3">
        <label for="auth_method" class="form-label">Metoda uwierzytelniania</label>
        <select name="auth_method" id="auth_method" class="form-select" onchange="toggleAuthFields()">
          <option value="password"   {% if host.auth_method == 'password' %}selected{% endif %}>Hasło</option>
          <option value="ssh_key"    {% if host.auth_method == 'ssh_key' %}selected{% endif %}>Klucz SSH</option>
          <option value="global_key" {% if host.auth_method == 'global_key' %}selected{% endif %}>Globalny klucz SSH</option>
          <option value="daemon"     {% if host.use_daemon and host.type == 'linux' %}selected{% endif %}>Demon (Linux)</option>
        </select>
      </div>

      <!-- Kontener host + port -->
      <div id="hostPortFields">
        <div class="mb-3">
          <label for="hostname" class="form-label">Nazwa hosta (IP lub domena)</label>
          <input type="text" name="hostname" id="hostname" class="form-control" value="{{ host.hostname }}">
        </div>
        <div class="mb-3">
          <label for="port" class="form-label">Port</label>
          <input type="text" name="port" id="port" class="form-control" value="{{ host.port }}">
        </div>
      </div>

      <!-- Kontener user + hasło -->
      <div id="userPassFields">
        <div class="mb-3">
          <label for="username" class="form-label">Użytkownik</label>
          <input type="text" name="username" id="username" class="form-control" value="{{ host.username }}">
        </div>
        <div class="mb-3" id="passwordField">
          <label for="password" class="form-label">Hasło (pozostaw puste, aby nie zmieniać)</label>
          <input type="password" name="password" id="password" class="form-control" placeholder="Wprowadź nowe hasło">
        </div>
      </div>

      <!-- Kontener klucza SSH (ssh_key) -->
      <div id="sshKeyFields">
        <div class="mb-3">
          <label for="private_key" class="form-label">Klucz prywatny</label>
          <textarea name="private_key" id="private_key" rows="4" class="form-control">{{ host.private_key }}</textarea>
        </div>
        <div class="mb-3">
          <label for="key_passphrase" class="form-label">Hasło do klucza</label>
          <input type="password" name="key_passphrase" id="key_passphrase" class="form-control" value="{{ host.key_passphrase }}">
        </div>
      </div>

      <!-- Kontener demona -->
      <div id="daemonFields">
        <div class="form-check mb-3">
          <input class="form-check-input" type="checkbox" name="use_daemon" id="use_daemon" value="1"
                 {% if host.use_daemon %}checked{% endif %}>
          <label class="form-check-label" for="use_daemon">
            Korzystaj z demona (zamiast SSH) [Tylko Linux]
          </label>
        </div>
        <div class="mb-3">
          <label for="daemon_url" class="form-label">URL demona</label>
          <input type="text" name="daemon_url" id="daemon_url" class="form-control" value="{{ host.daemon_url }}">
        </div>
        <div class="mb-3">
          <label for="daemon_token" class="form-label">Token autoryzacyjny demona</label>
          <input type="text" name="daemon_token" id="daemon_token" class="form-control" value="{{ host.daemon_token }}">
        </div>
      </div>

      <!-- Nowe: wybór pliku /etc/hosts (preferred_hostfile_id) -->
      <div class="mb-3">
        <label for="preferred_hostfile_id" class="form-label">Domyślny plik /etc/hosts dla tego serwera</label>
        <select name="preferred_hostfile_id" id="preferred_hostfile_id" class="form-select">
          <!-- pusta wartość => None => "Default" -->
          <option value=""
            {% if not host.preferred_hostfile_id %}selected{% endif %}>
            (Default - brak)
          </option>
          {% for hf in user_hostfiles %}
            <option value="{{ hf.id }}"
              {% if host.preferred_hostfile_id == hf.id %}selected{% endif %}>
              {{ hf.title }}
            </option>
          {% endfor %}
        </select>
      </div>

      <button type="submit" class="btn btn-primary">Zapisz zmiany</button>
    </form>
  </div>
</div>

<div class="mt-3 text-center">
  <a href="{{ url_for('server_list') }}" class="btn btn-secondary">Lista serwerów</a>
  <a href="{{ url_for('import_servers') }}" class="btn btn-secondary">Importuj z CSV</a>
  <a href="{{ url_for('export_servers_to_csv') }}" class="btn btn-secondary">Eksportuj do CSV</a>
</div>
{% endblock %}

{% block extra_js %}
{{ super() }}
<script>
function toggleSystemOptions() {
  const hostType = document.getElementById('host_type').value;
  const authMethodSelect = document.getElementById('auth_method');
  const daemonOption = Array.from(authMethodSelect.options).find(opt => opt.value === 'daemon');

  // Mikrotik -> chowamy daemon
  if (hostType === 'mikrotik') {
    if (daemonOption) {
      daemonOption.style.display = 'none';
      if (authMethodSelect.value === 'daemon') {
        authMethodSelect.value = 'password';
      }
    }
  } else {
    // Linux -> pokazujemy
    if (daemonOption) {
      daemonOption.style.display = 'block';
    }
  }
  toggleAuthFields();
}

function toggleAuthFields() {
  const hostType = document.getElementById('host_type').value;
  const authMethod = document.getElementById('auth_method').value;

  const hostPortFields = document.getElementById('hostPortFields');
  const userPassFields = document.getElementById('userPassFields');
  const passwordField  = document.getElementById('passwordField');
  const sshKeyFields   = document.getElementById('sshKeyFields');
  const daemonFields   = document.getElementById('daemonFields');
  const useDaemon      = document.getElementById('use_daemon');

  // Najpierw wszystko chowamy
  hostPortFields.style.display = 'none';
  userPassFields.style.display = 'none';
  passwordField.style.display  = 'none';
  sshKeyFields.style.display   = 'none';
  daemonFields.style.display   = 'none';
  if (useDaemon) {
    useDaemon.checked = false;
  }

  // Gdy authMethod != 'daemon', włącz hostPort
  if (authMethod !== 'daemon') {
    hostPortFields.style.display = 'block';
  }

  // Szczegółowe reguły
  if (authMethod === 'password') {
    userPassFields.style.display = 'block';
    passwordField.style.display  = 'block';
  } else if (authMethod === 'ssh_key') {
    userPassFields.style.display = 'block';
    sshKeyFields.style.display   = 'block';
  } else if (authMethod === 'global_key') {
    userPassFields.style.display = 'block';
  } else if (authMethod === 'daemon') {
    if (hostType === 'linux') {
      daemonFields.style.display = 'block';
      if (useDaemon) {
        useDaemon.checked = true;
      }
    }
  }
}

// Uruchamiamy przy ładowaniu
document.addEventListener('DOMContentLoaded', function() {
  toggleSystemOptions();
});
</script>
{% endblock %}