").addClass("status-content").text(data.status); // SAFE
+ $statusTd.append($statusContent);
+ let $imageTd = $("").text(imageDisplay);
+ let $modifiedTd = $(" ").text(modifiedTime);
+ $row.append($deviceTd, $statusTd, $imageTd, $modifiedTd);
+ tbody.append($row);
+
+ let operation = {
+ status: data.status,
+ id: data.operation_id,
+ progress: data.progress,
+ };
+ renderOperationProgressBarInCell($statusTd, operation);
+}
+
+function renderOperationProgressBarInCell(statusCell, operation) {
+ // Renders a visual progress bar in the given status cell based on the
+ // operation's status and progress.
+ let $ = django.jQuery;
+ let status = operation.status;
+ let progressPercentage = normalizeProgress(operation.progress, status);
+ statusCell.empty();
+ statusCell.append('');
+ let statusContainer = statusCell.find(".upgrade-status-container");
+ let statusClass = STATUS_TO_CSS_CLASS[status] || "";
+ if (STATUSES_WITH_FULL_PROGRESS.has(status)) {
+ progressPercentage = 100;
+ }
+ // Per operation bars do not show percentage text to keep table rows compact
+ let progressHtml = renderProgressBarHtml(progressPercentage, statusClass, false);
+ statusContainer.html(progressHtml);
+}
+
+function getBatchUpgradeIdFromUrl() {
+ try {
+ let matches = window.location.pathname.match(/\/batchupgradeoperation\/([^\/]+)\//);
+ return matches && matches[1] ? matches[1] : null;
+ } catch (error) {
+ console.error("Error extracting batch ID from URL:", error);
+ return null;
+ }
+}
+
+function initializeMainProgressBar($) {
+ let statusField = $(".field-status .readonly");
+ if (statusField.length > 0) {
+ let currentStatusText = statusField
+ .contents()
+ .filter(function () {
+ return this.nodeType === 3 && this.textContent.trim();
+ })
+ .first()
+ .text()
+ .trim();
+ let mainProgressElement = $(".batch-main-progress");
+ if (mainProgressElement.length > 0 && currentStatusText) {
+ let progressPercentage = 100;
+ let statusClass = "";
+ let showPercentageText;
+
+ if (currentStatusText === FW_UPGRADE_DISPLAY_STATUS.COMPLETED_SUCCESSFULLY) {
+ statusClass = FW_UPGRADE_CSS_CLASSES.COMPLETED_SUCCESSFULLY;
+ showPercentageText = true;
+ } else if (
+ currentStatusText === FW_UPGRADE_DISPLAY_STATUS.COMPLETED_WITH_CANCELLATIONS
+ ) {
+ statusClass = FW_UPGRADE_CSS_CLASSES.CANCELLED;
+ showPercentageText = false;
+ } else if (
+ currentStatusText === FW_UPGRADE_DISPLAY_STATUS.COMPLETED_WITH_FAILURES
+ ) {
+ statusClass = FW_UPGRADE_CSS_CLASSES.PARTIAL_SUCCESS;
+ showPercentageText = false;
+ } else if (currentStatusText === FW_UPGRADE_DISPLAY_STATUS.IN_PROGRESS) {
+ statusClass = FW_UPGRADE_CSS_CLASSES.IN_PROGRESS;
+ showPercentageText = true;
+ progressPercentage = 0;
+ } else {
+ statusClass = FW_UPGRADE_CSS_CLASSES.FAILED;
+ showPercentageText = false;
+ }
+ let progressHtml = `
+
+ `;
+ if (showPercentageText) {
+ progressHtml += `
+ ${escapeHtml(progressPercentage)}%
+ `;
+ }
+ mainProgressElement.html(progressHtml);
+ }
+ }
+}
diff --git a/openwisp_firmware_upgrader/static/firmware-upgrader/js/mass-upgrade-select2.js b/openwisp_firmware_upgrader/static/firmware-upgrader/js/mass-upgrade-select2.js
new file mode 100644
index 000000000..b49866611
--- /dev/null
+++ b/openwisp_firmware_upgrader/static/firmware-upgrader/js/mass-upgrade-select2.js
@@ -0,0 +1,21 @@
+"use strict";
+
+django.jQuery(function ($) {
+ $(".select2-input").each(function () {
+ var $element = $(this);
+ var placeholder = $element.data("placeholder") || gettext("Select an option");
+ $element.select2({
+ theme: "default",
+ dropdownCssClass: $element.data("dropdown-css-class"),
+ placeholder: placeholder,
+ allowClear: !!$element.data("allow-clear"),
+ width: "resolve",
+ minimumInputLength: 0,
+ language: {
+ noResults: function () {
+ return gettext("No results found.");
+ },
+ },
+ });
+ });
+});
diff --git a/openwisp_firmware_upgrader/static/firmware-upgrader/js/upgrade-progress.js b/openwisp_firmware_upgrader/static/firmware-upgrader/js/upgrade-progress.js
new file mode 100644
index 000000000..614bc5e3b
--- /dev/null
+++ b/openwisp_firmware_upgrader/static/firmware-upgrader/js/upgrade-progress.js
@@ -0,0 +1,472 @@
+"use strict";
+
+django.jQuery &&
+ django.jQuery(function ($) {
+ // Detect page type and get appropriate ID
+ const pageType = detectPageType();
+ const pageId = getPageId(pageType);
+ if (!pageId) {
+ return;
+ }
+ window.upgradePageType = pageType;
+ window.upgradePageId = pageId;
+
+ // Initialize based on page type
+ if (pageType === "device") {
+ // Device page with multiple operations
+ initializeExistingMultiUpgrades($);
+ } else if (pageType === "operation") {
+ // Single operation page
+ initializeExistingSingleUpgrade($);
+ }
+
+ const wsHost = getFirmwareUpgraderApiHost();
+ if (!wsHost) {
+ // error already logged by helper
+ return;
+ }
+ const wsUrl = getWebSocketUrl(pageType, pageId, wsHost);
+
+ const upgradeProgressWebSocket = new ReconnectingWebSocket(wsUrl, null, {
+ automaticOpen: false,
+ timeoutInterval: 7000,
+ maxReconnectAttempts: 5,
+ reconnectInterval: 3000,
+ });
+
+ window.upgradeProgressWebSocket = upgradeProgressWebSocket;
+ // Initialize websocket connection
+ initUpgradeProgressWebSockets($, upgradeProgressWebSocket);
+ });
+
+let upgradeOperationsInitialized = false;
+
+// Store accumulated log content to preserve across WebSocket reconnections
+let accumulatedLogContent = new Map();
+
+function formatLogForDisplay(logContent) {
+ return logContent ? escapeHtml(logContent).replace(/\n/g, "
") : ""; +} + +function getSanitizedStatusFromField(statusField) { + let statusText = + statusField.find(".upgrade-progress-text").text() || statusField.text().trim(); + statusText = statusText.replace(/\d+%.*$/, "").trim(); + let statusKey = getKeyFromValue(FW_UPGRADE_DISPLAY_STATUS, statusText); + return FW_UPGRADE_STATUS[statusKey]; +} + +function requestCurrentOperationState(websocket) { + if (websocket.readyState === WebSocket.OPEN) { + try { + let requestMessage = { + type: "request_current_state", + }; + // Add appropriate ID based on page type + if (window.upgradePageType === "device") { + requestMessage.device_id = window.upgradePageId; + } else if (window.upgradePageType === "operation") { + requestMessage.operation_id = window.upgradePageId; + } + websocket.send(JSON.stringify(requestMessage)); + } catch (error) { + console.error("Error requesting current state:", error); + } + } +} + +function initializeExistingMultiUpgrades($, isRetry = false) { + if (upgradeOperationsInitialized && isRetry) { + return; + } + let statusFields = $("#upgradeoperation_set-group .field-status .readonly"); + let processedCount = 0; + // loop over all the stauts fields + statusFields.each(function (index) { + let statusField = $(this); + let statusValue = getSanitizedStatusFromField(statusField); + if (statusField.find(".upgrade-status-container").length > 0) { + return; + } + if ( + statusValue && + (FW_STATUS_HELPERS.includesProgress(statusValue) || + ALL_VALID_FW_STATUSES.has(statusValue)) + ) { + let operationFieldset = statusField.closest(".dynamic-upgradeoperation_set"); + let logElement = operationFieldset.find(".field-log .readonly"); + // Get operation ID for restoring accumulated content + let operationIdInput = operationFieldset.find("input[name*='id'][value]"); + let operationId = + operationIdInput.length > 0 ? operationIdInput.val() : "unknown"; + // Use accumulated log content if available + let logContent; + if (accumulatedLogContent.has(operationId)) { + logContent = accumulatedLogContent.get(operationId); + if (logElement.length > 0) { + logElement.html(formatLogForDisplay(logContent)); + } + } else { + logContent = logElement.length > 0 ? logElement.text().trim() : ""; + // Store this initial content for future use + if (logContent && operationId !== "unknown") { + accumulatedLogContent.set(operationId, logContent); + } + } + // Create operation object for updateStatusWithProgressBar + let operation = { + status: statusValue, + log: logContent, + id: operationId, + progress: null, + }; + updateStatusWithProgressBar(statusField, operation); + processedCount++; + } + }); + // Mark as initialized if found and processed some operations, or if this is already a retry + if (processedCount > 0 || isRetry) { + upgradeOperationsInitialized = true; + } else if (!isRetry) { + setTimeout(function () { + initializeExistingMultiUpgrades($, true); + }, 1000); + } +} + +function initializeExistingSingleUpgrade($, isRetry = false) { + if (upgradeOperationsInitialized && isRetry) { + return; + } + let statusField = $(".field-status .readonly"); + let logElement = $(".field-log .readonly"); + if (statusField.find(".upgrade-status-container").length > 0) { + return; + } + let statusValue = getSanitizedStatusFromField(statusField); + if (statusValue) { + let operationId = window.upgradePageId; + let logContent = logElement.length > 0 ? logElement.text().trim() : ""; + if (logContent && operationId) { + accumulatedLogContent.set(operationId, logContent); + } + let operation = { + status: statusValue, + log: logContent, + id: operationId, + progress: null, + }; + updateStatusWithProgressBar(statusField, operation); + upgradeOperationsInitialized = true; + } else if (!isRetry) { + setTimeout(function () { + initializeExistingSingleUpgrade($, true); + }, 1000); + } +} + +function initUpgradeProgressWebSockets($, upgradeProgressWebSocket) { + upgradeProgressWebSocket.addEventListener("open", function (e) { + upgradeOperationsInitialized = false; + requestCurrentOperationState(upgradeProgressWebSocket); + }); + + upgradeProgressWebSocket.addEventListener("close", function (e) { + upgradeOperationsInitialized = false; + + if (e.code === 1006) { + console.error("WebSocket closed"); + } + }); + + upgradeProgressWebSocket.addEventListener("error", function (e) { + console.error("WebSocket error occurred", e); + }); + + upgradeProgressWebSocket.addEventListener("message", function (e) { + try { + let data = JSON.parse(e.data); + // Both device & operation pages receive "operation_update" events. + if (data.type === "operation_update") { + let op = data.operation; + if (op) { + updateUpgradeOperationDisplay(op); + } + } + } catch (error) { + console.error("Error parsing WebSocket message:", error); + } + }); + upgradeProgressWebSocket.open(); +} + +function updateUpgradeOperationDisplay(operation) { + let $ = django.jQuery, + operationFieldset; + + if (window.upgradePageType === "device") { + let operationIdInputField = $(`input[value="${$.escapeSelector(operation.id)}"]`); + if (!operationIdInputField.length) { + return; + } + operationFieldset = operationIdInputField.parent().find("fieldset"); + } else if (window.upgradePageType === "operation") { + operationFieldset = $("#upgradeoperation_form fieldset"); + } + + let statusField = operationFieldset.find(".field-status .readonly"); + if (operation.log && operation.id) { + accumulatedLogContent.set(operation.id, operation.log); + } + // Update status with progress bar + updateStatusWithProgressBar(statusField, operation); + let logElement = operationFieldset.find(".field-log .readonly"); + let shouldScroll = isScrolledToBottom(logElement); + logElement.html(formatLogForDisplay(operation.log)); + if (FW_STATUS_HELPERS.isCompleted(operation.status)) { + accumulatedLogContent.delete(operation.id); + } + // Auto-scroll to bottom if user was already at bottom + if (shouldScroll) { + scrollToBottom(logElement); + } + // Update modified timestamp + if (operation.modified) { + operationFieldset + .find(".field-modified .readonly") + .html(getFormattedDateTimeString(operation.modified)); + } +} + +function updateStatusWithProgressBar(statusField, operation) { + let $ = django.jQuery; + let status = operation.status; + let progressPercentage = getProgressPercentage(status, operation.progress); + let progressClass = status.replace(/\s+/g, "-"); + let statusKey = getKeyFromValue(FW_UPGRADE_STATUS, status); + let statusHtml = ` + + ${FW_UPGRADE_DISPLAY_STATUS[statusKey]} + + `; + if (FW_STATUS_GROUPS.IN_PROGRESS.has(status)) { + statusHtml += ` + + + ${escapeHtml(progressPercentage)}% + + `; + const canCancel = progressPercentage < 65; + const cancelButtonClass = canCancel + ? "upgrade-cancel-btn" + : "upgrade-cancel-btn disabled"; + const cancelButtonTitle = canCancel + ? gettext("Cancel upgrade") + : gettext("Cannot cancel - firmware flashing in progress"); + statusHtml += ` + + `; + } else if (FW_STATUS_GROUPS.SUCCESS.has(status)) { + statusHtml += ` + + 100% + `; + } else if (FW_STATUS_GROUPS.FAILURE.has(status)) { + statusHtml += ` + + `; + } else { + statusHtml += ` + + + ${progressPercentage}% + + `; + } + if (!statusField.find(".upgrade-status-container").length) { + statusField.empty(); + statusField.append(''); + } + let statusContainer = statusField.find(".upgrade-status-container"); + statusContainer.html(statusHtml); + statusContainer + .find(".upgrade-cancel-btn:not(.disabled)") + .off("click") + .on("click", function (e) { + e.preventDefault(); + const operationId = $(this).data("operation-id"); + showCancelConfirmationModal(operationId); + }); +} + +function getProgressPercentage(status, operationProgress = null) { + if (operationProgress !== null && operationProgress !== undefined) { + return Math.min(100, Math.max(0, operationProgress)); + } + if (status === FW_UPGRADE_STATUS.SUCCESS) { + return 100; + } + return 0; +} + +function detectPageType() { + // Check if it's a single upgrade operation page + if (document.getElementById("upgradeoperation_form")) { + return "operation"; + } + // Check if it's a device page (with upgrade operations) + if (document.getElementById("upgradeoperation_set-group")) { + return "device"; + } + return null; +} + +function getPageId(pageType) { + if (pageType === "operation") { + return getOperationIdFromUrl(); + } else if (pageType === "device") { + return getObjectIdFromUrl(); + } + return null; +} + +function getWebSocketUrl(pageType, pageId, wsHost) { + const protocol = getWebSocketProtocol(); + if (pageType === "operation") { + return `${protocol}${wsHost}/ws/firmware-upgrader/upgrade-operation/${pageId}/`; + } else if (pageType === "device") { + return `${protocol}${wsHost}/ws/firmware-upgrader/device/${pageId}/`; + } + return null; +} + +function getOperationIdFromUrl() { + try { + let matches = window.location.pathname.match(/\/upgradeoperation\/([^\/]+)\//); + return matches && matches[1] ? matches[1] : null; + } catch (error) { + console.error("Error extracting operation ID from URL:", error); + return null; + } +} + +function getObjectIdFromUrl() { + let objectId; + try { + objectId = /\/((\w{4,12}-?)){5}\//.exec(window.location)[0]; + } catch (error) { + try { + objectId = /\/(\d+)\//.exec(window.location)[0]; + } catch (error) { + return null; + } + } + return objectId.replace(/\//g, ""); +} + +function showCancelConfirmationModal(operationId) { + const $ = django.jQuery; + // Create modal if it doesn't exist + if ($("#ow-cancel-confirmation-modal").length === 0) { + createCancelConfirmationModal($); + } + // Set the operation ID and show the modal + $("#ow-cancel-confirmation-modal").data("operation-id", operationId); + $("#ow-cancel-confirmation-modal").removeClass("ow-hide"); +} + +function createCancelConfirmationModal($) { + const modalHtml = ` + + `; + $("body").append(modalHtml); + // Close modal handlers + $("#ow-cancel-confirmation-modal .ow-dialog-close").on("click", function () { + $("#ow-cancel-confirmation-modal").addClass("ow-hide"); + }); + // Confirm cancellation handler + $("#ow-cancel-confirmation-modal .ow-cancel-btn-confirm").on("click", function () { + const operationId = $("#ow-cancel-confirmation-modal").data("operation-id"); + $("#ow-cancel-confirmation-modal").addClass("ow-hide"); + cancelUpgradeOperation(operationId); + }); + // Close on escape key + $(document).on("keyup", function (e) { + if (e.keyCode === 27 && $("#ow-cancel-confirmation-modal").is(":visible")) { + $("#ow-cancel-confirmation-modal").addClass("ow-hide"); + } + }); + // Close on overlay click (outside dialog) + $("#ow-cancel-confirmation-modal").on("click", function (e) { + if (e.target === this) { + $(this).addClass("ow-hide"); + } + }); +} + +function cancelUpgradeOperation(operationId) { + const $ = django.jQuery; + // Show loading overlay + $("#ow-loading").show(); + $.ajax({ + url: owUpgradeOperationCancelUrl.replace( + "00000000-0000-0000-0000-000000000000", + operationId, + ), + type: "POST", + headers: { + "X-CSRFToken": $('input[name="csrfmiddlewaretoken"]').val(), + }, + xhrFields: { + withCredentials: true, + }, + crossDomain: true, + success: function (response) { + $("#ow-loading").hide(); + }, + error: function (xhr, status, error) { + $("#ow-loading").hide(); + let errorMessage = gettext("Failed to cancel upgrade operation."); + alert(errorMessage); + }, + }); +} diff --git a/openwisp_firmware_upgrader/static/firmware-upgrader/js/upgrade-selected-confirmation.js b/openwisp_firmware_upgrader/static/firmware-upgrader/js/upgrade-selected-confirmation.js index e9a47ce61..37b1b672e 100644 --- a/openwisp_firmware_upgrader/static/firmware-upgrader/js/upgrade-selected-confirmation.js +++ b/openwisp_firmware_upgrader/static/firmware-upgrader/js/upgrade-selected-confirmation.js @@ -1,7 +1,8 @@ "use strict"; django.jQuery(function ($) { - if (firmwareUpgraderSchema === null) { + const upgradeOptions = $('textarea[name="upgrade_options"]'); + if (firmwareUpgraderSchema === null || !upgradeOptions.length) { $(".form-row").hide(); } else { django._loadJsonSchemaUi( diff --git a/openwisp_firmware_upgrader/static/firmware-upgrader/js/upgrade-utils.js b/openwisp_firmware_upgrader/static/firmware-upgrader/js/upgrade-utils.js new file mode 100644 index 000000000..054891275 --- /dev/null +++ b/openwisp_firmware_upgrader/static/firmware-upgrader/js/upgrade-utils.js @@ -0,0 +1,218 @@ +"use strict"; + +// Core firmware upgrade statuses +const FW_UPGRADE_STATUS = { + SUCCESS: "success", + FAILED: "failed", + ABORTED: "aborted", + CANCELLED: "cancelled", + IN_PROGRESS: "in-progress", +}; + +// Display statuses +const FW_UPGRADE_DISPLAY_STATUS = { + SUCCESS: gettext("success"), + FAILED: gettext("failed"), + ABORTED: gettext("aborted"), + CANCELLED: gettext("cancelled"), + IN_PROGRESS: gettext("in progress"), + COMPLETED_SUCCESSFULLY: gettext("completed successfully"), + COMPLETED_WITH_FAILURES: gettext("completed with some failures"), + COMPLETED_WITH_CANCELLATIONS: gettext("completed with some cancellations"), +}; + +// CSS class names +const FW_UPGRADE_CSS_CLASSES = { + COMPLETED_SUCCESSFULLY: "completed-successfully", + PARTIAL_SUCCESS: "partial-success", + CANCELLED: "cancelled", + FAILED: "failed", + IN_PROGRESS: "in-progress", + SUCCESS: "success", + ABORTED: "aborted", +}; + +const VALID_FW_STATUSES = new Set(Object.values(FW_UPGRADE_STATUS)); + +// For rendering checks (from HTML display values): include both backend and display statuses +const ALL_VALID_FW_STATUSES = new Set([ + ...Object.values(FW_UPGRADE_STATUS), + ...Object.values(FW_UPGRADE_DISPLAY_STATUS), +]); + +// Status groups for easier conditional checking +const FW_STATUS_GROUPS = { + COMPLETED: new Set([ + FW_UPGRADE_STATUS.SUCCESS, + FW_UPGRADE_STATUS.FAILED, + FW_UPGRADE_STATUS.ABORTED, + FW_UPGRADE_STATUS.CANCELLED, + FW_UPGRADE_DISPLAY_STATUS.COMPLETED_SUCCESSFULLY, + FW_UPGRADE_DISPLAY_STATUS.COMPLETED_WITH_FAILURES, + FW_UPGRADE_DISPLAY_STATUS.COMPLETED_WITH_CANCELLATIONS, + ]), + + IN_PROGRESS: new Set([ + FW_UPGRADE_STATUS.IN_PROGRESS, + FW_UPGRADE_DISPLAY_STATUS.IN_PROGRESS, + ]), + + SUCCESS: new Set([ + FW_UPGRADE_STATUS.SUCCESS, + FW_UPGRADE_DISPLAY_STATUS.COMPLETED_SUCCESSFULLY, + ]), + + FAILURE: new Set([ + FW_UPGRADE_STATUS.FAILED, + FW_UPGRADE_STATUS.ABORTED, + FW_UPGRADE_STATUS.CANCELLED, + ]), +}; + +const FW_STATUS_HELPERS = { + isValid: (status) => ALL_VALID_FW_STATUSES.has(status), + isCompleted: (status) => FW_STATUS_GROUPS.COMPLETED.has(status), + isInProgress: (status) => FW_STATUS_GROUPS.IN_PROGRESS.has(status), + isSuccess: (status) => FW_STATUS_GROUPS.SUCCESS.has(status), + isFailure: (status) => FW_STATUS_GROUPS.FAILURE.has(status), + includesProgress: (status) => status && status.includes("progress"), +}; + +// Mapping of status to CSS class for progress bars +const STATUS_TO_CSS_CLASS = { + [FW_UPGRADE_STATUS.IN_PROGRESS]: FW_UPGRADE_CSS_CLASSES.IN_PROGRESS, + [FW_UPGRADE_STATUS.SUCCESS]: FW_UPGRADE_CSS_CLASSES.SUCCESS, + [FW_UPGRADE_STATUS.FAILED]: FW_UPGRADE_CSS_CLASSES.FAILED, + [FW_UPGRADE_STATUS.ABORTED]: FW_UPGRADE_CSS_CLASSES.ABORTED, + [FW_UPGRADE_STATUS.CANCELLED]: FW_UPGRADE_CSS_CLASSES.CANCELLED, +}; + +// Statuses that should show 100% progress +const STATUSES_WITH_FULL_PROGRESS = new Set([ + FW_UPGRADE_STATUS.SUCCESS, + FW_UPGRADE_STATUS.FAILED, + FW_UPGRADE_STATUS.ABORTED, + FW_UPGRADE_STATUS.CANCELLED, +]); + +// returns the object key of statusMap corresponding to value +function getKeyFromValue(statusMap, value) { + return Object.keys(statusMap).find((key) => statusMap[key] === value); +} + +// Normalize numeric progress input and fallback to sensible defaults. +function normalizeProgress(operationProgress = null, status) { + if (operationProgress !== null && operationProgress !== undefined) { + let parsed = parseInt(operationProgress, 10); + if (isNaN(parsed)) { + return 0; + } + return Math.min(100, Math.max(0, parsed)); + } + if (FW_STATUS_HELPERS.isCompleted(status)) { + return 100; + } + return 0; +} + +// Return progress bar HTML fragment given percentage and CSS class. +function renderProgressBarHtml( + progressPercentage, + statusClass, + showPercentageText = true, +) { + return ` + + ${showPercentageText ? `${progressPercentage}%` : ""} + `; +} + +function getWebSocketProtocol() { + let protocol = "ws://"; + if (window.location.protocol === "https:") { + protocol = "wss://"; + } + return protocol; +} + +/** + * HTML-escape a string to prevent insertion of untrusted content into DOM + * fragments. + */ +function escapeHtml(unsafe) { + if (unsafe === null || unsafe === undefined) { + return ""; + } + unsafe = String(unsafe); + return unsafe + .replace(/&/g, "&") + .replace(//g, ">") + .replace(/"/g, """) + .replace(/'/g, "'"); +} + +/** + * Return the host portion of the firmware upgrader API host configured + * by the server. When the global `owFirmwareUpgraderApiHost` object is + * missing or does not contain a `host` property we log an error and return + * null so callers can bail out gracefully. + */ +function getFirmwareUpgraderApiHost() { + if ( + typeof owFirmwareUpgraderApiHost === "undefined" || + !owFirmwareUpgraderApiHost.host + ) { + console.error("owFirmwareUpgraderApiHost is not defined or missing host property"); + return null; + } + return owFirmwareUpgraderApiHost.host; +} + +function getFormattedDateTimeString(dateTimeString) { + let dateTime = new Date(dateTimeString); + let locale = window.djangoLocale || "en-us"; + return dateTime.toLocaleString(locale, { + year: "numeric", + month: "short", + day: "numeric", + hour: "numeric", + minute: "2-digit", + }); +} + +function isScrolledToBottom(element) { + if (!element || !element.length) return false; + let el = element[0]; + return el.scrollHeight - el.clientHeight <= el.scrollTop + 1; +} + +function scrollToBottom(element) { + if (element && element.length) { + let el = element[0]; + el.scrollTop = el.scrollHeight - el.clientHeight; + } +} + +if (typeof window !== "undefined") { + window.FW_UPGRADE_STATUS = FW_UPGRADE_STATUS; + window.FW_UPGRADE_DISPLAY_STATUS = FW_UPGRADE_DISPLAY_STATUS; + window.FW_UPGRADE_CSS_CLASSES = FW_UPGRADE_CSS_CLASSES; + window.VALID_FW_STATUSES = VALID_FW_STATUSES; + window.VALID_FW_DISPLAY_STATUSES = new Set(Object.values(FW_UPGRADE_DISPLAY_STATUS)); + window.ALL_VALID_FW_STATUSES = ALL_VALID_FW_STATUSES; + window.FW_STATUS_GROUPS = FW_STATUS_GROUPS; + window.FW_STATUS_HELPERS = FW_STATUS_HELPERS; + window.STATUS_TO_CSS_CLASS = STATUS_TO_CSS_CLASS; + window.STATUSES_WITH_FULL_PROGRESS = STATUSES_WITH_FULL_PROGRESS; + window.normalizeProgress = normalizeProgress; + window.renderProgressBarHtml = renderProgressBarHtml; + window.getWebSocketProtocol = getWebSocketProtocol; + window.escapeHtml = escapeHtml; + window.getFirmwareUpgraderApiHost = getFirmwareUpgraderApiHost; + window.getFormattedDateTimeString = getFormattedDateTimeString; + window.isScrolledToBottom = isScrolledToBottom; + window.scrollToBottom = scrollToBottom; +} diff --git a/openwisp_firmware_upgrader/templates/admin/firmware_upgrader/batch_upgrade_operation_change_form.html b/openwisp_firmware_upgrader/templates/admin/firmware_upgrader/batch_upgrade_operation_change_form.html new file mode 100644 index 000000000..263164330 --- /dev/null +++ b/openwisp_firmware_upgrader/templates/admin/firmware_upgrader/batch_upgrade_operation_change_form.html @@ -0,0 +1,193 @@ +{% extends "admin/change_form.html" %} +{% load i18n admin_urls static admin_list ow_tags %} + +{% block extrahead %} +{{ block.super }} + + + + +{% endblock %} + +{% block content %} +{{ block.super }} + + +Mass upgrade operation with ID “{batch.pk}”'
+ " doesn’t exist. Perhaps it was deleted? ",
+ html=True,
+ )
+
+ env["category"].organization = org1
+ env["category"].save()
+ with self.subTest(
+ "Superuser: Organization filter hidden when category belongs to org"
+ ):
+ self._login()
+ response = self.client.get(url)
+ self.assertEqual(response.status_code, 200)
+ self.assertNotContains(response, "By organization")
+
+ with self.subTest(
+ "Org admin: Organization filter hidden when category belongs to org"
+ ):
+ self.client.force_login(org1_admin)
+ response = self.client.get(url)
+ self.assertEqual(response.status_code, 200)
+ self.assertNotContains(response, "By organization")
+
+ def test_batch_upgrade_operation_filters(self, *args):
+ """Test that filter UI elements are displayed correctly for organization admin"""
+ env = self._create_upgrade_env()
+ org_admin = self._create_administrator(organizations=[env["d1"].organization])
+ self.client.force_login(org_admin)
+ batch = env["build2"].batch_upgrade(firmwareless=True)
+ url = reverse(
+ f"admin:{self.app_label}_batchupgradeoperation_change", args=[batch.pk]
+ )
+
+ with self.subTest("Test filter UI elements are present"):
+ response = self.client.get(url)
+ self.assertEqual(response.status_code, 200)
+ # Check status filter options
+ self.assertContains(response, "By status")
+ self.assertContains(response, 'title="in progress"')
+ self.assertContains(response, 'title="success"')
+ self.assertContains(response, 'title="failed"')
+ # Organization filter should not be present because the build's category is not shared
+ self.assertNotContains(response, "By organization")
+
+ with self.subTest("Test active filter indication"):
+ # Test with status filter active
+ response = self.client.get(url + "?status=in-progress")
+ self.assertEqual(response.status_code, 200)
+ # Check that the in-progress status is selected
+ self.assertContains(
+ response,
+ (
+ ''
+ "in progress"
+ ),
+ html=True,
+ )
+
+ with self.subTest("Filter link building preserves other GET params"):
+ # Apply search and status simultaneously and verify the generated
+ # "All" choice keeps the search parameter when building its
+ # query string. The href for the idle option will still contain
+ # both params, but the important part is the all link.
+ response = self.client.get(url + "?q=testsearch&status=idle")
+ self.assertEqual(response.status_code, 200)
+ content = response.content.decode()
+ self.assertIn('href="?q=testsearch"', content)
+ self.assertContains(
+ response,
+ 'All',
+ html=True,
+ )
+
_mock_upgrade = "openwisp_firmware_upgrader.upgraders.openwrt.OpenWrt.upgrade"
_mock_connect = "openwisp_controller.connection.models.DeviceConnection.connect"
@@ -559,8 +676,7 @@ def test_upgrade_selected_action_perms(self, *args):
obj=env["build1"],
message=(
"You can track the progress of this mass upgrade operation "
- "in this page. Refresh the page from time to time to check "
- "its progress."
+ "in this page."
),
required_perms=["change"],
extra_payload={
@@ -887,7 +1003,7 @@ def test_using_upgrade_options_with_unsupported_upgrader(self, *args):
reverse("admin:config_device_change", args=[device.id])
)
self.assertContains(
- response, ""
+ response, "
") : ""; +} + +function getSanitizedStatusFromField(statusField) { + let statusText = + statusField.find(".upgrade-progress-text").text() || statusField.text().trim(); + statusText = statusText.replace(/\d+%.*$/, "").trim(); + let statusKey = getKeyFromValue(FW_UPGRADE_DISPLAY_STATUS, statusText); + return FW_UPGRADE_STATUS[statusKey]; +} + +function requestCurrentOperationState(websocket) { + if (websocket.readyState === WebSocket.OPEN) { + try { + let requestMessage = { + type: "request_current_state", + }; + // Add appropriate ID based on page type + if (window.upgradePageType === "device") { + requestMessage.device_id = window.upgradePageId; + } else if (window.upgradePageType === "operation") { + requestMessage.operation_id = window.upgradePageId; + } + websocket.send(JSON.stringify(requestMessage)); + } catch (error) { + console.error("Error requesting current state:", error); + } + } +} + +function initializeExistingMultiUpgrades($, isRetry = false) { + if (upgradeOperationsInitialized && isRetry) { + return; + } + let statusFields = $("#upgradeoperation_set-group .field-status .readonly"); + let processedCount = 0; + // loop over all the stauts fields + statusFields.each(function (index) { + let statusField = $(this); + let statusValue = getSanitizedStatusFromField(statusField); + if (statusField.find(".upgrade-status-container").length > 0) { + return; + } + if ( + statusValue && + (FW_STATUS_HELPERS.includesProgress(statusValue) || + ALL_VALID_FW_STATUSES.has(statusValue)) + ) { + let operationFieldset = statusField.closest(".dynamic-upgradeoperation_set"); + let logElement = operationFieldset.find(".field-log .readonly"); + // Get operation ID for restoring accumulated content + let operationIdInput = operationFieldset.find("input[name*='id'][value]"); + let operationId = + operationIdInput.length > 0 ? operationIdInput.val() : "unknown"; + // Use accumulated log content if available + let logContent; + if (accumulatedLogContent.has(operationId)) { + logContent = accumulatedLogContent.get(operationId); + if (logElement.length > 0) { + logElement.html(formatLogForDisplay(logContent)); + } + } else { + logContent = logElement.length > 0 ? logElement.text().trim() : ""; + // Store this initial content for future use + if (logContent && operationId !== "unknown") { + accumulatedLogContent.set(operationId, logContent); + } + } + // Create operation object for updateStatusWithProgressBar + let operation = { + status: statusValue, + log: logContent, + id: operationId, + progress: null, + }; + updateStatusWithProgressBar(statusField, operation); + processedCount++; + } + }); + // Mark as initialized if found and processed some operations, or if this is already a retry + if (processedCount > 0 || isRetry) { + upgradeOperationsInitialized = true; + } else if (!isRetry) { + setTimeout(function () { + initializeExistingMultiUpgrades($, true); + }, 1000); + } +} + +function initializeExistingSingleUpgrade($, isRetry = false) { + if (upgradeOperationsInitialized && isRetry) { + return; + } + let statusField = $(".field-status .readonly"); + let logElement = $(".field-log .readonly"); + if (statusField.find(".upgrade-status-container").length > 0) { + return; + } + let statusValue = getSanitizedStatusFromField(statusField); + if (statusValue) { + let operationId = window.upgradePageId; + let logContent = logElement.length > 0 ? logElement.text().trim() : ""; + if (logContent && operationId) { + accumulatedLogContent.set(operationId, logContent); + } + let operation = { + status: statusValue, + log: logContent, + id: operationId, + progress: null, + }; + updateStatusWithProgressBar(statusField, operation); + upgradeOperationsInitialized = true; + } else if (!isRetry) { + setTimeout(function () { + initializeExistingSingleUpgrade($, true); + }, 1000); + } +} + +function initUpgradeProgressWebSockets($, upgradeProgressWebSocket) { + upgradeProgressWebSocket.addEventListener("open", function (e) { + upgradeOperationsInitialized = false; + requestCurrentOperationState(upgradeProgressWebSocket); + }); + + upgradeProgressWebSocket.addEventListener("close", function (e) { + upgradeOperationsInitialized = false; + + if (e.code === 1006) { + console.error("WebSocket closed"); + } + }); + + upgradeProgressWebSocket.addEventListener("error", function (e) { + console.error("WebSocket error occurred", e); + }); + + upgradeProgressWebSocket.addEventListener("message", function (e) { + try { + let data = JSON.parse(e.data); + // Both device & operation pages receive "operation_update" events. + if (data.type === "operation_update") { + let op = data.operation; + if (op) { + updateUpgradeOperationDisplay(op); + } + } + } catch (error) { + console.error("Error parsing WebSocket message:", error); + } + }); + upgradeProgressWebSocket.open(); +} + +function updateUpgradeOperationDisplay(operation) { + let $ = django.jQuery, + operationFieldset; + + if (window.upgradePageType === "device") { + let operationIdInputField = $(`input[value="${$.escapeSelector(operation.id)}"]`); + if (!operationIdInputField.length) { + return; + } + operationFieldset = operationIdInputField.parent().find("fieldset"); + } else if (window.upgradePageType === "operation") { + operationFieldset = $("#upgradeoperation_form fieldset"); + } + + let statusField = operationFieldset.find(".field-status .readonly"); + if (operation.log && operation.id) { + accumulatedLogContent.set(operation.id, operation.log); + } + // Update status with progress bar + updateStatusWithProgressBar(statusField, operation); + let logElement = operationFieldset.find(".field-log .readonly"); + let shouldScroll = isScrolledToBottom(logElement); + logElement.html(formatLogForDisplay(operation.log)); + if (FW_STATUS_HELPERS.isCompleted(operation.status)) { + accumulatedLogContent.delete(operation.id); + } + // Auto-scroll to bottom if user was already at bottom + if (shouldScroll) { + scrollToBottom(logElement); + } + // Update modified timestamp + if (operation.modified) { + operationFieldset + .find(".field-modified .readonly") + .html(getFormattedDateTimeString(operation.modified)); + } +} + +function updateStatusWithProgressBar(statusField, operation) { + let $ = django.jQuery; + let status = operation.status; + let progressPercentage = getProgressPercentage(status, operation.progress); + let progressClass = status.replace(/\s+/g, "-"); + let statusKey = getKeyFromValue(FW_UPGRADE_STATUS, status); + let statusHtml = ` + + ${FW_UPGRADE_DISPLAY_STATUS[statusKey]} + + `; + if (FW_STATUS_GROUPS.IN_PROGRESS.has(status)) { + statusHtml += ` + + + ${escapeHtml(progressPercentage)}% + + `; + const canCancel = progressPercentage < 65; + const cancelButtonClass = canCancel + ? "upgrade-cancel-btn" + : "upgrade-cancel-btn disabled"; + const cancelButtonTitle = canCancel + ? gettext("Cancel upgrade") + : gettext("Cannot cancel - firmware flashing in progress"); + statusHtml += ` + + `; + } else if (FW_STATUS_GROUPS.SUCCESS.has(status)) { + statusHtml += ` + + 100% + `; + } else if (FW_STATUS_GROUPS.FAILURE.has(status)) { + statusHtml += ` + + `; + } else { + statusHtml += ` + + + ${progressPercentage}% + + `; + } + if (!statusField.find(".upgrade-status-container").length) { + statusField.empty(); + statusField.append(''); + } + let statusContainer = statusField.find(".upgrade-status-container"); + statusContainer.html(statusHtml); + statusContainer + .find(".upgrade-cancel-btn:not(.disabled)") + .off("click") + .on("click", function (e) { + e.preventDefault(); + const operationId = $(this).data("operation-id"); + showCancelConfirmationModal(operationId); + }); +} + +function getProgressPercentage(status, operationProgress = null) { + if (operationProgress !== null && operationProgress !== undefined) { + return Math.min(100, Math.max(0, operationProgress)); + } + if (status === FW_UPGRADE_STATUS.SUCCESS) { + return 100; + } + return 0; +} + +function detectPageType() { + // Check if it's a single upgrade operation page + if (document.getElementById("upgradeoperation_form")) { + return "operation"; + } + // Check if it's a device page (with upgrade operations) + if (document.getElementById("upgradeoperation_set-group")) { + return "device"; + } + return null; +} + +function getPageId(pageType) { + if (pageType === "operation") { + return getOperationIdFromUrl(); + } else if (pageType === "device") { + return getObjectIdFromUrl(); + } + return null; +} + +function getWebSocketUrl(pageType, pageId, wsHost) { + const protocol = getWebSocketProtocol(); + if (pageType === "operation") { + return `${protocol}${wsHost}/ws/firmware-upgrader/upgrade-operation/${pageId}/`; + } else if (pageType === "device") { + return `${protocol}${wsHost}/ws/firmware-upgrader/device/${pageId}/`; + } + return null; +} + +function getOperationIdFromUrl() { + try { + let matches = window.location.pathname.match(/\/upgradeoperation\/([^\/]+)\//); + return matches && matches[1] ? matches[1] : null; + } catch (error) { + console.error("Error extracting operation ID from URL:", error); + return null; + } +} + +function getObjectIdFromUrl() { + let objectId; + try { + objectId = /\/((\w{4,12}-?)){5}\//.exec(window.location)[0]; + } catch (error) { + try { + objectId = /\/(\d+)\//.exec(window.location)[0]; + } catch (error) { + return null; + } + } + return objectId.replace(/\//g, ""); +} + +function showCancelConfirmationModal(operationId) { + const $ = django.jQuery; + // Create modal if it doesn't exist + if ($("#ow-cancel-confirmation-modal").length === 0) { + createCancelConfirmationModal($); + } + // Set the operation ID and show the modal + $("#ow-cancel-confirmation-modal").data("operation-id", operationId); + $("#ow-cancel-confirmation-modal").removeClass("ow-hide"); +} + +function createCancelConfirmationModal($) { + const modalHtml = ` + + `; + $("body").append(modalHtml); + // Close modal handlers + $("#ow-cancel-confirmation-modal .ow-dialog-close").on("click", function () { + $("#ow-cancel-confirmation-modal").addClass("ow-hide"); + }); + // Confirm cancellation handler + $("#ow-cancel-confirmation-modal .ow-cancel-btn-confirm").on("click", function () { + const operationId = $("#ow-cancel-confirmation-modal").data("operation-id"); + $("#ow-cancel-confirmation-modal").addClass("ow-hide"); + cancelUpgradeOperation(operationId); + }); + // Close on escape key + $(document).on("keyup", function (e) { + if (e.keyCode === 27 && $("#ow-cancel-confirmation-modal").is(":visible")) { + $("#ow-cancel-confirmation-modal").addClass("ow-hide"); + } + }); + // Close on overlay click (outside dialog) + $("#ow-cancel-confirmation-modal").on("click", function (e) { + if (e.target === this) { + $(this).addClass("ow-hide"); + } + }); +} + +function cancelUpgradeOperation(operationId) { + const $ = django.jQuery; + // Show loading overlay + $("#ow-loading").show(); + $.ajax({ + url: owUpgradeOperationCancelUrl.replace( + "00000000-0000-0000-0000-000000000000", + operationId, + ), + type: "POST", + headers: { + "X-CSRFToken": $('input[name="csrfmiddlewaretoken"]').val(), + }, + xhrFields: { + withCredentials: true, + }, + crossDomain: true, + success: function (response) { + $("#ow-loading").hide(); + }, + error: function (xhr, status, error) { + $("#ow-loading").hide(); + let errorMessage = gettext("Failed to cancel upgrade operation."); + alert(errorMessage); + }, + }); +} diff --git a/openwisp_firmware_upgrader/static/firmware-upgrader/js/upgrade-selected-confirmation.js b/openwisp_firmware_upgrader/static/firmware-upgrader/js/upgrade-selected-confirmation.js index e9a47ce61..37b1b672e 100644 --- a/openwisp_firmware_upgrader/static/firmware-upgrader/js/upgrade-selected-confirmation.js +++ b/openwisp_firmware_upgrader/static/firmware-upgrader/js/upgrade-selected-confirmation.js @@ -1,7 +1,8 @@ "use strict"; django.jQuery(function ($) { - if (firmwareUpgraderSchema === null) { + const upgradeOptions = $('textarea[name="upgrade_options"]'); + if (firmwareUpgraderSchema === null || !upgradeOptions.length) { $(".form-row").hide(); } else { django._loadJsonSchemaUi( diff --git a/openwisp_firmware_upgrader/static/firmware-upgrader/js/upgrade-utils.js b/openwisp_firmware_upgrader/static/firmware-upgrader/js/upgrade-utils.js new file mode 100644 index 000000000..054891275 --- /dev/null +++ b/openwisp_firmware_upgrader/static/firmware-upgrader/js/upgrade-utils.js @@ -0,0 +1,218 @@ +"use strict"; + +// Core firmware upgrade statuses +const FW_UPGRADE_STATUS = { + SUCCESS: "success", + FAILED: "failed", + ABORTED: "aborted", + CANCELLED: "cancelled", + IN_PROGRESS: "in-progress", +}; + +// Display statuses +const FW_UPGRADE_DISPLAY_STATUS = { + SUCCESS: gettext("success"), + FAILED: gettext("failed"), + ABORTED: gettext("aborted"), + CANCELLED: gettext("cancelled"), + IN_PROGRESS: gettext("in progress"), + COMPLETED_SUCCESSFULLY: gettext("completed successfully"), + COMPLETED_WITH_FAILURES: gettext("completed with some failures"), + COMPLETED_WITH_CANCELLATIONS: gettext("completed with some cancellations"), +}; + +// CSS class names +const FW_UPGRADE_CSS_CLASSES = { + COMPLETED_SUCCESSFULLY: "completed-successfully", + PARTIAL_SUCCESS: "partial-success", + CANCELLED: "cancelled", + FAILED: "failed", + IN_PROGRESS: "in-progress", + SUCCESS: "success", + ABORTED: "aborted", +}; + +const VALID_FW_STATUSES = new Set(Object.values(FW_UPGRADE_STATUS)); + +// For rendering checks (from HTML display values): include both backend and display statuses +const ALL_VALID_FW_STATUSES = new Set([ + ...Object.values(FW_UPGRADE_STATUS), + ...Object.values(FW_UPGRADE_DISPLAY_STATUS), +]); + +// Status groups for easier conditional checking +const FW_STATUS_GROUPS = { + COMPLETED: new Set([ + FW_UPGRADE_STATUS.SUCCESS, + FW_UPGRADE_STATUS.FAILED, + FW_UPGRADE_STATUS.ABORTED, + FW_UPGRADE_STATUS.CANCELLED, + FW_UPGRADE_DISPLAY_STATUS.COMPLETED_SUCCESSFULLY, + FW_UPGRADE_DISPLAY_STATUS.COMPLETED_WITH_FAILURES, + FW_UPGRADE_DISPLAY_STATUS.COMPLETED_WITH_CANCELLATIONS, + ]), + + IN_PROGRESS: new Set([ + FW_UPGRADE_STATUS.IN_PROGRESS, + FW_UPGRADE_DISPLAY_STATUS.IN_PROGRESS, + ]), + + SUCCESS: new Set([ + FW_UPGRADE_STATUS.SUCCESS, + FW_UPGRADE_DISPLAY_STATUS.COMPLETED_SUCCESSFULLY, + ]), + + FAILURE: new Set([ + FW_UPGRADE_STATUS.FAILED, + FW_UPGRADE_STATUS.ABORTED, + FW_UPGRADE_STATUS.CANCELLED, + ]), +}; + +const FW_STATUS_HELPERS = { + isValid: (status) => ALL_VALID_FW_STATUSES.has(status), + isCompleted: (status) => FW_STATUS_GROUPS.COMPLETED.has(status), + isInProgress: (status) => FW_STATUS_GROUPS.IN_PROGRESS.has(status), + isSuccess: (status) => FW_STATUS_GROUPS.SUCCESS.has(status), + isFailure: (status) => FW_STATUS_GROUPS.FAILURE.has(status), + includesProgress: (status) => status && status.includes("progress"), +}; + +// Mapping of status to CSS class for progress bars +const STATUS_TO_CSS_CLASS = { + [FW_UPGRADE_STATUS.IN_PROGRESS]: FW_UPGRADE_CSS_CLASSES.IN_PROGRESS, + [FW_UPGRADE_STATUS.SUCCESS]: FW_UPGRADE_CSS_CLASSES.SUCCESS, + [FW_UPGRADE_STATUS.FAILED]: FW_UPGRADE_CSS_CLASSES.FAILED, + [FW_UPGRADE_STATUS.ABORTED]: FW_UPGRADE_CSS_CLASSES.ABORTED, + [FW_UPGRADE_STATUS.CANCELLED]: FW_UPGRADE_CSS_CLASSES.CANCELLED, +}; + +// Statuses that should show 100% progress +const STATUSES_WITH_FULL_PROGRESS = new Set([ + FW_UPGRADE_STATUS.SUCCESS, + FW_UPGRADE_STATUS.FAILED, + FW_UPGRADE_STATUS.ABORTED, + FW_UPGRADE_STATUS.CANCELLED, +]); + +// returns the object key of statusMap corresponding to value +function getKeyFromValue(statusMap, value) { + return Object.keys(statusMap).find((key) => statusMap[key] === value); +} + +// Normalize numeric progress input and fallback to sensible defaults. +function normalizeProgress(operationProgress = null, status) { + if (operationProgress !== null && operationProgress !== undefined) { + let parsed = parseInt(operationProgress, 10); + if (isNaN(parsed)) { + return 0; + } + return Math.min(100, Math.max(0, parsed)); + } + if (FW_STATUS_HELPERS.isCompleted(status)) { + return 100; + } + return 0; +} + +// Return progress bar HTML fragment given percentage and CSS class. +function renderProgressBarHtml( + progressPercentage, + statusClass, + showPercentageText = true, +) { + return ` + + ${showPercentageText ? `${progressPercentage}%` : ""} + `; +} + +function getWebSocketProtocol() { + let protocol = "ws://"; + if (window.location.protocol === "https:") { + protocol = "wss://"; + } + return protocol; +} + +/** + * HTML-escape a string to prevent insertion of untrusted content into DOM + * fragments. + */ +function escapeHtml(unsafe) { + if (unsafe === null || unsafe === undefined) { + return ""; + } + unsafe = String(unsafe); + return unsafe + .replace(/&/g, "&") + .replace(//g, ">") + .replace(/"/g, """) + .replace(/'/g, "'"); +} + +/** + * Return the host portion of the firmware upgrader API host configured + * by the server. When the global `owFirmwareUpgraderApiHost` object is + * missing or does not contain a `host` property we log an error and return + * null so callers can bail out gracefully. + */ +function getFirmwareUpgraderApiHost() { + if ( + typeof owFirmwareUpgraderApiHost === "undefined" || + !owFirmwareUpgraderApiHost.host + ) { + console.error("owFirmwareUpgraderApiHost is not defined or missing host property"); + return null; + } + return owFirmwareUpgraderApiHost.host; +} + +function getFormattedDateTimeString(dateTimeString) { + let dateTime = new Date(dateTimeString); + let locale = window.djangoLocale || "en-us"; + return dateTime.toLocaleString(locale, { + year: "numeric", + month: "short", + day: "numeric", + hour: "numeric", + minute: "2-digit", + }); +} + +function isScrolledToBottom(element) { + if (!element || !element.length) return false; + let el = element[0]; + return el.scrollHeight - el.clientHeight <= el.scrollTop + 1; +} + +function scrollToBottom(element) { + if (element && element.length) { + let el = element[0]; + el.scrollTop = el.scrollHeight - el.clientHeight; + } +} + +if (typeof window !== "undefined") { + window.FW_UPGRADE_STATUS = FW_UPGRADE_STATUS; + window.FW_UPGRADE_DISPLAY_STATUS = FW_UPGRADE_DISPLAY_STATUS; + window.FW_UPGRADE_CSS_CLASSES = FW_UPGRADE_CSS_CLASSES; + window.VALID_FW_STATUSES = VALID_FW_STATUSES; + window.VALID_FW_DISPLAY_STATUSES = new Set(Object.values(FW_UPGRADE_DISPLAY_STATUS)); + window.ALL_VALID_FW_STATUSES = ALL_VALID_FW_STATUSES; + window.FW_STATUS_GROUPS = FW_STATUS_GROUPS; + window.FW_STATUS_HELPERS = FW_STATUS_HELPERS; + window.STATUS_TO_CSS_CLASS = STATUS_TO_CSS_CLASS; + window.STATUSES_WITH_FULL_PROGRESS = STATUSES_WITH_FULL_PROGRESS; + window.normalizeProgress = normalizeProgress; + window.renderProgressBarHtml = renderProgressBarHtml; + window.getWebSocketProtocol = getWebSocketProtocol; + window.escapeHtml = escapeHtml; + window.getFirmwareUpgraderApiHost = getFirmwareUpgraderApiHost; + window.getFormattedDateTimeString = getFormattedDateTimeString; + window.isScrolledToBottom = isScrolledToBottom; + window.scrollToBottom = scrollToBottom; +} diff --git a/openwisp_firmware_upgrader/templates/admin/firmware_upgrader/batch_upgrade_operation_change_form.html b/openwisp_firmware_upgrader/templates/admin/firmware_upgrader/batch_upgrade_operation_change_form.html new file mode 100644 index 000000000..263164330 --- /dev/null +++ b/openwisp_firmware_upgrader/templates/admin/firmware_upgrader/batch_upgrade_operation_change_form.html @@ -0,0 +1,193 @@ +{% extends "admin/change_form.html" %} +{% load i18n admin_urls static admin_list ow_tags %} + +{% block extrahead %} +{{ block.super }} + + + + +{% endblock %} + +{% block content %} +{{ block.super }} + + +
{% trans "Upgrade Operations" %}
+ + +{% if filter_specs %} +
+
+{% endif %}
+
+
+
+
+ 
+
+
+
+
+
+
+
+
+{% trans 'Filter' %}
+
+ {% if has_active_filters %}
+
+ + ✖ {% trans "Clear all filters" %} +
+ {% endif %} + {% if filter_specs|length > 4 %} + + {% endif %} +
+
+
+
+
+
+
+
+
+
+
+ {% if paginator %}
+
+{% endblock %}
+
+{% block footer %}
+{{ block.super }}
+
+
+
+
+
+
+{% endblock %}
diff --git a/openwisp_firmware_upgrader/templates/admin/firmware_upgrader/device_firmware_inline.html b/openwisp_firmware_upgrader/templates/admin/firmware_upgrader/device_firmware_inline.html
index 0b740ea3d..04db5c2e3 100644
--- a/openwisp_firmware_upgrader/templates/admin/firmware_upgrader/device_firmware_inline.html
+++ b/openwisp_firmware_upgrader/templates/admin/firmware_upgrader/device_firmware_inline.html
@@ -2,4 +2,8 @@
diff --git a/openwisp_firmware_upgrader/templates/admin/firmware_upgrader/upgrade_operation_change_form.html b/openwisp_firmware_upgrader/templates/admin/firmware_upgrader/upgrade_operation_change_form.html
new file mode 100644
index 000000000..0fb5bdec7
--- /dev/null
+++ b/openwisp_firmware_upgrader/templates/admin/firmware_upgrader/upgrade_operation_change_form.html
@@ -0,0 +1,22 @@
+{% extends "admin/change_form.html" %}
+{% load i18n admin_urls static %}
+
+{% block extrahead %}
+{{ block.super }}
+
+{% endblock extrahead %}
+
+{% block footer %}
+{{ block.super }}
+
+
+
+
+{% endblock footer %}
diff --git a/openwisp_firmware_upgrader/templates/admin/upgrade_selected_confirmation.html b/openwisp_firmware_upgrader/templates/admin/upgrade_selected_confirmation.html
index 31aef52d3..c0ad01d9f 100644
--- a/openwisp_firmware_upgrader/templates/admin/upgrade_selected_confirmation.html
+++ b/openwisp_firmware_upgrader/templates/admin/upgrade_selected_confirmation.html
@@ -2,74 +2,105 @@
{% load i18n l10n admin_urls static %}
{% block extrahead %}
- {{ block.super }}
- {{ media }}
-
+ {{ block.super }}
+ {{ media }}
+
{% endblock %}
{% block bodyclass %}{{ block.super }} app-{{ opts.app_label }} model-{{ opts.model_name }} delete-confirmation delete-selected-confirmation{% endblock %}
{% block breadcrumbs %}
-
+
{% endblock %}
{% block content %}
{% if related_count or firmwareless_count %}
- | {% trans "Device" %} | +{% trans "Status" %} | +{% trans "Image" %} | +{% trans "Last Updated" %} | +
|---|---|---|---|
| + + {{ operation.device.name }} + + | +
+ {{ operation.get_status_display }}
+ |
+ + {% if operation.image %} + {{ operation.image }} + {% else %} + {% trans "None" %} + {% endif %} + | +{{ operation.modified|date }} | +
| {% trans "No device upgrades found." %} | +|||
+ {% blocktrans count counter=paginator.count %} + {{ counter }} upgrade operation + {% plural %}{{ counter }} upgrade operations + {% endblocktrans %} +
+ {% endif %} + + + {% if page_obj.has_other_pages %} +
+
+ {% if page_obj.has_previous %}
+
+ {% trans 'Previous' %}
+
+ {% endif %}
+
+ {% trans 'Page' %} {{ page_obj.number }} {% trans 'of' %} {{ page_obj.paginator.num_pages }}
+
+ {% if page_obj.has_next %}
+
+ {% trans 'Next' %}
+
+ {% endif %}
+
+
+ {% endif %}
+{% blocktrans %}Are you sure you want to proceed with this batch upgrade operation?{% endblocktrans %}
++ {% blocktrans %} + Are you sure you want to proceed with the + mass upgrade operation for {{ build }}? + {% endblocktrans %} +
{% elif not related_count and not firmwareless_count %} -{% blocktrans %}No devices to upgrade were found. - Hint: Maybe they have been all already updated previously.{% endblocktrans %}
- {% endif %} - {% if related_count %} -{% trans "Devices related to build" %} {{ build }} ({{ related_count }})
--
- {% for device_fw in related_device_fw %}
-
- {{ device_fw.device.name }} - {% endfor %} -
{% trans "Devices which the system has never upgraded yet" %} ({{ firmwareless_count }})
--
- {% for device in firmwareless_devices %}
-
- {{ device.name }} - {% endfor %} -
+ {% blocktrans %} + No devices to upgrade were found. + Hint: Maybe they have been all already updated previously. + {% endblocktrans %} +
{% endif %} - {% endblock %} - {% block footer %} -{{ block.super }} - -{{ form.media }} + {{ block.super }} + {% endblock footer %} diff --git a/openwisp_firmware_upgrader/tests/base.py b/openwisp_firmware_upgrader/tests/base.py index e8d59f68c..236658785 100644 --- a/openwisp_firmware_upgrader/tests/base.py +++ b/openwisp_firmware_upgrader/tests/base.py @@ -9,6 +9,7 @@ from django.core.files.uploadedfile import SimpleUploadedFile from openwisp_controller.connection.tests.utils import CreateConnectionsMixin +from openwisp_utils.tests.selenium import SeleniumTestMixin from ..swapper import load_model @@ -16,8 +17,8 @@ Category = load_model("Category") FirmwareImage = load_model("FirmwareImage") DeviceFirmware = load_model("DeviceFirmware") -DeviceFirmware = load_model("DeviceFirmware") Credentials = swapper.load_model("connection", "Credentials") +DeviceGroup = swapper.load_model("config", "DeviceGroup") OrganizationUser = swapper.load_model("openwisp_users", "OrganizationUser") @@ -153,6 +154,7 @@ def _create_upgrade_env( build=build2, type=self.TPLINK_4300_IL_IMAGE ) data = { + "category": category, "build1": build1, "build2": build2, "d1": d1, @@ -202,6 +204,30 @@ def _create_device_with_connection(self, **kwargs): self._create_device_connection(device=d1) return d1 + def _create_device_group(self, **kwargs): + """Create a device group for testing.""" + opts = dict(name="Test Group") + opts.update(kwargs) + if "organization" not in opts: + opts["organization"] = self._get_org() + group = DeviceGroup(**opts) + group.full_clean() + group.save() + return group + + +class SeleniumTestMixin(SeleniumTestMixin): + def _assert_no_js_errors(self): + browser_logs = [] + for log in self.get_browser_logs(): + # capture SEVERE-level entries from both JS runtime and console API + if log.get("level") == "SEVERE" and log.get("source") in ( + "javascript", + "console-api", + ): + browser_logs.append(log) + self.assertEqual(browser_logs, []) + def spy_mock(method, pre_action): magicmock = mock.MagicMock() diff --git a/openwisp_firmware_upgrader/tests/test_admin.py b/openwisp_firmware_upgrader/tests/test_admin.py index 06e8bd5a7..6e39a487c 100644 --- a/openwisp_firmware_upgrader/tests/test_admin.py +++ b/openwisp_firmware_upgrader/tests/test_admin.py @@ -14,6 +14,7 @@ from openwisp_controller.config.tests.test_admin import TestAdmin as TestConfigAdmin from openwisp_controller.connection import settings as conn_settings from openwisp_firmware_upgrader.admin import ( + BatchUpgradeConfirmationForm, BuildAdmin, DeviceAdmin, DeviceFirmwareForm, @@ -39,6 +40,9 @@ UpgradeOperation = load_model("UpgradeOperation") BatchUpgradeOperation = load_model("BatchUpgradeOperation") Device = swapper.load_model("config", "Device") +Location = swapper.load_model("geo", "Location") +DeviceLocation = swapper.load_model("geo", "DeviceLocation") +DeviceConnection = swapper.load_model("connection", "DeviceConnection") class MockRequest: @@ -151,7 +155,7 @@ def test_upgrade_selected_error(self): def test_upgrade_intermediate_page_related(self): self._login() env = self._create_upgrade_env() - with self.assertNumQueries(13): + with self.assertNumQueries(15): r = self.client.post( self.build_list_url, { @@ -160,14 +164,12 @@ def test_upgrade_intermediate_page_related(self): }, follow=True, ) - self.assertContains(r, "Devices related to build") - self.assertNotContains(r, "has never upgraded yet") self.assertNotContains(r, '{org.name}' + + org1_option = _get_org_option(org1) + org2_option = _get_org_option(org2) + with self.subTest( + "Superuser: Organization filter is visible for shared category" + ): + self._login() + response = self.client.get(url) + self.assertEqual(response.status_code, 200) + self.assertContains(response, "By organization") + self.assertContains( + response, + org1_option, + html=True, + ) + self.assertContains( + response, + org2_option, + html=True, + ) + + with self.subTest("Org admin: Cannot view shared mass upgrade operation"): + self.client.force_login(org1_admin) + response = self.client.get(url, follow=True) + self.assertEqual(response.status_code, 200) + self.assertEqual(response.request["PATH_INFO"], reverse("admin:index")) + self.assertContains( + response, + f'