django-admin-inline-controls 0.1.0__py3-none-any.whl

django_admin_inline_controls/static/django_admin_inline_controls/js/actions.js

@@ -0,0 +1,330 @@
+/*
+ * django-admin-inline-controls: bulk actions (inline_bulk_actions) and row
+ * actions (inline_actions). Loaded after core.js, only by inlines that
+ * use them.
+ */
+(() => {
+    const core = globalThis.DjangoAdminInlineControls;
+    const SCOPE = ".inline-controls-actions";
+    const ROW_SCOPE = ".inline-controls-row-actions-status";
+
+    /** Whether the inline has bulk actions (the toolbar's select). */
+    const hasBulkActions = (config) =>
+        Boolean(config.actionUrl) && (config.bulkActions ?? []).length > 0;
+
+    const format = (template, values) =>
+        template.replace(/%\((\w+)\)s/g, (_, key) => values[key]);
+
+    /** Saved rows of the inline with their primary keys. */
+    function selectableRows(root, config) {
+        const group = root.querySelector(`[id="${config.prefix}-group"]`);
+        if (!group) {
+            return [];
+        }
+        return core
+            .formRows(group, config.prefix, config)
+            .filter((row) => core.isSaved(row, config))
+            .map((row) => {
+                const index = core.formIndex(row, config.prefix);
+                const input = row.querySelector(
+                    `[name="${config.prefix}-${index}-${config.pkName}"]`,
+                );
+                return { row, pk: input?.value };
+            })
+            .filter(({ pk }) => pk);
+    }
+
+    function addRowCheckbox(row, pk, config) {
+        if (row.querySelector(".inline-controls-select")) {
+            return;
+        }
+        const checkbox = document.createElement("input");
+        checkbox.type = "checkbox";
+        checkbox.className = "inline-controls-select";
+        checkbox.value = pk;
+        checkbox.setAttribute("form", config.actionsFormId);
+        checkbox.setAttribute("aria-label", config.messages.selectRow ?? "");
+        // Next to the object's name: the label line of a tabular row (inside
+        // the zero-width "original" cell) or the heading of a stacked one.
+        (core.query(row, config, "row_label") ?? row).prepend(checkbox);
+    }
+
+    function selectedPks(root) {
+        return [
+            ...root.querySelectorAll(".inline-controls-select:checked"),
+        ].map((checkbox) => checkbox.value);
+    }
+
+    function updateSelection(root, state) {
+        const { config } = state;
+        const boxes = [...root.querySelectorAll(".inline-controls-select")];
+        const checked = boxes.filter((box) => box.checked).length;
+        const total = config.totalCount ?? boxes.length;
+        const all = boxes.length > 0 && checked === boxes.length;
+        if (!all) {
+            state.selectAcross = false;
+        }
+        const toggle = root.querySelector(".inline-controls-select-all");
+        if (toggle) {
+            toggle.checked = all;
+            toggle.indeterminate = checked > 0 && !all;
+        }
+        const label = root.querySelector("[data-inline-controls-selection]");
+        if (label) {
+            label.textContent = state.selectAcross
+                ? format(config.messages.allSelected, { total })
+                : format(config.messages.selected, {
+                      sel: checked,
+                      cnt: total,
+                  });
+        }
+        const across = root.querySelector(
+            "[data-inline-controls-select-across]",
+        );
+        if (across) {
+            across.hidden = !all || state.selectAcross || total <= boxes.length;
+            across.textContent = format(config.messages.selectAll, { total });
+        }
+    }
+
+    /** Show the row action buttons, rendered hidden by the server. */
+    function showRowActions(scope, config) {
+        if (!config.actionUrl || !config.rowActions) {
+            return;
+        }
+        for (const el of scope.querySelectorAll(
+            "[data-inline-controls-row-actions]",
+        )) {
+            el.hidden = false;
+        }
+    }
+
+    function setupActions(root, state) {
+        const { config } = state;
+        state.selectAcross = false;
+        showRowActions(root, config);
+        if (!hasBulkActions(config)) {
+            return;
+        }
+        for (const { row, pk } of selectableRows(root, config)) {
+            addRowCheckbox(row, pk, config);
+        }
+        const toggle = document.createElement("input");
+        toggle.type = "checkbox";
+        toggle.className = "inline-controls-select-all";
+        toggle.setAttribute("form", config.actionsFormId);
+        toggle.setAttribute("aria-label", config.messages.selectAllRows ?? "");
+        root.querySelector(".inline-controls-actions")?.prepend(toggle);
+        updateSelection(root, state);
+    }
+
+    async function runAction(root) {
+        const state = core.stateOf(root);
+        const { config } = state;
+        const select = root.querySelector("[data-inline-controls-action]");
+        const group = document.getElementById(`${config.prefix}-group`);
+        const form = group?.closest("form");
+        if (state.loading || !config.actionUrl || !select || !form) {
+            return;
+        }
+        const action = config.bulkActions.find(
+            (item) => item.name === select.value,
+        );
+        const pks = selectedPks(root);
+        if (!action) {
+            core.showStatus(root, "error", config.messages.noAction, SCOPE);
+            return;
+        }
+        if (pks.length === 0 && !state.selectAcross) {
+            core.showStatus(root, "error", config.messages.noSelection, SCOPE);
+            return;
+        }
+        const count = state.selectAcross
+            ? (config.totalCount ?? pks.length)
+            : pks.length;
+        if (
+            action.confirmation &&
+            !window.confirm(format(action.confirmation, { count }))
+        ) {
+            return;
+        }
+        if (state.dirty && !window.confirm(config.messages.unsaved)) {
+            return;
+        }
+        const data = actionData(root, form, config);
+        data.append("action", action.name);
+        for (const pk of pks) {
+            data.append("_selected_action", pk);
+        }
+        data.append("select_across", state.selectAcross ? "1" : "0");
+        await postAction(root, data, SCOPE);
+    }
+
+    /** One row's action: the button's row only, no selection needed. */
+    async function runRowAction(root, button) {
+        const state = core.stateOf(root);
+        const { config } = state;
+        const group = document.getElementById(`${config.prefix}-group`);
+        const form = group?.closest("form");
+        if (state.loading || !config.actionUrl || !form) {
+            return;
+        }
+        const { confirmation } = button.dataset;
+        if (confirmation && !window.confirm(confirmation)) {
+            return;
+        }
+        if (state.dirty && !window.confirm(config.messages.unsaved)) {
+            return;
+        }
+        const data = actionData(root, form, config);
+        data.append("row_action", button.dataset.inlineControlsRowAction);
+        data.append("_selected_action", button.dataset.pk);
+        await postAction(root, data, ROW_SCOPE);
+    }
+
+    /** The CSRF token and the number of rows loaded (infinite mode). */
+    function actionData(root, form, config) {
+        const data = new FormData();
+        const csrf = form.querySelector("[name=csrfmiddlewaretoken]");
+        if (csrf) {
+            data.append(csrf.name, csrf.value);
+        }
+        data.append(
+            "_inline_controls_loaded",
+            String(selectableRows(root, config).length),
+        );
+        return data;
+    }
+
+    /** POST an action and show its result (a download, a redirect, another
+     * page, or the re-rendered inline with its status under `scope`). */
+    async function postAction(root, data, scope) {
+        const state = core.stateOf(root);
+        const { config } = state;
+        state.loading = true;
+        root.classList.add("inline-controls-loading");
+        const target = new URL(
+            config.actionUrl + window.location.search,
+            window.location.href,
+        ).toString();
+        try {
+            const response = await fetch(target, {
+                method: "POST",
+                body: data,
+                credentials: "same-origin",
+                headers: { "X-Requested-With": "XMLHttpRequest" },
+            });
+            if (!response.ok) {
+                throw new Error(`HTTP ${response.status}`);
+            }
+            const disposition =
+                response.headers.get("Content-Disposition") ?? "";
+            if (disposition.includes("attachment")) {
+                const blob = await response.blob();
+                const link = document.createElement("a");
+                link.href = URL.createObjectURL(blob);
+                link.download =
+                    disposition.match(/filename="?([^";]+)"?/)?.[1] ??
+                    "download";
+                document.body.append(link);
+                link.click();
+                link.remove();
+                URL.revokeObjectURL(link.href);
+                state.loading = false;
+                root.classList.remove("inline-controls-loading");
+                return;
+            }
+            if (response.redirected) {
+                window.location.assign(response.url);
+                return;
+            }
+            const text = await response.text();
+            const doc = new DOMParser().parseFromString(text, "text/html");
+            const result = doc.getElementById(
+                `${config.prefix}-inline-controls-response`,
+            );
+            const fresh = doc.getElementById(root.id);
+            if (!result || !fresh) {
+                // Any other page the action returned (e.g. an intermediate
+                // step) replaces this one.
+                document.open();
+                document.write(text);
+                document.close();
+                return;
+            }
+            const node = core.swapInline(root, fresh);
+            core.setup(node);
+            core.reinitAdmin(node);
+            core.showStatus(
+                node,
+                result.dataset.status,
+                result.dataset.message,
+                scope,
+            );
+        } catch {
+            state.loading = false;
+            root.classList.remove("inline-controls-loading");
+            core.showStatus(
+                root,
+                "failed",
+                config.messages.actionFailed,
+                scope,
+            );
+        }
+    }
+
+    /** Tick every row's checkbox, or clear them. */
+    function checkAll(root, checked) {
+        for (const box of root.querySelectorAll(".inline-controls-select")) {
+            box.checked = checked;
+        }
+    }
+
+    core.register({
+        setup: setupActions,
+        rowsLoaded(root, state) {
+            showRowActions(root, state.config);
+            if (hasBulkActions(state.config)) {
+                for (const { row, pk } of selectableRows(root, state.config)) {
+                    addRowCheckbox(row, pk, state.config);
+                }
+                updateSelection(root, state);
+            }
+        },
+        click(event, root, state) {
+            const rowButton = event.target.closest(
+                "[data-inline-controls-row-action]",
+            );
+            if (rowButton) {
+                runRowAction(root, rowButton);
+                return true;
+            }
+            if (event.target.closest("[data-inline-controls-run]")) {
+                runAction(root);
+                return true;
+            }
+            if (event.target.closest("[data-inline-controls-select-across]")) {
+                checkAll(root, true);
+                state.selectAcross = true;
+                updateSelection(root, state);
+                return true;
+            }
+            return false;
+        },
+        edit(event, root, state) {
+            const { target } = event;
+            if (target.getAttribute?.("form") !== state.config.actionsFormId) {
+                return false;
+            }
+            if (target.classList.contains("inline-controls-select-all")) {
+                checkAll(root, target.checked);
+            }
+            if (event.type === "change") {
+                updateSelection(root, state);
+            }
+            return true;
+        },
+    });
+
+    Object.assign(core, { runAction, runRowAction });
+})();

django_admin_inline_controls/static/django_admin_inline_controls/js/contrib/unfold.js

@@ -0,0 +1,21 @@
+/*
+ * django-admin-inline-controls: django-unfold integration.
+ *
+ * Unfold binds its "Add another" and delete buttons once, on page load:
+ * bind them on refreshed inlines and appended rows too.
+ */
+document.addEventListener("inline-controls:updated", (event) => {
+    const handlers = {
+        ".add-row": window.addInlineTemplateHandler,
+        ".delete-template": window.deleteInlineTemplateHandler,
+    };
+    for (const [selector, handler] of Object.entries(handlers)) {
+        if (typeof handler !== "function") {
+            continue;
+        }
+        for (const el of event.target.querySelectorAll(selector)) {
+            // The same listener is only added once.
+            el.addEventListener("click", handler);
+        }
+    }
+});