troy-grunt/netwatch
1
0
Fork 0
Code Issues Pull Requests Actions Packages Projects Releases Wiki Activity

div TODOs

Browse Source
This commit is contained in:
fixclean
2026-02-16 13:56:01 +01:00
parent 12141485ae
commit 510a248edb
36 changed files with 1500 additions and 1533 deletions
Download Patch File Download Diff File Expand all files Collapse all files

179
app/assets/js/app.js
View File

@@ -1,135 +1,110 @@
/**
* app/assets/js/app.js
*
* Zentrale JS-Datei für die Webanwendung
* - Initialisiert alle Module
* - SVG-Editor, Netzwerk-Ansicht, Drag & Drop, Floorplan
* - Event-Handler, globale Variablen
*/
// =========================
// Global Variables / Config
// =========================
window.APP = {
deviceTypes: [], // TODO: alle Gerätetypen laden
devices: [], // TODO: alle Geräte laden
racks: [], // TODO: alle Racks laden
floors: [], // TODO: alle Floors laden
connections: [], // TODO: alle Verbindungen laden
state: {
deviceTypes: [],
devices: [],
racks: [],
floors: [],
connections: [],
},
capabilities: {
hasGlobalDataApi: false,
}
};
// =========================
// Init Functions
// =========================
document.addEventListener('DOMContentLoaded', () => {
console.log('App initialized');
// =========================
// SVG-Port-Editor initialisieren
// =========================
// TODO: import / init svg-editor.js
// if (window.SVGEditor) window.SVGEditor.init();
// =========================
// Netzwerk-Ansicht initialisieren
// =========================
// TODO: import / init network-view.js
// if (window.NetworkView) window.NetworkView.init();
// =========================
// Drag & Drop für Floors / Racks / Devices
// =========================
// TODO: init drag & drop logic
// =========================
// Event-Handler für Buttons / Forms
// =========================
initViewModules();
initEventHandlers();
});
// =========================
// Event Handler Setup
// =========================
function initViewModules() {
if (typeof window.Dashboard?.init === 'function') {
window.Dashboard.init();
}
// Both modules are loaded via script tags in header.php.
// They are self-initializing and only run when expected DOM nodes exist.
window.dispatchEvent(new CustomEvent('app:modules-initialized'));
}
function initEventHandlers() {
// TODO: Save-Button Device-Type
const saveDeviceTypeBtn = document.querySelector('#save-device-type');
if (saveDeviceTypeBtn) {
saveDeviceTypeBtn.addEventListener('click', (e) => {
e.preventDefault();
// TODO: Save Device-Type via AJAX
});
}
// TODO: Save-Button Device
const saveDeviceBtn = document.querySelector('#save-device');
if (saveDeviceBtn) {
saveDeviceBtn.addEventListener('click', (e) => {
e.preventDefault();
// TODO: Save Device via AJAX
});
}
// TODO: Save-Button Floor
const saveFloorBtn = document.querySelector('#save-floor');
if (saveFloorBtn) {
saveFloorBtn.addEventListener('click', (e) => {
e.preventDefault();
// TODO: Save Floor via AJAX
});
}
// TODO: Save-Button Rack
const saveRackBtn = document.querySelector('#save-rack');
if (saveRackBtn) {
saveRackBtn.addEventListener('click', (e) => {
e.preventDefault();
// TODO: Save Rack via AJAX
});
}
// TODO: Weitere Event-Handler (Import, Export, Filter)
bindFormSubmitButton('#save-device-type', 'form[action*="module=device_types"][action*="save"]');
bindFormSubmitButton('#save-device', 'form[action*="module=devices"][action*="save"]');
bindFormSubmitButton('#save-floor', 'form[action*="module=floors"][action*="save"]');
bindFormSubmitButton('#save-rack', 'form[action*="module=racks"][action*="save"]');
document.querySelectorAll('[data-confirm-delete]').forEach((btn) => {
btn.addEventListener('click', (event) => {
event.preventDefault();
const message = btn.getAttribute('data-confirm-message') || 'Aktion ausführen?';
const message = btn.getAttribute('data-confirm-message') || 'Aktion ausfuehren?';
if (confirm(message)) {
alert(btn.getAttribute('data-confirm-feedback') || 'Diese Funktion ist noch nicht verfügbar.');
const href = btn.getAttribute('href') || btn.dataset.href;
if (href) {
window.location.href = href;
}
}
});
});
document.querySelectorAll('[data-filter-submit]').forEach((el) => {
el.addEventListener('change', () => {
const form = el.closest('form');
if (form) {
form.requestSubmit();
}
});
});
}
// =========================
// Utility Functions
// =========================
function bindFormSubmitButton(buttonSelector, formSelector) {
const button = document.querySelector(buttonSelector);
if (!button) {
return;
}
/**
* AJAX Request Helper
* @param {string} url
* @param {object} data
* @param {function} callback
*/
function ajaxPost(url, data, callback) {
button.addEventListener('click', (event) => {
event.preventDefault();
const form = button.closest('form') || document.querySelector(formSelector);
if (form) {
form.requestSubmit();
}
});
}
function ajaxPost(url, data, callback, onError) {
const xhr = new XMLHttpRequest();
xhr.open('POST', url, true);
xhr.setRequestHeader('Content-Type', 'application/json;charset=UTF-8');
xhr.onload = function() {
xhr.onload = function onLoad() {
if (xhr.status >= 200 && xhr.status < 300) {
callback(JSON.parse(xhr.responseText));
} else {
console.error('AJAX Error:', xhr.statusText);
let parsed = null;
try {
parsed = JSON.parse(xhr.responseText);
} catch (error) {
if (typeof onError === 'function') {
onError(error);
}
return;
}
callback(parsed);
return;
}
if (typeof onError === 'function') {
onError(new Error('AJAX error: ' + xhr.status));
}
};
xhr.onerror = function onXhrError() {
if (typeof onError === 'function') {
onError(new Error('Netzwerkfehler'));
}
};
xhr.send(JSON.stringify(data));
}
// TODO: weitere Utility-Funktionen (DOM-Helper, SVG-Helper, etc.)
// Dashboard initialisieren
if (window.Dashboard) window.Dashboard.init();
window.APP.ajaxPost = ajaxPost;