{# SPDX-License-Identifier: AGPL-3.0-or-later #}
{# SPDX-FileCopyrightText: 2026 JWP Consulting GK #}
{% extends "_default/baseof.html" %}
{% load static %}
{% block title %}Edit – {{ page.title }}{% endblock %}
{% block extrahead %}
    <meta name="htmx-config"
          content='{ "inlineScriptNonce":"{{ csp_nonce }}", "inlineStyleNonce":"{{ csp_nonce }}", "allowEval": false }'>
    <link rel="stylesheet" href="{% static 'font-awesome/css/all.min.css' %}">
    <link rel="stylesheet" href="{% static 'easymde/easymde.min.css' %}">
    <link rel="stylesheet" href="{% static 'css/post_editor.css' %}">
    <script src="{% static 'htmx/htmx.js' %}" defer></script>
    <script src="{% static 'easymde/easymde.min.js' %}" defer></script>
    <script src="{% static 'post_editor.js' %}" defer></script>
    <style nonce="{{csp_nonce}}"></style>
{% endblock extrahead %}
{% partialdef resources %}
<section id="page-resources">
    <h2>Page Resources</h2>
    <div id="unused-resources"></div>
    <div class="resource-tiles">
        {% for resource in page.pageresource_set.all %}
            <form class="resource-tile"
                  hx-post="{% url 'editor_resource_delete' path=page.address resource_pk=resource.pk %}"
                  hx-confirm="Are you sure you want to delete this resource?"
                  hx-target="#page-resources">
                {% csrf_token %}
                {% if resource.name in unused %}unused{% endif %}
                {% if resource.type == 'IMAGE' and resource.image_instance %}
                    <a href="{{ resource.image_instance.full_url }}" target="_blank">
                        <img src="{{ resource.image_instance.full_url }}"
                             width="{{ resource.image_instance.width }}"
                             height="{{ resource.image_instance.height }}"
                             alt="{{ resource.name }}">
                    </a>
                {% endif %}
                <p>
                    <a href="{% url 'admin:koriander_pageresource_change' resource.pk %}">{{ resource.name }}</a>
                </p>
                <p>
                    <button type="button"
                            data-insert-page-resource
                            data-resource-path="{{ resource.name }}"
                            data-resource-name="{{ resource.name }}">Insert</button>
                </p>
                <p>
                    <button type="submit">Delete</button>
                </p>
            </form>
        {% empty %}
            <p>No resources.</p>
        {% endfor %}
    </div>
    <p>Toggle preview in editor to show unused page resouces</p>
</section>
{% endpartialdef %}
{% block editor %}
    <h1>Edit: {{ page.title }}</h1>
    <form id="editor-form"
          method="post"
          data-image-upload-url="{% url 'editor_image_upload' path=page.address %}"
          data-preview-url="{% url 'editor_preview' path=page.address %}"
          data-image-max-size="{{ image_max_size }}"
          data-back-url="{{ page.get_absolute_url }}"
          data-image-accept="{{ image_accept }}"
          data-page-search-url="{% url 'page_search' %}">
        {% csrf_token %}
        <textarea id="editor-content" name="content_md">{{ content_md }}</textarea>
    </form>
    <dialog id="link-dialog">
        <form method="dialog">
            <h2>Link to page</h2>
            {{ link_search_form.q.as_field_group }}
            <div id="link-results-container">
                <ul id="link-results">
                </ul>
            </div>
            <button type="submit" id="link-cancel">Cancel</button>
        </form>
    </dialog>
    <dialog id="footnote-dialog">
        <form method="dialog">
            <h2>Insert footnote</h2>
            <label for="footnote-name">Footnote name</label>
            <input type="text"
                   id="footnote-name"
                   placeholder="e.g. my-note"
                   autocomplete="off">
            <button type="submit" id="footnote-insert">Insert</button>
            <button type="submit" id="footnote-cancel">Cancel</button>
        </form>
    </dialog>
    {% partial resources %}
{% endblock %}