update os logic

public/javascript/main.js

@@ -1476,19 +1476,54 @@ function createTd(tr, text, options = {}) {
 };
 //#endregion
 
+
 //#region Tabs
-function createTab(tabSelector, name, onclick = null) {
-  const tabElement = document.createElement('div');
-  tabElement.className = 'tab';
-  tabElement.dataset.tab = name;
-  tabElement.textContent = name;
-  tabSelector.appendChild(tabElement);
-  tabElement.addEventListener('click', async () => {
-    Array.from(document.querySelectorAll('.tab')).forEach(t => t.classList.remove('active'));
-    tabElement.classList.add('active');
-    if(typeof onclick === 'function') {
-      onclick();
+function createTab(tabSelector, name, options = {}) {
+    const {
+        id = null,
+        hidden = false,
+        classes = [],
+        styles = null,
+        attributes = {},
+        onclick = null
+    } = options;
+
+    const tabElement = document.createElement('div');
+    tabElement.className = 'tab';
+    tabElement.dataset.tab = name;
+    tabElement.textContent = name;
+    tabSelector.appendChild(tabElement);
+
+    if(id !== null) {
+        tabElement.id = id;
     }
-  });
+
+    // Standard-Stile & Attribute
+    tabElement.hidden = hidden;
+
+    classes.forEach(c => tabElement.classList.add(c));
+
+    if (styles && typeof styles === 'object') {
+        Object.entries(styles).forEach(([prop, value]) => {
+        tabElement.style[prop] = value;
+        });
+    }
+
+    // Data attributes
+    if (attributes && typeof attributes === 'object') {
+        Object.entries(attributes).forEach(([key, value]) => {
+        tabElement.setAttribute(key, value);
+        });
+    }
+
+    tabElement.addEventListener('click', async (evt) => {
+        Array.from(tabSelector.querySelectorAll('.tab')).forEach(t => t.classList.remove('active'));
+        tabElement.classList.add('active');
+        if(typeof onclick === 'function') {
+            onclick(evt);
+        }
+    });
+
+    return tabElement;
 }
 //#endregion

public/javascript/os.js

@@ -378,6 +378,7 @@ function applyMaximized(win) {
 
   win.classList.add('max');
   win.dataset.state = 'maximized';
+
 }
 
 
@@ -600,16 +601,18 @@ function wireWindowControls(win, taskbarBtn = null) {
   if (taskbarBtn !== null) {
     titlebar.addEventListener('dblclick', (evt) => {
       toggleMaximize();
+      titlebar.querySelector('.maximize').innerHTML = win.dataset.state === 'maximized' ? '🗗' : '▢';
       saveOpenWindows()
     });
   }
+  
 
   titlebar.addEventListener('touchend', (ev) => {
     const current = Date.now();
     const delta = current - lastTap;
-
     if (delta < 300 && delta > 0) {
       // Double tap → maximize / restore
+      titlebar.querySelector('.maximize').innerHTML = win.dataset.state === 'maximized' ? '🗗' : '▢';
       toggleMaximize();
     }
     lastTap = current;
@@ -668,7 +671,7 @@ function destroyWindow(win) {
       // 🔥 VOR dem Maximieren speichern
       storeNormalGeometry(win);
 
-applyMaximized(win);
+    applyMaximized(win);
     } else {
       const prev = JSON.parse(win.dataset.normalGeometry || '{}');
 
@@ -838,6 +841,7 @@ function makeDraggableWithSnap(win) {
     } else if (ev.clientY <= snapThreshold) {
       // Snap top (maximize)
       applySnap(win, 'top');
+      win.querySelector('.maximize').innerHTML = '🗗';
       snapped = 'top';
     } else if (snapped && ev.clientX > snapThreshold * 2 && ev.clientX < screenW - snapThreshold * 2) {
       // Wegziehen vom Rand → Restore
@@ -865,6 +869,7 @@ function makeDraggableWithSnap(win) {
     }
 
     win.classList.add('max');
+    
 
     if (side === 'left') {
       win.style.left = '0';
@@ -908,6 +913,8 @@ function makeDraggableWithSnap(win) {
     win.style.height = height + 'px';
 
     win.classList.remove('max');
+    win.querySelector('.maximize').innerHTML = '▢';
+
     win.dataset.state = 'normal';
     win.dataset.snapped = '';
   }