{% extends 'admin/model/list.html' %}

{% block body %}
{% if saved_searches is defined %}
<div class="d-flex align-items-center mb-2" style="gap: 8px;">
  <strong style="margin-right: 4px;">
    <i class="fa fa-bookmark"></i> Saved Searches:
  </strong>
  {% if saved_searches %}
    {% for preset in saved_searches %}
      <div class="btn-group btn-group-sm" role="group">
        <a href="{{ preset.path }}{% if preset.query_string %}?{{ preset.query_string }}{% endif %}"
           class="btn btn-sm btn-outline-primary"
           title="{{ preset.owner_email }}{% if preset.shared %} (shared){% endif %}">
          {{ preset.name }}{% if preset.shared %} <i class="fa fa-share-alt fa-xs"></i>{% endif %}
        </a>
        {% if preset.owner_email == current_user.email or current_user.global_admin %}
        <form method="POST" action="{{ url_for('.delete_preset', preset_id=preset.id) }}"
              style="display:inline; margin:0;"
              onsubmit="return confirm('Delete preset &quot;{{ preset.name }}&quot;?');">
          <input type="hidden" name="csrf_token" value="{{ csrf_token() }}">
          <button type="submit" class="btn btn-sm btn-outline-danger"
                  title="Delete this preset"
                  style="padding: 0.15rem 0.4rem;">
            <i class="fa fa-times"></i>
          </button>
        </form>
        {% endif %}
      </div>
    {% endfor %}
  {% else %}
    <span class="text-muted" style="font-size: 0.9rem;">none yet</span>
  {% endif %}
  <button type="button" class="btn btn-sm btn-outline-secondary"
          data-toggle="modal" data-target="#savePresetModal"
          style="margin-left: auto;">
    <i class="fa fa-plus"></i> Save current filter
  </button>
</div>

<div class="modal fade" id="savePresetModal" tabindex="-1" role="dialog">
  <div class="modal-dialog" role="document">
    <div class="modal-content">
      <form method="POST" action="{{ url_for('.save_preset') }}">
        <input type="hidden" name="csrf_token" value="{{ csrf_token() }}">
        <input type="hidden" name="path" value="{{ request.path }}">
        <input type="hidden" name="query_string" value="{{ request.query_string.decode('utf-8') }}">
        <div class="modal-header">
          <h5 class="modal-title">Save filter as preset</h5>
          <button type="button" class="close" data-dismiss="modal">&times;</button>
        </div>
        <div class="modal-body">
          <div class="form-group">
            <label for="savePresetName">Name</label>
            <input type="text" class="form-control" id="savePresetName"
                   name="name" required maxlength="120"
                   placeholder="e.g. Stale prod hosts">
          </div>
          <div class="form-check">
            <input class="form-check-input" type="checkbox" id="savePresetShared"
                   name="shared">
            <label class="form-check-label" for="savePresetShared">
              Share with other operators
            </label>
          </div>
          <p class="text-muted mt-2" style="font-size: 0.85rem;">
            Captures the current filters, search and sort. Re-opening the
            preset replays the URL exactly as you saved it.
          </p>
        </div>
        <div class="modal-footer">
          <button type="button" class="btn btn-secondary" data-dismiss="modal">Cancel</button>
          <button type="submit" class="btn btn-primary">Save</button>
        </div>
      </form>
    </div>
  </div>
</div>
{% endif %}
{{ super() }}

<div class="modal fade" id="setTemplateModal" tabindex="-1" role="dialog"
     aria-labelledby="setTemplateModalLabel" aria-hidden="true">
  <div class="modal-dialog" role="document">
    <div class="modal-content">
      <form method="POST" action="{{ url_for('.process_template_assignment') }}">
        <input type="hidden" name="csrf_token" value="{{ csrf_token() }}">
        <input type="hidden" name="host_ids" id="setTemplateHostIds" value="">
        <input type="hidden" name="return_to" value="{{ request.full_path }}">

        <div class="modal-header">
          <h5 class="modal-title" id="setTemplateModalLabel">Set CMDB Template</h5>
          <button type="button" class="close" data-dismiss="modal" aria-label="Close">
            <span aria-hidden="true">&times;</span>
          </button>
        </div>

        <div class="modal-body">
          <p class="text-muted" style="font-size: 0.9rem;">
            <span id="setTemplateHostCount">0</span> host(s) will be assigned.
          </p>
          <div class="form-group mb-0">
            <label for="setTemplateId">Select template</label>
            <select class="form-control" id="setTemplateId" name="template_id" required>
              <option value="">Choose a template…</option>
              {% for template in set_template_choices or [] %}
                <option value="{{ template.id }}">{{ template.hostname }}</option>
              {% endfor %}
            </select>
          </div>
        </div>

        <div class="modal-footer">
          <button type="button" class="btn btn-secondary" data-dismiss="modal">Cancel</button>
          <button type="submit" class="btn btn-primary">Apply Template</button>
        </div>
      </form>
    </div>
  </div>
