<!-- Acknowledge Alert modal -->
<div class="modal fade" id="xymon-ack-modal" tabindex="-1" aria-labelledby="xymon-ack-modal-label" aria-hidden="true">
  <div class="modal-dialog">
    <div class="modal-content">
      <div class="modal-header">
        <h5 class="modal-title" id="xymon-ack-modal-label">
          <i class="fa-solid fa-square-check xymon-&XYMWEBCOLOR"></i> Acknowledge Alert
        </h5>
        <button type="button" class="btn-close" data-bs-dismiss="modal" aria-label="Close"></button>
      </div>
      <form method="POST" action="&XYMONSERVERSECURECGIURL/acknowledge.sh">
        <!--
          NUMBER_1 is the xymond ack cookie — a per-alert integer assigned when a test
          enters alert state.  acknowledge.c requires it to build the "xymondack COOKIE"
          protocol message; submitting 0 causes a silent "NO ACK sent" failure.
          The value is fetched from xymondboard at page-render time via &XYMONACKCOOKIE.
        -->
        <input type="hidden" name="NUMBER_1"   value="&XYMONACKCOOKIE">
        <input type="hidden" name="HOSTNAME_1" value="&XYMWEBHOST">
        <input type="hidden" name="TESTNAME_1" value="&XYMWEBSVC">
        <div class="modal-body">
          <div class="mb-3">
            <label class="form-label fw-semibold">Host &amp; Test</label>
            <div class="text-muted small">&XYMWEBHOST &mdash; &XYMWEBSVC</div>
          </div>
          <div class="mb-3">
            <label for="xymon-ack-delay" class="form-label fw-semibold">Acknowledge for</label>
            <div class="d-flex gap-2 align-items-center">
              <input type="number" name="DELAY_1" id="xymon-ack-delay"
                     value="4" min="1" class="form-control maint-duration">
              <select name="PERIOD_1" class="form-select w-auto">
                <option value="minute">minutes</option>
                <option value="hour" selected>hours</option>
                <option value="day">days</option>
              </select>
            </div>
          </div>
          <div class="mb-3">
            <label for="xymon-ack-msg" class="form-label fw-semibold">Message</label>
            <textarea name="MESSAGE_1" id="xymon-ack-msg" class="form-control" rows="3" required
                      placeholder="Describe what is being done about this alert"></textarea>
          </div>
        </div>
        <div class="modal-footer">
          <button type="button" class="btn btn-secondary btn-sm" data-bs-dismiss="modal">Cancel</button>
          <button type="submit" name="Send_1" value="Send" class="btn btn-primary btn-sm">Acknowledge</button>
        </div>
      </form>
    </div>
  </div>
</div>

<!-- Disable Tests modal — dual-purpose:
     Single-service mode (default): shows current test pre-checked + "Select more tests…" collapse.
     Multi-select mode (data-multiselect="true" on trigger, or mark4Disable()): shows all tests
     from window.xymonHostTests (injected by svcstatus-info.c for SERVICE=info pages). -->
