chore(release): set APP_VERSION to v2.0.3 [skip ci]

- Update scripts/manual-sync.sh to pull v2.0.2, backup extra demo/Pro dirs,
  and safely rsync core code without touching data, bundles, or site overrides
- After sync, automatically flip FR_DEMO_MODE to true in config/config.php
  so the droplet always runs in demo mode
- Block TOTP enable/disable/setup and recovery code generation for the
  demo account when FR_DEMO_MODE is enabled, returning 403 with clear
  JSON errors

CHANGELOG.md

@@ -1,5 +1,34 @@
 # Changelog
 
+## Changes 11/26/2025 (v2.0.3)
+
+release(v2.0.3): polish uploads, header dock, and panel fly animations
+
+- Rework upload drop area markup to be rebuild-safe and wire a guarded "Choose files" button
+  so only one OS file-picker dialog can open at a time.
+- Centralize file input change handling and reset selectedFiles/_currentResumableIds per batch
+  to avoid duplicate resumable entries and keep the progress list/drafts in sync.
+- Ensure drag-and-drop uploads still support folder drops while file-picker is files-only.
+- Add ghost-based animations when collapsing panels into the header dock and expanding them back
+  to sidebar/top zones, inheriting card background/border/shadow for smooth visuals.
+- Offset sidebar ghosts so upload and folder cards don't stack directly on top of each other.
+- Respect header-pinned cards: cards saved to HEADER stay as icons and no longer fly out on expand.
+- Slightly tighten file summary margin in the file list header for better alignment with actions.
+
+---
+
+## Changes 11/23/2025 (v2.0.2)
+
+release(v2.0.2): add config-driven demo mode and lock demo account changes
+
+- Wire FR_DEMO_MODE through AdminModel/siteConfig and admin getConfig (demoMode flag)
+- Drive demo detection in JS from __FR_SITE_CFG__.demoMode instead of hostname
+- Show consistent login tip + toasts for demo using shared __FR_DEMO__ flag
+- Block password changes for the demo user and profile picture uploads when in demo mode
+- Keep normal user dropdown/admin UI visible even on the demo, while still protecting the demo account
+
+---
+
 ## Changes 11/23/2025 (v2.0.0)
 
 ### FileRise Core v2.0.0 & FileRise Pro v1.1.0

README.md