</div>

<div class="modal fade" id="bulkLabelModal" tabindex="-1" role="dialog"
     aria-labelledby="bulkLabelModalLabel" aria-hidden="true">
  <div class="modal-dialog modal-lg" role="document">
    <div class="modal-content">
      <form method="POST" action="{{ url_for('.bulk_label_process') }}">
        <input type="hidden" name="csrf_token" value="{{ csrf_token() }}">
        <input type="hidden" name="host_ids" id="bulkLabelHostIds" value="">
        <input type="hidden" name="return_to" value="{{ request.full_path }}">

        <div class="modal-header">
          <h5 class="modal-title" id="bulkLabelModalLabel">Bulk edit labels</h5>
          <button type="button" class="close" data-dismiss="modal" aria-label="Close">
            <span aria-hidden="true">&times;</span>
          </button>
        </div>

        <div class="modal-body">
          <p class="text-muted" style="font-size: 0.9rem;">
            <span id="bulkLabelHostCount">0</span> host(s) selected.
          </p>

          <div class="form-group">
            <label>Action</label>
            <div class="form-check">
              <input class="form-check-input" type="radio" name="mode"
                     id="bulkMode_add" value="add" checked>
              <label class="form-check-label" for="bulkMode_add">
                <strong>Add / overwrite label</strong>
                — write <code>key:value</code> on every selected host.
              </label>
            </div>
            <div class="form-check">
              <input class="form-check-input" type="radio" name="mode"
                     id="bulkMode_remove" value="remove">
              <label class="form-check-label" for="bulkMode_remove">
                <strong>Remove label</strong>
                — delete the label with this key from every selected host.
              </label>
            </div>
            <div class="form-check">
              <input class="form-check-input" type="radio" name="mode"
                     id="bulkMode_rename" value="rename">
              <label class="form-check-label" for="bulkMode_rename">
                <strong>Rename label key</strong>
                — move the value from the old key to the new key.
              </label>
            </div>
          </div>

          <div class="form-group">
            <label for="bulkLabelKey" id="bulkLabelKeyLabel">Label key</label>
            <input type="text" class="form-control" id="bulkLabelKey"
                   name="label_key" required placeholder="e.g. environment">
          </div>

          <div class="form-group" id="bulkLabelValueGroup">
            <label for="bulkLabelValue">Label value</label>
            <input type="text" class="form-control" id="bulkLabelValue"
                   name="label_value" placeholder="e.g. production">
            <small class="form-text text-muted">
              Overwrites an existing value on hosts that already have this key.
            </small>
          </div>

          <div class="form-group mb-0" id="bulkLabelNewKeyGroup" style="display:none;">
            <label for="bulkLabelNewKey">New label key</label>
            <input type="text" class="form-control" id="bulkLabelNewKey" name="new_key"
                   placeholder="e.g. env">
          </div>
        </div>

        <div class="modal-footer">
          <button type="button" class="btn btn-secondary" data-dismiss="modal">Cancel</button>
          <button type="submit" class="btn btn-primary">Apply</button>
        </div>
      </form>
    </div>
  </div>
</div>

