underpost 2.7.92 → 2.7.94

package/bin/index.js

@@ -19,7 +19,7 @@ const globalBinFolder = `${shellExec(`npm root -g`, {
 
 const program = new Command();
 
-const version = '2.7.92';
+const version = '2.7.94';
 
 program.name('underpost').description(`underpost.net ci/cd cli ${version}`).version(version);
 

package/conf.js

@@ -180,7 +180,7 @@ const DefaultConf = {
   ssr: {
     Default: {
       head: ['Seo', 'Pwa', 'Css', 'DefaultScripts', 'Production'],
-      body: ['CacheControl', 'DefaultSplashScreen'],
+      body: ['CacheControl', 'DefaultSplashScreen', '404', '500'],
       mailer: {
         userVerifyEmail: 'DefaultVerifyEmail',
         userRecoverEmail: 'DefaultRecoverEmail',

package/docker-compose.yml

@@ -58,7 +58,7 @@ services:
           cpus: '0.25'
           memory: 20M
     labels: # labels in Compose file instead of Dockerfile
-      engine.version: '2.7.92'
+      engine.version: '2.7.94'
     networks:
       - load-balancer
 

package/package.json

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

package/src/api/core/core.service.js

@@ -9,11 +9,9 @@ const CoreService = {
     /** @type {import('./core.model.js').CoreModel} */
     const Core = DataBaseProvider.instance[`${options.host}${options.path}`].mongoose.models.Core;
     if (req.path.startsWith('/sh')) {
-      shellExec(req.body.sh, { stdout: true, async: true });
-      return {
-        status: 'success',
-        message: 'Command "' + req.body.sh + '" running',
-      };
+      if (req.body.print) return shellExec(req.body.sh, { stdout: true });
+      shellExec(req.body.sh, { async: true });
+      return 'Command "' + req.body.sh + '" running';
     }
     return await new Core(req.body).save();
   },

package/src/client/Default.index.js

@@ -9,13 +9,13 @@ import { SignUpDefault } from './components/default/SignUpDefault.js';
 import { MenuDefault } from './components/default/MenuDefault.js';
 import { RouterDefault } from './components/default/RoutesDefault.js';
 import { TranslateDefault } from './components/default/TranslateDefault.js';
-import { getProxyPath } from './components/core/VanillaJs.js';
 import { Worker } from './components/core/Worker.js';
 import { Keyboard } from './components/core/Keyboard.js';
 import { DefaultParams } from './components/default/CommonDefault.js';
 import { SocketIo } from './components/core/SocketIo.js';
 import { SocketIoDefault } from './components/default/SocketIoDefault.js';
 import { ElementsDefault } from './components/default/ElementsDefault.js';
+import { Scroll } from './components/core/Scroll.js';
 
 const htmlMainBody = async () => {
   return html`<span style="color: black; padding: 5px">Hello World!!</span>`;
@@ -35,6 +35,7 @@ window.onload = () =>
       await LogInDefault();
       await LogOutDefault();
       await SignUpDefault();
+      await Scroll.pullTopRefresh();
       await Keyboard.Init({ callBackTime: DefaultParams.EVENT_CALLBACK_TIME });
     },
   });

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

@@ -79,7 +79,7 @@ const Docs = {
       icon: html`<i class="fa-brands fa-osi"></i>`,
       text: 'Source Docs',
       url: function () {
-        return `${getProxyPath()}docs/engine/2.7.92`;
+        return `${getProxyPath()}docs/engine/2.7.94`;
       },
     },
     {

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

@@ -1340,6 +1340,9 @@ const Modal = {
             backMenuButtonEvent();
           }
           s(`.btn-close-modal-menu`).click();
+          if (window.location.pathname !== (getProxyPath() === '/' ? getProxyPath() : `${getProxyPath()}/`))
+            setPath(getProxyPath());
+          setDocTitle({ ...options.RouterInstance, route: '' });
         };
         EventsUI.onClick(`.btn-icon-menu-back`, backMenuButtonEvent);
         EventsUI.onClick(`.btn-icon-menu-mode`, () => {
@@ -1532,7 +1535,7 @@ const Modal = {
         Responsive.Event['h-ui-hide-' + idModal] = () => {
           setTimeout(() => {
             if (!s(`.${idModal}`) || !s(`.main-body-btn-ui-close`)) return;
-            if (s(`.btn-restore-${idModal}`).style.display !== 'none') {
+            if (s(`.btn-restore-${idModal}`) && s(`.btn-restore-${idModal}`).style.display !== 'none') {
               s(`.${idModal}`).style.height = s(`.main-body-btn-ui-close`).classList.contains('hide')
                 ? `${window.innerHeight}px`
                 : `${
@@ -1540,10 +1543,10 @@ const Modal = {
                     (options.heightTopBar ? options.heightTopBar : heightDefaultTopBar) -
                     (options.heightBottomBar ? options.heightBottomBar : heightDefaultBottomBar)
                   }px`;
-              s(`.${idModal}`).style.top = s(`.main-body-btn-ui-close`).classList.contains('hide')
-                ? `0px`
-                : `${options.heightTopBar ? options.heightTopBar : heightDefaultTopBar}px`;
             }
+            s(`.${idModal}`).style.top = s(`.main-body-btn-ui-close`).classList.contains('hide')
+              ? `0px`
+              : `${options.heightTopBar ? options.heightTopBar : heightDefaultTopBar}px`;
           });
         };
         Responsive.Event['h-ui-hide-' + idModal]();

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

@@ -1,4 +1,6 @@
-import { s } from './VanillaJs.js';
+import { borderChar } from './Css.js';
+import { Modal } from './Modal.js';
+import { append, s } from './VanillaJs.js';
 
 const Scroll = {
   data: {},
@@ -16,7 +18,7 @@ const Scroll = {
   scrollHandler: async function () {
     for (const selector in Scroll.data) await Scroll.data[selector].callback(Scroll.getScrollPosition(selector));
   },
-  addEvent: function (selector = '', callback = () => {}) {
+  addEvent: function (selector = '', callback = (position = 0) => {}) {
     Scroll.data[selector].callback = callback;
   },
   removeEvent: function (selector) {
@@ -29,6 +31,100 @@ const Scroll = {
       behavior: options.behavior || 'smooth',
     });
   },
+  topRefreshEvents: {},
+  addTopRefreshEvent: function (options = { id: '', callback: () => {}, condition: () => {} }) {
+    this.topRefreshEvents[options.id] = options;
+  },
+  removeTopRefreshEvent: function (id = '') {
+    delete this.topRefreshEvents[id];
+  },
+  pullTopRefresh: function () {
+    append(
+      'body',
+      html` <style>
+          .pull-refresh-icon-container {
+            height: 60px;
+            width: 100%;
+            z-index: 10;
+            transition: 0.3s;
+            left: 0px;
+          }
+          .pull-refresh-icon {
+            width: 60px;
+            height: 60px;
+            margin: auto;
+            color: white;
+            font-size: 30px;
+          }
+        </style>
+        ${borderChar(2, 'black', [' .pull-refresh-icon-container'])}
+        <div style="top: -60px" class="abs pull-refresh-icon-container">
+          <div class="in pull-refresh-icon">
+            <div class="abs center"><i class="fa-solid fa-arrows-rotate"></i></div>
+          </div>
+        </div>`,
+    );
+
+    let touchstartY = 0;
+    let reload = false;
+    const minHeightDragReload = 3;
+    const maxHeightDragReload = 20;
+
+    document.addEventListener('touchstart', (e) => {
+      touchstartY = e.touches[0].clientY;
+      // console.warn('touchstart', touchstartY);
+    });
+
+    document.addEventListener('touchmove', (e) => {
+      if (
+        !Object.keys(Scroll.topRefreshEvents).find((event) => Scroll.topRefreshEvents[event].condition()) ||
+        (!s(`.btn-bar-center-icon-close`).classList.contains('hide') &&
+          !s(
+            `.btn-icon-menu-mode-${Modal.Data['modal-menu'].options.mode !== 'slide-menu-right' ? 'left' : 'right'}`,
+          ).classList.contains('hide'))
+      )
+        return;
+
+      const touchY = e.touches[0].clientY;
+      const touchDiff = touchY - touchstartY;
+
+      // console.warn('touchDiff', touchDiff, maxHeightDragReload);
+
+      if (touchDiff > maxHeightDragReload)
+        s(`.pull-refresh-icon-container`).style.top = 60 + maxHeightDragReload + 'px';
+      else s(`.pull-refresh-icon-container`).style.top = 60 + touchDiff + 'px';
+
+      if (touchDiff > minHeightDragReload && window.scrollY === 0) {
+        reload = true;
+      } else {
+        reload = false;
+      }
+    });
+    document.addEventListener('touchend', (e) => {
+      // console.warn('touchend');
+      s(`.pull-refresh-icon-container`).style.top = '-60px';
+      if (reload) {
+        for (const event of Object.keys(Scroll.topRefreshEvents))
+          if (Scroll.topRefreshEvents[event].condition()) Scroll.topRefreshEvents[event].callback();
+      }
+      reload = false;
+    });
+    Scroll.addTopRefreshEvent({
+      id: 'main-body',
+      callback: () => {
+        location.reload();
+      },
+      condition: () => {
+        return (
+          s('.main-body') &&
+          s('.main-body').scrollTop === 0 &&
+          !Object.keys(Modal.Data).find(
+            (idModal) => !['modal-menu', 'main-body', 'bottom-bar', 'main-body-top'].includes(idModal),
+          )
+        );
+      },
+    });
+  },
 };
 
 export { Scroll };

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

@@ -106,6 +106,10 @@ const TranslateCore = {
       en: 'Enter your WhatsApp number, including your country code.',
       es: 'Número de WhatsApp, recuerda colocar el código de tu país',
     };
+    Translate.Data['¿'] = {
+      en: '',
+      es: '¿',
+    };
     Translate.Data['color-copy'] = { es: 'color copiado en el portapapeles', en: 'color copied to clipboard' };
     Translate.Data['pallet-colors'] = { en: 'pallet colors', es: 'paleta de colores' };
     Translate.Data['fullscreen'] = { en: 'Fullscreen', es: 'Pantalla completa' };

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

@@ -429,7 +429,9 @@ const isDevInstance = () => location.origin.match('localhost') && location.port;
 const getDataFromInputFile = async (file) => Array.from(new Uint8Array(await file.arrayBuffer()));
 
 const getLang = () =>
-  (localStorage.getItem('lang') || navigator.language || navigator.userLanguage || s('html').lang).slice(0, 2);
+  (localStorage.getItem('lang') || navigator.language || navigator.userLanguage || s('html').lang)
+    .slice(0, 2)
+    .toLowerCase();
 
 export {
   s,

package/src/client/components/default/MenuDefault.js

@@ -172,6 +172,7 @@ const MenuDefault = {
         return '';
       },
       mode: 'slide-menu',
+      RouterInstance,
       heightTopBar,
       heightBottomBar,
       htmlMainBody: options?.htmlMainBody ? options.htmlMainBody : undefined,

package/src/client/ssr/body/404.js

@@ -0,0 +1,73 @@
+const s = (el) => document.querySelector(el);
+
+const append = (el, html) => s(el).insertAdjacentHTML('beforeend', html);
+
+const getLang = () =>
+  (localStorage.getItem('lang') || navigator.language || navigator.userLanguage || s('html').lang)
+    .slice(0, 2)
+    .toLowerCase();
+
+const main = () => {
+  const Translate = {
+    Data: {
+      ['page-not-found']: {
+        en: 'Page not found',
+        es: 'Página no encontrada',
+      },
+      ['page-broken']: {
+        es: 'Algo salio mal',
+        en: 'Something went wrong',
+      },
+      ['back']: {
+        en: 'Back to <br>  homepage',
+        es: 'Volver a  <br> la pagina principal',
+      },
+    },
+    Render: function (id) {
+      return this.Data[id][getLang()] ? this.Data[id][getLang()] : this.Data[id]['en'];
+    },
+  };
+  const icon = html`
+    <svg xmlns="http://www.w3.org/2000/svg" width="80" height="80" viewBox="0 0 24 24">
+      <path
+        fill="currentColor"
+        d="M15.097 5.904A6.5 6.5 0 0 0 4 10.504l.001 1h-2v-1a8.5 8.5 0 1 1 15.176 5.258l5.344 5.345l-1.414 1.414l-5.344-5.345A8.48 8.48 0 0 1 10.5 19h-1v-2h1a6.5 6.5 0 0 0 4.596-11.096M1.672 13.257L4.5 16.086l2.829-2.829l1.414 1.415L5.915 17.5l2.828 2.828l-1.414 1.415L4.5 18.914l-2.828 2.829l-1.414-1.415L3.086 17.5L.258 14.672z"
+      />
+    </svg>
+  `;
+  append(
+    'body',
+    html` <style>
+        body {
+          font-family: arial;
+          font-size: 20px;
+          background-color: #d8d8d8;
+          color: #333;
+        }
+        a {
+          color: black;
+        }
+      </style>
+
+      <div class="abs center" style="top: 45%">
+        ${icon}
+        <br />
+        <br />
+        <span class="bold">404</span>
+        <br />
+        <br />${Translate.Render('page-not-found')} <br />
+        <br />
+        <a href="${location.origin}">${Translate.Render('back')}</a>
+      </div>`,
+  );
+};
+
+SrrComponent = () => html`<script>
+  {
+    const s = ${s};
+    const append = ${append};
+    const getLang = ${getLang};
+    const main = ${main};
+    window.onload = main;
+  }
+</script>`;

package/src/client/ssr/body/500.js

@@ -0,0 +1,72 @@
+const s = (el) => document.querySelector(el);
+
+const append = (el, html) => s(el).insertAdjacentHTML('beforeend', html);
+
+const getLang = () =>
+  (localStorage.getItem('lang') || navigator.language || navigator.userLanguage || s('html').lang)
+    .slice(0, 2)
+    .toLowerCase();
+
+const main = () => {
+  const Translate = {
+    Data: {
+      ['page-not-found']: {
+        en: 'Page not found',
+        es: 'Página no encontrada',
+      },
+      ['page-broken']: {
+        es: 'Algo salio mal',
+        en: 'Something went wrong',
+      },
+      ['back']: {
+        en: 'Back to <br>  homepage',
+        es: 'Volver a  <br> la pagina principal',
+      },
+    },
+    Render: function (id) {
+      return this.Data[id][getLang()] ? this.Data[id][getLang()] : this.Data[id]['en'];
+    },
+  };
+  const icon = html`<svg xmlns="http://www.w3.org/2000/svg" width="80" height="80" viewBox="0 0 20 20">
+    <path
+      fill="currentColor"
+      d="M6 2a2 2 0 0 0-2 2v5.207a5.5 5.5 0 0 1 1-.185V4a1 1 0 0 1 1-1h4v3.5A1.5 1.5 0 0 0 11.5 8H15v8a1 1 0 0 1-1 1h-3.6a5.5 5.5 0 0 1-.657 1H14a2 2 0 0 0 2-2V7.414a1.5 1.5 0 0 0-.44-1.06l-3.914-3.915A1.5 1.5 0 0 0 10.586 2zm8.793 5H11.5a.5.5 0 0 1-.5-.5V3.207zM10 14.5a4.5 4.5 0 1 1-9 0a4.5 4.5 0 0 1 9 0M5.5 12a.5.5 0 0 0-.5.5v2a.5.5 0 0 0 1 0v-2a.5.5 0 0 0-.5-.5m0 5.125a.625.625 0 1 0 0-1.25a.625.625 0 0 0 0 1.25"
+    />
+  </svg>`;
+
+  append(
+    'body',
+    html` <style>
+        body {
+          font-family: arial;
+          font-size: 20px;
+          background-color: #d8d8d8;
+          color: #333;
+        }
+        a {
+          color: black;
+        }
+      </style>
+
+      <div class="abs center" style="top: 45%">
+        ${icon}
+        <br />
+        <br />
+        <span class="bold">500</span>
+        <br />
+        <br />${Translate.Render('page-broken')} <br />
+        <br />
+        <a href="${location.origin}">${Translate.Render('back')}</a>
+      </div>`,
+  );
+};
+
+SrrComponent = () => html`<script>
+  {
+    const s = ${s};
+    const append = ${append};
+    const getLang = ${getLang};
+    const main = ${main};
+    window.onload = main;
+  }
+</script>`;

package/src/client/ssr/body/CacheControl.js

@@ -109,6 +109,6 @@ SrrComponent = ({ ttiLoadTimeLimit }) => {
       const CacheControl = ${CacheControl};
       CacheControl({ ttiLoadTimeLimit: ${ttiLoadTimeLimit ? ttiLoadTimeLimit : 1000 * 70 * 1} });
     </script>
-    <div class="clean-cache-container">v2.7.92</div>
+    <div class="clean-cache-container">v2.7.94</div>
   `;
 };

