@underpostnet/underpost 2.98.1 → 2.98.3

package/README.md

@@ -18,7 +18,7 @@
 
 <!-- badges -->
 
-[![Node.js CI](https://github.com/underpostnet/engine/actions/workflows/docker-image.ci.yml/badge.svg?branch=master)](https://github.com/underpostnet/engine/actions/workflows/docker-image.yml) [![Test](https://github.com/underpostnet/engine/actions/workflows/coverall.ci.yml/badge.svg?branch=master)](https://github.com/underpostnet/engine/actions/workflows/coverall.ci.yml) [![Downloads](https://img.shields.io/npm/dm/underpost.svg)](https://www.npmjs.com/package/underpost) [![Socket Badge](https://socket.dev/api/badge/npm/package/underpost/2.98.1)](https://socket.dev/npm/package/underpost/overview/2.98.1) [![Coverage Status](https://coveralls.io/repos/github/underpostnet/engine/badge.svg?branch=master)](https://coveralls.io/github/underpostnet/engine?branch=master) [![Version](https://img.shields.io/npm/v/underpost.svg)](https://www.npmjs.org/package/underpost) [![License](https://img.shields.io/npm/l/underpost.svg)](https://www.npmjs.com/package/underpost)
+[![Node.js CI](https://github.com/underpostnet/engine/actions/workflows/docker-image.ci.yml/badge.svg?branch=master)](https://github.com/underpostnet/engine/actions/workflows/docker-image.yml) [![Test](https://github.com/underpostnet/engine/actions/workflows/coverall.ci.yml/badge.svg?branch=master)](https://github.com/underpostnet/engine/actions/workflows/coverall.ci.yml) [![Downloads](https://img.shields.io/npm/dm/underpost.svg)](https://www.npmjs.com/package/underpost) [![Socket Badge](https://socket.dev/api/badge/npm/package/underpost/2.98.3)](https://socket.dev/npm/package/underpost/overview/2.98.3) [![Coverage Status](https://coveralls.io/repos/github/underpostnet/engine/badge.svg?branch=master)](https://coveralls.io/github/underpostnet/engine?branch=master) [![Version](https://img.shields.io/npm/v/underpost.svg)](https://www.npmjs.org/package/underpost) [![License](https://img.shields.io/npm/l/underpost.svg)](https://www.npmjs.com/package/underpost)
 
 <!-- end-badges -->
 
@@ -66,7 +66,7 @@ Run dev client server
 npm run dev
 ```
 <!-- -->
-## underpost ci/cd cli v2.98.1
+## underpost ci/cd cli v2.98.3
 
 ### Usage: `underpost [options] [command]`
   ```

package/bin/build.js

@@ -181,11 +181,11 @@ const { DefaultConf } = await import(`../conf.${confName}.js`);
         'atlas-sprite-sheet',
       ];
       packageJson.description = 'Cyberia Engine - Object Layer and Assets Management Microservice';
-      packageJson.dependencies = originPackageJson.dependencies;
-      packageJson.dependencies['maxrects-packer'] = '^2.7.3';
-      packageJson.dependencies['pngjs'] = '^7.0.0';
-      packageJson.dependencies['jimp'] = '^1.6.0';
-      packageJson.dependencies['sharp'] = '^0.32.5';
+      const { CyberiaDependencies } = await import(`../src/client/components/cyberia-portal/CommonCyberiaPortal.js`);
+      packageJson.dependencies = {
+        ...packageJson.dependencies,
+        ...CyberiaDependencies,
+      };
       fs.writeFileSync(`${basePath}/bin/index.js`, fs.readFileSync(`./bin/cyberia.js`, 'utf8'), 'utf8');
       fs.copyFileSync(`./src/api/object-layer/README.md`, `${basePath}/README.md`);
       fs.copySync(`./hardhat`, `${basePath}/hardhat`);

package/bin/deploy.js

@@ -1134,6 +1134,15 @@ nvidia/gpu-operator \
       }
       break;
     }
+
+    case 'cyberia': {
+      const { CyberiaDependencies } = await import(`../src/client/components/cyberia-portal/CommonCyberiaPortal.js`);
+      for (const dep of Object.keys(CyberiaDependencies)) {
+        const ver = CyberiaDependencies[dep];
+        shellExec(`npm install ${dep}@${ver}`);
+      }
+      break;
+    }
   }
 } catch (error) {
   logger.error(error, error.stack);

package/cli.md

@@ -1,4 +1,4 @@
-## underpost ci/cd cli v2.98.1
+## underpost ci/cd cli v2.98.3
 
 ### Usage: `underpost [options] [command]`
   ```

package/manifests/deployment/dd-default-development/deployment.yaml

@@ -17,7 +17,7 @@ spec:
     spec:
       containers:
         - name: dd-default-development-blue
-          image: localhost/rockylinux9-underpost:v2.98.1
+          image: localhost/rockylinux9-underpost:v2.98.3
           #          resources:
           #            requests:
           #              memory: "124Ki"
@@ -100,7 +100,7 @@ spec:
     spec:
       containers:
         - name: dd-default-development-green
-          image: localhost/rockylinux9-underpost:v2.98.1
+          image: localhost/rockylinux9-underpost:v2.98.3
           #          resources:
           #            requests:
           #              memory: "124Ki"

package/manifests/deployment/dd-test-development/deployment.yaml

@@ -18,7 +18,7 @@ spec:
     spec:
       containers:
         - name: dd-test-development-blue
-          image: localhost/rockylinux9-underpost:v2.98.1
+          image: localhost/rockylinux9-underpost:v2.98.3
 
           command:
             - /bin/sh
@@ -103,7 +103,7 @@ spec:
     spec:
       containers:
         - name: dd-test-development-green
-          image: localhost/rockylinux9-underpost:v2.98.1
+          image: localhost/rockylinux9-underpost:v2.98.3
 
           command:
             - /bin/sh

package/package.json

@@ -2,7 +2,7 @@
     "type": "module",
     "main": "src/index.js",
     "name": "@underpostnet/underpost",
-    "version": "2.98.1",
+    "version": "2.98.3",
     "description": "pwa api rest template",
     "scripts": {
         "start": "env-cmd -f .env.production node --max-old-space-size=8192 src/server",

package/src/client/components/core/Content.js

@@ -8,50 +8,50 @@ import { DocumentService } from '../../services/document/document.service.js';
 import { CoreService, getApiBaseUrl, headersFactory } from '../../services/core/core.service.js';
 import { loggerFactory } from './Logger.js';
 import { imageShimmer, renderChessPattern, renderCssAttr, styleFactory } from './Css.js';
-import { getQueryParams } from './Router.js';
+import { getQueryParams, setPath } from './Router.js';
 
 const logger = loggerFactory(import.meta);
 
 const attachMarkdownLinkHandlers = (containerSelector) => {
-  const links = sa(`${containerSelector} a[href]`);
-  links.forEach((link) => {
-    link.addEventListener('click', async (e) => {
-      e.preventDefault();
-      const href = link.getAttribute('href');
-
-      // Check if link is external
-      const isExternal = href.startsWith('http://') || href.startsWith('https://');
-
-      if (isExternal) {
-        // Show warning modal for external links
-        const result = await Modal.RenderConfirm({
-          id: `external-link-${s4()}`,
-          html: async () => html`
-            <div class="in section-mp" style="text-align: center; padding: 20px;">
-              <p>${Translate.Render('external-link-warning')}</p>
-              <p style="word-break: break-all; margin-top: 10px;"><strong>${href}</strong></p>
-            </div>
-          `,
-          icon: html`<i class="fas fa-external-link-alt"></i>`,
-          style: {
-            width: '350px',
-            height: '500px',
-            overflow: 'auto',
-            'z-index': '11',
-            resize: 'none',
-          },
-        });
-
-        // Only open link if user confirmed (not cancelled or closed)
-        if (result && result.status === 'confirm') {
-          window.open(href, '_blank', 'noopener,noreferrer');
-        }
-        // If cancelled, do nothing - don't navigate
-      } else {
-        // Internal link - navigate normally
-        window.location.href = href;
+  const container = s(containerSelector);
+  if (!container || container.dataset.mdLinkHandler) return;
+  container.dataset.mdLinkHandler = 'true';
+
+  container.addEventListener('click', async (e) => {
+    const link = e.target.closest('.markdown-content a[href]');
+    if (!link) return;
+
+    const href = link.getAttribute('href');
+    if (!href || href.startsWith('#')) return;
+
+    e.preventDefault();
+    const isExternal = href.startsWith('http://') || href.startsWith('https://');
+
+    if (isExternal) {
+      const result = await Modal.RenderConfirm({
+        id: `external-link-${s4()}`,
+        html: async () => html`
+          <div class="in section-mp" style="text-align: center; padding: 20px;">
+            <p>${Translate.Render('external-link-warning')}</p>
+            <p style="word-break: break-all; margin-top: 10px;"><strong>${href}</strong></p>
+          </div>
+        `,
+        icon: html`<i class="fas fa-external-link-alt"></i>`,
+        style: {
+          width: '350px',
+          height: '500px',
+          overflow: 'auto',
+          'z-index': '11',
+          resize: 'none',
+        },
+      });
+
+      if (result && result.status === 'confirm') {
+        window.open(href, '_blank', 'noopener,noreferrer');
       }
-    });
+    } else {
+      setPath(href);
+    }
   });
 };
 
@@ -214,7 +214,9 @@ const Content = {
         case 'md':
           {
             const content = await Content.getFileContent(file, options);
-            render += html`<div class="${options.class}" ${styleFactory(options.style)}>${marked.parse(content)}</div>`;
+            render += html`<div class="${options.class} markdown-content" ${styleFactory(options.style)}>
+              ${marked.parse(content)}
+            </div>`;
           }
           break;
 

package/src/client/components/core/FullScreen.js

@@ -1,31 +1,224 @@
+/**
+ * Utility module for fullscreen mode management with cross-browser and PWA compatibility.
+ * Provides robust fullscreen detection, event handling, and UI synchronization.
+ * @module src/client/components/core/FullScreen.js
+ * @namespace FullScreenClient
+ */
+
 import { Responsive } from './Responsive.js';
 import { ToggleSwitch } from './ToggleSwitch.js';
 import { Translate } from './Translate.js';
 import { checkFullScreen, fullScreenIn, fullScreenOut, s } from './VanillaJs.js';
 
+/**
+ * Manages fullscreen mode state, event handling, and UI synchronization.
+ * Supports all major browsers and PWA/Nativefier environments with comprehensive
+ * vendor-prefixed API detection.
+ * @memberof FullScreenClient
+ */
 const FullScreen = {
+  /**
+   * Internal state flag tracking the intended fullscreen mode.
+   * @type {boolean}
+   * @private
+   */
+  _fullScreenSwitch: false,
+
+  /**
+   * Flag indicating whether event listeners have been attached.
+   * Prevents duplicate event listener registration.
+   * @type {boolean}
+   * @private
+   */
+  _eventListenersAdded: false,
+
+  /**
+   * Flag preventing concurrent sync operations.
+   * Ensures state synchronization happens sequentially.
+   * @type {boolean}
+   * @private
+   */
+  _syncInProgress: false,
+
+  /**
+   * Checks if the browser is currently in fullscreen mode.
+   * Supports all vendor-prefixed fullscreen APIs for maximum compatibility:
+   * - Standard Fullscreen API
+   * - Webkit (Chrome, Safari, Opera)
+   * - Mozilla (Firefox)
+   * - Microsoft (IE/Edge)
+   * @private
+   * @memberof FullScreenClient.FullScreen
+   * @returns {boolean} True if currently in fullscreen mode, false otherwise.
+   */
+  _isFullScreen: function () {
+    return !!(
+      document.fullscreenElement ||
+      document.webkitFullscreenElement ||
+      document.mozFullScreenElement ||
+      document.msFullscreenElement ||
+      document.fullscreen ||
+      document.webkitIsFullScreen ||
+      document.mozFullScreen
+    );
+  },
+
+  /**
+   * Synchronizes the toggle switch UI state with the actual fullscreen state.
+   * Prevents race conditions using the _syncInProgress flag.
+   * Updates the toggle switch only if there's a mismatch between UI and actual state.
+   * @private
+   * @memberof FullScreenClient.FullScreen
+   * @returns {void}
+   */
+  _syncToggleState: function () {
+    if (this._syncInProgress) return;
+    this._syncInProgress = true;
+
+    const actualFullScreen = this._isFullScreen();
+
+    // Only update if there's a mismatch
+    if (this._fullScreenSwitch !== actualFullScreen) {
+      this._fullScreenSwitch = actualFullScreen;
+
+      // Update toggle switch UI if it exists
+      const toggle = s('.fullscreen');
+      if (toggle && ToggleSwitch.Tokens[`fullscreen`]) {
+        const switchState = ToggleSwitch.Tokens[`fullscreen`].checked;
+        if (switchState !== actualFullScreen) {
+          ToggleSwitch.Tokens[`fullscreen`].click();
+        }
+      }
+    }
+
+    setTimeout(() => {
+      this._syncInProgress = false;
+    }, 100);
+  },
+
+  /**
+   * Event handler for fullscreen change events.
+   * Triggers UI state synchronization when fullscreen mode changes.
+   * @private
+   * @memberof FullScreenClient.FullScreen
+   * @returns {void}
+   */
+  _handleFullScreenChange: function () {
+    this._syncToggleState();
+  },
+
+  /**
+   * Attaches all necessary event listeners for fullscreen mode detection.
+   * Handles multiple scenarios:
+   * - Vendor-prefixed fullscreen change events (Chrome, Firefox, IE/Edge)
+   * - Window resize events (for PWA/Nativefier compatibility)
+   * - ESC key detection (fallback for manual fullscreen exit)
+   * Only attaches listeners once to prevent duplicates.
+   * @private
+   * @memberof FullScreenClient.FullScreen
+   * @returns {void}
+   */
+  _addEventListeners: function () {
+    if (this._eventListenersAdded) return;
+
+    const events = ['fullscreenchange', 'webkitfullscreenchange', 'mozfullscreenchange', 'MSFullscreenChange'];
+
+    events.forEach((eventName) => {
+      document.addEventListener(eventName, () => this._handleFullScreenChange(), false);
+    });
+
+    // Additional check for PWA/Nativefier window resize events
+    window.addEventListener(
+      'resize',
+      () => {
+        setTimeout(() => this._syncToggleState(), 150);
+      },
+      false,
+    );
+
+    // ESC key detection fallback
+    document.addEventListener(
+      'keydown',
+      (e) => {
+        if (e.key === 'Escape' || e.keyCode === 27) {
+          setTimeout(() => this._syncToggleState(), 100);
+        }
+      },
+      false,
+    );
+
+    this._eventListenersAdded = true;
+  },
+
+  /**
+   * Enters fullscreen mode if not already in fullscreen.
+   * Updates internal state and triggers fullscreen API.
+   * Verifies the state change after a delay to ensure synchronization.
+   * @private
+   * @memberof FullScreenClient.FullScreen
+   * @returns {void}
+   */
+  _enterFullScreen: function () {
+    if (this._isFullScreen()) return;
+
+    this._fullScreenSwitch = true;
+    fullScreenIn();
+
+    // Verify after attempt
+    setTimeout(() => this._syncToggleState(), 300);
+  },
+
+  /**
+   * Exits fullscreen mode if currently in fullscreen.
+   * Updates internal state and triggers fullscreen exit API.
+   * Verifies the state change after a delay to ensure synchronization.
+   * @private
+   * @memberof FullScreenClient.FullScreen
+   * @returns {void}
+   */
+  _exitFullScreen: function () {
+    if (!this._isFullScreen()) return;
+
+    this._fullScreenSwitch = false;
+    fullScreenOut();
+
+    // Verify after attempt
+    setTimeout(() => this._syncToggleState(), 300);
+  },
+
+  /**
+   * Renders the fullscreen toggle setting UI component.
+   * Initializes fullscreen state detection, sets up event listeners,
+   * and creates a toggle switch for user interaction.
+   * Integrates with the Responsive system for dynamic updates.
+   * @memberof FullScreenClient.FullScreen
+   * @returns {Promise<string>} A promise resolving to the HTML string for the fullscreen setting component.
+   */
   RenderSetting: async function () {
-    let fullScreenSwitch = checkFullScreen();
+    // Initialize state from actual fullscreen status
+    this._fullScreenSwitch = this._isFullScreen();
+
+    // Setup event listeners once
+    this._addEventListeners();
+
+    // Update responsive event
     Responsive.Event['full-screen-settings'] = () => {
-      let fullScreenMode = checkFullScreen();
-      if ((fullScreenSwitch && !fullScreenMode) || (!fullScreenSwitch && fullScreenMode))
-        if (s('.fullscreen')) ToggleSwitch.Tokens[`fullscreen`].click();
+      this._syncToggleState();
     };
+
     return html`<div class="in section-mp">
       ${await ToggleSwitch.Render({
         wrapper: true,
         wrapperLabel: html`<i class="fa-solid fa-expand"></i> ${Translate.Render('fullscreen')}`,
         id: 'fullscreen',
         disabledOnClick: true,
-        checked: fullScreenSwitch,
+        checked: this._fullScreenSwitch,
         on: {
           unchecked: () => {
-            fullScreenSwitch = false;
-            if (checkFullScreen()) fullScreenOut();
+            this._exitFullScreen();
           },
           checked: () => {
-            fullScreenSwitch = true;
-            if (!checkFullScreen()) fullScreenIn();
+            this._enterFullScreen();
           },
         },
       })}

package/src/client/components/core/PanelForm.js

@@ -455,7 +455,9 @@ const PanelForm = {
 
             const baseNewDoc = newInstance(data);
             baseNewDoc.tags = tags.filter((t) => !prefixTags.includes(t));
-            baseNewDoc.mdFileId = hasMdContent ? marked.parse(data.mdFileId) : null;
+            baseNewDoc.mdFileId = hasMdContent
+              ? `<div class="markdown-content">${marked.parse(data.mdFileId)}</div>`
+              : null;
             baseNewDoc.userId = Elements.Data.user?.main?.model?.user?._id;
 
             // Ensure profileImageId is properly formatted as object with _id property
@@ -677,7 +679,7 @@ const PanelForm = {
                     mdPlain = await blobArray[0].text();
                     // Parse markdown with proper error handling
                     try {
-                      parsedMarkdown = mdPlain ? marked.parse(mdPlain) : '';
+                      parsedMarkdown = mdPlain ? `<div class="markdown-content">${marked.parse(mdPlain)}</div>` : '';
                     } catch (parseError) {
                       logger.error('Error parsing markdown for document:', documentObject._id, parseError);
                       parsedMarkdown = `<p><strong>Error rendering markdown:</strong> ${parseError.message}</p>`;

package/src/client/components/core/VanillaJs.js

@@ -174,52 +174,103 @@ const disableOptionsClick = (element, types) => {
 
 /**
  * The function `checkFullScreen` checks if the document is in full screen mode and returns a boolean
- * value accordingly.
- * @returns The function `checkFullScreen` is returning `true` if `document.fullscreenElement` is
- * truthy, otherwise it returns `false`.
+ * value accordingly. Checks all vendor-prefixed APIs for maximum compatibility.
+ * @returns The function `checkFullScreen` is returning `true` if any fullscreen API indicates
+ * fullscreen mode is active, otherwise it returns `false`.
  * @memberof VanillaJS
  */
 const checkFullScreen = () => {
-  // !(!window.screenTop && !window.screenY) ||
-  return document.fullscreenElement ? true : false;
+  return !!(
+    document.fullscreenElement ||
+    document.webkitFullscreenElement ||
+    document.mozFullScreenElement ||
+    document.msFullscreenElement ||
+    document.fullscreen ||
+    document.webkitIsFullScreen ||
+    document.mozFullScreen
+  );
 };
 
 /**
  * The function `fullScreenOut` is used to exit full screen mode in a web browser.
+ * Handles all vendor-prefixed APIs and returns a promise for better control flow.
+ * @returns {Promise<boolean>} Promise that resolves to true if exit was attempted
  * @memberof VanillaJS
  */
 const fullScreenOut = () => {
-  if (document.exitFullscreen) {
-    document.exitFullscreen();
-  } else if (document.mozCancelFullScreen) {
-    document.mozCancelFullScreen();
-  } else if (document.webkitExitFullscreen) {
-    document.webkitExitFullscreen();
-  } else if (document.msExitFullscreen) {
-    window.top.document.msExitFullscreen();
-  }
+  return new Promise((resolve) => {
+    if (!checkFullScreen()) {
+      resolve(true);
+      return;
+    }
+
+    try {
+      if (document.exitFullscreen) {
+        document
+          .exitFullscreen()
+          .then(() => resolve(true))
+          .catch(() => resolve(false));
+      } else if (document.webkitExitFullscreen) {
+        document.webkitExitFullscreen();
+        setTimeout(() => resolve(true), 100);
+      } else if (document.mozCancelFullScreen) {
+        document.mozCancelFullScreen();
+        setTimeout(() => resolve(true), 100);
+      } else if (document.msExitFullscreen) {
+        document.msExitFullscreen();
+        setTimeout(() => resolve(true), 100);
+      } else {
+        resolve(false);
+      }
+    } catch (err) {
+      console.warn('Fullscreen exit error:', err);
+      resolve(false);
+    }
+  });
 };
 
 /**
  * The `fullScreenIn` function is used to request full screen mode in a web browser using different
- * vendor-specific methods.
+ * vendor-specific methods. Returns a promise for better control flow.
+ * @returns {Promise<boolean>} Promise that resolves to true if fullscreen was requested
  * @memberof VanillaJS
  */
 const fullScreenIn = () => {
-  const elem = document.documentElement;
-  if (elem.requestFullscreen) {
-    elem.requestFullscreen();
-  } else if (elem.mozRequestFullScreen) {
-    /* Firefox */
-    elem.mozRequestFullScreen();
-  } else if (elem.webkitRequestFullscreen) {
-    /* Chrome, Safari & Opera */
-    elem.webkitRequestFullscreen();
-  } else if (elem.msRequestFullscreen) {
-    /* IE/Edge */
-    elem = window.top.document.body; //To break out of frame in IE
-    elem.msRequestFullscreen();
-  }
+  return new Promise((resolve) => {
+    if (checkFullScreen()) {
+      resolve(true);
+      return;
+    }
+
+    const elem = document.documentElement;
+
+    try {
+      if (elem.requestFullscreen) {
+        elem
+          .requestFullscreen()
+          .then(() => resolve(true))
+          .catch(() => resolve(false));
+      } else if (elem.webkitRequestFullscreen) {
+        /* Chrome, Safari & Opera */
+        elem.webkitRequestFullscreen();
+        setTimeout(() => resolve(true), 100);
+      } else if (elem.mozRequestFullScreen) {
+        /* Firefox */
+        elem.mozRequestFullScreen();
+        setTimeout(() => resolve(true), 100);
+      } else if (elem.msRequestFullscreen) {
+        /* IE/Edge */
+        const msElem = window.top.document.body;
+        msElem.msRequestFullscreen();
+        setTimeout(() => resolve(true), 100);
+      } else {
+        resolve(false);
+      }
+    } catch (err) {
+      console.warn('Fullscreen request error:', err);
+      resolve(false);
+    }
+  });
 };
 
 /**

package/src/index.js

@@ -36,7 +36,7 @@ class Underpost {
    * @type {String}
    * @memberof Underpost
    */
-  static version = 'v2.98.1';
+  static version = 'v2.98.3';
   /**
    * Repository cli API
    * @static