FE: delay UI_DEFAULT_PAGE_SIZE setting check after cahce rebuilt #1181

Signed-off-by: jokob-sk <jokob.sk@gmail.com>
This commit is contained in:
jokob-sk
2025-11-29 15:45:28 +11:00
parent 0d81315809
commit 8586c5a307
2 changed files with 206 additions and 204 deletions

View File

@@ -1,6 +1,6 @@
/* -----------------------------------------------------------------------------
* NetAlertX
* Open Source Network Guard / WIFI & LAN intrusion detector
* Open Source Network Guard / WIFI & LAN intrusion detector
*
* common.js - Front module. Common Javascript functions
*-------------------------------------------------------------------------------
@@ -35,16 +35,16 @@ function getCache(key, noCookie = false)
// }
}
return "";
return "";
}
// -----------------------------------------------------------------------------
function setCache(key, data, expirationMinutes='')
{
localStorage.setItem(key, data);
localStorage.setItem(key, data);
// // create cookie if expiration set to handle refresh of data
// if (expirationMinutes != '')
// if (expirationMinutes != '')
// {
// setCookie ('cache_session_expiry', 'OK', 1)
// }
@@ -57,7 +57,7 @@ function setCookie (cookie, value, expirationMinutes='') {
var expires = '';
if (typeof expirationMinutes === 'number') {
expires = ';expires=' + new Date(Date.now() + expirationMinutes *60*1000).toUTCString();
}
}
// Save Cookie
document.cookie = cookie + "=" + value + expires;
@@ -107,42 +107,42 @@ function deleteAllCookies() {
// -----------------------------------------------------------------------------
// Get settings from the .json file generated by the python backend
// and cache them, if available, with options
// Get settings from the .json file generated by the python backend
// and cache them, if available, with options
// -----------------------------------------------------------------------------
function cacheSettings()
{
return new Promise((resolve, reject) => {
if(!getCache('cacheSettings_completed') === true)
{
$.get('php/server/query_json.php', { file: 'table_settings.json', nocache: Date.now() }, function(resSet) {
{
$.get('php/server/query_json.php', { file: 'table_settings.json', nocache: Date.now() }, function(resSet) {
$.get('php/server/query_json.php', { file: 'plugins.json', nocache: Date.now() }, function(resPlug) {
pluginsData = resPlug["data"];
settingsData = resSet["data"];
settingsData.forEach((set) => {
pluginsData = resPlug["data"];
settingsData = resSet["data"];
settingsData.forEach((set) => {
resolvedOptions = createArray(set.setOptions)
resolvedOptionsOld = resolvedOptions
setPlugObj = {};
options_params = [];
resolved = ""
// proceed only if first option item contains something to resolve
if( !set.setKey.includes("__metadata") &&
resolvedOptions.length != 0 &&
if( !set.setKey.includes("__metadata") &&
resolvedOptions.length != 0 &&
resolvedOptions[0].includes("{value}"))
{
// get setting definition from the plugin config if available
setPlugObj = getPluginSettingObject(pluginsData, set.setKey)
// check if options contains parameters and resolve
// check if options contains parameters and resolve
if(setPlugObj != {} && setPlugObj["options_params"])
{
// get option_params for {value} resolution
options_params = setPlugObj["options_params"]
options_params = setPlugObj["options_params"]
if(options_params != [])
{
@@ -154,19 +154,19 @@ function cacheSettings()
{
resolvedOptions = `[${resolved}]`
} else // one value only
{
{
resolvedOptions = `["${resolved}"]`
}
}
}
}
}
}
setCache(`nax_set_${set.setKey}`, set.setValue)
setCache(`nax_set_opt_${set.setKey}`, resolvedOptions)
setCache(`nax_set_${set.setKey}`, set.setValue)
setCache(`nax_set_opt_${set.setKey}`, resolvedOptions)
});
}).then(() => handleSuccess('cacheSettings', resolve())).catch(() => handleFailure('cacheSettings', reject("cacheSettings already completed"))); // handle AJAX synchronization
})
}
}
});
}
@@ -176,7 +176,7 @@ function getSettingOptions (key) {
// handle initial load to make sure everything is set-up and cached
// handleFirstLoad()
result = getCache(`nax_set_opt_${key}`, true);
if (result == "")
@@ -194,7 +194,7 @@ function getSetting (key) {
// handle initial load to make sure everything is set-up and cached
// handleFirstLoad()
result = getCache(`nax_set_${key}`, true);
if (result == "")
@@ -210,7 +210,7 @@ function getSetting (key) {
// -----------------------------------------------------------------------------
function cacheStrings() {
return new Promise((resolve, reject) => {
// Create a promise for each language (include en_us by default as fallback)
languagesToLoad = ['en_us']
@@ -222,11 +222,11 @@ function cacheStrings() {
}
console.log(languagesToLoad);
const languagePromises = languagesToLoad.map((language_code) => {
return new Promise((resolveLang, rejectLang) => {
// Fetch core strings and translations
$.get(`php/templates/language/${language_code}.json?nocache=${Date.now()}`)
.done((res) => {
// Iterate over each key-value pair and store the translations
@@ -238,7 +238,7 @@ function cacheStrings() {
$.get('php/server/query_json.php', { file: 'table_plugins_language_strings.json', nocache: Date.now() })
.done((pluginRes) => {
const data = pluginRes["data"];
// Store plugin translations
data.forEach((langString) => {
setCache(`pia_lang_${langString.String_Key}_${langString.Language_Code}`, langString.String_Value);
@@ -269,7 +269,7 @@ function cacheStrings() {
// Handle failure in any of the language processing
handleFailure('cacheStrings', reject);
});
});
}
@@ -278,7 +278,7 @@ function cacheStrings() {
function getString(key) {
function fetchString(key) {
lang_code = getLangCode();
let result = getCache(`pia_lang_${key}_${lang_code}`, true);
@@ -509,7 +509,7 @@ function isBase64(value) {
const base64Regex = /^[A-Za-z0-9+/]+={0,2}$/;
if (!base64Regex.test(value)) return false;
try {
const decoded = atob(value);
@@ -568,7 +568,7 @@ function decodeSpecialChars(str) {
function utf8ToBase64(str) {
// Convert the string to a Uint8Array using TextEncoder
const utf8Bytes = new TextEncoder().encode(str);
// Convert the Uint8Array to a base64-encoded string
return btoa(String.fromCharCode(...utf8Bytes));
}
@@ -597,31 +597,31 @@ function handle_locked_DB(data)
{
if(data.includes('database is locked'))
{
// console.log(data)
// console.log(data)
showSpinner()
setTimeout(function() {
console.warn("Database locked - reload")
location.reload();
location.reload();
}, 5000);
}
}
// -----------------------------------------------------------------------------
function numberArrayFromString(data)
{
{
data = JSON.parse(sanitize(data));
return data.replace(/\[|\]/g, '').split(',').map(Number);
}
// -----------------------------------------------------------------------------
// -----------------------------------------------------------------------------
function saveData(functionName, id, value) {
$.ajax({
method: "GET",
url: "php/server/devices.php",
data: { action: functionName, id: id, value:value },
success: function(data) {
success: function(data) {
if(sanitize(data) == 'OK')
{
showMessage("Saved")
@@ -630,7 +630,7 @@ function saveData(functionName, id, value) {
} else
{
showMessage("ERROR")
}
}
}
});
@@ -670,13 +670,13 @@ function sleep(milliseconds) {
} while (currentDate - date < milliseconds);
}
// ---------------------------------------------------------
// ---------------------------------------------------------
somethingChanged = false;
function settingsChanged()
{
somethingChanged = true;
// Enable navigation prompt ... "Are you sure you want to leave..."
window.onbeforeunload = function() {
window.onbeforeunload = function() {
return true;
};
}
@@ -694,16 +694,16 @@ function getUrlAnchor(defaultValue){
selectedTab = defaultValue
// the #target from the url
target = window.location.hash.substr(1)
target = window.location.hash.substr(1)
// get only the part between #...?
if(target.includes('?'))
{
target = target.split('?')[0]
}
return target
}
}
@@ -715,7 +715,7 @@ function getQueryString(key){
get: (searchParams, prop) => searchParams.get(prop),
});
tmp = params[key]
tmp = params[key]
if(emptyArr.includes(tmp))
{
@@ -726,17 +726,17 @@ function getQueryString(key){
if (fullUrl.includes('?')) {
var queryString = fullUrl.split('?')[1];
// Split the query string into individual parameters
var paramsArray = queryString.split('&');
// Loop through the parameters array
paramsArray.forEach(function(param) {
// Split each parameter into key and value
var keyValue = param.split('=');
var keyTmp = decodeURIComponent(keyValue[0]);
var value = decodeURIComponent(keyValue[1] || '');
// Store key-value pair in the queryParams object
queryParams[keyTmp] = value;
});
@@ -750,7 +750,7 @@ function getQueryString(key){
result = emptyArr.includes(tmp) ? "" : tmp;
return result
}
}
// -----------------------------------------------------------------------------
function translateHTMLcodes (text) {
if (text == null || emptyArr.includes(text)) {
@@ -769,14 +769,14 @@ function translateHTMLcodes (text) {
// -----------------------------------------------------------------------------
function stopTimerRefreshData () {
try {
clearTimeout (timerRefreshData);
clearTimeout (timerRefreshData);
} catch (e) {}
}
// -----------------------------------------------------------------------------
function newTimerRefreshData (refeshFunction, timeToRefresh) {
if(timeToRefresh && (timeToRefresh != 0 || timeToRefresh != ""))
{
time = parseInt(timeToRefresh)
@@ -813,7 +813,7 @@ function openInNewTab (url) {
window.open(url, "_blank");
}
// -----------------------------------------------------------------------------
// -----------------------------------------------------------------------------
// Navigate to URL if the current URL is not in the provided list of URLs
function openUrl(urls) {
var currentUrl = window.location.href;
@@ -844,21 +844,21 @@ function openUrl(urls) {
function forceLoadUrl(relativeUrl) {
window.location.replace(relativeUrl);
window.location.reload()
window.location.reload()
}
// -----------------------------------------------------------------------------
function navigateToDeviceWithIp (ip) {
$.get('php/server/query_json.php', { file: 'table_devices.json', nocache: Date.now() }, function(res) {
$.get('php/server/query_json.php', { file: 'table_devices.json', nocache: Date.now() }, function(res) {
devices = res["data"];
mac = ""
$.each(devices, function(index, obj) {
if(obj.devLastIP.trim() == ip.trim())
{
mac = obj.devMac;
@@ -866,7 +866,7 @@ function navigateToDeviceWithIp (ip) {
window.open('./deviceDetails.php?mac=' + mac , "_blank");
}
});
});
}
@@ -898,7 +898,7 @@ function getMac(){
});
return params.mac
}
}
// -----------------------------------------------------------------------------
// A function used to make the IP address orderable
@@ -950,7 +950,7 @@ function isRandomMAC(mac)
{
isRandom = false;
isRandom = ["2", "6", "A", "E", "a", "e"].includes(mac[1]);
isRandom = ["2", "6", "A", "E", "a", "e"].includes(mac[1]);
// if detected as random, make sure it doesn't start with a prefix which teh suer doesn't want to mark as random
if(isRandom)
@@ -959,17 +959,17 @@ function isRandomMAC(mac)
if(mac.startsWith(prefix))
{
isRandom = false;
}
isRandom = false;
}
});
}
return isRandom;
}
// ---------------------------------------------------------
// ---------------------------------------------------------
// Generate an array object from a string representation of an array
function createArray(input) {
// Is already array, return
@@ -980,25 +980,25 @@ function isRandomMAC(mac)
if (input === '[]' || input === '') {
return [];
}
// handle integer
// handle integer
if (typeof input === 'number') {
input = input.toString();
}
// Regex pattern for brackets
const patternBrackets = /(^\s*\[)|(\]\s*$)/g;
const replacement = '';
// Remove brackets
const noBrackets = input.replace(patternBrackets, replacement);
const options = [];
// Detect the type of quote used after the opening bracket
const firstChar = noBrackets.trim()[0];
const isDoubleQuoted = firstChar === '"';
const isSingleQuoted = firstChar === "'";
// Create array while handling commas within quoted segments
let currentSegment = '';
let withinQuotes = false;
@@ -1016,7 +1016,7 @@ function isRandomMAC(mac)
}
// Push the last segment
options.push(currentSegment.trim());
// Remove quotes based on detected type
options.forEach((item, index) => {
let trimmedItem = item.trim();
@@ -1028,7 +1028,7 @@ function isRandomMAC(mac)
}
options[index] = trimmedItem;
});
return options;
}
@@ -1037,7 +1037,7 @@ function isRandomMAC(mac)
// for the value to be returned
function getDevDataByMac(macAddress, dbColumn) {
const sessionDataKey = 'devicesListAll_JSON';
const sessionDataKey = 'devicesListAll_JSON';
const devicesCache = getCache(sessionDataKey);
if (!devicesCache || devicesCache == "") {
@@ -1068,11 +1068,11 @@ function getDevDataByMac(macAddress, dbColumn) {
// -----------------------------------------------------------------------------
// Cache the devices as one JSON
function cacheDevices()
{
{
return new Promise((resolve, reject) => {
$.get('php/server/query_json.php', { file: 'table_devices.json', nocache: Date.now() }, function(data) {
$.get('php/server/query_json.php', { file: 'table_devices.json', nocache: Date.now() }, function(data) {
// console.log(data)
devicesListAll_JSON = data["data"]
@@ -1093,11 +1093,11 @@ function cacheDevices()
// console.log(getCache('devicesListAll_JSON'))
}).then(() => handleSuccess('cacheDevices', resolve())).catch(() => handleFailure('cacheDevices', reject("cacheDevices already completed"))); // handle AJAX synchronization
}
}
);
}
var devicesListAll_JSON = []; // this will contain a list off all devices
var devicesListAll_JSON = []; // this will contain a list off all devices
// -----------------------------------------------------------------------------
function isEmpty(value)
@@ -1127,7 +1127,7 @@ function getGuid() {
}
// -----------------------------------------------------------------------------
// UI
// UI
// -----------------------------------------------------------------------------
// -----------------------------------------------------------------------------
@@ -1230,7 +1230,7 @@ function hideSpinner() {
});
}
// --------------------------------------------------------
// Calls a backend function to add a front-end event to an execution queue
function updateApi(apiEndpoints)
@@ -1250,9 +1250,9 @@ function updateApi(apiEndpoints)
})
}
// -----------------------------------------------------------------------------
// -----------------------------------------------------------------------------
// handling smooth scrolling
// -----------------------------------------------------------------------------
// -----------------------------------------------------------------------------
function setupSmoothScrolling() {
// Function to scroll to the element
function scrollToElement(id) {
@@ -1310,17 +1310,17 @@ function getPluginSettingObject(pluginsData, setting_key, unique_prefix ) {
result = {}
unique_prefix == undefined ? unique_prefix = setting_key.split("_")[0] : unique_prefix = unique_prefix;
$.each(pluginsData, function (i, plgnObj){
// go thru plugins
if(plgnObj.unique_prefix == unique_prefix)
{
// go thru plugin settings
$.each(plgnObj["settings"], function (j, setObj){
if(`${unique_prefix}_${setObj.function}` == setting_key)
{
result = setObj
{
result = setObj
}
});
@@ -1372,7 +1372,7 @@ function arraysContainSameValues(arr1, arr2) {
if (!Array.isArray(arr1) || !Array.isArray(arr2)) {
return false;
} else
{
{
// Sort and stringify arrays, then compare
return JSON.stringify(arr1.slice().sort()) === JSON.stringify(arr2.slice().sort());
}
@@ -1383,7 +1383,7 @@ function arraysContainSameValues(arr1, arr2) {
function hideUIelements(setKey) {
hiddenSectionsSetting = getSetting(setKey)
if(hiddenSectionsSetting != "") // handle if settings not yet initialized
{
@@ -1398,9 +1398,9 @@ function hideUIelements(setKey) {
if($('#' + hiddenSection))
{
$('#' + hiddenSection).hide()
}
$('#' + hiddenSection).hide()
}
});
}
@@ -1411,7 +1411,7 @@ function getDevicesList()
{
// Read cache (skip cookie expiry check)
devicesList = getCache('devicesListAll_JSON', true);
if (devicesList != '') {
devicesList = JSON.parse (devicesList);
} else {
@@ -1468,7 +1468,7 @@ $(document).ready(function() {
// Restart Backend Python Server
function askRestartBackend() {
// Ask
// Ask
showModalWarning(getString('Maint_RestartServer'), getString('Maint_Restart_Server_noti_text'),
getString('Gen_Cancel'), getString('Maint_RestartServer'), 'restartBackend');
}
@@ -1477,7 +1477,7 @@ function askRestartBackend() {
function restartBackend() {
modalEventStatusId = 'modal-message-front-event'
// Execute
$.ajax({
method: "POST",
@@ -1523,7 +1523,7 @@ function clearCache() {
// -----------------------------------------------------------------------------
// Function to check if cache needs to be refreshed because of setting changes
function checkSettingChanges() {
$.get('php/server/query_json.php', { file: 'app_state.json', nocache: Date.now() }, function(appState) {
$.get('php/server/query_json.php', { file: 'app_state.json', nocache: Date.now() }, function(appState) {
const importedMilliseconds = parseInt(appState["settingsImported"] * 1000);
const lastReloaded = parseInt(sessionStorage.getItem(sessionStorageKey + '_time'));
@@ -1594,7 +1594,7 @@ function isAppInitialized() {
lang_shouldBeCompletedCalls = getLangCode() == 'en_us' ? 1 : 2;
// check if each ajax call completed succesfully
// check if each ajax call completed succesfully
$.each(completedCalls_final, function(index, call_name){
if(getCache(call_name + "_completed") != "true")
@@ -1622,8 +1622,7 @@ async function executeOnce() {
if (!isAppInitialized()) {
try {
console.log("HERE");
await waitForGraphQLServer(); // Wait for the server to start
await cacheDevices();
@@ -1680,7 +1679,7 @@ const onAllCallsComplete = () => {
// setTimeout(() => {
// location.reload()
// }, 10);
} else {
// If not all strings are initialized, retry initialization
console.log('❌ Not all strings are initialized. Retrying...');
@@ -1702,7 +1701,7 @@ const areAllStringsInitialized = () => {
// Call the function to execute the code
executeOnce();
// Set timer for regular UI refresh if enabled
// Set timer for regular UI refresh if enabled
setTimeout(() => {
// page refresh if configured