<div class="modal fade" id="xymon-disable-modal" tabindex="-1" aria-labelledby="xymon-disable-modal-label" aria-hidden="true">
  <div class="modal-dialog">
    <div class="modal-content">
      <div class="modal-header">
        <h5 class="modal-title" id="xymon-disable-modal-label">
          <i class="fa-solid fa-bell-slash xymon-blue"></i> Disable Tests
        </h5>
        <button type="button" class="btn-close" data-bs-dismiss="modal" aria-label="Close"></button>
      </div>
      <form method="POST" action="&XYMONSERVERSECURECGIURL/enadis.sh">
        <input type="hidden" name="hostname" value="&XYMWEBHOST">
        <input type="hidden" name="go"       value="Disable now">
        <input type="hidden" name="go2"      id="dis-go2" value="Disable for">
        <div class="modal-body">
          <!-- Tests section: populated by JS on show.bs.modal -->
          <div class="mb-3">
            <label class="form-label fw-semibold">Tests</label>
            <!-- Seed: current service name for JS — substituted at render time -->
            <span id="dis-current-svc" data-svc="&XYMWEBSVC" hidden></span>
            <div id="dis-single-test"><!-- JS: one pre-checked checkbox in single-service mode --></div>
            <div class="collapse mt-1" id="dis-more-tests">
              <div class="mt-1 border-start ps-2" id="dis-more-list"><!-- JS: additional tests --></div>
            </div>
            <a href="#" class="small link-secondary mt-1 d-inline-block" id="dis-more-toggle"
               data-bs-toggle="collapse" data-bs-target="#dis-more-tests"
               aria-expanded="false">Select more tests…</a>
          </div>
          <!-- ACK pre-flight data: read by JS; not submitted to enadis.sh -->
          <input type="hidden" id="dis-ack-cookie" value="&XYMONACKCOOKIE">
          <input type="hidden" id="dis-ack-svc"    value="&XYMWEBSVC">
          <!-- Shown only when there is an active alert cookie -->
          <div class="mb-2" id="dis-ack-section" style="display:none">
            <div class="form-check">
              <input class="form-check-input" type="checkbox" id="dis-also-ack">
              <label class="form-check-label" for="dis-also-ack">Also acknowledge active alert</label>
            </div>
          </div>
          <!-- Duration mode selector -->
          <div class="mb-3">
            <div class="btn-group w-100 mb-2" role="group" aria-label="Disable mode">
              <input type="radio" class="btn-check" name="dis_mode" id="dis-mode-for" value="for" autocomplete="off" checked>
              <label class="btn btn-outline-secondary btn-sm" for="dis-mode-for">For a duration</label>
              <input type="radio" class="btn-check" name="dis_mode" id="dis-mode-until" value="until" autocomplete="off">
              <label class="btn btn-outline-secondary btn-sm" for="dis-mode-until">Until date/time</label>
              <input type="radio" class="btn-check" name="dis_mode" id="dis-mode-forever" value="forever" autocomplete="off">
              <label class="btn btn-outline-secondary btn-sm" for="dis-mode-forever">Forever</label>
            </div>
            <div id="dis-panel-for">
              <div class="d-flex gap-2 align-items-center">
                <input type="number" name="duration" id="xymon-disable-duration" value="4" min="1" class="form-control maint-duration">
                <select name="scale" id="xymon-disable-scale" class="form-select w-auto">
                  <option value="1">minutes</option>
                  <option value="60" selected>hours</option>
                  <option value="1440">days</option>
                  <option value="10080">weeks</option>
                </select>
              </div>
            </div>
            <div id="dis-panel-until" style="display:none">
              <div class="d-flex gap-2 align-items-center">
                <input type="date" name="end-date" id="xymon-disable-enddate" class="form-control">
                <input type="time" name="end-time" id="xymon-disable-endtime" value="23:59" class="form-control w-auto">
              </div>
            </div>
            <!-- Hidden untilok field: set by JS when mode=forever -->
            <input type="checkbox" name="untilok" id="xymon-disable-untilok" value="on" style="display:none">
            <!-- Re-enable on Green: visible, pre-checked; inverse-maps to disableignoreok -->
            <div class="form-check mt-2" id="dis-reenable-section">
              <input class="form-check-input" type="checkbox" id="dis-reenable-ok" checked>
              <label class="form-check-label" for="dis-reenable-ok">Re-enable on Green</label>
            </div>
            <!-- Submitted only when "Re-enable on Green" is UNCHECKED -->
            <input type="hidden" id="dis-ignoreok" name="disableignoreok" value="on" disabled>
          </div>
          <div class="mb-3">
            <label for="xymon-disable-cause" class="form-label fw-semibold">Reason</label>
            <textarea name="cause" id="xymon-disable-cause" class="form-control" rows="3" required
                      placeholder="Describe why this test is being disabled"></textarea>
          </div>
        </div>
        <div class="modal-footer">
          <button type="button" class="btn btn-secondary btn-sm" data-bs-dismiss="modal">Cancel</button>
          <button type="submit" class="btn btn-primary btn-sm">Disable</button>
        </div>
      </form>
    </div>
  </div>
