diff --git a/allianceauth/static/allianceauth/js/refresh-notification-icon.js b/allianceauth/static/allianceauth/js/refresh-notification-icon.js
new file mode 100644
index 00000000..1dbb9eec
--- /dev/null
+++ b/allianceauth/static/allianceauth/js/refresh-notification-icon.js
@@ -0,0 +1,81 @@
+/* global notificationUpdateSettings */
+
+/**
+ * This script refreshed the notification icon in the top menu
+ * on a regular basis so to keep the user apprised about newly arrived
+ * notifications without having to reload the page.
+ *
+ * The refresh rate can be changes via the Django setting NOTIFICATIONS_REFRESH_TIME.
+ * See documentation for details.
+ */
+$(() => {
+ 'use strict';
+
+ const notificationsRefreshTime = notificationUpdateSettings.refreshTime;
+ const userNotificationsCountViewUrl = notificationUpdateSettings.userNotificationsCountViewUrl;
+ const elementNotificationIcon = $('#menu_item_notifications .fa-bell');
+
+ /**
+ * Update the notification icon in the top menu
+ */
+ const updateNotificationIcon = () => {
+ fetch(userNotificationsCountViewUrl)
+ .then((response) => {
+ if (response.ok) {
+ return response.json();
+ }
+
+ throw new Error('Something went wrong');
+ })
+ .then((responseJson) => {
+ const unreadCount = responseJson.unread_count;
+
+ if (unreadCount > 0) {
+ elementNotificationIcon.addClass('text-danger');
+ } else {
+ elementNotificationIcon.removeClass('text-danger');
+ }
+ })
+ .catch((error) => {
+ console.log(`Failed to load HTMl to render notifications item. Error: ${error.message}`);
+ });
+ };
+
+ let myInterval;
+
+ /**
+ * Activate automatic refresh every x seconds
+ */
+ const activateIconUpdate = () => {
+ if (notificationsRefreshTime > 0) {
+ myInterval = setInterval(
+ updateNotificationIcon, notificationsRefreshTime * 1000
+ );
+ }
+ };
+
+ /**
+ * Deactivate automatic refresh
+ */
+ const deactivateIconUpdate = () => {
+ if ((notificationsRefreshTime > 0) && (typeof myInterval !== 'undefined')) {
+ clearInterval(myInterval);
+ }
+ };
+
+ /**
+ * Refresh only on active browser tabs
+ */
+ $(window)
+ // Tab active
+ .focus(() => {
+ activateIconUpdate();
+ })
+ // Tab inactive
+ .blur(function() {
+ deactivateIconUpdate();
+ });
+
+ // Initial start of refreshing on script loading
+ activateIconUpdate();
+});
diff --git a/allianceauth/static/allianceauth/js/timerboard.js b/allianceauth/static/allianceauth/js/timerboard.js
index 26ceb226..22ec0383 100644
--- a/allianceauth/static/allianceauth/js/timerboard.js
+++ b/allianceauth/static/allianceauth/js/timerboard.js
@@ -1,28 +1,28 @@
$(document).ready(() => {
'use strict';
+
const inputAbsoluteTime = $('input#id_absolute_time');
const inputCountdown = $('#id_days_left, #id_hours_left, #id_minutes_left');
- //inputAbsoluteTime.prop('disabled', true);
- inputAbsoluteTime.parent().hide()
- inputAbsoluteTime.parent().prev('label').hide()
+ inputAbsoluteTime.parent().hide();
+ inputAbsoluteTime.parent().prev('label').hide();
inputCountdown.prop('required', true);
- $('input#id_absolute_checkbox').change(function () {
- if ($(this).prop("checked")) {
- // check box enabled
- inputAbsoluteTime.parent().show()
- inputAbsoluteTime.parent().prev('label').show()
- inputCountdown.parent().hide()
- inputCountdown.parent().prev('label').hide()
+ $('input#id_absolute_checkbox').change((event) => {
+ if ($(event.target).prop('checked')) {
+ // Checkbox is checked
+ inputAbsoluteTime.parent().show();
+ inputAbsoluteTime.parent().prev('label').show();
+ inputCountdown.parent().hide();
+ inputCountdown.parent().prev('label').hide();
inputAbsoluteTime.prop('required', true);
inputCountdown.prop('required', false);
} else {
// Checkbox is not checked
- inputAbsoluteTime.parent().hide()
- inputAbsoluteTime.parent().prev('label').hide()
- inputCountdown.parent().show()
- inputCountdown.parent().prev('label').show()
+ inputAbsoluteTime.parent().hide();
+ inputAbsoluteTime.parent().prev('label').hide();
+ inputCountdown.parent().show();
+ inputCountdown.parent().prev('label').show();
inputAbsoluteTime.prop('required', false);
inputCountdown.prop('required', true);
}
diff --git a/allianceauth/templates/allianceauth/base-bs5.html b/allianceauth/templates/allianceauth/base-bs5.html
index 20b0cb83..802f0512 100644
--- a/allianceauth/templates/allianceauth/base-bs5.html
+++ b/allianceauth/templates/allianceauth/base-bs5.html
@@ -122,13 +122,14 @@
{% theme_js %}
{% if user.is_authenticated %}
-
+
+ {% include 'bundles/refresh-notification-icon-js.html' %}
{% endif %}
{% block extra_javascript %}
diff --git a/allianceauth/templates/bundles/refresh-notification-icon-js.html b/allianceauth/templates/bundles/refresh-notification-icon-js.html
new file mode 100644
index 00000000..88f3d16f
--- /dev/null
+++ b/allianceauth/templates/bundles/refresh-notification-icon-js.html
@@ -0,0 +1,3 @@
+{% load static %}
+
+