mirror of
https://github.com/billz/raspap-webgui.git
synced 2025-12-26 23:26:47 +01:00
Merge pull request #1905 from RaspAP/maint/js-assets-reorg
Maintenance: Reorg JavaScript assets
This commit is contained in:
Bill Zimmerman
1
.gitignore
vendored
1
.gitignore
vendored
@@ -8,3 +8,4 @@ vendor
|
|||||||
.env
|
.env
|
||||||
locale/**/*.mo
|
locale/**/*.mo
|
||||||
app/net_activity
|
app/net_activity
|
||||||
|
app/js/plugins/
|
||||||
|
|||||||
@@ -1,21 +1,3 @@
|
|||||||
function msgShow(retcode,msg) {
|
|
||||||
if(retcode == 0) { var alertType = 'success';
|
|
||||||
} else if(retcode == 2 || retcode == 1) {
|
|
||||||
var alertType = 'danger';
|
|
||||||
}
|
|
||||||
var htmlMsg = '<div class="alert alert-'+alertType+' alert-dismissible" role="alert"><button type="button" class="btn-close" data-bs-dismiss="alert" aria-label="Close"></button>'+msg+'</div>';
|
|
||||||
return htmlMsg;
|
|
||||||
}
|
|
||||||
|
|
||||||
function createNetmaskAddr(bitCount) {
|
|
||||||
var mask=[];
|
|
||||||
for(i=0;i<4;i++) {
|
|
||||||
var n = Math.min(bitCount, 8);
|
|
||||||
mask.push(256 - Math.pow(2, 8-n));
|
|
||||||
bitCount -= n;
|
|
||||||
}
|
|
||||||
return mask.join('.');
|
|
||||||
}
|
|
||||||
|
|
||||||
function loadSummary(strInterface) {
|
function loadSummary(strInterface) {
|
||||||
var csrfToken = $('meta[name=csrf_token]').attr('content');
|
var csrfToken = $('meta[name=csrf_token]').attr('content');
|
||||||
@@ -38,94 +20,6 @@ function getAllInterfaces() {
|
|||||||
});
|
});
|
||||||
}
|
}
|
||||||
|
|
||||||
function setupTabs() {
|
|
||||||
$('a[data-bs-toggle="tab"]').on('shown.bs.tab',function(e){
|
|
||||||
var target = $(e.target).attr('href');
|
|
||||||
if(!target.match('summary')) {
|
|
||||||
var int = target.replace("#","");
|
|
||||||
// loadCurrentSettings(int);
|
|
||||||
}
|
|
||||||
});
|
|
||||||
}
|
|
||||||
|
|
||||||
$(document).on("click", ".js-add-dhcp-static-lease", function(e) {
|
|
||||||
e.preventDefault();
|
|
||||||
var container = $(".js-new-dhcp-static-lease");
|
|
||||||
var mac = $("input[name=mac]", container).val().trim();
|
|
||||||
var ip = $("input[name=ip]", container).val().trim();
|
|
||||||
var comment = $("input[name=comment]", container).val().trim();
|
|
||||||
if (mac == "" || ip == "") {
|
|
||||||
return;
|
|
||||||
}
|
|
||||||
var row = $("#js-dhcp-static-lease-row").html()
|
|
||||||
.replace("{{ mac }}", mac)
|
|
||||||
.replace("{{ ip }}", ip)
|
|
||||||
.replace("{{ comment }}", comment);
|
|
||||||
$(".js-dhcp-static-lease-container").append(row);
|
|
||||||
|
|
||||||
$("input[name=mac]", container).val("");
|
|
||||||
$("input[name=ip]", container).val("");
|
|
||||||
$("input[name=comment]", container).val("");
|
|
||||||
});
|
|
||||||
|
|
||||||
$(document).on("click", ".js-remove-dhcp-static-lease", function(e) {
|
|
||||||
e.preventDefault();
|
|
||||||
$(this).parents(".js-dhcp-static-lease-row").remove();
|
|
||||||
});
|
|
||||||
|
|
||||||
$(document).on("submit", ".js-dhcp-settings-form", function(e) {
|
|
||||||
$(".js-add-dhcp-static-lease").trigger("click");
|
|
||||||
});
|
|
||||||
|
|
||||||
$(document).on("click", ".js-add-dhcp-upstream-server", function(e) {
|
|
||||||
e.preventDefault();
|
|
||||||
|
|
||||||
var field = $("#add-dhcp-upstream-server-field")
|
|
||||||
var row = $("#dhcp-upstream-server").html().replace("{{ server }}", field.val())
|
|
||||||
|
|
||||||
if (field.val().trim() == "") { return }
|
|
||||||
|
|
||||||
$(".js-dhcp-upstream-servers").append(row)
|
|
||||||
|
|
||||||
field.val("")
|
|
||||||
});
|
|
||||||
|
|
||||||
$(document).on("click", ".js-remove-dhcp-upstream-server", function(e) {
|
|
||||||
e.preventDefault();
|
|
||||||
$(this).parents(".js-dhcp-upstream-server").remove();
|
|
||||||
});
|
|
||||||
|
|
||||||
$(document).on("submit", ".js-dhcp-settings-form", function(e) {
|
|
||||||
$(".js-add-dhcp-upstream-server").trigger("click");
|
|
||||||
});
|
|
||||||
|
|
||||||
/**
|
|
||||||
* mark a form field, e.g. a select box, with the class `.js-field-preset`
|
|
||||||
* and give it an attribute `data-field-preset-target` with a text field's
|
|
||||||
* css selector.
|
|
||||||
*
|
|
||||||
* now, if the element marked `.js-field-preset` receives a `change` event,
|
|
||||||
* its value will be copied to all elements matching the selector in
|
|
||||||
* data-field-preset-target.
|
|
||||||
*/
|
|
||||||
$(document).on("change", ".js-field-preset", function(e) {
|
|
||||||
var selector = this.getAttribute("data-field-preset-target")
|
|
||||||
var value = "" + this.value
|
|
||||||
var syncValue = function(el) { el.value = value }
|
|
||||||
|
|
||||||
if (value.trim() === "") { return }
|
|
||||||
|
|
||||||
document.querySelectorAll(selector).forEach(syncValue)
|
|
||||||
});
|
|
||||||
|
|
||||||
$(document).on("click", "#gen_wpa_passphrase", function(e) {
|
|
||||||
$('#txtwpapassphrase').val(genPassword(63));
|
|
||||||
});
|
|
||||||
|
|
||||||
$(document).on("click", "#gen_apikey", function(e) {
|
|
||||||
$('#txtapikey').val(genPassword(32).toLowerCase());
|
|
||||||
});
|
|
||||||
|
|
||||||
$(document).on("click", "#js-clearhostapd-log", function(e) {
|
$(document).on("click", "#js-clearhostapd-log", function(e) {
|
||||||
var csrfToken = $('meta[name=csrf_token]').attr('content');
|
var csrfToken = $('meta[name=csrf_token]').attr('content');
|
||||||
$.post('ajax/logging/clearlog.php?',{'logfile':'/tmp/hostapd.log', 'csrf_token': csrfToken},function(data){
|
$.post('ajax/logging/clearlog.php?',{'logfile':'/tmp/hostapd.log', 'csrf_token': csrfToken},function(data){
|
||||||
@@ -150,54 +44,6 @@ $(document).on("click", "#js-clearopenvpn-log", function(e) {
|
|||||||
});
|
});
|
||||||
});
|
});
|
||||||
|
|
||||||
|
|
||||||
// Enable Bootstrap tooltips
|
|
||||||
$(function () {
|
|
||||||
$('[data-bs-toggle="tooltip"]').tooltip()
|
|
||||||
})
|
|
||||||
|
|
||||||
function genPassword(pwdLen) {
|
|
||||||
var pwdChars = "0123456789ABCDEFGHIJKLMNOPQRSTUVWXYZabcdefghijklmnopqrstuvwxyz";
|
|
||||||
var rndPass = Array(pwdLen).fill(pwdChars).map(function(x) { return x[Math.floor(Math.random() * x.length)] }).join('');
|
|
||||||
return rndPass;
|
|
||||||
}
|
|
||||||
|
|
||||||
function setupBtns() {
|
|
||||||
$('#btnSummaryRefresh').click(function(){getAllInterfaces();});
|
|
||||||
$('.intsave').click(function(){
|
|
||||||
var int = $(this).data('int');
|
|
||||||
saveNetworkSettings(int);
|
|
||||||
});
|
|
||||||
$('.intapply').click(function(){
|
|
||||||
applyNetworkSettings();
|
|
||||||
});
|
|
||||||
}
|
|
||||||
|
|
||||||
function setCSRFTokenHeader(event, xhr, settings) {
|
|
||||||
var csrfToken = $('meta[name=csrf_token]').attr('content');
|
|
||||||
if (/^(POST|PATCH|PUT|DELETE)$/i.test(settings.type)) {
|
|
||||||
xhr.setRequestHeader("X-CSRF-Token", csrfToken);
|
|
||||||
}
|
|
||||||
}
|
|
||||||
|
|
||||||
function contentLoaded() {
|
|
||||||
pageCurrent = window.location.href.split("/").pop();
|
|
||||||
switch(pageCurrent) {
|
|
||||||
case "network_conf":
|
|
||||||
getAllInterfaces();
|
|
||||||
setupTabs();
|
|
||||||
setupBtns();
|
|
||||||
break;
|
|
||||||
case "hostapd_conf":
|
|
||||||
getChannel();
|
|
||||||
setHardwareModeTooltip();
|
|
||||||
break;
|
|
||||||
case "dhcpd_conf":
|
|
||||||
loadInterfaceDHCPSelect();
|
|
||||||
break;
|
|
||||||
}
|
|
||||||
}
|
|
||||||
|
|
||||||
function loadWifiStations(refresh) {
|
function loadWifiStations(refresh) {
|
||||||
return function() {
|
return function() {
|
||||||
var complete = function() { $(this).removeClass('loading-spinner'); }
|
var complete = function() { $(this).removeClass('loading-spinner'); }
|
||||||
@@ -257,26 +103,6 @@ function loadInterfaceDHCPSelect() {
|
|||||||
});
|
});
|
||||||
}
|
}
|
||||||
|
|
||||||
function setDHCPToggles(state) {
|
|
||||||
if ($('#chkfallback').is(':checked') && state) {
|
|
||||||
$('#chkfallback').prop('checked', state);
|
|
||||||
}
|
|
||||||
if ($('#dhcp-iface').is(':checked') && !state) {
|
|
||||||
$('#dhcp-iface').prop('checked', state);
|
|
||||||
setDhcpFieldsDisabled();
|
|
||||||
}
|
|
||||||
$('#chkfallback').prop('disabled', state);
|
|
||||||
$('#dhcp-iface').prop('disabled', !state);
|
|
||||||
}
|
|
||||||
|
|
||||||
$('#chkfallback').change(function() {
|
|
||||||
if ($('#chkfallback').is(':checked')) {
|
|
||||||
setStaticFieldsEnabled();
|
|
||||||
} else {
|
|
||||||
setStaticFieldsDisabled();
|
|
||||||
}
|
|
||||||
});
|
|
||||||
|
|
||||||
$('#debugModal').on('shown.bs.modal', function (e) {
|
$('#debugModal').on('shown.bs.modal', function (e) {
|
||||||
var csrfToken = $('meta[name=csrf_token]').attr('content');
|
var csrfToken = $('meta[name=csrf_token]').attr('content');
|
||||||
$.post('ajax/system/sys_debug.php',{'csrf_token': csrfToken},function(data){
|
$.post('ajax/system/sys_debug.php',{'csrf_token': csrfToken},function(data){
|
||||||
@@ -327,10 +153,6 @@ $('#performUpdate').on('submit', function(event) {
|
|||||||
$('#performupdateModal').modal('show');
|
$('#performupdateModal').modal('show');
|
||||||
});
|
});
|
||||||
|
|
||||||
$('#performupdateModal').on('shown.bs.modal', function (e) {
|
|
||||||
fetchUpdateResponse();
|
|
||||||
});
|
|
||||||
|
|
||||||
function fetchUpdateResponse() {
|
function fetchUpdateResponse() {
|
||||||
const complete = 6;
|
const complete = 6;
|
||||||
const error = 7;
|
const error = 7;
|
||||||
@@ -372,22 +194,6 @@ function fetchUpdateResponse() {
|
|||||||
});
|
});
|
||||||
}
|
}
|
||||||
|
|
||||||
$('#hostapdModal').on('shown.bs.modal', function (e) {
|
|
||||||
var seconds = 3;
|
|
||||||
var pct = 0;
|
|
||||||
var countDown = setInterval(function(){
|
|
||||||
if(seconds <= 0){
|
|
||||||
clearInterval(countDown);
|
|
||||||
}
|
|
||||||
document.getElementsByClassName('progress-bar').item(0).setAttribute('style','width:'+Number(pct)+'%');
|
|
||||||
seconds --;
|
|
||||||
pct = Math.floor(100-(seconds*100/4));
|
|
||||||
}, 500);
|
|
||||||
});
|
|
||||||
|
|
||||||
$('#configureClientModal').on('shown.bs.modal', function (e) {
|
|
||||||
});
|
|
||||||
|
|
||||||
$('#ovpn-confirm-delete').on('click', '.btn-delete', function (e) {
|
$('#ovpn-confirm-delete').on('click', '.btn-delete', function (e) {
|
||||||
var cfg_id = $(this).data('recordId');
|
var cfg_id = $(this).data('recordId');
|
||||||
var csrfToken = $('meta[name=csrf_token]').attr('content');
|
var csrfToken = $('meta[name=csrf_token]').attr('content');
|
||||||
@@ -418,21 +224,6 @@ $('#ovpn-confirm-activate').on('click', '.btn-activate', function (e) {
|
|||||||
});
|
});
|
||||||
});
|
});
|
||||||
|
|
||||||
$('#ovpn-confirm-activate').on('shown.bs.modal', function (e) {
|
|
||||||
var data = $(e.relatedTarget).data();
|
|
||||||
$('.btn-activate', this).data('recordId', data.recordId);
|
|
||||||
});
|
|
||||||
|
|
||||||
$('#ovpn-userpw,#ovpn-certs').on('click', function (e) {
|
|
||||||
if (this.id == 'ovpn-userpw') {
|
|
||||||
$('#PanelCerts').hide();
|
|
||||||
$('#PanelUserPW').show();
|
|
||||||
} else if (this.id == 'ovpn-certs') {
|
|
||||||
$('#PanelUserPW').hide();
|
|
||||||
$('#PanelCerts').show();
|
|
||||||
}
|
|
||||||
});
|
|
||||||
|
|
||||||
$('#js-system-reset-confirm').on('click', function (e) {
|
$('#js-system-reset-confirm').on('click', function (e) {
|
||||||
var progressText = $('#js-system-reset-confirm').attr('data-message');
|
var progressText = $('#js-system-reset-confirm').attr('data-message');
|
||||||
var successHtml = $('#system-reset-message').attr('data-message');
|
var successHtml = $('#system-reset-message').attr('data-message');
|
||||||
@@ -463,49 +254,6 @@ $('#js-sys-reboot, #js-sys-shutdown').on('click', function (e) {
|
|||||||
});
|
});
|
||||||
});
|
});
|
||||||
|
|
||||||
$('#install-user-plugin').on('shown.bs.modal', function (e) {
|
|
||||||
var button = $(e.relatedTarget);
|
|
||||||
$(this).data('button', button);
|
|
||||||
var manifestData = button.data('plugin-manifest');
|
|
||||||
var installed = button.data('plugin-installed') || false;
|
|
||||||
var repoPublic = button.data('repo-public') || false;
|
|
||||||
var installPath = manifestData.install_path;
|
|
||||||
|
|
||||||
if (!installed && repoPublic && installPath === 'plugins-available') {
|
|
||||||
insidersHTML = 'Available with <i class="fas fa-heart heart me-1"></i><a href="https://docs.raspap.com/insiders" target="_blank" rel="noopener">Insiders</a>';
|
|
||||||
$('#plugin-additional').html(insidersHTML);
|
|
||||||
} else {
|
|
||||||
$('#plugin-additional').empty();
|
|
||||||
}
|
|
||||||
if (manifestData) {
|
|
||||||
$('#plugin-docs').html(manifestData.plugin_docs
|
|
||||||
? `<a href="${manifestData.plugin_docs}" target="_blank">${manifestData.plugin_docs}</a>`
|
|
||||||
: 'Unknown');
|
|
||||||
$('#plugin-icon').attr('class', `${manifestData.icon || 'fas fa-plug'} link-secondary h5 me-2`);
|
|
||||||
$('#plugin-name').text(manifestData.name || 'Unknown');
|
|
||||||
$('#plugin-version').text(manifestData.version || 'Unknown');
|
|
||||||
$('#plugin-description').text(manifestData.description || 'No description provided');
|
|
||||||
$('#plugin-author').html(manifestData.author
|
|
||||||
? manifestData.author + (manifestData.author_uri
|
|
||||||
? ` (<a href="${manifestData.author_uri}" target="_blank">profile</a>)` : '') : 'Unknown');
|
|
||||||
$('#plugin-license').text(manifestData.license || 'Unknown');
|
|
||||||
$('#plugin-locale').text(manifestData.default_locale || 'Unknown');
|
|
||||||
$('#plugin-configuration').html(formatProperty(manifestData.configuration || 'None'));
|
|
||||||
$('#plugin-packages').html(formatProperty(manifestData.keys || 'None'));
|
|
||||||
$('#plugin-dependencies').html(formatProperty(manifestData.dependencies || 'None'));
|
|
||||||
$('#plugin-javascript').html(formatProperty(manifestData.javascript || 'None'));
|
|
||||||
$('#plugin-sudoers').html(formatProperty(manifestData.sudoers || 'None'));
|
|
||||||
$('#plugin-user-name').html((manifestData.user_nonprivileged && manifestData.user_nonprivileged.name) || 'None');
|
|
||||||
}
|
|
||||||
if (installed) {
|
|
||||||
$('#js-install-plugin-confirm').html('OK');
|
|
||||||
} else if (!installed && repoPublic && installPath == 'plugins-available') {
|
|
||||||
$('#js-install-plugin-confirm').html('Get Insiders');
|
|
||||||
} else {
|
|
||||||
$('#js-install-plugin-confirm').html('Install now');
|
|
||||||
}
|
|
||||||
});
|
|
||||||
|
|
||||||
$('#js-install-plugin-confirm').on('click', function (e) {
|
$('#js-install-plugin-confirm').on('click', function (e) {
|
||||||
var button = $('#install-user-plugin').data('button');
|
var button = $('#install-user-plugin').data('button');
|
||||||
var manifestData = button.data('plugin-manifest');
|
var manifestData = button.data('plugin-manifest');
|
||||||
@@ -572,75 +320,7 @@ $('#js-install-plugin-confirm').on('click', function (e) {
|
|||||||
}
|
}
|
||||||
});
|
});
|
||||||
|
|
||||||
$('#js-install-plugin-ok').on('click', function (e) {
|
// Retrieves the 'channel' value specified in hostapd.conf
|
||||||
$("#install-plugin-progress").modal('hide');
|
|
||||||
window.location.reload();
|
|
||||||
});
|
|
||||||
|
|
||||||
function formatProperty(prop) {
|
|
||||||
if (Array.isArray(prop)) {
|
|
||||||
if (typeof prop[0] === 'object') {
|
|
||||||
return prop.map(item => {
|
|
||||||
return Object.entries(item)
|
|
||||||
.map(([key, value]) => `${key}: ${value}`)
|
|
||||||
.join('<br/>');
|
|
||||||
}).join('<br/>');
|
|
||||||
}
|
|
||||||
return prop.map(line => `${line}<br/>`).join('');
|
|
||||||
}
|
|
||||||
if (typeof prop === 'object') {
|
|
||||||
return Object.entries(prop)
|
|
||||||
.map(([key, value]) => `${key}: ${value}`)
|
|
||||||
.join('<br/>');
|
|
||||||
}
|
|
||||||
return prop || 'None';
|
|
||||||
}
|
|
||||||
|
|
||||||
$(document).ready(function(){
|
|
||||||
$("#PanelManual").hide();
|
|
||||||
$('.ip_address').mask('0ZZ.0ZZ.0ZZ.0ZZ', {
|
|
||||||
translation: {
|
|
||||||
'Z': {
|
|
||||||
pattern: /[0-9]/, optional: true
|
|
||||||
}
|
|
||||||
},
|
|
||||||
placeholder: "___.___.___.___"
|
|
||||||
});
|
|
||||||
$('.mac_address').mask('FF:FF:FF:FF:FF:FF', {
|
|
||||||
translation: {
|
|
||||||
'F': {
|
|
||||||
pattern: /[0-9a-fA-F]/, optional: false
|
|
||||||
}
|
|
||||||
},
|
|
||||||
placeholder: "__:__:__:__:__:__"
|
|
||||||
});
|
|
||||||
});
|
|
||||||
|
|
||||||
$(document).ready(function() {
|
|
||||||
$('.cidr').mask('099.099.099.099/099', {
|
|
||||||
translation: {
|
|
||||||
'0': { pattern: /[0-9]/ }
|
|
||||||
},
|
|
||||||
placeholder: "___.___.___.___/___"
|
|
||||||
});
|
|
||||||
});
|
|
||||||
|
|
||||||
$('#wg-upload,#wg-manual').on('click', function (e) {
|
|
||||||
if (this.id == 'wg-upload') {
|
|
||||||
$('#PanelManual').hide();
|
|
||||||
$('#PanelUpload').show();
|
|
||||||
} else if (this.id == 'wg-manual') {
|
|
||||||
$('#PanelUpload').hide();
|
|
||||||
$('#PanelManual').show();
|
|
||||||
}
|
|
||||||
});
|
|
||||||
|
|
||||||
$(".custom-file-input").on("change", function() {
|
|
||||||
var fileName = $(this).val().split("\\").pop();
|
|
||||||
$(this).siblings(".custom-file-label").addClass("selected").html(fileName);
|
|
||||||
});
|
|
||||||
|
|
||||||
// Retrieves the 'channel' value specified in hostapd.conf
|
|
||||||
function getChannel() {
|
function getChannel() {
|
||||||
$.get('ajax/networking/get_channel.php',function(data){
|
$.get('ajax/networking/get_channel.php',function(data){
|
||||||
jsonData = JSON.parse(data);
|
jsonData = JSON.parse(data);
|
||||||
@@ -827,22 +507,6 @@ $('.wg-client-dl').click(function(){
|
|||||||
req.send();
|
req.send();
|
||||||
})
|
})
|
||||||
|
|
||||||
// Event listener for Bootstrap's form validation
|
|
||||||
window.addEventListener('load', function() {
|
|
||||||
// Fetch all the forms we want to apply custom Bootstrap validation styles to
|
|
||||||
var forms = document.getElementsByClassName('needs-validation');
|
|
||||||
// Loop over them and prevent submission
|
|
||||||
var validation = Array.prototype.filter.call(forms, function(form) {
|
|
||||||
form.addEventListener('submit', function(event) {
|
|
||||||
if (form.checkValidity() === false) {
|
|
||||||
event.preventDefault();
|
|
||||||
event.stopPropagation();
|
|
||||||
}
|
|
||||||
form.classList.add('was-validated');
|
|
||||||
}, false);
|
|
||||||
});
|
|
||||||
}, false);
|
|
||||||
|
|
||||||
let sessionCheckInterval = setInterval(checkSession, 5000);
|
let sessionCheckInterval = setInterval(checkSession, 5000);
|
||||||
|
|
||||||
function checkSession() {
|
function checkSession() {
|
||||||
@@ -861,249 +525,3 @@ function checkSession() {
|
|||||||
});
|
});
|
||||||
}
|
}
|
||||||
|
|
||||||
function showSessionExpiredModal() {
|
|
||||||
$('#sessionTimeoutModal').modal('show');
|
|
||||||
}
|
|
||||||
|
|
||||||
$(document).on("click", "#js-session-expired-login", function(e) {
|
|
||||||
const loginModal = $('#modal-admin-login');
|
|
||||||
const redirectUrl = window.location.pathname;
|
|
||||||
window.location.href = `/login?action=${encodeURIComponent(redirectUrl)}`;
|
|
||||||
});
|
|
||||||
|
|
||||||
// show modal login on page load
|
|
||||||
$(document).ready(function () {
|
|
||||||
const params = new URLSearchParams(window.location.search);
|
|
||||||
const redirectUrl = $('#redirect-url').val() || params.get('action') || '/';
|
|
||||||
$('#modal-admin-login').modal('show');
|
|
||||||
$('#redirect-url').val(redirectUrl);
|
|
||||||
$('#username').focus();
|
|
||||||
$('#username').addClass("focusedInput");
|
|
||||||
});
|
|
||||||
|
|
||||||
// DHCP or Static IP option group
|
|
||||||
$('#chkstatic').on('change', function() {
|
|
||||||
if (this.checked) {
|
|
||||||
setStaticFieldsEnabled();
|
|
||||||
}
|
|
||||||
});
|
|
||||||
|
|
||||||
$('#chkdhcp').on('change', function() {
|
|
||||||
this.checked ? setStaticFieldsDisabled() : null;
|
|
||||||
});
|
|
||||||
|
|
||||||
|
|
||||||
$('input[name="dhcp-iface"]').change(function() {
|
|
||||||
if ($('input[name="dhcp-iface"]:checked').val() == '1') {
|
|
||||||
setDhcpFieldsEnabled();
|
|
||||||
} else {
|
|
||||||
setDhcpFieldsDisabled();
|
|
||||||
}
|
|
||||||
});
|
|
||||||
|
|
||||||
|
|
||||||
function setStaticFieldsEnabled() {
|
|
||||||
$('#txtipaddress').prop('required', true);
|
|
||||||
$('#txtsubnetmask').prop('required', true);
|
|
||||||
$('#txtgateway').prop('required', true);
|
|
||||||
|
|
||||||
$('#txtipaddress').removeAttr('disabled');
|
|
||||||
$('#txtsubnetmask').removeAttr('disabled');
|
|
||||||
$('#txtgateway').removeAttr('disabled');
|
|
||||||
}
|
|
||||||
|
|
||||||
function setStaticFieldsDisabled() {
|
|
||||||
$('#txtipaddress').prop('disabled', true);
|
|
||||||
$('#txtsubnetmask').prop('disabled', true);
|
|
||||||
$('#txtgateway').prop('disabled', true);
|
|
||||||
|
|
||||||
$('#txtipaddress').removeAttr('required');
|
|
||||||
$('#txtsubnetmask').removeAttr('required');
|
|
||||||
$('#txtgateway').removeAttr('required');
|
|
||||||
}
|
|
||||||
|
|
||||||
function setDhcpFieldsEnabled() {
|
|
||||||
$('#txtrangestart').prop('required', true);
|
|
||||||
$('#txtrangeend').prop('required', true);
|
|
||||||
$('#txtrangeleasetime').prop('required', true);
|
|
||||||
$('#cbxrangeleasetimeunits').prop('required', true);
|
|
||||||
|
|
||||||
$('#txtrangestart').removeAttr('disabled');
|
|
||||||
$('#txtrangeend').removeAttr('disabled');
|
|
||||||
$('#txtrangeleasetime').removeAttr('disabled');
|
|
||||||
$('#cbxrangeleasetimeunits').removeAttr('disabled');
|
|
||||||
$('#txtdns1').removeAttr('disabled');
|
|
||||||
$('#txtdns2').removeAttr('disabled');
|
|
||||||
$('#txtmetric').removeAttr('disabled');
|
|
||||||
}
|
|
||||||
|
|
||||||
function setDhcpFieldsDisabled() {
|
|
||||||
$('#txtrangestart').removeAttr('required');
|
|
||||||
$('#txtrangeend').removeAttr('required');
|
|
||||||
$('#txtrangeleasetime').removeAttr('required');
|
|
||||||
$('#cbxrangeleasetimeunits').removeAttr('required');
|
|
||||||
|
|
||||||
$('#txtrangestart').prop('disabled', true);
|
|
||||||
$('#txtrangeend').prop('disabled', true);
|
|
||||||
$('#txtrangeleasetime').prop('disabled', true);
|
|
||||||
$('#cbxrangeleasetimeunits').prop('disabled', true);
|
|
||||||
$('#txtdns1').prop('disabled', true);
|
|
||||||
$('#txtdns2').prop('disabled', true);
|
|
||||||
$('#txtmetric').prop('disabled', true);
|
|
||||||
}
|
|
||||||
|
|
||||||
// Static Array method
|
|
||||||
Array.range = (start, end) => Array.from({length: (end - start)}, (v, k) => k + start);
|
|
||||||
|
|
||||||
$(document).on("click", ".js-toggle-password", function(e) {
|
|
||||||
var button = $(e.currentTarget);
|
|
||||||
var field = $(button.data("bsTarget"));
|
|
||||||
if (field.is(":input")) {
|
|
||||||
e.preventDefault();
|
|
||||||
|
|
||||||
if (!button.data("__toggle-with-initial")) {
|
|
||||||
$("i", button).removeClass("fas fa-eye").addClass(button.attr("data-toggle-with"));
|
|
||||||
}
|
|
||||||
|
|
||||||
if (field.attr("type") === "password") {
|
|
||||||
field.attr("type", "text");
|
|
||||||
} else {
|
|
||||||
$("i", button).removeClass("fas fa-eye-slash").addClass("fas fa-eye");
|
|
||||||
field.attr("type", "password");
|
|
||||||
}
|
|
||||||
}
|
|
||||||
});
|
|
||||||
|
|
||||||
$(function() {
|
|
||||||
$('#theme-select').change(function() {
|
|
||||||
var theme = themes[$( "#theme-select" ).val() ];
|
|
||||||
|
|
||||||
var hasDarkTheme = theme === 'custom.php';
|
|
||||||
var nightModeChecked = $("#night-mode").prop("checked");
|
|
||||||
|
|
||||||
if (nightModeChecked && hasDarkTheme) {
|
|
||||||
if (theme === "custom.php") {
|
|
||||||
set_theme("dark.css");
|
|
||||||
}
|
|
||||||
} else {
|
|
||||||
set_theme(theme);
|
|
||||||
}
|
|
||||||
});
|
|
||||||
});
|
|
||||||
|
|
||||||
function set_theme(theme) {
|
|
||||||
$('link[title="main"]').attr('href', 'app/css/' + theme);
|
|
||||||
// persist selected theme in cookie
|
|
||||||
setCookie('theme',theme,90);
|
|
||||||
}
|
|
||||||
|
|
||||||
$(function() {
|
|
||||||
var currentTheme = getCookie('theme');
|
|
||||||
// Check if the current theme is a dark theme
|
|
||||||
var isDarkTheme = currentTheme === 'dark.css';
|
|
||||||
|
|
||||||
$('#night-mode').prop('checked', isDarkTheme);
|
|
||||||
$('#night-mode').change(function() {
|
|
||||||
var state = $(this).is(':checked');
|
|
||||||
var currentTheme = getCookie('theme');
|
|
||||||
|
|
||||||
if (state == true) {
|
|
||||||
if (currentTheme == 'custom.php') {
|
|
||||||
set_theme('dark.css');
|
|
||||||
}
|
|
||||||
} else {
|
|
||||||
if (currentTheme == 'dark.css') {
|
|
||||||
set_theme('custom.php');
|
|
||||||
}
|
|
||||||
}
|
|
||||||
});
|
|
||||||
});
|
|
||||||
|
|
||||||
function setCookie(cname, cvalue, exdays) {
|
|
||||||
var d = new Date();
|
|
||||||
d.setTime(d.getTime() + (exdays*24*60*60*1000));
|
|
||||||
var expires = "expires="+ d.toUTCString();
|
|
||||||
document.cookie = cname + "=" + cvalue + ";" + expires + ";path=/";
|
|
||||||
}
|
|
||||||
|
|
||||||
function getCookie(cname) {
|
|
||||||
var regx = new RegExp(cname + "=([^;]+)");
|
|
||||||
var value = regx.exec(document.cookie);
|
|
||||||
return (value != null) ? unescape(value[1]) : null;
|
|
||||||
}
|
|
||||||
|
|
||||||
// Define themes
|
|
||||||
var themes = {
|
|
||||||
"default": "custom.php",
|
|
||||||
"hackernews" : "hackernews.css"
|
|
||||||
}
|
|
||||||
|
|
||||||
// Adds active class to current nav-item
|
|
||||||
$(window).bind("load", function() {
|
|
||||||
var url = window.location;
|
|
||||||
$('.sb-nav-link-icon a').filter(function() {
|
|
||||||
return this.href == url;
|
|
||||||
}).parent().addClass('active');
|
|
||||||
});
|
|
||||||
|
|
||||||
// Sets focus on a specified tab
|
|
||||||
document.addEventListener("DOMContentLoaded", function () {
|
|
||||||
const params = new URLSearchParams(window.location.search);
|
|
||||||
const targetTab = params.get("tab");
|
|
||||||
if (targetTab) {
|
|
||||||
let tabElement = document.querySelector(`[data-bs-toggle="tab"][href="#${targetTab}"]`);
|
|
||||||
if (tabElement) {
|
|
||||||
let tab = new bootstrap.Tab(tabElement);
|
|
||||||
tab.show();
|
|
||||||
}
|
|
||||||
}
|
|
||||||
});
|
|
||||||
|
|
||||||
function disableValidation(form) {
|
|
||||||
form.removeAttribute("novalidate");
|
|
||||||
form.classList.remove("needs-validation");
|
|
||||||
form.querySelectorAll("[required]").forEach(function (field) {
|
|
||||||
field.removeAttribute("required");
|
|
||||||
});
|
|
||||||
}
|
|
||||||
|
|
||||||
function updateActivityLED() {
|
|
||||||
const threshold_bytes = 300;
|
|
||||||
fetch('/app/net_activity')
|
|
||||||
.then(res => res.text())
|
|
||||||
.then(data => {
|
|
||||||
const activity = parseInt(data.trim());
|
|
||||||
const leds = document.querySelectorAll('.hostapd-led');
|
|
||||||
|
|
||||||
if (!isNaN(activity)) {
|
|
||||||
leds.forEach(led => {
|
|
||||||
if (activity > threshold_bytes) {
|
|
||||||
led.classList.add('led-pulse');
|
|
||||||
setTimeout(() => {
|
|
||||||
led.classList.remove('led-pulse');
|
|
||||||
}, 50);
|
|
||||||
} else {
|
|
||||||
led.classList.remove('led-pulse');
|
|
||||||
}
|
|
||||||
});
|
|
||||||
}
|
|
||||||
})
|
|
||||||
.catch(() => { /* ignore fetch errors */ });
|
|
||||||
}
|
|
||||||
setInterval(updateActivityLED, 100);
|
|
||||||
|
|
||||||
$(document).ready(function() {
|
|
||||||
const $htmlElement = $('html');
|
|
||||||
const $modeswitch = $('#night-mode');
|
|
||||||
$modeswitch.on('change', function() {
|
|
||||||
const isChecked = $(this).is(':checked');
|
|
||||||
const newTheme = isChecked ? 'dark' : 'light';
|
|
||||||
$htmlElement.attr('data-bs-theme', newTheme);
|
|
||||||
localStorage.setItem('bsTheme', newTheme);
|
|
||||||
});
|
|
||||||
});
|
|
||||||
|
|
||||||
$(document)
|
|
||||||
.ajaxSend(setCSRFTokenHeader)
|
|
||||||
.ready(contentLoaded)
|
|
||||||
.ready(loadWifiStations());
|
|
||||||
@@ -1,147 +0,0 @@
|
|||||||
(function($, _t) {
|
|
||||||
"use strict";
|
|
||||||
|
|
||||||
/**
|
|
||||||
* Create a Chart.js barchart.
|
|
||||||
*/
|
|
||||||
function CreateChart(ctx, labels) {
|
|
||||||
var barchart = new Chart(ctx,{
|
|
||||||
type: 'line',
|
|
||||||
options: {
|
|
||||||
responsive: true,
|
|
||||||
scales: {
|
|
||||||
xAxes: [{
|
|
||||||
scaleLabel: {
|
|
||||||
display: true,
|
|
||||||
labelString: 'date',
|
|
||||||
},
|
|
||||||
ticks: {
|
|
||||||
maxRotation: 90,
|
|
||||||
minRotation: 80
|
|
||||||
}
|
|
||||||
}],
|
|
||||||
yAxes: [{
|
|
||||||
id: 'y-axis-1',
|
|
||||||
type: 'linear',
|
|
||||||
display: true,
|
|
||||||
position: 'left',
|
|
||||||
ticks: {
|
|
||||||
beginAtZero: true
|
|
||||||
}
|
|
||||||
}]
|
|
||||||
}
|
|
||||||
},
|
|
||||||
data: {
|
|
||||||
labels: labels,
|
|
||||||
datasets: []
|
|
||||||
}
|
|
||||||
});
|
|
||||||
|
|
||||||
return barchart;
|
|
||||||
}
|
|
||||||
|
|
||||||
/**
|
|
||||||
* Create a jquery bootstrap datatable.
|
|
||||||
*/
|
|
||||||
function CreateDataTable(placeholder, timeunits) {
|
|
||||||
$("#"+placeholder).append('<table id="tableBandwidth'+timeunits+
|
|
||||||
'" class="table table-striped"><thead>'+
|
|
||||||
'<tr><th>date</th><th>rx</th><th>tx</th></tr></thead><tbody></tbody></table>');
|
|
||||||
}
|
|
||||||
|
|
||||||
/**
|
|
||||||
* Figure out which tab is selected and remove all existing charts and then
|
|
||||||
* construct the proper barchart.
|
|
||||||
*/
|
|
||||||
function ShowBandwidthChartHandler(e) {
|
|
||||||
// Remove all chartjs charts
|
|
||||||
$('#divChartBandwidthhourly').empty();
|
|
||||||
$('#divChartBandwidthdaily').empty();
|
|
||||||
$('#divChartBandwidthmonthly').empty();
|
|
||||||
// Remove all datatables
|
|
||||||
$('#divTableBandwidthhourly').empty();
|
|
||||||
$('#divTableBandwidthdaily').empty();
|
|
||||||
$('#divTableBandwidthmonthly').empty();
|
|
||||||
// Construct ajax uri for getting the proper data.
|
|
||||||
var timeunit = $('ul#tabbarBandwidth li.nav-item a.nav-link.active').attr('href').substr(1);
|
|
||||||
var uri = 'ajax/bandwidth/get_bandwidth.php?';
|
|
||||||
uri += 'inet=';
|
|
||||||
uri += encodeURIComponent($('#cbxInterface'+timeunit+' option:selected').text());
|
|
||||||
uri += '&tu=';
|
|
||||||
uri += encodeURIComponent(timeunit.substr(0, 1));
|
|
||||||
var datasizeunits = 'mb';
|
|
||||||
uri += '&dsu='+encodeURIComponent(datasizeunits);
|
|
||||||
// Init. datatable html
|
|
||||||
var datatable = CreateDataTable('divTableBandwidth'+timeunit, timeunit);
|
|
||||||
// Get data for chart
|
|
||||||
$.ajax({
|
|
||||||
url: uri,
|
|
||||||
dataType: 'json',
|
|
||||||
beforeSend: function() {
|
|
||||||
$('#divLoaderBandwidth'+timeunit).show();
|
|
||||||
}
|
|
||||||
}).done(function(jsondata) {
|
|
||||||
$('#divLoaderBandwidth'+timeunit).hide();
|
|
||||||
// Map json values to label array
|
|
||||||
var labels = jsondata.map(function(e) {
|
|
||||||
return e.date;
|
|
||||||
});
|
|
||||||
// Init. chart with label series
|
|
||||||
var barchart = CreateChart('divChartBandwidth'+timeunit, labels);
|
|
||||||
var dataRx = jsondata.map(function(e) {
|
|
||||||
return e.rx;
|
|
||||||
});
|
|
||||||
var dataTx = jsondata.map(function(e) {
|
|
||||||
return e.tx;
|
|
||||||
});
|
|
||||||
|
|
||||||
addData(barchart, dataRx, dataTx, datasizeunits);
|
|
||||||
$('#tableBandwidth'+timeunit).DataTable({
|
|
||||||
'searching': false,
|
|
||||||
'paging': false,
|
|
||||||
'data': jsondata,
|
|
||||||
'order': [[ 0, 'ASC' ]],
|
|
||||||
'columns': [
|
|
||||||
{ 'data': 'date' },
|
|
||||||
{ 'data': 'rx', "title": _t['receive']+' '+datasizeunits.toUpperCase() },
|
|
||||||
{ 'data': 'tx', "title": _t['send']+' '+datasizeunits.toUpperCase() }]
|
|
||||||
});
|
|
||||||
}).fail(function(xhr, textStatus) {
|
|
||||||
if (window.console) {
|
|
||||||
console.error('server error');
|
|
||||||
} else {
|
|
||||||
alert("server error");
|
|
||||||
}
|
|
||||||
});
|
|
||||||
}
|
|
||||||
/**
|
|
||||||
* Add data array to datasets of current chart.
|
|
||||||
*/
|
|
||||||
function addData(chart, dataRx, dataTx, datasizeunits) {
|
|
||||||
chart.data.datasets.push({
|
|
||||||
label: 'Receive'+' '+datasizeunits.toUpperCase(),
|
|
||||||
yAxisID: 'y-axis-1',
|
|
||||||
borderColor: 'rgba(75, 192, 192, 1)',
|
|
||||||
backgroundColor: 'rgba(75, 192, 192, 0.2)',
|
|
||||||
data: dataRx
|
|
||||||
});
|
|
||||||
chart.data.datasets.push({
|
|
||||||
label: 'Send'+' '+datasizeunits.toUpperCase(),
|
|
||||||
yAxisID: 'y-axis-1',
|
|
||||||
borderColor: 'rgba(192, 192, 192, 1)',
|
|
||||||
backgroundColor: 'rgba(192, 192, 192, 0.2)',
|
|
||||||
data: dataTx
|
|
||||||
});
|
|
||||||
chart.update();
|
|
||||||
}
|
|
||||||
|
|
||||||
$(document).ready(function() {
|
|
||||||
$('#tabbarBandwidth a[data-toggle="tab"]').on('shown.bs.tab', ShowBandwidthChartHandler);
|
|
||||||
$('#cbxInterfacehourly').on('change', ShowBandwidthChartHandler);
|
|
||||||
$('#cbxInterfacedaily').on('change', ShowBandwidthChartHandler);
|
|
||||||
$('#cbxInterfacemonthly').on('change', ShowBandwidthChartHandler);
|
|
||||||
ShowBandwidthChartHandler();
|
|
||||||
});
|
|
||||||
|
|
||||||
})(jQuery, t);
|
|
||||||
|
|
||||||
7
app/js/bandwidthcharts.min.js
vendored
7
app/js/bandwidthcharts.min.js
vendored
@@ -1,7 +0,0 @@
|
|||||||
/*!
|
|
||||||
* RaspAP - RaspAP WiFi Configuration Portal v1.6.1 (https://github.com/billz/raspap-webgui)
|
|
||||||
* Copyright 2013-2019 RaspAP Developers
|
|
||||||
* Licensed under MIT (https://github.com/raspap-webgui/raspap-webgui/blob/master/LICENSE)
|
|
||||||
*/
|
|
||||||
|
|
||||||
!function(r,i){"use strict";function t(t){r("#divChartBandwidthhourly").empty(),r("#divChartBandwidthdaily").empty(),r("#divChartBandwidthmonthly").empty(),r("#divTableBandwidthhourly").empty(),r("#divTableBandwidthdaily").empty(),r("#divTableBandwidthmonthly").empty();var e=r("ul#tabbarBandwidth li.active a").attr("href").substr(1),a="ajax/bandwidth/get_bandwidth.php?";a+="inet=",a+=encodeURIComponent(r("#cbxInterface"+e+" option:selected").text()),a+="&tu=",a+=encodeURIComponent(e.substr(0,1));var d="mb";a+="&dsu="+encodeURIComponent(d);var n=function(t,e){return new Morris.Bar({element:t,xkey:"date",ykeys:["rx","tx"],labels:[i.receive+" "+e.toUpperCase(),i.send+" "+e.toUpperCase()]})}("divChartBandwidth"+e,d);!function(t,e){r("#"+t).append('<table id="tableBandwidth'+e+'" class="table table-responsive table-striped container-fluid"><thead><tr><th>date</th><th>rx</th><th>tx</th></tr></thead><tbody></tbody></table>')}("divTableBandwidth"+e,e);r.ajax({url:a,dataType:"json",beforeSend:function(){r("#divLoaderBandwidth"+e).removeClass("hidden")}}).done(function(t){r("#divLoaderBandwidth"+e).addClass("hidden"),n.setData(t),r("#tableBandwidth"+e).DataTable({searching:!1,paging:!1,data:t,order:[[0,"ASC"]],columns:[{data:"date"},{data:"rx",title:i.receive+" "+d.toUpperCase()},{data:"tx",title:i.send+" "+d.toUpperCase()}]})}).fail(function(t,e){window.console?console.error("server error"):alert("server error")})}r(document).ready(function(){r('#tabbarBandwidth a[data-toggle="tab"]').on("shown.bs.tab",t),r("#cbxInterfacehourly").on("change",t),r("#cbxInterfacedaily").on("change",t),r("#cbxInterfacemonthly").on("change",t),t()})}(jQuery,t);
|
|
||||||
7
app/js/custom.min.js
vendored
7
app/js/custom.min.js
vendored
@@ -1,7 +0,0 @@
|
|||||||
/*!
|
|
||||||
* RaspAP - RaspAP WiFi Configuration Portal v1.6.1 (https://github.com/billz/raspap-webgui)
|
|
||||||
* Copyright 2013-2019 RaspAP Developers
|
|
||||||
* Licensed under MIT (https://github.com/raspap-webgui/raspap-webgui/blob/master/LICENSE)
|
|
||||||
*/
|
|
||||||
|
|
||||||
function msgShow(t,a){if(0==t)var e="success";else if(2==t||1==t)e="danger";return'<div class="alert alert-'+e+' alert-dismissible" role="alert"><button type="button" class="close" data-dismiss="alert" aria-label="Close"><span aria-hidden="true">×</span></button>'+a+"</div>"}function createNetmaskAddr(t){var a=[];for(i=0;i<4;i++){var e=Math.min(t,8);a.push(256-Math.pow(2,8-e)),t-=e}return a.join(".")}function loadSummary(a){$.post("/ajax/networking/get_ip_summary.php",{interface:a},function(t){jsonData=JSON.parse(t),console.log(jsonData),0==jsonData.return?$("#"+a+"-summary").html(jsonData.output.join("<br />")):2==jsonData.return&&$("#"+a+"-summary").append('<div class="alert alert-danger alert-dismissible" role="alert"><button type="button" class="close" data-dismiss="alert" aria-label="Close"><span aria-hidden="true">×</span></button>'+jsonData.output.join("<br />")+"</div>")})}function getAllInterfaces(){$.get("/ajax/networking/get_all_interfaces.php",function(t){jsonData=JSON.parse(t),$.each(jsonData,function(t,a){loadSummary(a)})})}function setupTabs(){$('a[data-toggle="tab"]').on("shown.bs.tab",function(t){var a=$(t.target).attr("href");a.match("summary")||loadCurrentSettings(a.replace("#",""))})}function loadCurrentSettings(t){$.post("/ajax/networking/get_int_config.php",{interface:t},function(t){jsonData=JSON.parse(t),$.each(jsonData.output,function(t,a){var n=a.interface;$.each(a,function(t,a){switch(t){case"static":"true"==a?($("#"+n+"-static").click(),$("#"+n+"-nofailover").click()):$("#"+n+"-dhcp").click();break;case"failover":"true"===a?$("#"+n+"-failover").click():$("#"+n+"-nofailover").click();break;case"ip_address":var e=a.split("/");$("#"+n+"-ipaddress").val(e[0]),$("#"+n+"-netmask").val(createNetmaskAddr(e[1]));break;case"routers":$("#"+n+"-gateway").val(a);break;case"domain_name_server":svrsDNS=a.split(" "),$("#"+n+"-dnssvr").val(svrsDNS[0]),$("#"+n+"-dnssvralt").val(svrsDNS[1])}})})})}function saveNetworkSettings(t){var a=$("#frm-"+t).find(":input"),e={};$.each(a,function(t,a){"radio"==$(a).attr("type")?e[$(a).attr("id")]=$(a).prop("checked"):e[$(a).attr("id")]=$(a).val()}),e.interface=t,$.post("/ajax/networking/save_int_config.php",e,function(t){var a=JSON.parse(t);$("#msgNetworking").html(msgShow(a.return,a.output))})}function applyNetworkSettings(){$(this).data("int");arrFormData={generate:""},$.post("/ajax/networking/gen_int_config.php",arrFormData,function(t){console.log(t);var a=JSON.parse(t);$("#msgNetworking").html(msgShow(a.return,a.output))})}function setupBtns(){$("#btnSummaryRefresh").click(function(){getAllInterfaces()}),$(".intsave").click(function(){saveNetworkSettings($(this).data("int"))}),$(".intapply").click(function(){applyNetworkSettings()})}function setCSRFTokenHeader(t,a,e){var n=$("meta[name=csrf_token]").attr("content");/^(POST|PATCH|PUT|DELETE)$/i.test(e.type)&&a.setRequestHeader("X-CSRF-Token",n)}function contentLoaded(){switch(pageCurrent=window.location.href.split("?")[1].split("=")[1],pageCurrent=pageCurrent.replace("#",""),$("#side-menu").metisMenu(),pageCurrent){case"network_conf":getAllInterfaces(),setupTabs(),setupBtns()}}function loadWifiStations(a){return function(){var t=!0===a?"?refresh":"";$(".js-wifi-stations").addClass("loading-spinner").empty().load("/ajax/networking/wifi_stations.php"+t,function(){$(this).removeClass("loading-spinner")})}}$(document).on("click",".js-add-dhcp-static-lease",function(t){t.preventDefault();var a=$(".js-new-dhcp-static-lease"),e=$("input[name=mac]",a).val().trim(),n=$("input[name=ip]",a).val().trim();if(""!=e&&""!=n){var i=$("#js-dhcp-static-lease-row").html().replace("{{ mac }}",e).replace("{{ ip }}",n);$(".js-dhcp-static-lease-container").append(i),$("input[name=mac]",a).val(""),$("input[name=ip]",a).val("")}}),$(document).on("click",".js-remove-dhcp-static-lease",function(t){t.preventDefault(),$(this).parents(".js-dhcp-static-lease-row").remove()}),$(document).on("submit",".js-dhcp-settings-form",function(t){$(".js-add-dhcp-static-lease").trigger("click")}),$(".js-reload-wifi-stations").on("click",loadWifiStations(!0)),$(document).on("click",".js-toggle-password",function(t){var a=$(t.target),e=$(a.data("target"));e.is(":input")&&(t.preventDefault(),a.data("__toggle-with-initial")||a.data("__toggle-with-initial",a.text()),"password"===e.attr("type")?(a.text(a.data("toggle-with")),e.attr("type","text")):(a.text(a.data("__toggle-with-initial")),e.attr("type","password")))}),$(document).on("keyup",".js-validate-psk",function(t){var a=$(t.target),e=a.data("colors").split(","),n=$(a.data("target"));a.val().length<8||63<a.val().length?(a.css("backgroundColor",e[0]),n.attr("disabled",!0)):(a.css("backgroundColor",e[1]),n.attr("disabled",!1))}),$(document).ajaxSend(setCSRFTokenHeader).ready(contentLoaded).ready(loadWifiStations());
|
|
||||||
@@ -1,106 +0,0 @@
|
|||||||
(function($, _t) {
|
|
||||||
"use strict";
|
|
||||||
|
|
||||||
/**
|
|
||||||
* Create a Chart.js barchart.
|
|
||||||
*/
|
|
||||||
function CreateChart(ctx, labels) {
|
|
||||||
var barchart = new Chart(ctx,{
|
|
||||||
type: 'line',
|
|
||||||
options: {
|
|
||||||
responsive: true,
|
|
||||||
maintainAspectRatio: false,
|
|
||||||
scales: {
|
|
||||||
xAxes: [{
|
|
||||||
scaleLabel: {
|
|
||||||
display: true
|
|
||||||
},
|
|
||||||
ticks: {
|
|
||||||
maxRotation: 0,
|
|
||||||
minRotation: 0
|
|
||||||
}
|
|
||||||
}],
|
|
||||||
yAxes: [{
|
|
||||||
id: 'y-axis-1',
|
|
||||||
type: 'linear',
|
|
||||||
display: true,
|
|
||||||
position: 'left',
|
|
||||||
ticks: {
|
|
||||||
beginAtZero: true
|
|
||||||
}
|
|
||||||
}]
|
|
||||||
}
|
|
||||||
},
|
|
||||||
data: {
|
|
||||||
labels: labels,
|
|
||||||
datasets: []
|
|
||||||
}
|
|
||||||
});
|
|
||||||
return barchart;
|
|
||||||
}
|
|
||||||
|
|
||||||
function ShowBandwidthChartHandler(e) {
|
|
||||||
// Remove hourly chartjs chart
|
|
||||||
$('#divDBChartBandwidthhourly').empty();
|
|
||||||
// Construct ajax uri for getting the proper data
|
|
||||||
var timeunit = 'hourly';
|
|
||||||
var uri = 'ajax/bandwidth/get_bandwidth.php?';
|
|
||||||
uri += 'inet=';
|
|
||||||
uri += encodeURIComponent($('#divInterface').text());
|
|
||||||
uri += '&tu=';
|
|
||||||
uri += encodeURIComponent(timeunit.substr(0, 1));
|
|
||||||
var datasizeunits = 'mb';
|
|
||||||
uri += '&dsu='+encodeURIComponent(datasizeunits);
|
|
||||||
// Get data for chart
|
|
||||||
$.ajax({
|
|
||||||
url: uri,
|
|
||||||
dataType: 'json',
|
|
||||||
beforeSend: function() {}
|
|
||||||
}).done(function(jsondata) {
|
|
||||||
// Map json values to label array
|
|
||||||
var labels = jsondata.map(function(e) {
|
|
||||||
return e.date;
|
|
||||||
});
|
|
||||||
// Init. chart with label series
|
|
||||||
var barchart = CreateChart('divDBChartBandwidth'+timeunit, labels);
|
|
||||||
var dataRx = jsondata.map(function(e) {
|
|
||||||
return e.rx;
|
|
||||||
});
|
|
||||||
var dataTx = jsondata.map(function(e) {
|
|
||||||
return e.tx;
|
|
||||||
});
|
|
||||||
addData(barchart, dataTx, dataRx, datasizeunits);
|
|
||||||
}).fail(function(xhr, textStatus) {
|
|
||||||
if (window.console) {
|
|
||||||
console.error('server error');
|
|
||||||
} else {
|
|
||||||
alert("server error");
|
|
||||||
}
|
|
||||||
});
|
|
||||||
}
|
|
||||||
/**
|
|
||||||
* Add data array to datasets of current chart.
|
|
||||||
*/
|
|
||||||
function addData(chart, dataTx, dataRx, datasizeunits) {
|
|
||||||
chart.data.datasets.push({
|
|
||||||
label: 'Send'+' '+datasizeunits.toUpperCase(),
|
|
||||||
yAxisID: 'y-axis-1',
|
|
||||||
borderColor: 'rgba(75, 192, 192, 1)',
|
|
||||||
backgroundColor: 'rgba(75, 192, 192, 0.2)',
|
|
||||||
data: dataTx
|
|
||||||
});
|
|
||||||
chart.data.datasets.push({
|
|
||||||
label: 'Receive'+' '+datasizeunits.toUpperCase(),
|
|
||||||
yAxisID: 'y-axis-1',
|
|
||||||
borderColor: 'rgba(192, 192, 192, 1)',
|
|
||||||
backgroundColor: 'rgba(192, 192, 192, 0.2)',
|
|
||||||
data: dataRx
|
|
||||||
});
|
|
||||||
chart.update();
|
|
||||||
}
|
|
||||||
$(document).ready(function() {
|
|
||||||
ShowBandwidthChartHandler();
|
|
||||||
});
|
|
||||||
|
|
||||||
})(jQuery, t);
|
|
||||||
|
|
||||||
@@ -1,22 +0,0 @@
|
|||||||
// Initialize Huebee color picker
|
|
||||||
var elem = document.querySelector('.color-input');
|
|
||||||
var hueb = new Huebee( elem, {
|
|
||||||
notation: 'hex',
|
|
||||||
saturations: 2,
|
|
||||||
customColors: [ '#d8224c', '#dd4814', '#ea0', '#19f', '#333' ],
|
|
||||||
className: 'light-picker',
|
|
||||||
hue0: 210
|
|
||||||
});
|
|
||||||
|
|
||||||
// Set custom color if defined
|
|
||||||
var color = getCookie('color');
|
|
||||||
if (color == null || color == '') {
|
|
||||||
color = '#2b8080';
|
|
||||||
}
|
|
||||||
hueb.setColor(color);
|
|
||||||
|
|
||||||
// Change event
|
|
||||||
hueb.on( 'change', function( color, hue, sat, lum ) {
|
|
||||||
setCookie('color',color,90);
|
|
||||||
})
|
|
||||||
|
|
||||||
@@ -1,88 +0,0 @@
|
|||||||
// Link quality gauge for ChartJS
|
|
||||||
|
|
||||||
// Support for dark theme
|
|
||||||
theme = getCookie('theme');
|
|
||||||
if (theme == 'lightsout.css') {
|
|
||||||
var borderColor = 'rgba(37, 153, 63, 1)';
|
|
||||||
var labelColor = 'rgba(37, 153, 63, 1)';
|
|
||||||
} else if (theme == 'material-light.php') {
|
|
||||||
var borderColor = '#f2f2fb';
|
|
||||||
var labelColor = '#f2f2fb';
|
|
||||||
} else if (theme == 'material-dark.php') {
|
|
||||||
var borderColor = '#f2f2fb';
|
|
||||||
var labelColor = '#f2f2fb';
|
|
||||||
} else {
|
|
||||||
var borderColor = 'rgba(147, 210, 162, 1)';
|
|
||||||
var labelColor = 'rgba(130, 130, 130, 1)';
|
|
||||||
}
|
|
||||||
|
|
||||||
let data1 = {
|
|
||||||
datasets: [{
|
|
||||||
data: [linkQ, 100-linkQ],
|
|
||||||
backgroundColor: 'transparent',
|
|
||||||
borderColor: borderColor,
|
|
||||||
}],
|
|
||||||
};
|
|
||||||
|
|
||||||
let config = {
|
|
||||||
type: 'doughnut',
|
|
||||||
data: data1,
|
|
||||||
options: {
|
|
||||||
aspectRatio: 2,
|
|
||||||
responsive: true,
|
|
||||||
maintainAspectRatio: false,
|
|
||||||
tooltips: {enabled: false},
|
|
||||||
hover: {mode: null},
|
|
||||||
legend: {
|
|
||||||
display: false,
|
|
||||||
},
|
|
||||||
rotation: (2/3)*Math.PI,//2+(1/3),
|
|
||||||
circumference: (1+(2/3)) * Math.PI, // * Math.PI,
|
|
||||||
cutoutPercentage: 80,
|
|
||||||
animation: {
|
|
||||||
animateScale: false,
|
|
||||||
animateRotate: true
|
|
||||||
},
|
|
||||||
tooltips: {
|
|
||||||
enabled: false
|
|
||||||
}
|
|
||||||
},
|
|
||||||
centerText: {
|
|
||||||
display: true,
|
|
||||||
text: linkQ + "%"
|
|
||||||
},
|
|
||||||
plugins: [{
|
|
||||||
beforeDraw: function(chart) {
|
|
||||||
if (chart.config.centerText.display !== null &&
|
|
||||||
typeof chart.config.centerText.display !== 'undefined' &&
|
|
||||||
chart.config.centerText.display) {
|
|
||||||
drawLinkQ(chart);
|
|
||||||
}
|
|
||||||
}
|
|
||||||
}]
|
|
||||||
};
|
|
||||||
|
|
||||||
function drawLinkQ(chart) {
|
|
||||||
|
|
||||||
let width = chart.chart.width;
|
|
||||||
let height = chart.chart.height;
|
|
||||||
let ctx = chart.chart.ctx;
|
|
||||||
|
|
||||||
ctx.restore();
|
|
||||||
let fontSize = (height / 100).toFixed(2);
|
|
||||||
ctx.font = fontSize + "em sans-serif";
|
|
||||||
ctx.fillStyle = labelColor;
|
|
||||||
ctx.textBaseline = "middle";
|
|
||||||
|
|
||||||
let text = chart.config.centerText.text;
|
|
||||||
let textX = Math.round((width - ctx.measureText(text).width) * 0.5);
|
|
||||||
let textY = height / 2;
|
|
||||||
ctx.fillText(text, textX, textY);
|
|
||||||
ctx.save();
|
|
||||||
}
|
|
||||||
|
|
||||||
window.onload = function() {
|
|
||||||
let ctx = document.getElementById("divChartLinkQ").getContext("2d");
|
|
||||||
var chart = new Chart(ctx, config);
|
|
||||||
};
|
|
||||||
|
|
||||||
@@ -1,189 +0,0 @@
|
|||||||
function I(i){return document.getElementById(i);}
|
|
||||||
|
|
||||||
const origin=window.location.origin;
|
|
||||||
const host=window.location.host;
|
|
||||||
var SPEEDTEST_SERVERS=[
|
|
||||||
{
|
|
||||||
"name":"RaspAP Speedtest server (US)",
|
|
||||||
"server":"https://speedtest.raspap.com/",
|
|
||||||
"dlURL":"backend/garbage.php",
|
|
||||||
"ulURL":"backend/empty.php",
|
|
||||||
"pingURL":"backend/empty.php",
|
|
||||||
"getIpURL":"backend/getIP.php"
|
|
||||||
},
|
|
||||||
{
|
|
||||||
"name":"RaspAP ("+host+")",
|
|
||||||
"server":origin,
|
|
||||||
"dlURL":"dist/speedtest/backend/garbage.php",
|
|
||||||
"ulURL":"dist/speedtest/backend/empty.php",
|
|
||||||
"pingURL":"dist/speedtest/backend/empty.php",
|
|
||||||
"getIpURL":"dist/speedtest/backend/getIP.php"
|
|
||||||
}
|
|
||||||
];
|
|
||||||
|
|
||||||
//INITIALIZE SPEEDTEST
|
|
||||||
var s=new Speedtest(); //create speedtest object
|
|
||||||
s.setParameter("telemetry_level","basic"); //enable telemetry
|
|
||||||
|
|
||||||
//SERVER AUTO SELECTION
|
|
||||||
function initServers(){
|
|
||||||
var noServersAvailable=function(){
|
|
||||||
I("message").innerHTML="No servers available";
|
|
||||||
}
|
|
||||||
var runServerSelect=function(){
|
|
||||||
s.selectServer(function(server){
|
|
||||||
if(server!=null){ //at least 1 server is available
|
|
||||||
I("loading").className="hidden"; //hide loading message
|
|
||||||
//populate server list for manual selection
|
|
||||||
for(var i=0;i<SPEEDTEST_SERVERS.length;i++){
|
|
||||||
//if(SPEEDTEST_SERVERS[i].pingT==-1) continue;
|
|
||||||
var option=document.createElement("option");
|
|
||||||
option.value=i;
|
|
||||||
option.textContent=SPEEDTEST_SERVERS[i].name;
|
|
||||||
if(SPEEDTEST_SERVERS[i]===server) option.selected=true;
|
|
||||||
I("server").appendChild(option);
|
|
||||||
}
|
|
||||||
//show test UI
|
|
||||||
I("testWrapper").className="visible";
|
|
||||||
initUI();
|
|
||||||
}else{ //no servers are available, the test cannot proceed
|
|
||||||
noServersAvailable();
|
|
||||||
}
|
|
||||||
});
|
|
||||||
}
|
|
||||||
if(typeof SPEEDTEST_SERVERS === "string"){
|
|
||||||
//need to fetch list of servers from specified URL
|
|
||||||
s.loadServerList(SPEEDTEST_SERVERS,function(servers){
|
|
||||||
if(servers==null){ //failed to load server list
|
|
||||||
noServersAvailable();
|
|
||||||
}else{ //server list loaded
|
|
||||||
SPEEDTEST_SERVERS=servers;
|
|
||||||
runServerSelect();
|
|
||||||
}
|
|
||||||
});
|
|
||||||
}else{
|
|
||||||
//hardcoded server list
|
|
||||||
s.addTestPoints(SPEEDTEST_SERVERS);
|
|
||||||
runServerSelect();
|
|
||||||
}
|
|
||||||
}
|
|
||||||
|
|
||||||
var meterBk=/Trident.*rv:(\d+\.\d+)/i.test(navigator.userAgent)?"#EAEAEA":"#80808040";
|
|
||||||
var dlColor="#4BC0C0",
|
|
||||||
ulColor="#616161";
|
|
||||||
var progColor=meterBk;
|
|
||||||
|
|
||||||
//CODE FOR GAUGES
|
|
||||||
function drawMeter(c,amount,bk,fg,progress,prog){
|
|
||||||
var ctx=c.getContext("2d");
|
|
||||||
var dp=window.devicePixelRatio||1;
|
|
||||||
var cw=c.clientWidth*dp, ch=c.clientHeight*dp;
|
|
||||||
var sizScale=ch*0.0055;
|
|
||||||
if(c.width==cw&&c.height==ch){
|
|
||||||
ctx.clearRect(0,0,cw,ch);
|
|
||||||
}else{
|
|
||||||
c.width=cw;
|
|
||||||
c.height=ch;
|
|
||||||
}
|
|
||||||
ctx.beginPath();
|
|
||||||
ctx.strokeStyle=bk;
|
|
||||||
ctx.lineWidth=12*sizScale;
|
|
||||||
ctx.arc(c.width/2,c.height-58*sizScale,c.height/1.8-ctx.lineWidth,-Math.PI*1.1,Math.PI*0.1);
|
|
||||||
ctx.stroke();
|
|
||||||
ctx.beginPath();
|
|
||||||
ctx.strokeStyle=fg;
|
|
||||||
ctx.lineWidth=12*sizScale;
|
|
||||||
ctx.arc(c.width/2,c.height-58*sizScale,c.height/1.8-ctx.lineWidth,-Math.PI*1.1,amount*Math.PI*1.2-Math.PI*1.1);
|
|
||||||
ctx.stroke();
|
|
||||||
if(typeof progress !== "undefined"){
|
|
||||||
ctx.fillStyle=prog;
|
|
||||||
ctx.fillRect(c.width*0.3,c.height-16*sizScale,c.width*0.4*progress,4*sizScale);
|
|
||||||
}
|
|
||||||
}
|
|
||||||
function mbpsToAmount(s){
|
|
||||||
return 1-(1/(Math.pow(1.3,Math.sqrt(s))));
|
|
||||||
}
|
|
||||||
function format(d){
|
|
||||||
d=Number(d);
|
|
||||||
if(d<10) return d.toFixed(2);
|
|
||||||
if(d<100) return d.toFixed(1);
|
|
||||||
return d.toFixed(0);
|
|
||||||
}
|
|
||||||
|
|
||||||
//UI CODE
|
|
||||||
var uiData=null;
|
|
||||||
function startStop(){
|
|
||||||
if(s.getState()==3){
|
|
||||||
//speedtest is running, abort
|
|
||||||
s.abort();
|
|
||||||
data=null;
|
|
||||||
I("startStopBtn").className="btn btn-outline btn-primary";
|
|
||||||
I("server").disabled=false;
|
|
||||||
initUI();
|
|
||||||
}else{
|
|
||||||
//test is not running, begin
|
|
||||||
I("startStopBtn").className="btn btn-outline btn-primary running";
|
|
||||||
I("server").disabled=true;
|
|
||||||
s.onupdate=function(data){
|
|
||||||
uiData=data;
|
|
||||||
};
|
|
||||||
s.onend=function(aborted){
|
|
||||||
I("startStopBtn").className="btn btn-outline btn-primary";
|
|
||||||
I("server").disabled=false;
|
|
||||||
updateUI(true);
|
|
||||||
if(!aborted){
|
|
||||||
//if testId is present, show sharing panel, otherwise do nothing
|
|
||||||
try{
|
|
||||||
var testId=uiData.testId;
|
|
||||||
if(testId!=null){
|
|
||||||
var shareURL=window.location.href.substring(0,window.location.href.lastIndexOf("/"))+"/results/?id="+testId;
|
|
||||||
I("resultsImg").src=shareURL;
|
|
||||||
I("resultsURL").value=shareURL;
|
|
||||||
I("testId").innerHTML=testId;
|
|
||||||
I("shareArea").style.display="";
|
|
||||||
}
|
|
||||||
}catch(e){}
|
|
||||||
}
|
|
||||||
};
|
|
||||||
s.start();
|
|
||||||
}
|
|
||||||
}
|
|
||||||
//this function reads the data sent back by the test and updates the UI
|
|
||||||
function updateUI(forced){
|
|
||||||
if(!forced&&s.getState()!=3) return;
|
|
||||||
if(uiData==null) return;
|
|
||||||
var status=uiData.testState;
|
|
||||||
I("ip").textContent=uiData.clientIp;
|
|
||||||
I("dlText").textContent=(status==1&&uiData.dlStatus==0)?"...":format(uiData.dlStatus);
|
|
||||||
drawMeter(I("dlMeter"),mbpsToAmount(Number(uiData.dlStatus*(status==1?oscillate():1))),meterBk,dlColor,Number(uiData.dlProgress),progColor);
|
|
||||||
I("ulText").textContent=(status==3&&uiData.ulStatus==0)?"...":format(uiData.ulStatus);
|
|
||||||
drawMeter(I("ulMeter"),mbpsToAmount(Number(uiData.ulStatus*(status==3?oscillate():1))),meterBk,ulColor,Number(uiData.ulProgress),progColor);
|
|
||||||
I("pingText").textContent=format(uiData.pingStatus);
|
|
||||||
I("jitText").textContent=format(uiData.jitterStatus);
|
|
||||||
}
|
|
||||||
function oscillate(){
|
|
||||||
return 1+0.02*Math.sin(Date.now()/100);
|
|
||||||
}
|
|
||||||
//update the UI every frame
|
|
||||||
window.requestAnimationFrame=window.requestAnimationFrame||window.webkitRequestAnimationFrame||window.mozRequestAnimationFrame||window.msRequestAnimationFrame||(function(callback,element){setTimeout(callback,1000/60);});
|
|
||||||
function frame(){
|
|
||||||
requestAnimationFrame(frame);
|
|
||||||
updateUI();
|
|
||||||
}
|
|
||||||
frame(); //start frame loop
|
|
||||||
//function to (re)initialize UI
|
|
||||||
function initUI(){
|
|
||||||
drawMeter(I("dlMeter"),0,meterBk,dlColor,0);
|
|
||||||
drawMeter(I("ulMeter"),0,meterBk,ulColor,0);
|
|
||||||
I("dlText").textContent="";
|
|
||||||
I("ulText").textContent="";
|
|
||||||
I("pingText").textContent="";
|
|
||||||
I("jitText").textContent="";
|
|
||||||
I("ip").textContent="";
|
|
||||||
}
|
|
||||||
// add EventListener to diagnostic tab
|
|
||||||
var e = document.querySelectorAll("a[href^='#diagnostic']");
|
|
||||||
e[0].addEventListener("click", function(){
|
|
||||||
initServers()
|
|
||||||
});
|
|
||||||
|
|
||||||
583
app/js/ui/main.js
Normal file
583
app/js/ui/main.js
Normal file
@@ -0,0 +1,583 @@
|
|||||||
|
|
||||||
|
function msgShow(retcode,msg) {
|
||||||
|
if(retcode == 0) { var alertType = 'success';
|
||||||
|
} else if(retcode == 2 || retcode == 1) {
|
||||||
|
var alertType = 'danger';
|
||||||
|
}
|
||||||
|
var htmlMsg = '<div class="alert alert-'+alertType+' alert-dismissible" role="alert"><button type="button" class="btn-close" data-bs-dismiss="alert" aria-label="Close"></button>'+msg+'</div>';
|
||||||
|
return htmlMsg;
|
||||||
|
}
|
||||||
|
|
||||||
|
function createNetmaskAddr(bitCount) {
|
||||||
|
var mask=[];
|
||||||
|
for(i=0;i<4;i++) {
|
||||||
|
var n = Math.min(bitCount, 8);
|
||||||
|
mask.push(256 - Math.pow(2, 8-n));
|
||||||
|
bitCount -= n;
|
||||||
|
}
|
||||||
|
return mask.join('.');
|
||||||
|
}
|
||||||
|
|
||||||
|
function setupTabs() {
|
||||||
|
$('a[data-bs-toggle="tab"]').on('shown.bs.tab',function(e){
|
||||||
|
var target = $(e.target).attr('href');
|
||||||
|
if(!target.match('summary')) {
|
||||||
|
var int = target.replace("#","");
|
||||||
|
}
|
||||||
|
});
|
||||||
|
}
|
||||||
|
|
||||||
|
$(document).on("click", ".js-add-dhcp-static-lease", function(e) {
|
||||||
|
e.preventDefault();
|
||||||
|
var container = $(".js-new-dhcp-static-lease");
|
||||||
|
var mac = $("input[name=mac]", container).val().trim();
|
||||||
|
var ip = $("input[name=ip]", container).val().trim();
|
||||||
|
var comment = $("input[name=comment]", container).val().trim();
|
||||||
|
if (mac == "" || ip == "") {
|
||||||
|
return;
|
||||||
|
}
|
||||||
|
var row = $("#js-dhcp-static-lease-row").html()
|
||||||
|
.replace("{{ mac }}", mac)
|
||||||
|
.replace("{{ ip }}", ip)
|
||||||
|
.replace("{{ comment }}", comment);
|
||||||
|
$(".js-dhcp-static-lease-container").append(row);
|
||||||
|
|
||||||
|
$("input[name=mac]", container).val("");
|
||||||
|
$("input[name=ip]", container).val("");
|
||||||
|
$("input[name=comment]", container).val("");
|
||||||
|
});
|
||||||
|
|
||||||
|
$(document).on("click", ".js-remove-dhcp-static-lease", function(e) {
|
||||||
|
e.preventDefault();
|
||||||
|
$(this).parents(".js-dhcp-static-lease-row").remove();
|
||||||
|
});
|
||||||
|
|
||||||
|
$(document).on("submit", ".js-dhcp-settings-form", function(e) {
|
||||||
|
$(".js-add-dhcp-static-lease").trigger("click");
|
||||||
|
});
|
||||||
|
|
||||||
|
$(document).on("click", ".js-add-dhcp-upstream-server", function(e) {
|
||||||
|
e.preventDefault();
|
||||||
|
|
||||||
|
var field = $("#add-dhcp-upstream-server-field")
|
||||||
|
var row = $("#dhcp-upstream-server").html().replace("{{ server }}", field.val())
|
||||||
|
|
||||||
|
if (field.val().trim() == "") { return }
|
||||||
|
|
||||||
|
$(".js-dhcp-upstream-servers").append(row)
|
||||||
|
|
||||||
|
field.val("")
|
||||||
|
});
|
||||||
|
|
||||||
|
$(document).on("click", ".js-remove-dhcp-upstream-server", function(e) {
|
||||||
|
e.preventDefault();
|
||||||
|
$(this).parents(".js-dhcp-upstream-server").remove();
|
||||||
|
});
|
||||||
|
|
||||||
|
$(document).on("submit", ".js-dhcp-settings-form", function(e) {
|
||||||
|
$(".js-add-dhcp-upstream-server").trigger("click");
|
||||||
|
});
|
||||||
|
|
||||||
|
/**
|
||||||
|
* mark a form field, e.g. a select box, with the class `.js-field-preset`
|
||||||
|
* and give it an attribute `data-field-preset-target` with a text field's
|
||||||
|
* css selector.
|
||||||
|
*
|
||||||
|
* now, if the element marked `.js-field-preset` receives a `change` event,
|
||||||
|
* its value will be copied to all elements matching the selector in
|
||||||
|
* data-field-preset-target.
|
||||||
|
*/
|
||||||
|
$(document).on("change", ".js-field-preset", function(e) {
|
||||||
|
var selector = this.getAttribute("data-field-preset-target")
|
||||||
|
var value = "" + this.value
|
||||||
|
var syncValue = function(el) { el.value = value }
|
||||||
|
|
||||||
|
if (value.trim() === "") { return }
|
||||||
|
|
||||||
|
document.querySelectorAll(selector).forEach(syncValue)
|
||||||
|
});
|
||||||
|
|
||||||
|
$(document).on("click", "#gen_wpa_passphrase", function(e) {
|
||||||
|
$('#txtwpapassphrase').val(genPassword(63));
|
||||||
|
});
|
||||||
|
|
||||||
|
$(document).on("click", "#gen_apikey", function(e) {
|
||||||
|
$('#txtapikey').val(genPassword(32).toLowerCase());
|
||||||
|
});
|
||||||
|
|
||||||
|
// Enable Bootstrap tooltips
|
||||||
|
$(function () {
|
||||||
|
$('[data-bs-toggle="tooltip"]').tooltip()
|
||||||
|
})
|
||||||
|
|
||||||
|
function genPassword(pwdLen) {
|
||||||
|
var pwdChars = "0123456789ABCDEFGHIJKLMNOPQRSTUVWXYZabcdefghijklmnopqrstuvwxyz";
|
||||||
|
var rndPass = Array(pwdLen).fill(pwdChars).map(function(x) { return x[Math.floor(Math.random() * x.length)] }).join('');
|
||||||
|
return rndPass;
|
||||||
|
}
|
||||||
|
|
||||||
|
function setupBtns() {
|
||||||
|
$('#btnSummaryRefresh').click(function(){getAllInterfaces();});
|
||||||
|
$('.intsave').click(function(){
|
||||||
|
var int = $(this).data('int');
|
||||||
|
saveNetworkSettings(int);
|
||||||
|
});
|
||||||
|
$('.intapply').click(function(){
|
||||||
|
applyNetworkSettings();
|
||||||
|
});
|
||||||
|
}
|
||||||
|
|
||||||
|
function setCSRFTokenHeader(event, xhr, settings) {
|
||||||
|
var csrfToken = $('meta[name=csrf_token]').attr('content');
|
||||||
|
if (/^(POST|PATCH|PUT|DELETE)$/i.test(settings.type)) {
|
||||||
|
xhr.setRequestHeader("X-CSRF-Token", csrfToken);
|
||||||
|
}
|
||||||
|
}
|
||||||
|
|
||||||
|
function contentLoaded() {
|
||||||
|
pageCurrent = window.location.href.split("/").pop();
|
||||||
|
switch(pageCurrent) {
|
||||||
|
case "network_conf":
|
||||||
|
getAllInterfaces();
|
||||||
|
setupTabs();
|
||||||
|
setupBtns();
|
||||||
|
break;
|
||||||
|
case "hostapd_conf":
|
||||||
|
getChannel();
|
||||||
|
setHardwareModeTooltip();
|
||||||
|
break;
|
||||||
|
case "dhcpd_conf":
|
||||||
|
loadInterfaceDHCPSelect();
|
||||||
|
break;
|
||||||
|
}
|
||||||
|
}
|
||||||
|
|
||||||
|
function setDHCPToggles(state) {
|
||||||
|
if ($('#chkfallback').is(':checked') && state) {
|
||||||
|
$('#chkfallback').prop('checked', state);
|
||||||
|
}
|
||||||
|
if ($('#dhcp-iface').is(':checked') && !state) {
|
||||||
|
$('#dhcp-iface').prop('checked', state);
|
||||||
|
setDhcpFieldsDisabled();
|
||||||
|
}
|
||||||
|
$('#chkfallback').prop('disabled', state);
|
||||||
|
$('#dhcp-iface').prop('disabled', !state);
|
||||||
|
}
|
||||||
|
|
||||||
|
$('#chkfallback').change(function() {
|
||||||
|
if ($('#chkfallback').is(':checked')) {
|
||||||
|
setStaticFieldsEnabled();
|
||||||
|
} else {
|
||||||
|
setStaticFieldsDisabled();
|
||||||
|
}
|
||||||
|
});
|
||||||
|
|
||||||
|
$('#performupdateModal').on('shown.bs.modal', function (e) {
|
||||||
|
fetchUpdateResponse();
|
||||||
|
});
|
||||||
|
|
||||||
|
$('#hostapdModal').on('shown.bs.modal', function (e) {
|
||||||
|
var seconds = 3;
|
||||||
|
var pct = 0;
|
||||||
|
var countDown = setInterval(function(){
|
||||||
|
if(seconds <= 0){
|
||||||
|
clearInterval(countDown);
|
||||||
|
}
|
||||||
|
document.getElementsByClassName('progress-bar').item(0).setAttribute('style','width:'+Number(pct)+'%');
|
||||||
|
seconds --;
|
||||||
|
pct = Math.floor(100-(seconds*100/4));
|
||||||
|
}, 500);
|
||||||
|
});
|
||||||
|
|
||||||
|
$('#configureClientModal').on('shown.bs.modal', function (e) {
|
||||||
|
});
|
||||||
|
|
||||||
|
$('#ovpn-confirm-activate').on('shown.bs.modal', function (e) {
|
||||||
|
var data = $(e.relatedTarget).data();
|
||||||
|
$('.btn-activate', this).data('recordId', data.recordId);
|
||||||
|
});
|
||||||
|
|
||||||
|
$('#ovpn-userpw,#ovpn-certs').on('click', function (e) {
|
||||||
|
if (this.id == 'ovpn-userpw') {
|
||||||
|
$('#PanelCerts').hide();
|
||||||
|
$('#PanelUserPW').show();
|
||||||
|
} else if (this.id == 'ovpn-certs') {
|
||||||
|
$('#PanelUserPW').hide();
|
||||||
|
$('#PanelCerts').show();
|
||||||
|
}
|
||||||
|
});
|
||||||
|
|
||||||
|
$('#install-user-plugin').on('shown.bs.modal', function (e) {
|
||||||
|
var button = $(e.relatedTarget);
|
||||||
|
$(this).data('button', button);
|
||||||
|
var manifestData = button.data('plugin-manifest');
|
||||||
|
var installed = button.data('plugin-installed') || false;
|
||||||
|
var repoPublic = button.data('repo-public') || false;
|
||||||
|
var installPath = manifestData.install_path;
|
||||||
|
|
||||||
|
if (!installed && repoPublic && installPath === 'plugins-available') {
|
||||||
|
insidersHTML = 'Available with <i class="fas fa-heart heart me-1"></i><a href="https://docs.raspap.com/insiders" target="_blank" rel="noopener">Insiders</a>';
|
||||||
|
$('#plugin-additional').html(insidersHTML);
|
||||||
|
} else {
|
||||||
|
$('#plugin-additional').empty();
|
||||||
|
}
|
||||||
|
if (manifestData) {
|
||||||
|
$('#plugin-docs').html(manifestData.plugin_docs
|
||||||
|
? `<a href="${manifestData.plugin_docs}" target="_blank">${manifestData.plugin_docs}</a>`
|
||||||
|
: 'Unknown');
|
||||||
|
$('#plugin-icon').attr('class', `${manifestData.icon || 'fas fa-plug'} link-secondary h5 me-2`);
|
||||||
|
$('#plugin-name').text(manifestData.name || 'Unknown');
|
||||||
|
$('#plugin-version').text(manifestData.version || 'Unknown');
|
||||||
|
$('#plugin-description').text(manifestData.description || 'No description provided');
|
||||||
|
$('#plugin-author').html(manifestData.author
|
||||||
|
? manifestData.author + (manifestData.author_uri
|
||||||
|
? ` (<a href="${manifestData.author_uri}" target="_blank">profile</a>)` : '') : 'Unknown');
|
||||||
|
$('#plugin-license').text(manifestData.license || 'Unknown');
|
||||||
|
$('#plugin-locale').text(manifestData.default_locale || 'Unknown');
|
||||||
|
$('#plugin-configuration').html(formatProperty(manifestData.configuration || 'None'));
|
||||||
|
$('#plugin-packages').html(formatProperty(manifestData.keys || 'None'));
|
||||||
|
$('#plugin-dependencies').html(formatProperty(manifestData.dependencies || 'None'));
|
||||||
|
$('#plugin-javascript').html(formatProperty(manifestData.javascript || 'None'));
|
||||||
|
$('#plugin-sudoers').html(formatProperty(manifestData.sudoers || 'None'));
|
||||||
|
$('#plugin-user-name').html((manifestData.user_nonprivileged && manifestData.user_nonprivileged.name) || 'None');
|
||||||
|
}
|
||||||
|
if (installed) {
|
||||||
|
$('#js-install-plugin-confirm').html('OK');
|
||||||
|
} else if (!installed && repoPublic && installPath == 'plugins-available') {
|
||||||
|
$('#js-install-plugin-confirm').html('Get Insiders');
|
||||||
|
} else {
|
||||||
|
$('#js-install-plugin-confirm').html('Install now');
|
||||||
|
}
|
||||||
|
});
|
||||||
|
|
||||||
|
$('#js-install-plugin-ok').on('click', function (e) {
|
||||||
|
$("#install-plugin-progress").modal('hide');
|
||||||
|
window.location.reload();
|
||||||
|
});
|
||||||
|
|
||||||
|
function formatProperty(prop) {
|
||||||
|
if (Array.isArray(prop)) {
|
||||||
|
if (typeof prop[0] === 'object') {
|
||||||
|
return prop.map(item => {
|
||||||
|
return Object.entries(item)
|
||||||
|
.map(([key, value]) => `${key}: ${value}`)
|
||||||
|
.join('<br/>');
|
||||||
|
}).join('<br/>');
|
||||||
|
}
|
||||||
|
return prop.map(line => `${line}<br/>`).join('');
|
||||||
|
}
|
||||||
|
if (typeof prop === 'object') {
|
||||||
|
return Object.entries(prop)
|
||||||
|
.map(([key, value]) => `${key}: ${value}`)
|
||||||
|
.join('<br/>');
|
||||||
|
}
|
||||||
|
return prop || 'None';
|
||||||
|
}
|
||||||
|
|
||||||
|
$(document).ready(function(){
|
||||||
|
$("#PanelManual").hide();
|
||||||
|
$('.ip_address').mask('0ZZ.0ZZ.0ZZ.0ZZ', {
|
||||||
|
translation: {
|
||||||
|
'Z': {
|
||||||
|
pattern: /[0-9]/, optional: true
|
||||||
|
}
|
||||||
|
},
|
||||||
|
placeholder: "___.___.___.___"
|
||||||
|
});
|
||||||
|
$('.mac_address').mask('FF:FF:FF:FF:FF:FF', {
|
||||||
|
translation: {
|
||||||
|
'F': {
|
||||||
|
pattern: /[0-9a-fA-F]/, optional: false
|
||||||
|
}
|
||||||
|
},
|
||||||
|
placeholder: "__:__:__:__:__:__"
|
||||||
|
});
|
||||||
|
});
|
||||||
|
|
||||||
|
$(document).ready(function() {
|
||||||
|
$('.cidr').mask('099.099.099.099/099', {
|
||||||
|
translation: {
|
||||||
|
'0': { pattern: /[0-9]/ }
|
||||||
|
},
|
||||||
|
placeholder: "___.___.___.___/___"
|
||||||
|
});
|
||||||
|
});
|
||||||
|
|
||||||
|
$('#wg-upload,#wg-manual').on('click', function (e) {
|
||||||
|
if (this.id == 'wg-upload') {
|
||||||
|
$('#PanelManual').hide();
|
||||||
|
$('#PanelUpload').show();
|
||||||
|
} else if (this.id == 'wg-manual') {
|
||||||
|
$('#PanelUpload').hide();
|
||||||
|
$('#PanelManual').show();
|
||||||
|
}
|
||||||
|
});
|
||||||
|
|
||||||
|
$(".custom-file-input").on("change", function() {
|
||||||
|
var fileName = $(this).val().split("\\").pop();
|
||||||
|
$(this).siblings(".custom-file-label").addClass("selected").html(fileName);
|
||||||
|
});
|
||||||
|
|
||||||
|
// Event listener for Bootstrap's form validation
|
||||||
|
window.addEventListener('load', function() {
|
||||||
|
// Fetch all the forms we want to apply custom Bootstrap validation styles to
|
||||||
|
var forms = document.getElementsByClassName('needs-validation');
|
||||||
|
// Loop over them and prevent submission
|
||||||
|
var validation = Array.prototype.filter.call(forms, function(form) {
|
||||||
|
form.addEventListener('submit', function(event) {
|
||||||
|
if (form.checkValidity() === false) {
|
||||||
|
event.preventDefault();
|
||||||
|
event.stopPropagation();
|
||||||
|
}
|
||||||
|
form.classList.add('was-validated');
|
||||||
|
}, false);
|
||||||
|
});
|
||||||
|
}, false);
|
||||||
|
|
||||||
|
function showSessionExpiredModal() {
|
||||||
|
$('#sessionTimeoutModal').modal('show');
|
||||||
|
}
|
||||||
|
|
||||||
|
$(document).on("click", "#js-session-expired-login", function(e) {
|
||||||
|
const loginModal = $('#modal-admin-login');
|
||||||
|
const redirectUrl = window.location.pathname;
|
||||||
|
window.location.href = `/login?action=${encodeURIComponent(redirectUrl)}`;
|
||||||
|
});
|
||||||
|
|
||||||
|
// show modal login on page load
|
||||||
|
$(document).ready(function () {
|
||||||
|
const params = new URLSearchParams(window.location.search);
|
||||||
|
const redirectUrl = $('#redirect-url').val() || params.get('action') || '/';
|
||||||
|
$('#modal-admin-login').modal('show');
|
||||||
|
$('#redirect-url').val(redirectUrl);
|
||||||
|
$('#username').focus();
|
||||||
|
$('#username').addClass("focusedInput");
|
||||||
|
});
|
||||||
|
|
||||||
|
// DHCP or Static IP option group
|
||||||
|
$('#chkstatic').on('change', function() {
|
||||||
|
if (this.checked) {
|
||||||
|
setStaticFieldsEnabled();
|
||||||
|
}
|
||||||
|
});
|
||||||
|
|
||||||
|
$('#chkdhcp').on('change', function() {
|
||||||
|
this.checked ? setStaticFieldsDisabled() : null;
|
||||||
|
});
|
||||||
|
|
||||||
|
|
||||||
|
$('input[name="dhcp-iface"]').change(function() {
|
||||||
|
if ($('input[name="dhcp-iface"]:checked').val() == '1') {
|
||||||
|
setDhcpFieldsEnabled();
|
||||||
|
} else {
|
||||||
|
setDhcpFieldsDisabled();
|
||||||
|
}
|
||||||
|
});
|
||||||
|
|
||||||
|
|
||||||
|
function setStaticFieldsEnabled() {
|
||||||
|
$('#txtipaddress').prop('required', true);
|
||||||
|
$('#txtsubnetmask').prop('required', true);
|
||||||
|
$('#txtgateway').prop('required', true);
|
||||||
|
|
||||||
|
$('#txtipaddress').removeAttr('disabled');
|
||||||
|
$('#txtsubnetmask').removeAttr('disabled');
|
||||||
|
$('#txtgateway').removeAttr('disabled');
|
||||||
|
}
|
||||||
|
|
||||||
|
function setStaticFieldsDisabled() {
|
||||||
|
$('#txtipaddress').prop('disabled', true);
|
||||||
|
$('#txtsubnetmask').prop('disabled', true);
|
||||||
|
$('#txtgateway').prop('disabled', true);
|
||||||
|
|
||||||
|
$('#txtipaddress').removeAttr('required');
|
||||||
|
$('#txtsubnetmask').removeAttr('required');
|
||||||
|
$('#txtgateway').removeAttr('required');
|
||||||
|
}
|
||||||
|
|
||||||
|
function setDhcpFieldsEnabled() {
|
||||||
|
$('#txtrangestart').prop('required', true);
|
||||||
|
$('#txtrangeend').prop('required', true);
|
||||||
|
$('#txtrangeleasetime').prop('required', true);
|
||||||
|
$('#cbxrangeleasetimeunits').prop('required', true);
|
||||||
|
|
||||||
|
$('#txtrangestart').removeAttr('disabled');
|
||||||
|
$('#txtrangeend').removeAttr('disabled');
|
||||||
|
$('#txtrangeleasetime').removeAttr('disabled');
|
||||||
|
$('#cbxrangeleasetimeunits').removeAttr('disabled');
|
||||||
|
$('#txtdns1').removeAttr('disabled');
|
||||||
|
$('#txtdns2').removeAttr('disabled');
|
||||||
|
$('#txtmetric').removeAttr('disabled');
|
||||||
|
}
|
||||||
|
|
||||||
|
function setDhcpFieldsDisabled() {
|
||||||
|
$('#txtrangestart').removeAttr('required');
|
||||||
|
$('#txtrangeend').removeAttr('required');
|
||||||
|
$('#txtrangeleasetime').removeAttr('required');
|
||||||
|
$('#cbxrangeleasetimeunits').removeAttr('required');
|
||||||
|
|
||||||
|
$('#txtrangestart').prop('disabled', true);
|
||||||
|
$('#txtrangeend').prop('disabled', true);
|
||||||
|
$('#txtrangeleasetime').prop('disabled', true);
|
||||||
|
$('#cbxrangeleasetimeunits').prop('disabled', true);
|
||||||
|
$('#txtdns1').prop('disabled', true);
|
||||||
|
$('#txtdns2').prop('disabled', true);
|
||||||
|
$('#txtmetric').prop('disabled', true);
|
||||||
|
}
|
||||||
|
|
||||||
|
// Static Array method
|
||||||
|
Array.range = (start, end) => Array.from({length: (end - start)}, (v, k) => k + start);
|
||||||
|
|
||||||
|
$(document).on("click", ".js-toggle-password", function(e) {
|
||||||
|
var button = $(e.currentTarget);
|
||||||
|
var field = $(button.data("bsTarget"));
|
||||||
|
if (field.is(":input")) {
|
||||||
|
e.preventDefault();
|
||||||
|
|
||||||
|
if (!button.data("__toggle-with-initial")) {
|
||||||
|
$("i", button).removeClass("fas fa-eye").addClass(button.attr("data-toggle-with"));
|
||||||
|
}
|
||||||
|
|
||||||
|
if (field.attr("type") === "password") {
|
||||||
|
field.attr("type", "text");
|
||||||
|
} else {
|
||||||
|
$("i", button).removeClass("fas fa-eye-slash").addClass("fas fa-eye");
|
||||||
|
field.attr("type", "password");
|
||||||
|
}
|
||||||
|
}
|
||||||
|
});
|
||||||
|
|
||||||
|
$(function() {
|
||||||
|
$('#theme-select').change(function() {
|
||||||
|
var theme = themes[$( "#theme-select" ).val() ];
|
||||||
|
|
||||||
|
var hasDarkTheme = theme === 'custom.php';
|
||||||
|
var nightModeChecked = $("#night-mode").prop("checked");
|
||||||
|
|
||||||
|
if (nightModeChecked && hasDarkTheme) {
|
||||||
|
if (theme === "custom.php") {
|
||||||
|
set_theme("dark.css");
|
||||||
|
}
|
||||||
|
} else {
|
||||||
|
set_theme(theme);
|
||||||
|
}
|
||||||
|
});
|
||||||
|
});
|
||||||
|
|
||||||
|
function set_theme(theme) {
|
||||||
|
$('link[title="main"]').attr('href', 'app/css/' + theme);
|
||||||
|
// persist selected theme in cookie
|
||||||
|
setCookie('theme',theme,90);
|
||||||
|
}
|
||||||
|
|
||||||
|
$(function() {
|
||||||
|
var currentTheme = getCookie('theme');
|
||||||
|
// Check if the current theme is a dark theme
|
||||||
|
var isDarkTheme = currentTheme === 'dark.css';
|
||||||
|
|
||||||
|
$('#night-mode').prop('checked', isDarkTheme);
|
||||||
|
$('#night-mode').change(function() {
|
||||||
|
var state = $(this).is(':checked');
|
||||||
|
var currentTheme = getCookie('theme');
|
||||||
|
|
||||||
|
if (state == true) {
|
||||||
|
if (currentTheme == 'custom.php') {
|
||||||
|
set_theme('dark.css');
|
||||||
|
}
|
||||||
|
} else {
|
||||||
|
if (currentTheme == 'dark.css') {
|
||||||
|
set_theme('custom.php');
|
||||||
|
}
|
||||||
|
}
|
||||||
|
});
|
||||||
|
});
|
||||||
|
|
||||||
|
function setCookie(cname, cvalue, exdays) {
|
||||||
|
var d = new Date();
|
||||||
|
d.setTime(d.getTime() + (exdays*24*60*60*1000));
|
||||||
|
var expires = "expires="+ d.toUTCString();
|
||||||
|
document.cookie = cname + "=" + cvalue + ";" + expires + ";path=/";
|
||||||
|
}
|
||||||
|
|
||||||
|
function getCookie(cname) {
|
||||||
|
var regx = new RegExp(cname + "=([^;]+)");
|
||||||
|
var value = regx.exec(document.cookie);
|
||||||
|
return (value != null) ? unescape(value[1]) : null;
|
||||||
|
}
|
||||||
|
|
||||||
|
// Define themes
|
||||||
|
var themes = {
|
||||||
|
"default": "custom.php",
|
||||||
|
"hackernews" : "hackernews.css"
|
||||||
|
}
|
||||||
|
|
||||||
|
// Adds active class to current nav-item
|
||||||
|
$(window).bind("load", function() {
|
||||||
|
var url = window.location;
|
||||||
|
$('.sb-nav-link-icon a').filter(function() {
|
||||||
|
return this.href == url;
|
||||||
|
}).parent().addClass('active');
|
||||||
|
});
|
||||||
|
|
||||||
|
// Sets focus on a specified tab
|
||||||
|
document.addEventListener("DOMContentLoaded", function () {
|
||||||
|
const params = new URLSearchParams(window.location.search);
|
||||||
|
const targetTab = params.get("tab");
|
||||||
|
if (targetTab) {
|
||||||
|
let tabElement = document.querySelector(`[data-bs-toggle="tab"][href="#${targetTab}"]`);
|
||||||
|
if (tabElement) {
|
||||||
|
let tab = new bootstrap.Tab(tabElement);
|
||||||
|
tab.show();
|
||||||
|
}
|
||||||
|
}
|
||||||
|
});
|
||||||
|
|
||||||
|
function disableValidation(form) {
|
||||||
|
form.removeAttribute("novalidate");
|
||||||
|
form.classList.remove("needs-validation");
|
||||||
|
form.querySelectorAll("[required]").forEach(function (field) {
|
||||||
|
field.removeAttribute("required");
|
||||||
|
});
|
||||||
|
}
|
||||||
|
|
||||||
|
function updateActivityLED() {
|
||||||
|
const threshold_bytes = 300;
|
||||||
|
fetch('/app/net_activity')
|
||||||
|
.then(res => res.text())
|
||||||
|
.then(data => {
|
||||||
|
const activity = parseInt(data.trim());
|
||||||
|
const leds = document.querySelectorAll('.hostapd-led');
|
||||||
|
|
||||||
|
if (!isNaN(activity)) {
|
||||||
|
leds.forEach(led => {
|
||||||
|
if (activity > threshold_bytes) {
|
||||||
|
led.classList.add('led-pulse');
|
||||||
|
setTimeout(() => {
|
||||||
|
led.classList.remove('led-pulse');
|
||||||
|
}, 50);
|
||||||
|
} else {
|
||||||
|
led.classList.remove('led-pulse');
|
||||||
|
}
|
||||||
|
});
|
||||||
|
}
|
||||||
|
})
|
||||||
|
.catch(() => { /* ignore fetch errors */ });
|
||||||
|
}
|
||||||
|
setInterval(updateActivityLED, 100);
|
||||||
|
|
||||||
|
$(document).ready(function() {
|
||||||
|
const $htmlElement = $('html');
|
||||||
|
const $modeswitch = $('#night-mode');
|
||||||
|
$modeswitch.on('change', function() {
|
||||||
|
const isChecked = $(this).is(':checked');
|
||||||
|
const newTheme = isChecked ? 'dark' : 'light';
|
||||||
|
$htmlElement.attr('data-bs-theme', newTheme);
|
||||||
|
localStorage.setItem('bsTheme', newTheme);
|
||||||
|
});
|
||||||
|
});
|
||||||
|
|
||||||
|
$(document)
|
||||||
|
.ajaxSend(setCSRFTokenHeader)
|
||||||
|
.ready(contentLoaded)
|
||||||
|
.ready(loadWifiStations());
|
||||||
|
|
||||||
@@ -123,7 +123,7 @@ function DisplayDashboard(&$extraFooterScripts): void
|
|||||||
"status"
|
"status"
|
||||||
)
|
)
|
||||||
);
|
);
|
||||||
$extraFooterScripts[] = array('src'=>'app/js/dashboardchart.js', 'defer'=>false);
|
$extraFooterScripts[] = array('src'=>'app/js/vendor/dashboardchart.js', 'defer'=>false);
|
||||||
}
|
}
|
||||||
|
|
||||||
/**
|
/**
|
||||||
|
|||||||
@@ -9,5 +9,5 @@ function DisplayDataUsage(&$extraFooterScripts)
|
|||||||
echo renderTemplate("data_usage", [ "interfaces" => $interfacesWlo ]);
|
echo renderTemplate("data_usage", [ "interfaces" => $interfacesWlo ]);
|
||||||
|
|
||||||
$extraFooterScripts[] = array('src'=>'dist/datatables/jquery.dataTables.min.js', 'defer'=>false);
|
$extraFooterScripts[] = array('src'=>'dist/datatables/jquery.dataTables.min.js', 'defer'=>false);
|
||||||
$extraFooterScripts[] = array('src'=>'app/js/bandwidthcharts.js', 'defer'=>false);
|
$extraFooterScripts[] = array('src'=>'app/js/vendor/bandwidthcharts.js', 'defer'=>false);
|
||||||
}
|
}
|
||||||
|
|||||||
@@ -23,5 +23,5 @@ function DisplayNetworkingConfig(&$extraFooterScripts)
|
|||||||
"routeInfoRaw",
|
"routeInfoRaw",
|
||||||
"bridgedEnabled")
|
"bridgedEnabled")
|
||||||
);
|
);
|
||||||
$extraFooterScripts[] = array('src'=>'app/js/speedtestUI.js', 'defer'=>false);
|
$extraFooterScripts[] = array('src'=>'app/js/vendor/speedtestUI.js', 'defer'=>false);
|
||||||
}
|
}
|
||||||
|
|||||||
@@ -122,7 +122,7 @@ function DisplaySystem(&$extraFooterScripts)
|
|||||||
];
|
];
|
||||||
$selectedTheme = array_search($_COOKIE['theme'], $themeFiles);
|
$selectedTheme = array_search($_COOKIE['theme'], $themeFiles);
|
||||||
$extraFooterScripts[] = array('src'=>'dist/huebee/huebee.pkgd.min.js', 'defer'=>false);
|
$extraFooterScripts[] = array('src'=>'dist/huebee/huebee.pkgd.min.js', 'defer'=>false);
|
||||||
$extraFooterScripts[] = array('src'=>'app/js/huebee.js', 'defer'=>false);
|
$extraFooterScripts[] = array('src'=>'app/js/vendor/huebee.js', 'defer'=>false);
|
||||||
$logLimit = isset($_SESSION['log_limit']) ? $_SESSION['log_limit'] : RASPI_LOG_SIZE_LIMIT;
|
$logLimit = isset($_SESSION['log_limit']) ? $_SESSION['log_limit'] : RASPI_LOG_SIZE_LIMIT;
|
||||||
|
|
||||||
$plugins = $pluginInstaller->getUserPlugins();
|
$plugins = $pluginInstaller->getUserPlugins();
|
||||||
|
|||||||
@@ -147,8 +147,9 @@ initializeApp();
|
|||||||
<!-- Librespeed JavaScript -->
|
<!-- Librespeed JavaScript -->
|
||||||
<script src="dist/speedtest/speedtest.js?v=<?= filemtime('dist/speedtest/speedtest.js'); ?>"></script>
|
<script src="dist/speedtest/speedtest.js?v=<?= filemtime('dist/speedtest/speedtest.js'); ?>"></script>
|
||||||
|
|
||||||
<!-- Custom RaspAP JS -->
|
<!-- RaspAP JavaScript -->
|
||||||
<script src="app/js/custom.js?v=<?= filemtime('app/js/custom.js'); ?>"></script>
|
<script src="app/js/ajax/main.js?v=<?= filemtime('app/js/ajax/main.js'); ?>"></script>
|
||||||
|
<script src="app/js/ui/main.js?v=<?= filemtime('app/js/ui/main.js'); ?>"></script>
|
||||||
|
|
||||||
<?php loadFooterScripts($extraFooterScripts); ?>
|
<?php loadFooterScripts($extraFooterScripts); ?>
|
||||||
</body>
|
</body>
|
||||||
|
|||||||
2
plugins
2
plugins
Submodule plugins updated: a867897ee5...a9bfe51603
Reference in New Issue
Block a user