</div>

<script>
(function() {
  var modal = document.getElementById('xymon-disable-modal');
  if (!modal) return;

  var currentSvc = (document.getElementById('dis-current-svc') || {dataset:{}}).dataset.svc || '';
  var reEnableOk  = document.getElementById('dis-reenable-ok');
  var ignoreOkHidden = document.getElementById('dis-ignoreok');

  function colorClass(c) {
    return {red:'xymon-red',yellow:'xymon-yellow',green:'xymon-green',
            blue:'xymon-blue',purple:'xymon-purple',clear:'xymon-clear'}[c] || '';
  }

  function makeCheckbox(name, cls, checked) {
    var id = 'dis-cb-' + name.replace(/[^a-z0-9]/gi, '_');
    return '<div class="form-check">'
      + '<input class="form-check-input" type="checkbox" name="disabletest"'
      + ' id="' + id + '" value="' + name + '"' + (checked ? ' checked' : '') + '>'
      + '<label class="form-check-label" for="' + id + '">'
      + (cls ? '<i class="fa-solid fa-circle ' + cls + ' me-1" style="font-size:.7em"></i>' : '')
      + name + '</label></div>';
  }

  function setMode(mode) {
    document.getElementById('dis-panel-for').style.display   = (mode === 'for')     ? '' : 'none';
    document.getElementById('dis-panel-until').style.display = (mode === 'until')   ? '' : 'none';
    document.getElementById('xymon-disable-untilok').checked = (mode === 'forever');
    document.getElementById('dis-go2').value = (mode === 'until') ? 'Disable until' : 'Disable for';
  }

  function initTests(multiselect, pendingServices) {
    var singleDiv  = document.getElementById('dis-single-test');
    var moreList   = document.getElementById('dis-more-list');
    var moreToggle = document.getElementById('dis-more-toggle');
    var moreCollapse = document.getElementById('dis-more-tests');

    if (multiselect && window.xymonHostTests && window.xymonHostTests.length) {
      var html = '<div class="form-check border-bottom pb-1 mb-1">'
        + '<input class="form-check-input" type="checkbox" id="dis-cb-selectall">'
        + '<label class="form-check-label fw-semibold" for="dis-cb-selectall">Select all</label>'
        + '</div>';
      window.xymonHostTests.forEach(function(t) {
        var checked = pendingServices.indexOf(',' + t.name + ',') >= 0;
        html += makeCheckbox(t.name, colorClass(t.color), checked);
      });
      singleDiv.innerHTML = html;
      document.getElementById('dis-cb-selectall').addEventListener('change', function() {
        singleDiv.querySelectorAll('input[name="disabletest"]').forEach(function(cb) {
          cb.checked = this.checked;
        }, this);
      });
      moreList.innerHTML = '';
      moreToggle.style.display = 'none';
      moreCollapse.classList.remove('show');
    } else {
      singleDiv.innerHTML = makeCheckbox(currentSvc, '', true);
      moreList.innerHTML = '';
      /* Hide "Select more" when there's nothing to populate it with */
      moreToggle.style.display = (window.xymonHostTests && window.xymonHostTests.length) ? '' : 'none';
      moreCollapse.classList.remove('show');
    }
  }

  modal.addEventListener('show.bs.modal', function(event) {
    document.getElementById('dis-mode-for').checked = true;
    document.getElementById('xymon-disable-enddate').value = '';
    document.getElementById('xymon-disable-endtime').value = '23:59';
    setMode('for');

    /* Reset Re-enable on Green to default checked */
    if (reEnableOk)     { reEnableOk.checked = true; }
    if (ignoreOkHidden) { ignoreOkHidden.disabled = true; }

    var trigger = event.relatedTarget;
    var multiselect = (trigger && trigger.dataset.multiselect === 'true') ||
                      !!(modal.dataset.pendingServices);
    var pending = modal.dataset.pendingServices || '';
    modal.dataset.pendingServices = '';
    initTests(multiselect, pending);

    var ackCookie = parseInt((document.getElementById('dis-ack-cookie') || {}).value, 10) || 0;
    var ackSection = document.getElementById('dis-ack-section');
    if (ackSection) ackSection.style.display = ackCookie ? '' : 'none';
    var ackCb = document.getElementById('dis-also-ack');
    if (ackCb) ackCb.checked = false;
  });

  /* Lazy-populate "more tests" on first expand in single-service mode */
  document.getElementById('dis-more-tests').addEventListener('show.bs.collapse', function() {
    var moreList = document.getElementById('dis-more-list');
    if (!moreList.children.length && window.xymonHostTests) {
      var html = '';
      window.xymonHostTests.forEach(function(t) {
        if (t.name !== currentSvc) html += makeCheckbox(t.name, colorClass(t.color), false);
      });
      moreList.innerHTML = html || '<em class="text-muted small">No other tests available.</em>';
    }
  });

  document.querySelectorAll('input[name="dis_mode"]').forEach(function(r) {
    r.addEventListener('change', function() { setMode(this.value); });
  });

  /* Wire up "Re-enable on Green" checkbox — toggles hidden disableignoreok field */
  if (reEnableOk) {
    reEnableOk.addEventListener('change', function() {
      if (ignoreOkHidden) ignoreOkHidden.disabled = this.checked;
    });
  }

  /* Called by "Toggle tests to disable" color buttons on SERVICE=info pages */
  window.mark4Disable = function(services) {
    modal.dataset.pendingServices = services;
    bootstrap.Modal.getOrCreateInstance(modal).show();
  };

  /* ACK pre-flight: when "Also acknowledge" is checked, POST to acknowledge.sh first */
  var disForm = modal.querySelector('form');
  if (disForm) {
    disForm.addEventListener('submit', function(e) {
      var ackCb = document.getElementById('dis-also-ack');
      var ackCookie = parseInt((document.getElementById('dis-ack-cookie') || {}).value, 10) || 0;
      if (!ackCb || !ackCb.checked || !ackCookie) return;

      e.preventDefault();

      var mode = (document.querySelector('input[name="dis_mode"]:checked') || {}).value || 'for';
      var delay, period;
      if (mode === 'for') {
        var scale = parseInt((document.getElementById('xymon-disable-scale') || {}).value, 10) || 60;
        delay  = (document.getElementById('xymon-disable-duration') || {}).value || '4';
        period = scale >= 1440 ? 'day' : (scale >= 60 ? 'hour' : 'minute');
      } else if (mode === 'until') {
        var endDate = (document.getElementById('xymon-disable-enddate') || {}).value || '';
        var endTime = (document.getElementById('xymon-disable-endtime') || {}).value || '23:59';
        var ms = (endDate ? new Date(endDate + 'T' + endTime).getTime() : 0) - Date.now();
        delay  = String(Math.max(1, Math.ceil(ms / 60000)));
        period = 'minute';
      } else {
        delay  = '30';
        period = 'day';
      }

      var body = new URLSearchParams({
        NUMBER_1:   ackCookie,
        HOSTNAME_1: (disForm.querySelector('[name="hostname"]') || {}).value || '',
        TESTNAME_1: (document.getElementById('dis-ack-svc') || {}).value || '',
        DELAY_1:    delay,
        PERIOD_1:   period,
        MESSAGE_1:  (document.getElementById('xymon-disable-cause') || {}).value || '',
        Send_1:     'Send'
      });

      fetch('&XYMONSERVERSECURECGIURL/acknowledge.sh', {method: 'POST', body: body})
        .finally(function() { disForm.submit(); });
    });
  }
})();
</script>

<script>
/* Auto-refresh that pauses while any Bootstrap modal is open.
   Replaces <meta http-equiv="refresh"> so the timer can be cancelled. */
(function() {
  var ms = parseInt('&XYMWEBREFRESH', 10) * 1000;
  if (!ms) return;
  var _t;
  function schedule() { _t = setTimeout(function() { location.reload(); }, ms); }
  document.addEventListener('show.bs.modal',   function() { clearTimeout(_t); });
  document.addEventListener('hidden.bs.modal', function() { schedule(); });
  schedule();
})();
</script>