<div class="modal fade" id="copyAsNewModal" tabindex="-1" role="dialog"
     aria-labelledby="copyAsNewModalLabel" aria-hidden="true">
  <div class="modal-dialog" role="document">
    <div class="modal-content">
      <form method="POST" action="{{ url_for('.copy_as_new_process') }}">
        <input type="hidden" name="csrf_token" value="{{ csrf_token() }}">
        <input type="hidden" name="source_id" id="copyAsNewSourceId" value="">

        <div class="modal-header">
          <h5 class="modal-title" id="copyAsNewModalLabel">Copy as new</h5>
          <button type="button" class="close" data-dismiss="modal" aria-label="Close">
            <span aria-hidden="true">&times;</span>
          </button>
        </div>

        <div class="modal-body">
          <div class="form-group mb-0">
            <label for="copyAsNewHostname">New hostname</label>
            <input type="text" class="form-control" id="copyAsNewHostname"
                   name="new_hostname" required>
            <small class="form-text text-muted">
              Labels, CMDB fields and assigned templates are cloned. Timestamps
              and sync state are reset.
            </small>
          </div>
        </div>

        <div class="modal-footer">
          <button type="button" class="btn btn-secondary" data-dismiss="modal">Cancel</button>
          <button type="submit" class="btn btn-primary">Create copy</button>
        </div>
      </form>
    </div>
  </div>
</div>
{% endblock %}

{% block tail %}
{{ super() }}
<script>
(function() {
  // The "With selected…" dropdown items call modelActions.execute(name).
  // `modelActions` is created by actions.js which is loaded inside
  // flask-admin's `tail` block — we must hook in this same block,
  // AFTER super(), or the global doesn't exist yet.
  if (typeof modelActions === 'undefined' || !modelActions.execute) {
    return;
  }
  var origExecute = modelActions.execute.bind(modelActions);
  modelActions.execute = function(name) {
    var ids;
    var collectIds = function() {
      var out = [];
      $('input.action-checkbox:checked').each(function() {
        out.push($(this).val());
      });
      return out;
    };

    if (name === 'set_template') {
      ids = collectIds();
      if (ids.length === 0) {
        alert('Please select at least one host.');
        return false;
      }
      $('#setTemplateHostIds').val(ids.join(','));
      $('#setTemplateHostCount').text(ids.length);
      $('#setTemplateModal').modal('show');
      return false;
    }

    if (name === 'bulk_label_edit') {
      ids = collectIds();
      if (ids.length === 0) {
        alert('Please select at least one host.');
        return false;
      }
      $('#bulkLabelHostIds').val(ids.join(','));
      $('#bulkLabelHostCount').text(ids.length);
      $('#bulkLabelModal').modal('show');
      return false;
    }

    if (name === 'copy_as_new') {
      ids = collectIds();
      if (ids.length !== 1) {
        alert('Copy as new requires exactly one selected host.');
        return false;
      }
      $('#copyAsNewSourceId').val(ids[0]);
      var sourceName = $('input.action-checkbox:checked')
        .closest('tr').find('td').eq(1).text().trim();
      $('#copyAsNewHostname').val(sourceName ? sourceName + '-copy' : '');
      $('#copyAsNewModal').modal('show');
      return false;
    }

    return origExecute(name);
  };

  // Toggle Key-Value vs Rename fields in the bulk label modal.
  $(document).on('change', 'input[name="mode"]', function() {
    var mode = $('input[name="mode"]:checked').val();
    $('#bulkLabelValueGroup').toggle(mode === 'add');
    $('#bulkLabelNewKeyGroup').toggle(mode === 'rename');
    $('#bulkLabelKeyLabel').text(mode === 'rename' ? 'Old label key' : 'Label key');
  });

  // Intercept the Copy-as-new ROW icon so it opens the same modal that
  // the "With selected" bulk action opens — we don't want a full-page
  // navigation for something this lightweight. The icon lives in the
  // row-actions column as <a href="…/copy_as_new_form?source_id=…">.
  $(document).on('click', 'a[href*="copy_as_new_form"]', function(ev) {
    ev.preventDefault();
    var href = $(this).attr('href');
    var match = /[?&]source_id=([^&]+)/.exec(href || '');
    if (!match) { return; }
    var sourceId = decodeURIComponent(match[1]);
    $('#copyAsNewSourceId').val(sourceId);
    var rowName = $(this).closest('tr').find('td').eq(1).text().trim();
    $('#copyAsNewHostname').val(rowName ? rowName + '-copy' : '');
    $('#copyAsNewModal').modal('show');
  });
})();
</script>
{% endblock %}