{% extends "base.html" %}
{% block content %}
<div class="card p-4 shadow-sm">
  <h2 class="mb-4">{{ _('Spiel bearbeiten') }}</h2>

  <!-- Flash-Nachrichten -->
  {% with messages = get_flashed_messages(with_categories=true) %}
    {% if messages %}
      <div class="flash-messages mb-4">
        {% for category, message in messages %}
          <div class="alert alert-{{ 'danger' if category == 'error' else category }} alert-dismissible fade show">
            {{ message|safe }}
            <button type="button" class="btn-close" data-bs-dismiss="alert"></button>
          </div>
        {% endfor %}
      </div>
    {% endif %}
  {% endwith %}

  <!-- Update Data Form (separate, outside main form, uses POST) -->
  <div class="mb-3 text-end">
  <form method="POST" action="{{ url_for('update_game_data', game_id=game.id) }}" id="updateDataForm">
    <input type="hidden" name="csrf_token" value="{{ csrf_token() }}">
    <!-- Ändere die ID für Eindeutigkeit -->
    <input type="hidden" name="steam_appid" id="itad_steam_appid" value="{{ game.steam_appid }}">
    <button type="submit" class="btn btn-secondary">
      🔄 {{ _('Update Data') }}
    </button>
  </form>
  <script>
  document.getElementById('updateDataForm').addEventListener('submit', function(e) {
    e.preventDefault();
    
    const currentAppId = document.getElementById('game_appid').value;
    
    document.getElementById('itad_steam_appid').value = currentAppId;
    
    this.submit();
  });
  </script>
  </div>

  <form method="POST" aria-label="{{ _('Spiel bearbeiten') }}">
    <input type="hidden" name="csrf_token" value="{{ csrf_token() }}">
    <div class="row g-3">
      <!-- Formularfelder -->
      <div class="col-md-6">
        <label class="form-label">{{ _('Name') }} <span class="text-danger">*</span></label>
        <input type="text" name="name" class="form-control" value="{{ game.name }}" required>
      </div>
      <div class="col-md-6">
        <label for="game_platform" class="form-label">{{ _('Platform') }} <span class="text-danger">*</span></label>
        <select id="game_platform" name="platform" class="form-select" required>
          {% for value, label in platforms %}
            <option value="{{ value }}" {% if game.platform == value %}selected{% endif %}>{{ _(label) }}</option>
          {% endfor %}
        </select>
      </div>
      <div class="col-md-6">
        <label for="game_status" class="form-label">{{ _('Status') }} <span class="text-danger">*</span></label>
        <select id="game_status" name="status" class="form-select" required>
          {% for value, label in statuses %}
            <option value="{{ value }}" {% if game.status == value %}selected{% endif %}>{{ _(label) }}</option>
          {% endfor %}
        </select>
      </div>
      <div class="col-md-6">
        <label class="form-label">{{ _('Steam Key') }} <span class="text-danger">*</span></label>
        <input type="text" name="steam_key" class="form-control" value="{{ game.steam_key }}" required>
      </div>
      <div class="col-md-6">
        <label for="game_appid" class="form-label">{{ _('Steam AppID') }}</label>
        <input type="text" id="game_appid" name="steam_appid" class="form-control" value="{{ game.steam_appid or '' }}">
        <small class="text-muted">
          {{ _('For GOG games: Enter the Steam AppID here to enable price tracking.') }}
        </small>
      </div>
      <div class="col-md-6">
        <label for="game_redeem_date" class="form-label">{{ _('Redeem by') }}</label>
        <input type="date" id="game_redeem_date" name="redeem_date" class="form-control" value="{{ game.redeem_date.strftime('%Y-%m-%d') if game.redeem_date else '' }}">
      </div>
      <div class="col-12">
        <label for="game_recipient" class="form-label">{{ _('Recipient') }}</label>
        <input type="text" id="game_recipient" name="recipient" class="form-control" value="{{ game.recipient }}">
      </div>
      <div class="col-12">
        <label for="game_url" class="form-label">{{ _('Shop URL') }}</label>
        <input type="url" id="game_url" name="url" class="form-control" value="{{ game.url }}">
      </div>
      <div class="col-12">
        <label for="game_notes" class="form-label">{{ _('Notes') }}</label>
        <textarea id="game_notes" name="notes" class="form-control" rows="3">{{ game.notes }}</textarea>
      </div>

      <!-- Show External Data -->
      <div class="col-12">
        <div class="card mb-4">
          <div class="card-header">
            <span>🔄 {{ _('External Data') }}</span>
          </div>
          <div class="card-body">
            {% if game.release_date %}
              <div class="mb-2">
                <strong>{{ _('Release Date:') }}</strong>
                {{ game.release_date|strftime('%d.%m.%Y') }}
              </div>
            {% endif %}
            {% if game.current_price %}
              <div class="text-center mb-2">
                <span class="badge bg-primary d-block">{{ _('Now') }}</span>
                <div class="fw-bold" style="font-size:1.1em;">
                  {{ "%.2f"|format(game.current_price) }} €
                </div>
              </div>
            {% endif %}
            {% if game.historical_low %}
              <div class="text-center">
                <span class="badge bg-secondary d-block">{{ _('Hist. Low') }}</span>
                <div class="fw-bold" style="font-size:1.1em;">
                  {{ "%.2f"|format(game.historical_low) }} €
                </div>
              </div>
            {% endif %}
            {% if game.itad_slug %}
              <a href="https://isthereanydeal.com/game/{{ game.itad_slug }}/info/" target="_blank" rel="noopener" class="btn btn-outline-info mt-2">
                🔗 {{ _('View on IsThereAnyDeal') }}
              </a>
            {% endif %}
          </div>
        </div>
      </div>

      <!-- Einlöse-Links -->
      {% if game.status == 'geschenkt' %}
        <div class="col-12">
          <div class="card mb-3">
            <div class="card-header">{{ _('Redeem-Link') }}</div>
            <div class="card-body">
              {% for token in game.redeem_tokens if not token.is_expired() %}
                <div class="input-group mb-3">
                  <input type="text" class="form-control" value="{{ url_for('redeem', token=token.token, _external=True) }}" readonly id="redeem-link-{{ loop.index }}">
                  <button type="button" class="btn btn-outline-secondary copy-btn" data-clipboard-target="#redeem-link-{{ loop.index }}">
                    {{ _('Copy') }}
                  </button>
                </div>
                <small class="text-muted">
                  {{ _('Expires at') }}: {{ token.expires.astimezone(local_tz).strftime('%d.%m.%Y %H:%M') }}
                </small>
              {% else %}
                <p class="text-muted mb-0">{{ _('No active redeem links') }}</p>
              {% endfor %}
            </div>
          </div>
        </div>
      {% endif %}

      <!-- Buttons -->
      <div class="col-12">
        <button type="submit" class="btn btn-primary">{{ _('Save') }}</button>
        <a href="{{ url_for('index') }}" class="btn btn-outline-secondary ms-2">{{ _('Cancel') }}</a>
        <a href="{{ url_for('game_details', game_id=game.id) }}" class="btn btn-info ms-2">🔍 {{ _('View Details') }}</a>
      </div>
    </div>
  </form>
</div>

<!-- Copy-JavaScript -->
<script>
  document.querySelectorAll('.copy-btn').forEach(btn => {
    btn.addEventListener('click', async function() {
      const input = document.querySelector(this.dataset.clipboardTarget);
      try {
        await navigator.clipboard.writeText(input.value);
        this.innerHTML = '✅ {{ _("Copied!") }}';
        setTimeout(() => this.innerHTML = '{{ _("Copy") }}', 2000);
      } catch (err) {
        this.innerHTML = '❌ {{ _("Error") }}';
        setTimeout(() => this.innerHTML = '{{ _("Copy") }}', 2000);
      }
    });
  });
</script>
{% endblock %}