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

{% block body %}
{{ 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="">

        <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="">

        <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 %}