feat: Document shortcuts in org-check und documentation

docs/user/index.rst

@@ -9,3 +9,4 @@ User Dokumentation
    vermittlungen.rst
    moderationskonzept.rst
    benachrichtigungen.rst
+   organisationen-pruefen.rst

docs/user/organisationen-pruefen.rst

@@ -0,0 +1,40 @@
+Tiere in Vermittlung systematisch entdecken & eintragen
+=======================================================
+
+Notfellchen hat eine Liste der meisten deutschen Tierheime und anderer Tierschutzorganisationen (550, Stand Oktober 2025).
+Die meisten dieser Organisationen (412, Stand Oktober 2025) nehmen Tiere auf die bei Notfellchen eingetragen werden können.
+Es ist daher das Ziel, diese Organisationen alle zwei Wochen auf neue Tiere zu prüfen.
+
+.. warning::
+
+   Organisationen auf neue Tiere zu prüfen ist eine Funktion für Moderator\*innen. Falls du Lust hast mitzuhelfen,
+   meld dich unter info@notfellchen.org
+
+Als Moderator\*in kannst du direkt auf den `Moderations-Check <https://notfellchen.org/organization-check/>`_ zugreifen
+oder findest ihn in unter :menuselection:`Hilfreiche Links --> Moderationstools`:
+
+.. image::
+   Screenshot-hilfreiche-Links.png
+   :alt: Screenshot der Hilfreichen Links. Zur Auswahl stehen "Tierheime in der Nähe","Moderationstools" und "Admin-Bereich"
+
+.. image::
+  Screenshot-Moderationstools.png
+  :alt: Screenshot der Moderationstools. Zur Auswahl stehen "Moderationswarteschlange", "Up-to-Date Check", "Organisations-Check" und "Vermittlung ins Fediverse posten".
+
+
+
+Shortcuts
+---------
+
+Um die Prüfung schneller zu gestalten, gibt es eine Reihe von Shortcuts die du nutzen kannst. Aus Gründen der
+Übersichtlichkeit sind im Folgenden auch Shortcuts im Browser aufgeführt.
+
++------------------------------------------------------+---------------+
+| Aktion                                               | Shortcut      |
++======================================================+===============+
+|  Website der ersten Tierschutzorganisation öffnen    | :kbd:`O`      |
++------------------------------------------------------+---------------+
+| Tab schließen (Firefox/Chrome)                       | :kbd:`STRG+W` |
++------------------------------------------------------+---------------+
+| Erste Tierschutzorganisationa als geprüft markieren  | :kbd:`C`      |
++------------------------------------------------------+---------------+

src/fellchensammlung/static/fellchensammlung/css/main.scss

@@ -352,3 +352,12 @@ AN Cards
 .embed-main-content {
   padding: 20px 10px 20px 10px;
 }
+
+// FLOATING BUTTON
+
+.floating {
+  position: fixed;
+  border-radius: 0.3rem;
+  bottom: 4.5rem;
+  right: 1rem;
+}

src/fellchensammlung/static/fellchensammlung/js/toggles.js

@@ -67,6 +67,51 @@ document.addEventListener('DOMContentLoaded', () => {
       $el.classList.remove("is-active");
     });
   }
+
+  // MODALS //
+
+  function openModal($el) {
+        $el.classList.add('is-active');
+        send("Modal.open", {
+            modal: $el.id
+        });
+    }
+
+    function closeModal($el) {
+        $el.classList.remove('is-active');
+    }
+
+    function closeAllModals() {
+        (document.querySelectorAll('.modal') || []).forEach(($modal) => {
+            closeModal($modal);
+        });
+    }
+
+    // Add a click event on buttons to open a specific modal
+    (document.querySelectorAll('.js-modal-trigger') || []).forEach(($trigger) => {
+        const modal = $trigger.dataset.target;
+        const $target = document.getElementById(modal);
+
+        $trigger.addEventListener('click', () => {
+            openModal($target);
+        });
+    });
+
+    // Add a click event on various child elements to close the parent modal
+    (document.querySelectorAll('.modal-background, .modal-close, .delete, .nf-modal-close') || []).forEach(($close) => {
+        const $target = $close.closest('.modal');
+
+        $close.addEventListener('click', () => {
+            closeModal($target);
+        });
+    });
+
+    // Add a keyboard event to close all modals
+    document.addEventListener('keydown', (event) => {
+        if (event.key === "Escape") {
+            closeAllModals();
+        }
+    });
 });
 
 

src/fellchensammlung/templates/fellchensammlung/partials/modal-shortcuts.html

@@ -0,0 +1,30 @@
+{% load i18n %}
+<div id="modal-shortcuts" class="modal">
+    <div class="modal-background"></div>
+    <div class="modal-card">
+        <header class="modal-card-head">
+            <p class="modal-card-title">{% trans 'Shortcuts' %}</p>
+            <button class="delete" aria-label="{% trans 'Schließen' %}"></button>
+        </header>
+        <section class="modal-card-body">
+            <div class="content">
+                <ul>
+                    <li>{% trans 'Website öffnen' %}: <code>O</code></li>
+                    <li>{% trans 'Website schließen' %}: <code>{% trans 'STRG' %} + W</code></li>
+                    <li>{% trans 'Organisation als geprüft markieren' %}: <code>{% trans 'STRG' %} + W</code></li>
+                </ul>
+            </div>
+        </section>
+        <footer class="modal-card-foot">
+            <div class="buttons">
+                <button class="button is-success nf-modal-close">{% translate 'Verstanden' %}</button>
+                <button class="button">{% translate 'Details' %}</button>
+            </div>
+        </footer>
+    </div>
+</div>
+
+
+<button class="button is-info floating js-modal-trigger" data-target="modal-shortcuts">
+    <i class="fa-solid fa-keyboard fa-fw"></i> {% trans 'Shortcuts' %}
+</button>

src/fellchensammlung/templates/fellchensammlung/rescue-organization-check.html

@@ -23,9 +23,11 @@
             </div>
             <div class="column">
                 {% if dq %}
-                    <a class="button is-info" href="{% url 'organization-check' %}">{% translate 'Datenergänzung deaktivieren' %}</a>
+                    <a class="button is-info"
+                       href="{% url 'organization-check' %}">{% translate 'Datenergänzung deaktivieren' %}</a>
                 {% else %}
-                    <a class="button is-info is-light" href="{% url 'organization-check-dq' %}">{% translate 'Datenergänzung aktivieren' %}</a>
+                    <a class="button is-info is-light"
+                       href="{% url 'organization-check-dq' %}">{% translate 'Datenergänzung aktivieren' %}</a>
                 {% endif %}
             </div>
         </div>
@@ -65,4 +67,5 @@
             {% endfor %}
         </div>
     </div>
+    {% include "fellchensammlung/partials/modal-shortcuts.html" %}
 {% endblock %}