package/src/client/ssr/offline/NoNetworkConnection.js

@@ -3,7 +3,9 @@ const s = (el) => document.querySelector(el);
 const append = (el, html) => s(el).insertAdjacentHTML('beforeend', html);
 
 const getLang = () =>
-  (localStorage.getItem('lang') || navigator.language || navigator.userLanguage || s('html').lang).slice(0, 2);
+  (localStorage.getItem('lang') || navigator.language || navigator.userLanguage || s('html').lang)
+    .slice(0, 2)
+    .toLowerCase();
 
 const main = () => {
   const Translate = {

package/src/client/ssr/pages/Test.js

@@ -3,7 +3,9 @@ const s = (el) => document.querySelector(el);
 const append = (el, html) => s(el).insertAdjacentHTML('beforeend', html);
 
 const getLang = () =>
-  (localStorage.getItem('lang') || navigator.language || navigator.userLanguage || s('html').lang).slice(0, 2);
+  (localStorage.getItem('lang') || navigator.language || navigator.userLanguage || s('html').lang)
+    .slice(0, 2)
+    .toLowerCase();
 
 const main = () => {
   const Translate = {

package/src/server/network.js

@@ -97,7 +97,7 @@ const saveRuntimeRouter = async () => {
           port: networkRouter[_host][_path].port,
           apis: networkRouter[_host][_path].apis,
         };
-        const instance = await Instance.findOne({ deployId: body.deployId, port: body.port });
+        const instance = await Instance.findOne({ deployId: body.deployId, host: _host, path: _path });
         if (instance) {
           await Instance.findByIdAndUpdate(instance._id, body);
         } else {