{% extends "base.html" %}

{% block title %}Script Generator - {{ app_name }}{% endblock %}

{% block content %}
<div class="container mt-4">
  <div class="row">
    <div class="col-lg-10 mx-auto">

      <div class="mb-4">
        <h2>Script Generator</h2>
        <p class="text-muted mb-2">Generate ready-to-use integration scripts for this API.</p>

        <div class="alert alert-info">
          <strong>Base URL:</strong> <code id="baseUrl"></code>
        </div>
      </div>

      <div class="card mb-4">
        <div class="card-header bg-dark text-white">
          <strong><i class="fab fa-python me-2"></i>Python Generator</strong>
          <span class="ms-2 small text-white-50">raw / generate</span>
        </div>

        <div class="card-body">

          <div class="row g-3">

            <div class="col-md-4">
              <label class="form-label">Mode</label>
              <select id="pyMode" class="form-select form-select-sm">
                <option value="raw">Raw blocklist (TXT / CSV / JSON / JS)</option>
                <option value="generate">App config file (download)</option>
              </select>
              <div class="form-text">Preview endpoint is UI-only — not recommended for external automation.</div>
            </div>

            <div class="col-md-4">
              <label class="form-label">Countries (comma separated)</label>
              <input type="text" id="pyCountries" class="form-control form-control-sm" value="PL">
              <div class="form-text">Example: <code>PL</code> or <code>CN,RU</code></div>
            </div>

            <div class="col-md-2">
              <label class="form-label">Aggregate</label>
              <select id="pyAggregate" class="form-select form-select-sm">
                <option value="true">true</option>
                <option value="false">false</option>
              </select>
            </div>

            <div class="col-md-2">
              <label class="form-label">Use cache</label>
              <select id="pyCache" class="form-select form-select-sm">
                <option value="true">true</option>
                <option value="false">false</option>
              </select>
            </div>

            <!-- RAW options -->
            <div class="col-md-4" id="pyRawFormatBox">
              <label class="form-label">Raw format (app_type)</label>
              <select id="pyRawFormat" class="form-select form-select-sm">
                <option value="raw-cidr_txt">raw-cidr_txt (TXT)</option>
                <option value="raw-cidr_csv">raw-cidr_csv (CSV)</option>
                <option value="raw-cidr_json">raw-cidr_json (JSON)</option>
              </select>
              <div class="form-text">
                JS wrapper works only with <code>raw-cidr_json</code>.
              </div>
            </div>

            <div class="col-md-2" id="pyAsJsBox">
              <label class="form-label">as_js</label>
              <select id="pyAsJs" class="form-select form-select-sm">
                <option value="false">false</option>
                <option value="true">true</option>
              </select>
            </div>

            <div class="col-md-3" id="pyJsVarBox">
              <label class="form-label">js_var</label>
              <input type="text" id="pyJsVar" class="form-control form-control-sm" value="geoipBlocklist">
            </div>

            <!-- GENERATE options -->
            <div class="col-md-4" id="pyAppTypeBox" style="display:none;">
              <label class="form-label">app_type</label>
              <select id="pyAppType" class="form-select form-select-sm">
                <option value="haproxy">haproxy</option>
                <option value="apache">apache</option>
                <option value="nginx">nginx</option>
              </select>
              <div class="form-text">
                Avoid <code>nginx</code> + <code>map</code> for production.
              </div>
            </div>

            <div class="col-md-4" id="pyAppVariantBox" style="display:none;">
              <label class="form-label">app_variant</label>
              <select id="pyAppVariant" class="form-select form-select-sm"></select>
              <div class="form-text" id="variantHint"></div>
            </div>

            <div class="col-12 mt-2">
              <button class="btn btn-primary btn-sm" id="btnGenPy">
                <i class="fas fa-code me-1"></i>Generate
              </button>
              <button class="btn btn-outline-secondary btn-sm ms-2" id="btnCopyPy">
                <i class="fas fa-copy me-1"></i>Copy
              </button>
            </div>

          </div>

          <hr>

          <div class="code-wrap mt-2">
            <div class="code-wrap-header">
                <span><i class="fab fa-python me-2"></i>generated.py</span>
                <button class="btn btn-sm btn-outline-light" type="button" id="btnCopyPyTop">
                <i class="fas fa-copy me-1"></i>Copy
                </button>
            </div>

            <pre class="code-wrap-body"><code id="pythonScriptOutput"></code></pre>
        </div>

        </div>
      </div>

      <div class="alert alert-secondary">
        <strong>Tip:</strong> If you need structured output for integrations, use <code>/api/generate/raw</code>.
        For ready-to-use app configs, use <code>/api/generate</code>.
      </div>

    </div>
  </div>
</div>
{% endblock %}

{% block scripts %}
<script src="{{ url_for('static', filename='js/generator.js') }}?v={{ js_hash }}"></script>
{% endblock %}