@@ -10,22 +10,25 @@
 [![Sponsor on GitHub](https://img.shields.io/badge/Sponsor-❤-red)](https://github.com/sponsors/error311)
 [![Support on Ko-fi](https://img.shields.io/badge/Ko--fi-Buy%20me%20a%20coffee-orange)](https://ko-fi.com/error311)
 
-**FileRise** is a modern, self‑hosted web file manager / WebDAV server.  
-Drag & drop uploads, ACL‑aware sharing, OnlyOffice integration, and a clean UI — all in a single PHP app that you control.
+**FileRise** is a modern, self-hosted web file manager / WebDAV server.  
+Drag & drop uploads, ACL-aware sharing, OnlyOffice integration, and a clean UI — all in a single PHP app that you control.
 
-- 💾 **Self‑hosted “cloud drive”** – Runs anywhere with PHP (or via Docker). No external DB required.
-- 🔐 **Granular per‑folder ACLs** – View / Own / Upload / Edit / Delete / Share, enforced across UI, API, and WebDAV.
-- 🔄 **Fast drag‑and‑drop uploads** – Chunked, resumable uploads with pause/resume and progress.
+- 💾 **Self-hosted “cloud drive”** – Runs anywhere with PHP (or via Docker). No external DB required.
+- 🔐 **Granular per-folder ACLs** – View / Own / Upload / Edit / Delete / Share, enforced across UI, API, and WebDAV.
+- 🔄 **Fast drag-and-drop uploads** – Chunked, resumable uploads with pause/resume and progress.
 - 🌳 **Scales to huge trees** – Tested with **100k+ folders** in the sidebar tree.
 - 🧩 **ONLYOFFICE support (optional)** – Edit DOCX/XLSX/PPTX using your own Document Server.
 - 🌍 **WebDAV** – Mount FileRise as a drive from macOS, Windows, Linux, or Cyberduck/WinSCP.
-- 🎨 **Polished UI** – Dark/light mode, responsive layout, in‑browser previews & code editor.
+- 🎨 **Polished UI** – Dark/light mode, responsive layout, in-browser previews & code editor.
 - 🔑 **Login + SSO** – Local users, TOTP 2FA, and OIDC (Auth0 / Authentik / Keycloak / etc.).
+- 👥 **User groups & client portals (Pro)** – Group-based ACLs and brandable client upload portals.
+
+Full list of features available at [Full Feature Wiki](https://github.com/error311/FileRise/wiki/Features)
 
 ![FileRise](https://raw.githubusercontent.com/error311/FileRise/master/resources/filerise-v2.0.0.png)
 
-> 💡 Looking for **FileRise Pro** (brandable header, Pro features, license handling)?
-> Check out [filerise.net](https://filerise.net) – FileRise Core stays fully open‑source (MIT).
+> 💡 Looking for **FileRise Pro** (brandable header, **user groups**, **client upload portals**, license handling)?
+> Check out [filerise.net](https://filerise.net) – FileRise Core stays fully open-source (MIT).
 
 ---
 
@@ -73,7 +76,10 @@ http://your-server-ip:8080
 
 On first launch you’ll be guided through creating the **initial admin user**.
 
-**More Docker options (Unraid, docker‑compose, env vars, reverse proxy, etc.)**  
+**More Docker options (Unraid, docker‑compose, env vars, reverse proxy, etc.)**
+[Install & Setup](https://github.com/error311/FileRise/wiki/Installation-Setup)
+[nginx](https://github.com/error311/FileRise/wiki/Nginx-Setup)
+[FAQ](https://github.com/error311/FileRise/wiki/FAQ)
 See the Docker repo: [docker repo](https://github.com/error311/filerise-docker)
 
 ---

config/config.php

@@ -16,6 +16,7 @@ define('REGEX_FOLDER_NAME','/^(?!^(?:CON|PRN|AUX|NUL|COM[1-9]|LPT[1-9])$)(?!.*[.
 define('PATTERN_FOLDER_NAME','[\p{L}\p{N}_\-\s\/\\\\]+');
 define('REGEX_FILE_NAME', '/^[^\x00-\x1F\/\\\\]{1,255}$/u');
 define('REGEX_USER',       '/^[\p{L}\p{N}_\- ]+$/u');
+define('FR_DEMO_MODE', false);
 
 date_default_timezone_set(TIMEZONE);
 

public/js/auth.js

@@ -34,18 +34,19 @@ window.currentOIDCConfig = currentOIDCConfig;
 
 
 (function installToastFilter() {
-  const isDemoHost = location.hostname.toLowerCase() === 'demo.filerise.net';
-
   window.__FR_TOAST_FILTER__ = function (msgKeyOrText) {
+    const isDemoMode = !!window.__FR_DEMO__;
+
     // Suppress the nag while doing TOTP step-up
     if (window.pendingTOTP && (msgKeyOrText === 'please_log_in_to_continue' ||
       /please log in/i.test(String(msgKeyOrText)))) {
       return null; // suppress
     }
 
-    // Demo host
-    if (isDemoHost && (msgKeyOrText === 'please_log_in_to_continue' ||
-      /please log in/i.test(String(msgKeyOrText)))) {
+    // Demo mode: swap login prompt for demo creds
+    if (isDemoMode &&
+        (msgKeyOrText === 'please_log_in_to_continue' ||
+         /please log in/i.test(String(msgKeyOrText)))) {
       return "Demo site — use:\nUsername: demo\nPassword: demo";
     }
 
@@ -81,14 +82,16 @@ window.pendingTOTP = new URLSearchParams(window.location.search).get('totp_requi
 // override showToast to suppress the "Please log in to continue." toast during TOTP
 
 function showToast(msgKeyOrText, type) {
-  const isDemoHost = window.location.hostname.toLowerCase() === "demo.filerise.net";
+  const isDemoMode = !!window.__FR_DEMO__;
 
-  // If it's the pre-login prompt and we're on the demo site, show demo creds instead.
-  if (isDemoHost) {
+  // For the pre-login prompt in demo mode, show demo creds instead
+  if (isDemoMode &&
+      (msgKeyOrText === "please_log_in_to_continue" ||
+       /please log in/i.test(String(msgKeyOrText)))) {
     return originalShowToast("Demo site — use: \nUsername: demo\nPassword: demo", 12000);
   }
 
-  // Don’t nag during pending TOTP, as you already had
+  // Don’t nag during pending TOTP
   if (window.pendingTOTP && msgKeyOrText === "please_log_in_to_continue") {
     return;
   }
@@ -97,11 +100,10 @@ function showToast(msgKeyOrText, type) {
   let msg = msgKeyOrText;
   try {
     const translated = t(msgKeyOrText);
-    // If t() changed it or it's a key-like string, use the translation
     if (typeof translated === "string" && translated !== msgKeyOrText) {
       msg = translated;
     }
-  } catch { /* if t() isn’t available here, just use the original */ }
+  } catch { }
 
   return originalShowToast(msg);
 }
@@ -351,26 +353,8 @@ export async function updateAuthenticatedUI(data) {
     if (r) r.style.display = "none";
   }
 
-  // b) admin panel button only on demo.filerise.net
-  if (data.isAdmin && window.location.hostname === "demo.filerise.net") {
-    let a = document.getElementById("adminPanelBtn");
-    if (!a) {
-      a = document.createElement("button");
-      a.id = "adminPanelBtn";
-      a.classList.add("btn", "btn-info");
-      a.setAttribute("data-i18n-title", "admin_panel");
-      a.innerHTML = '<i class="material-icons">admin_panel_settings</i>';
-      insertAfter(a, document.getElementById("restoreFilesBtn"));
-      a.addEventListener("click", openAdminPanel);
-    }
-    a.style.display = "block";
-  } else {
-    const a = document.getElementById("adminPanelBtn");
-    if (a) a.style.display = "none";
-  }
-
   // c) user dropdown on non-demo
-  if (window.location.hostname !== "demo.filerise.net") {
+{
     let dd = document.getElementById("userDropdown");
 
     // choose icon *or* img
@@ -866,6 +850,10 @@ function initAuth() {
   });
   document.getElementById("cancelRemoveUserBtn").addEventListener("click", closeRemoveUserModal);
   document.getElementById("changePasswordBtn").addEventListener("click", function () {
+    if (window.__FR_DEMO__) {
+      showToast("Password changes are disabled on the public demo.");
+      return;
+    }
     document.getElementById("changePasswordModal").style.display = "block";
     document.getElementById("oldPassword").focus();
   });
@@ -873,6 +861,10 @@ function initAuth() {
     document.getElementById("changePasswordModal").style.display = "none";
   });
   document.getElementById("saveNewPasswordBtn").addEventListener("click", function () {
+    if (window.__FR_DEMO__) {
+      showToast("Password changes are disabled on the public demo.");
+      return;
+    }
     const oldPassword = document.getElementById("oldPassword").value.trim();
     const newPassword = document.getElementById("newPassword").value.trim();
     const confirmPassword = document.getElementById("confirmPassword").value.trim();

public/js/dragAndDrop.js

@@ -72,6 +72,41 @@ function animateVerticalSlide(card) {
   }, 260);
 }
 
+function createCardGhost(card, rect, opts) {
+  const options = opts || {};
+  const scale   = typeof options.scale === 'number' ? options.scale : 1;
+  const opacity = typeof options.opacity === 'number' ? options.opacity : 1;
+
+  const ghost = card.cloneNode(true);
+  const cs = window.getComputedStyle(card);
+
+  // Give the ghost the same “card” chrome even though it’s attached to <body>
+  Object.assign(ghost.style, {
+    position: 'fixed',
+    left: rect.left + 'px',
+    top: rect.top + 'px',
+    width: rect.width + 'px',
+    height: rect.height + 'px',
+    margin: '0',
+    zIndex: '12000',
+    pointerEvents: 'none',
+    transformOrigin: 'center center',
+    transform: 'scale(' + scale + ')',
+    opacity: String(opacity),
+
+    // pull key visuals from the real card
+    backgroundColor: cs.backgroundColor || 'rgba(24,24,24,.96)',
+    borderRadius: cs.borderRadius || '',
+    boxShadow: cs.boxShadow || '',
+    borderColor: cs.borderColor || '',
+    borderWidth: cs.borderWidth || '',
+    borderStyle: cs.borderStyle || '',
+    backdropFilter: cs.backdropFilter || '',
+  });
+
+  return ghost;
+}
+
 // -------------------- header (icon+modal) --------------------
 function saveHeaderOrder() {
   const host = getHeaderDropArea();
@@ -325,6 +360,234 @@ function hideHeaderDockPersistent() {
   }
 }
 
+function animateCardsIntoHeaderAndThen(done) {
+  const sb  = getSidebar();
+  const top = getTopZone();
+  const liveCards = [];
+
+  if (sb)  liveCards.push(...sb.querySelectorAll('#uploadCard, #folderManagementCard'));
+  if (top) liveCards.push(...top.querySelectorAll('#uploadCard, #folderManagementCard'));
+
+  if (!liveCards.length) {
+    done();
+    return;
+  }
+
+  // Snapshot their current positions before we move the real DOM
+  const snapshots = liveCards.map(card => {
+    const rect = card.getBoundingClientRect();
+    return { card, rect };
+  });
+
+  // Show dock so icons exist / have positions
+  showHeaderDockPersistent();
+
+  // Move real cards into header (hidden container + icons)
+  snapshots.forEach(({ card }) => {
+    try { insertCardInHeader(card); } catch {}
+  });
+
+  const ghosts = [];
+
+  snapshots.forEach(({ card, rect }) => {
+    // remember the size for the expand animation later
+    card.dataset.lastWidth  = String(rect.width);
+    card.dataset.lastHeight = String(rect.height);
+  
+    const iconBtn = card.headerIconButton;
+    if (!iconBtn) return;
+  
+    const iconRect = iconBtn.getBoundingClientRect();
+  
+    const ghost = createCardGhost(card, rect, { scale: 1, opacity: 1 });
+    ghost.id = card.id + '-ghost-collapse';
+    ghost.classList.add('card-collapse-ghost');
+    ghost.style.transition = 'transform 0.22s ease-out, opacity 0.22s ease-out';
+
+    document.body.appendChild(ghost);
+    ghosts.push({ ghost, from: rect, to: iconRect });
+  });
+
+  if (!ghosts.length) {
+    done();
+    return;
+  }
+
+  requestAnimationFrame(() => {
+    ghosts.forEach(({ ghost, from, to }) => {
+      const fromCx = from.left + from.width  / 2;
+      const fromCy = from.top  + from.height / 2;
+      const toCx   = to.left   + to.width   / 2;
+      const toCy   = to.top    + to.height  / 2;
+
+      const dx = toCx - fromCx;
+      const dy = toCy - fromCy;
+
+      const rawScale = to.width / from.width;
+      const scale = Math.max(0.25, Math.min(0.5, rawScale * 0.9));
+
+      ghost.style.transform = `translate(${dx}px, ${dy}px) scale(${scale})`;
+      ghost.style.opacity   = '0';
+    });
+  });
+
+  setTimeout(() => {
+    ghosts.forEach(({ ghost }) => { try { ghost.remove(); } catch {} });
+    done();
+  }, 260);
+}
+
+function resolveTargetZoneForExpand(cardId) {
+  const layout   = readLayout();
+  const saved    = layout[cardId];
+  const isUpload = (cardId === 'uploadCard');
+
+  // 🔒 If the user explicitly pinned this card to the HEADER,
+  // it should remain a header-only icon and NEVER fly out.
+  if (saved === ZONES.HEADER) {
+    return null; // caller will skip animation + placement
+  }
+
+  let zone = saved || null;
+
+  // No saved zone yet: mirror applyUserLayoutOrDefault defaults
+  if (!zone) {
+    if (isSmallScreen()) {
+      zone = isUpload ? ZONES.TOP_LEFT : ZONES.TOP_RIGHT;
+    } else {
+      zone = ZONES.SIDEBAR;
+    }
+  }
+
+  // On small screens, anything targeting SIDEBAR gets lifted into the top cols
+  if (isSmallScreen() && zone === ZONES.SIDEBAR) {
+    zone = isUpload ? ZONES.TOP_LEFT : ZONES.TOP_RIGHT;
+  }
+
+  return zone;
+}
+
+function getZoneHost(zoneId) {
+  switch (zoneId) {
+    case ZONES.SIDEBAR:   return getSidebar();
+    case ZONES.TOP_LEFT:  return getLeftCol();
+    case ZONES.TOP_RIGHT: return getRightCol();
+    default:              return null;
+  }
+}
+
+
+// Animate cards "flying out" of header icons back into their zones.
+function animateCardsOutOfHeaderThen(done) {
+  const header = getHeaderDropArea();
+  if (!header) { done(); return; }
+
+  const cards = getCards().filter(c => c && c.headerIconButton);
+  if (!cards.length) { done(); return; }
+
+  // Make sure target containers are visible so their rects are non-zero.
+  const sb  = getSidebar();
+  const top = getTopZone();
+  if (sb)  sb.style.display  = '';
+  if (top) top.style.display = '';
+
+  const SAFE_TOP       = 16;   // minimum distance from top of viewport
+  const START_OFFSET_Y = 40;   // how far BELOW the icon we start the ghost
+  const DEST_EXTRA_Y   = 120;  // how far down into the zone center we aim
+
+  const ghosts = [];
+
+  cards.forEach(card => {
+    const iconBtn = card.headerIconButton;
+    if (!iconBtn) return;
+
+    const zoneId = resolveTargetZoneForExpand(card.id);
+    if (!zoneId) return; // header-only card, stays as icon
+
+    const host = getZoneHost(zoneId);
+    if (!host) return;
+
+    const iconRect = iconBtn.getBoundingClientRect();
+    const zoneRect = host.getBoundingClientRect();
+    if (!zoneRect.width) return;
+
+    // Where the ghost "comes from" (near the icon)
+    const fromCx = iconRect.left + iconRect.width / 2;
+    const fromCy = iconRect.bottom + START_OFFSET_Y; // lower starting point
+
+    // Where we want it to "land" (roughly center of the zone, a bit down)
+    let toCx = zoneRect.left + zoneRect.width / 2;
+    let toCy = zoneRect.top + Math.min(zoneRect.height / 2 || DEST_EXTRA_Y, DEST_EXTRA_Y);
+
+    // 🔹 If both cards are going to the sidebar, offset them so they don't stack
+    if (zoneId === ZONES.SIDEBAR) {
+      if (card.id === 'uploadCard') {
+        toCy -= 48; // a bit higher
+      } else if (card.id === 'folderManagementCard') {
+        toCy += 60; // a bit lower
+      }
+    }
+
+    // Try to match the real card size we captured during collapse
+    const savedW = parseFloat(card.dataset.lastWidth  || '');
+    const savedH = parseFloat(card.dataset.lastHeight || '');
+    const targetWidth  = !Number.isNaN(savedW)
+      ? savedW
+      : Math.min(280, Math.max(220, zoneRect.width * 0.85));
+    const targetHeight = !Number.isNaN(savedH) ? savedH : 190;
+
+    // Make sure the top of the ghost never goes above SAFE_TOP
+    const startTop = Math.max(SAFE_TOP, fromCy - targetHeight / 2);
+
+    // Build a rect for our ghost and use createCardGhost so we KEEP bg/border/shadow.
+    const ghostRect = {
+      left:  fromCx - targetWidth / 2,
+      top:   startTop,
+      width: targetWidth,
+      height: targetHeight
+    };
+
+    const ghost = createCardGhost(card, ghostRect, { scale: 0.7, opacity: 0 });
+    ghost.id = card.id + '-ghost-expand';
+    ghost.classList.add('card-expand-ghost');
+
+    // Override transform/transition for our flight animation
+    ghost.style.transform  = 'translate(0,0) scale(0.7)';
+    ghost.style.transition = 'transform 0.25s ease-out, opacity 0.25s ease-out';
+
+    document.body.appendChild(ghost);
+    ghosts.push({
+      ghost,
+      from: { cx: fromCx, cy: fromCy },
+      to:   { cx: toCx,   cy: toCy },
+      zoneId
+    });
+  });
+
+  if (!ghosts.length) {
+    done();
+    return;
+  }
+
+  // Kick off the flight on the next frame
+  requestAnimationFrame(() => {
+    ghosts.forEach(({ ghost, from, to }) => {
+      const dx = to.cx - from.cx;
+      const dy = to.cy - from.cy;
+      ghost.style.transform = `translate(${dx}px, ${dy}px) scale(1)`;
+      ghost.style.opacity   = '1';
+    });
+  });
+
+  // Clean up ghosts and then do real layout restore
+  setTimeout(() => {
+    ghosts.forEach(({ ghost }) => {
+      try { ghost.remove(); } catch {}
+    });
+    done();
+  }, 280); // just over the 0.25s transition
+}
+
 // -------------------- zones toggle (collapse to header) --------------------
 function isZonesCollapsed() { return localStorage.getItem('zonesCollapsed') === '1'; }
 
@@ -340,30 +603,73 @@ function applyCollapsedBodyClass() {
 }
 
 function setZonesCollapsed(collapsed) {
-  localStorage.setItem('zonesCollapsed', collapsed ? '1' : '0');
+  const currently = isZonesCollapsed();
+  if (collapsed === currently) return;
 
   if (collapsed) {
-    // Move ALL cards to header icons (transient) regardless of where they were.
-    getCards().forEach(insertCardInHeader);
-    showHeaderDockPersistent();
-    const sb = getSidebar();
-    if (sb) sb.style.display = 'none';
+    // ---- COLLAPSE: immediately expand file area, then animate cards up into header ----
+    localStorage.setItem('zonesCollapsed', '1');
+
+    // File list area expands right away (no delay)
+    applyCollapsedBodyClass();
+    ensureZonesToggle();
+    updateZonesToggleUI();
+
+    document.dispatchEvent(
+      new CustomEvent('zones:collapsed-changed', { detail: { collapsed: true } })
+    );
+
+    try {
+      animateCardsIntoHeaderAndThen(() => {
+        const sb = getSidebar();
+        if (sb) sb.style.display = 'none';
+        updateSidebarVisibility();
+        updateTopZoneLayout();
+        showHeaderDockPersistent();
+      });
+    } catch (e) {
+      console.warn('[zones] collapse animation failed, collapsing instantly', e);
+      // Fallback: old instant behavior
+      getCards().forEach(insertCardInHeader);
+      showHeaderDockPersistent();
+      updateSidebarVisibility();
+      updateTopZoneLayout();
+    }
   } else {
-    // Restore saved layout + rebuild header icons only for HEADER-assigned cards
-    applyUserLayoutOrDefault();
-    loadHeaderOrder();
-    hideHeaderDockPersistent();
+    // ---- EXPAND: immediately shrink file area, then animate cards out of header ----
+    localStorage.setItem('zonesCollapsed', '0');
+
+    // File list shrinks back right away
+    applyCollapsedBodyClass();
+    ensureZonesToggle();
+    updateZonesToggleUI();
+
+    document.dispatchEvent(
+      new CustomEvent('zones:collapsed-changed', { detail: { collapsed: false } })
+    );
+
+    try {
+      animateCardsOutOfHeaderThen(() => {
+        // After ghosts land, put the REAL cards back into their proper zones
+        applyUserLayoutOrDefault();
+        loadHeaderOrder();
+        hideHeaderDockPersistent();
+        updateSidebarVisibility();
+        updateTopZoneLayout();
+      });
+    } catch (e) {
+      console.warn('[zones] expand animation failed, expanding instantly', e);
+      // Fallback: just restore layout
+      applyUserLayoutOrDefault();
+      loadHeaderOrder();
+      hideHeaderDockPersistent();
+      updateSidebarVisibility();
+      updateTopZoneLayout();
+    }
   }
-
-  updateSidebarVisibility();
-  updateTopZoneLayout();
-  ensureZonesToggle();
-  updateZonesToggleUI();
-  applyCollapsedBodyClass();
-
-  document.dispatchEvent(new CustomEvent('zones:collapsed-changed', { detail: { collapsed: isZonesCollapsed() } }));
 }
 
+
 function getHeaderHost() {
   let host = document.querySelector('.header-container .header-left');
   if (!host) host = document.querySelector('.header-container');
@@ -371,6 +677,36 @@ function getHeaderHost() {
   return host || document.body;
 }
 
+function animateZonesCollapseAndThen(done) {
+  const sb = getSidebar();
+  const top = getTopZone();
+  const cards = [];
+
+  if (sb) cards.push(...sb.querySelectorAll('#uploadCard, #folderManagementCard'));
+  if (top) cards.push(...top.querySelectorAll('#uploadCard, #folderManagementCard'));
+
+  if (!cards.length) {
+    done();
+    return;
+  }
+
+  // quick "rise away" animation
+  cards.forEach(card => {
+    card.style.transition = 'transform 0.18s ease-out, opacity 0.18s ease-out';
+    card.style.transform = 'translateY(-10px)';
+    card.style.opacity = '0';
+  });
+
+  setTimeout(() => {
+    cards.forEach(card => {
+      card.style.transition = '';
+      card.style.transform = '';
+      card.style.opacity = '';
+    });
+    done();
+  }, 190);
+}
+
 function ensureZonesToggle() {
   const host = getHeaderHost();
   if (!host) return;

public/js/fileListView.js

@@ -934,7 +934,7 @@ export async function loadFileList(folderParam) {
       if (!summaryElem) {
         summaryElem = document.createElement("div");
         summaryElem.id = "fileSummary";
-        summaryElem.style.cssText = "float:right; margin:0 60px 0 auto; font-size:0.9em;";
+        summaryElem.style.cssText = "float:right; margin:0 30px 0 auto; font-size:0.9em;";
         actionsContainer.appendChild(summaryElem);
       }
       summaryElem.style.display = "block";

public/js/main.js

@@ -62,23 +62,43 @@ async function ensureToastReady() {
 }
 
 function isDemoHost() {
-  // Handles optional "www." just in case
+  try {
+    const cfg = window.__FR_SITE_CFG__ || {};
+    if (typeof cfg.demoMode !== 'undefined') {
+      return !!cfg.demoMode;
+    }
+  } catch {
+    // ignore
+  }
+  // Fallback for older configs / direct demo host:
   return location.hostname.replace(/^www\./, '') === 'demo.filerise.net';
 }
 
 function showLoginTip(message) {
   const tip = document.getElementById('fr-login-tip');
   if (!tip) return;
-  tip.innerHTML = '';                           // clear
-  if (message) tip.append(document.createTextNode(message));
-  if (location.hostname.replace(/^www\./, '') === 'demo.filerise.net') {
-    const line = document.createElement('div'); line.style.marginTop = '6px';
-    const mk = t => { const k = document.createElement('code'); k.textContent = t; return k; };
-    line.append(document.createTextNode('Demo login — user: '), mk('demo'),
-      document.createTextNode(' · pass: '), mk('demo'));
+  tip.innerHTML = ''; // clear
+
+  if (message) {
+    tip.append(document.createTextNode(message));
+  }
+
+  if (isDemoHost()) {
+    const line = document.createElement('div');
+    line.style.marginTop = '6px';
+    const mk = t => {
+      const k = document.createElement('code');
+      k.textContent = t;
+      return k;
+    };
+    line.append(
+      document.createTextNode('Demo login — user: '), mk('demo'),
+      document.createTextNode(' · pass: '), mk('demo')
+    );
     tip.append(line);
   }
-  tip.style.display = 'block';                  // reveal without shifting layout
+
+  tip.style.display = 'block';
 }
 
 async function hideOverlaySmoothly(overlay) {
@@ -552,11 +572,13 @@ function bindDarkMode() {
       const r = await fetch('/api/siteConfig.php', { credentials: 'include' });
       const j = await r.json().catch(() => ({}));
       window.__FR_SITE_CFG__ = j || {};
+      window.__FR_DEMO__ = !!(window.__FR_SITE_CFG__.demoMode);
       // Early pass: title + login options (skip touching <h1> to avoid flicker)
       applySiteConfig(window.__FR_SITE_CFG__, { phase: 'early' });
       return window.__FR_SITE_CFG__;
     } catch {
       window.__FR_SITE_CFG__ = {};
+      window.__FR_DEMO__ = false; 
       applySiteConfig({}, { phase: 'early' });
       return null;
     }

public/js/upload.js

@@ -39,6 +39,70 @@ function saveResumableDraftsAll(all) {
   }
 }
 
+// --- Single file-picker trigger guard (prevents multiple OS dialogs) ---
+let _lastFilePickerOpen = 0;
+
+function triggerFilePickerOnce() {
+  const now = Date.now();
+  // ignore any extra calls within 400ms of the last open
+  if (now - _lastFilePickerOpen < 400) return;
+  _lastFilePickerOpen = now;
+
+  const fi = document.getElementById('file');
+  if (fi) {
+    fi.click();
+  }
+}
+
+// Wire the "Choose files" button so it always uses the guarded trigger
+function wireChooseButton() {
+  const btn = document.getElementById('customChooseBtn');
+  if (!btn || btn.__uploadBound) return;
+  btn.__uploadBound = true;
+
+  btn.addEventListener('click', (e) => {
+    e.preventDefault();
+    e.stopPropagation(); // don't let it bubble to the drop-area click handler
+    triggerFilePickerOnce();
+  });
+}
+
+function wireFileInputChange(fileInput) {
+  if (!fileInput || fileInput.__uploadChangeBound) return;
+  fileInput.__uploadChangeBound = true;
+
+  // For file picker, remove directory attributes so only files can be chosen.
+  fileInput.removeAttribute("webkitdirectory");
+  fileInput.removeAttribute("mozdirectory");
+  fileInput.removeAttribute("directory");
+  fileInput.setAttribute("multiple", "");
+
+  fileInput.addEventListener("change", async function () {
+    const files = Array.from(fileInput.files || []);
+    if (!files.length) return;
+  
+    if (useResumable) {
+      // New resumable batch: reset selectedFiles so the count is correct
+      window.selectedFiles = [];
+      _currentResumableIds.clear();   // <--- add this
+  
+      // Ensure the lib/instance exists
+      if (!_resumableReady) await initResumableUpload();
+      if (resumableInstance) {
+        for (const f of files) {
+          resumableInstance.addFile(f);
+        }
+      } else {
+        // If Resumable failed to load, fall back to XHR
+        processFiles(files);
+      }
+    } else {
+      // Non-resumable: normal XHR path, drag-and-drop etc.
+      processFiles(files);
+    }
+  });
+}
+
 function getUserDraftContext() {
   const all = loadResumableDraftsAll();
   const userKey = getCurrentUserKey();
@@ -253,23 +317,35 @@ function getFilesFromDataTransferItems(items) {
 
 function setDropAreaDefault() {
   const dropArea = document.getElementById("uploadDropArea");
-  if (dropArea) {
-    dropArea.innerHTML = `
-      <div id="uploadInstruction" class="upload-instruction">
-       ${t("upload_instruction")}
+  if (!dropArea) return;
+
+  dropArea.innerHTML = `
+    <div id="uploadInstruction" class="upload-instruction">
+     ${t("upload_instruction")}
+    </div>
+    <div id="uploadFileRow" class="upload-file-row">
+      <button id="customChooseBtn" type="button">${t("choose_files")}</button>
+    </div>
+    <div id="fileInfoWrapper" class="file-info-wrapper">
+      <div id="fileInfoContainer" class="file-info-container">
+        <span id="fileInfoDefault"> ${t("no_files_selected_default")}</span>
       </div>
-      <div id="uploadFileRow" class="upload-file-row">
-        <button id="customChooseBtn" type="button">${t("choose_files")}</button>
-      </div>
-      <div id="fileInfoWrapper" class="file-info-wrapper">
-        <div id="fileInfoContainer" class="file-info-container">
-          <span id="fileInfoDefault"> ${t("no_files_selected_default")}</span>
-        </div>
-      </div>
-      <!-- File input for file picker (files only) -->
-      <input type="file" id="file" name="file[]" class="form-control-file" multiple style="opacity:0; position:absolute; width:1px; height:1px;" />
-    `;
-  }
+    </div>
+    <!-- File input for file picker (files only) -->
+    <input
+      type="file"
+      id="file"
+      name="file[]"
+      class="form-control-file"
+      multiple
+      style="opacity:0; position:absolute; width:1px; height:1px;"
+    />
+  `;
+
+  // After rebuilding markup, re-wire controls:
+  const fileInput = dropArea.querySelector('#file');
+  wireFileInputChange(fileInput);
+  wireChooseButton();
 }
 
 function adjustFolderHelpExpansion() {
@@ -608,6 +684,7 @@ const useResumable = true;
 let resumableInstance = null;
 let _pendingPickedFiles = [];   // files picked before library/instance ready
 let _resumableReady = false;
+let _currentResumableIds = new Set();
 
 // Make init async-safe; it resolves when Resumable is constructed
 async function initResumableUpload() {
@@ -644,18 +721,20 @@ async function initResumableUpload() {
     resumableInstance.opts.query.upload_token = window.csrfToken;
   }
 
-  const fileInput = document.getElementById("file");
-  if (fileInput) {
-    
-    fileInput.addEventListener("change", function () {
-      for (let i = 0; i < fileInput.files.length; i++) {
-        resumableInstance.addFile(fileInput.files[i]);
-      }
-    });
-  }
+
 
   resumableInstance.on("fileAdded", function (file) {
-
+    // Build a stable per-file key
+    const id =
+      file.uniqueIdentifier ||
+      ((file.fileName || file.name || '') + ':' + (file.size || 0));
+  
+    // If we've already seen this id in the current batch, skip wiring it again
+    if (_currentResumableIds.has(id)) {
+      return;
+    }
+    _currentResumableIds.add(id);
+  
     // Initialize custom paused flag
     file.paused = false;
     file.uploadIndex = file.uniqueIdentifier;
@@ -663,13 +742,13 @@ async function initResumableUpload() {
       window.selectedFiles = [];
     }
     window.selectedFiles.push(file);
-
+  
     // Track as in-progress draft at 0%
     upsertResumableDraft(file, 0);
     showResumableDraftBanner();
-
+  
     const progressContainer = document.getElementById("uploadProgressContainer");
-
+  
     // Check if a wrapper already exists; if not, create one with a UL inside.
     let listWrapper = progressContainer.querySelector(".upload-progress-wrapper");
     let list;
@@ -685,7 +764,7 @@ async function initResumableUpload() {
     } else {
       list = listWrapper.querySelector("ul.upload-progress-list");
     }
-
+  
     const li = createFileEntry(file);
     li.dataset.uploadIndex = file.uniqueIdentifier;
     list.appendChild(li);
@@ -1119,9 +1198,17 @@ function submitFiles(allFiles) {
    Main initUpload: Sets up file input, drop area, and form submission.
 ----------------------------------------------------- */
 function initUpload() {
-  const fileInput = document.getElementById("file");
-  const dropArea = document.getElementById("uploadDropArea");
+  window.__FR_FLAGS = window.__FR_FLAGS || { wired: {} };
+  window.__FR_FLAGS.wired = window.__FR_FLAGS.wired || {};
+
   const uploadForm = document.getElementById("uploadFileForm");
+  const dropArea   = document.getElementById("uploadDropArea");
+
+  // Always (re)build the inner markup and wire the Choose button
+  setDropAreaDefault();
+  wireChooseButton();
+
+  const fileInput = document.getElementById("file");
 
   // For file picker, remove directory attributes so only files can be chosen.
   if (fileInput) {
@@ -1131,67 +1218,50 @@ function initUpload() {
     fileInput.setAttribute("multiple", "");
   }
 
-  setDropAreaDefault();
-
   // Drag–and–drop events (for folder uploads) use original processing.
-  if (dropArea) {
+  if (dropArea && !dropArea.__uploadBound) {
+    dropArea.__uploadBound = true;
     dropArea.classList.add("upload-drop-area");
+
     dropArea.addEventListener("dragover", function (e) {
       e.preventDefault();
       dropArea.style.backgroundColor = document.body.classList.contains("dark-mode") ? "#333" : "#f8f8f8";
     });
+
     dropArea.addEventListener("dragleave", function (e) {
       e.preventDefault();
       dropArea.style.backgroundColor = "";
     });
+
     dropArea.addEventListener("drop", function (e) {
       e.preventDefault();
       dropArea.style.backgroundColor = "";
       const dt = e.dataTransfer || window.__pendingDropData || null;
-       window.__pendingDropData = null;
-      if (dt.items && dt.items.length > 0) {
+      window.__pendingDropData = null;
+      if (dt && dt.items && dt.items.length > 0) {
         getFilesFromDataTransferItems(dt.items).then(files => {
           if (files.length > 0) {
             processFiles(files);
           }
         });
-      } else if (dt.files && dt.files.length > 0) {
+      } else if (dt && dt.files && dt.files.length > 0) {
         processFiles(dt.files);
       }
     });
-    // Clicking drop area triggers file input.
-    dropArea.addEventListener("click", function () {
-      if (fileInput) fileInput.click();
-    });
-  }
 
-  if (fileInput) {
-    fileInput.addEventListener("change", async function () {
-      const files = Array.from(fileInput.files || []);
-      if (!files.length) return;
-
-      if (useResumable) {
-        // New resumable batch: reset selectedFiles so the count is correct
-        window.selectedFiles = [];
-
-        // Ensure the lib/instance exists
-        if (!_resumableReady) await initResumableUpload();
-        if (resumableInstance) {
-          for (const f of files) {
-            resumableInstance.addFile(f);
-          }
-        } else {
-          // If Resumable failed to load, fall back to XHR
-          processFiles(files);
-        }
-      } else {
-        // Non-resumable: normal XHR path, drag-and-drop etc.
-        processFiles(files);
+    // Only trigger file picker when clicking the *bare* drop area, not controls inside it
+    dropArea.addEventListener("click", function (e) {
+      // If the click originated from the "Choose files" button or the file input itself,
+      // let their handlers deal with it.
+      if (e.target.closest('#customChooseBtn') || e.target.closest('#file')) {
+        return;
       }
+      triggerFilePickerOnce();
     });
   }
 
-  if (uploadForm) {
+  if (uploadForm && !uploadForm.__uploadSubmitBound) {
+    uploadForm.__uploadSubmitBound = true;
     uploadForm.addEventListener("submit", async function (e) {
       e.preventDefault();
 
@@ -1205,7 +1275,6 @@ function initUpload() {
         return;
       }
 
-      // If we have any files queued in Resumable, treat this as a resumable upload.
       const hasResumableFiles =
         useResumable &&
         resumableInstance &&
@@ -1215,7 +1284,6 @@ function initUpload() {
       if (hasResumableFiles) {
         if (!_resumableReady) await initResumableUpload();
         if (resumableInstance) {
-          // Keep folder/token fresh
           resumableInstance.opts.query.folder = window.currentFolder || "root";
           resumableInstance.opts.query.upload_token = window.csrfToken;
           resumableInstance.opts.headers['X-CSRF-Token'] = window.csrfToken;
@@ -1223,11 +1291,9 @@ function initUpload() {
           resumableInstance.upload();
           showToast("Resumable upload started...");
         } else {
-          // Hard fallback – should basically never happen
           submitFiles(files);
         }
       } else {
-        // No resumable queue → drag-and-drop / paste / simple input → XHR path
         submitFiles(files);
       }
     });

public/js/version.js

@@ -1,2 +1,2 @@
 // generated by CI
-window.APP_VERSION = 'v2.0.1';
+window.APP_VERSION = 'v2.0.3';

scripts/manual-sync.sh

@@ -1,19 +1,24 @@
 #!/usr/bin/env bash
-# === Update FileRise to v1.9.1 (safe rsync) ===
-# shellcheck disable=SC2155  # we intentionally assign 'stamp' with command substitution
-
+# === Update FileRise to v2.0.2 (safe rsync) ===
 set -Eeuo pipefail
 
-VER="v1.9.1"
-ASSET="FileRise-${VER}.zip"          # If the asset name is different, set it exactly (e.g. FileRise-v1.9.0.zip)
+VER="v2.0.2"
+ASSET="FileRise-${VER}.zip"      # matches GitHub release asset name
 WEBROOT="/var/www"
 TMP="/tmp/filerise-update"
 
-# 0) (optional) quick backup of critical bits
+# 0) quick backup of critical bits (include Pro/demo stuff too)
 stamp="$(date +%F-%H%M)"
 mkdir -p /root/backups
 tar -C "$WEBROOT" -czf "/root/backups/filerise-$stamp.tgz" \
-  public/.htaccess config users uploads metadata || true
+  public/.htaccess \
+  config \
+  users \
+  uploads \
+  metadata \
+  filerise-bundles \
+  filerise-config \
+  filerise-site || true
 echo "Backup saved to /root/backups/filerise-$stamp.tgz"
 
 # 1) Fetch the release zip
@@ -29,12 +34,15 @@ STAGE_DIR="$(find "$TMP" -maxdepth 1 -type d -name 'FileRise*' ! -path "$TMP" |
 # 3) Sync code into /var/www
 #    - keep public/.htaccess
 #    - keep data dirs and current config.php
+#    - DO NOT touch filerise-site / bundles / demo config
 rsync -a --delete \
   --exclude='public/.htaccess' \
   --exclude='uploads/***' \
   --exclude='users/***' \
   --exclude='metadata/***' \
-  --exclude='config/config.php' \
+  --exclude='filerise-bundles/***' \
+  --exclude='filerise-config/***' \
+  --exclude='filerise-site/***' \
   --exclude='.github/***' \
   --exclude='docker-compose.yml' \
   "$STAGE_DIR"/ "$WEBROOT"/
@@ -42,13 +50,23 @@ rsync -a --delete \
 # 4) Ownership (Ubuntu/Debian w/ Apache)
 chown -R www-data:www-data "$WEBROOT"
 
-# 5) (optional) Composer autoload optimization if composer is available
+# 5) Composer autoload optimization if composer is available
 if command -v composer >/dev/null 2>&1; then
   cd "$WEBROOT" || { echo "cd to $WEBROOT failed" >&2; exit 1; }
   composer install --no-dev --optimize-autoloader
 fi
 
-# 6) Reload Apache (don’t fail the whole script if reload isn’t available)
+# 6) Force demo mode ON in config/config.php
+CFG_FILE="$WEBROOT/config/config.php"
+if [[ -f "$CFG_FILE" ]]; then
+  # Make a one-time backup of config.php before editing
+  cp "$CFG_FILE" "${CFG_FILE}.bak.$stamp" || true
+
+  # Flip FR_DEMO_MODE to true if it exists as false
+  sed -i "s/define('FR_DEMO_MODE',[[:space:]]*false);/define('FR_DEMO_MODE', true);/" "$CFG_FILE" || true
+fi
+
+# 7) Reload Apache (don’t fail the whole script if reload isn’t available)
 systemctl reload apache2 2>/dev/null || true
 
-echo "✅ FileRise updated to ${VER} (code). Data and public/.htaccess preserved."
+echo "FileRise updated to ${VER} (code). Demo mode forced ON. Data, Pro bundles, and demo site preserved."

src/controllers/AdminController.php

@@ -176,6 +176,7 @@ class AdminController
                         'version' => $proVersion,
                         'license' => $licenseString,
                     ],
+                    'demoMode' => defined('FR_DEMO_MODE') ? (bool)FR_DEMO_MODE : false,
                 ];
             
                 $isAdmin = !empty($_SESSION['authenticated']) && !empty($_SESSION['isAdmin']);

src/controllers/UserController.php

@@ -272,6 +272,15 @@ class UserController
             echo json_encode(["error" => "No username in session"]);
             exit;
         }
+        // Block changing the demo account password when in demo mode
+        if (FR_DEMO_MODE && $username === 'demo') {
+            header('Content-Type: application/json; charset=utf-8');
+            echo json_encode([
+                'success' => false,
+                'error'   => 'Password changes are disabled on the public demo.'
+            ]);
+            exit;
+        }
 
         $data = self::readJson();
         $oldPassword     = trim($data["oldPassword"] ?? "");
@@ -318,6 +327,14 @@ class UserController
             exit;
         }
 
+        if (defined('FR_DEMO_MODE') && FR_DEMO_MODE && $username === 'demo') {
+            http_response_code(403);
+            echo json_encode([
+                'error' => 'TOTP settings are disabled for the demo account.'
+            ]);
+            exit;
+        }
+
         $totp_enabled = isset($data['totp_enabled']) ? filter_var($data['totp_enabled'], FILTER_VALIDATE_BOOLEAN) : false;
         $result = UserModel::updateUserPanel($username, $totp_enabled);
         echo json_encode($result);
@@ -339,6 +356,14 @@ class UserController
             exit;
         }
 
+        if (defined('FR_DEMO_MODE') && FR_DEMO_MODE && $username === 'demo') {
+            http_response_code(403);
+            echo json_encode([
+                'error' => 'TOTP settings are disabled for the demo account.'
+            ]);
+            exit;
+        }
+
         $result = UserModel::disableTOTPSecret($username);
         if ($result) {
             echo json_encode(["success" => true, "message" => "TOTP disabled successfully."]);
@@ -403,6 +428,16 @@ class UserController
         }
 
         $userId = $_SESSION['username'];
+
+        if (defined('FR_DEMO_MODE') && FR_DEMO_MODE && $userId === 'demo') {
+            http_response_code(403);
+            echo json_encode([
+                'status'  => 'error',
+                'message' => 'TOTP settings are disabled for the demo account.',
+            ]);
+            exit;
+        }
+
         if (!preg_match(REGEX_USER, $userId)) {
             http_response_code(400);
             echo json_encode(['status' => 'error', 'message' => 'Invalid user identifier']);
@@ -429,6 +464,14 @@ class UserController
             exit;
         }
 
+        $username = $_SESSION['username'] ?? ($_SESSION['pending_login_user'] ?? '');
+        if (defined('FR_DEMO_MODE') && FR_DEMO_MODE && $username === 'demo') {
+            http_response_code(403);
+            header('Content-Type: application/json');
+            echo json_encode(['error' => 'TOTP setup is disabled for the demo account.']);
+        }
+     
+
         self::requireCsrf();
 
         // Fix: if username not present (pending flow), fall back to pending_login_user
@@ -608,6 +651,15 @@ class UserController
         self::requireAuth();
         self::requireCsrf();
 
+        if (defined('FR_DEMO_MODE') && FR_DEMO_MODE) {
+            http_response_code(403);
+            echo json_encode([
+                'success' => false,
+                'error'   => 'Profile picture changes are disabled in the demo environment.',
+            ]);
+            exit;
+        }
+
         if (empty($_FILES['profile_picture']) || $_FILES['profile_picture']['error'] !== UPLOAD_ERR_OK) {
             http_response_code(400);
             echo json_encode(['success' => false, 'error' => 'No file uploaded or error']);

src/models/AdminModel.php

@@ -121,6 +121,7 @@ private static function sanitizeLogoUrl($url): string
                 $config['branding']['headerBgDark'] ?? ''
             ),
         ],
+        'demoMode' => (defined('FR_DEMO_MODE') && FR_DEMO_MODE),
     ];
 
     // NEW: include ONLYOFFICE minimal public flag
@@ -136,16 +137,17 @@ private static function sanitizeLogoUrl($url): string
     $locked = defined('ONLYOFFICE_ENABLED') || defined('ONLYOFFICE_JWT_SECRET')
        || defined('ONLYOFFICE_DOCS_ORIGIN') || defined('ONLYOFFICE_PUBLIC_ORIGIN');
 
-if ($locked) {
-    $ooEnabled = defined('ONLYOFFICE_ENABLED') ? (bool)ONLYOFFICE_ENABLED : false;
-} else {
-    $ooEnabled = isset($config['onlyoffice']['enabled']) ? (bool)$config['onlyoffice']['enabled'] : false;
-}
+    if ($locked) {
+        $ooEnabled = defined('ONLYOFFICE_ENABLED') ? (bool)ONLYOFFICE_ENABLED : false;
+    } else {
+        $ooEnabled = isset($config['onlyoffice']['enabled']) ? (bool)$config['onlyoffice']['enabled'] : false;
+    }
 
-$public['onlyoffice'] = ['enabled' => $ooEnabled];
+        $public['onlyoffice'] = ['enabled' => $ooEnabled];
+        $public['demoMode'] = defined('FR_DEMO_MODE') ? (bool)FR_DEMO_MODE : false;
 
-    return $public;
-}
+        return $public;
+    }
 
     /** Write USERS_DIR/siteConfig.json atomically (unencrypted). */
     public static function writeSiteConfig(array $publicSubset): array