{% extends 'admin/custom_base.html' %}

{% block body %}
<div class="container-fluid mt-3">
  <div class="d-flex align-items-center mb-3">
    <h3 class="mb-0 mr-3">Store</h3>
    <small class="text-muted">Rotates every 12 hours &mdash; <strong id="countdown"></strong> remaining</small>
    {% if SCOPE_ADMIN in scopes %}
    <form method="post" class="ml-2">
      <input type="hidden" name="action_type" value="reroll">
      <button type="submit" class="btn btn-warning btn-sm">Reroll Now</button>
    </form>
    {% endif %}
  </div>

  {% with messages = get_flashed_messages(with_categories=true) %}
    {% for cat, msg in messages %}
    <div class="alert alert-{{ 'success' if cat == 'success' else 'danger' }} alert-dismissible">
      {{ msg }}<button type="button" class="close" data-dismiss="alert">&times;</button>
    </div>
    {% endfor %}
  {% endwith %}

  {% if SCOPE_ADMIN in scopes %}
  <div class="card mb-4">
    <div class="card-header d-flex justify-content-between align-items-center">
      <strong>Pinned Items</strong>
      <form method="post" class="d-inline">
        <input type="hidden" name="action_type" value="unpin">
        <input type="hidden" name="slot" value="all">
        <button type="submit" class="btn btn-outline-danger btn-sm">Clear All Pins</button>
      </form>
    </div>
    <div class="card-body">
      {% set rarity_colors = {0:'secondary',1:'primary',2:'info',3:'warning',4:'warning',5:'danger'} %}
      {% set rarity_names = {0:'Common',1:'Uncommon',2:'Rare',3:'Epic',4:'Legendary',5:'Mythic'} %}
      <div class="row mb-3">
        {% for entry in featured %}
        {% set fitem = all_items | selectattr('GiftDropId', 'equalto', entry.gift_drop_id) | first %}
        {% if fitem %}
        <div class="col-md-3 mb-2">
          <div class="card border-warning">
            <div class="card-body py-2 px-3">
              <div class="d-flex justify-content-between align-items-start">
                <div>
                  <span class="badge badge-warning mb-1">Slot {{ entry.slot }}</span>
                  <span class="badge badge-{{ rarity_colors.get(fitem.Rarity, 'secondary') }} mb-1">{{ rarity_names.get(fitem.Rarity, '') }}</span>
                  <div class="font-weight-bold small">{{ fitem.FriendlyName }}</div>
                  <div class="text-muted" style="font-size:.7rem">#{{ fitem.GiftDropId }}</div>
                </div>
                <form method="post" class="ml-2">
                  <input type="hidden" name="action_type" value="unpin">
                  <input type="hidden" name="slot" value="{{ entry.slot }}">
                  <button type="submit" class="btn btn-outline-danger btn-sm px-1 py-0">&times;</button>
                </form>
              </div>
            </div>
          </div>
        </div>
        {% endif %}
        {% else %}
        <div class="col-12"><span class="text-muted small">No pinned items. Pinned items always appear in the store regardless of rotation.</span></div>
        {% endfor %}
      </div>

      <form method="post" class="form-inline">
        <input type="hidden" name="action_type" value="pin">
        <div class="form-group mr-2">
          <label class="mr-1 small">Slot (0–7)</label>
          <input type="number" name="slot" min="0" max="7" value="0" class="form-control form-control-sm" style="width:70px">
        </div>
        <div class="form-group mr-2 flex-grow-1">
          <label class="mr-1 small">Item</label>
          <select name="gift_drop_id" class="form-control form-control-sm" style="max-width:400px">
            <option value="">— select —</option>
            {% for item in all_items %}
            <option value="{{ item.GiftDropId }}">{{ item.FriendlyName }} (#{{ item.GiftDropId }}, {{ rarity_names.get(item.Rarity, '?') }})</option>
            {% endfor %}
          </select>
        </div>
        <button type="submit" class="btn btn-primary btn-sm">Pin Item</button>
      </form>
    </div>
  </div>
  {% endif %}

  <h5 class="mb-3">Current Rotation ({{ current | length }} items)</h5>
  <div class="row">
    {% for item in current %}
    <div class="col-md-3 col-sm-4 mb-3">
      <div class="card h-100 {% if item.GiftDropId in featured | map(attribute='gift_drop_id') | list %}border-warning{% endif %}">
        <div class="card-body">
          {% set rarity_colors = {0:'secondary',1:'primary',2:'info',3:'warning',4:'warning',5:'danger'} %}
          <span class="badge badge-{{ rarity_colors.get(item.Rarity, 'secondary') }} mb-2">
            {% set rarity_names = {0:'Common',1:'Uncommon',2:'Rare',3:'Epic',4:'Legendary',5:'Mythic'} %}
            {{ rarity_names.get(item.Rarity, item.Rarity) }}
          </span>
          {% if item.GiftDropId in featured | map(attribute='gift_drop_id') | list %}
          <span class="badge badge-warning mb-2">Pinned</span>
          {% endif %}
          <h6 class="card-title">{{ item.FriendlyName }}</h6>
          <p class="card-text text-muted small">{{ item.Tooltip }}</p>
          {% if item.ConsumableItemDesc %}
          <div><small class="text-info">Consumable: {{ item.ConsumableItemDesc }}</small></div>
          {% endif %}
          {% if item.AvatarItemDesc %}
          <div><small class="text-muted" style="font-size:.7rem;word-break:break-all">{{ item.AvatarItemDesc[:40] }}…</small></div>
          {% endif %}
        </div>
        <div class="card-footer d-flex justify-content-between align-items-center">
          <span class="font-weight-bold">{{ rarity_prices.get(item.Rarity, 150) }} tokens</span>
          <small class="text-muted">#{{ item.GiftDropId }}</small>
        </div>
      </div>
    </div>
    {% endfor %}
  </div>

  <p class="text-muted mt-2">Seed offset: {{ seed_offset }}</p>
</div>

<script>
const secsLeft = {{ secs_left }};
function updateCountdown() {
  const s = Math.max(0, secsLeft - Math.floor((Date.now()/1000) % 86400));
  const h = Math.floor(s / 3600), m = Math.floor((s % 3600) / 60);
  document.getElementById('countdown').textContent = h + 'h ' + m + 'm';
}
updateCountdown();
setInterval(updateCountdown, 30000);
</script>
{% endblock %}