@underpostnet/underpost 2.7.82

package/src/client/ssr/common/Translate.js

@@ -0,0 +1,26 @@
+const TranslateCore = {
+  ['server-maintenance']: {
+    en: "The server is under maintenance <br> we'll be back soon.",
+    es: 'El servidor está en mantenimiento <br> volveremos pronto.',
+  },
+  ['no-internet-connection']: {
+    en: 'No internet connection <br> verify your network',
+    es: 'Sin conexión a internet <br> verifica tu red',
+  },
+  ['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',
+  },
+};
+
+const Translate = (key) => TranslateCore[key][getLang().match('es') ? 'es' : 'en'];
+
+export { Translate };

package/src/client/ssr/common/Worker.js

@@ -0,0 +1,28 @@
+const Worker = {
+  instance: async function (options = { render: async () => {} }) {
+    window.serviceWorkerReady = true;
+    append(
+      'body',
+      html`
+        <style>
+          body {
+            background-color: #dcdcdc;
+            color: #303030;
+            font-family: arial;
+            font-size: 16px;
+          }
+          .page-render {
+            min-height: 100vh;
+          }
+          a {
+            color: #000000;
+          }
+        </style>
+        <div class="in page-render"></div>
+      `,
+    );
+    await options.render();
+  },
+};
+
+export { Worker };

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

@@ -0,0 +1,114 @@
+const CacheControl = function ({ ttiLoadTimeLimit }) {
+  window.cleanCache = async () => {
+    await new Promise(async (resolve, reject) => {
+      navigator.serviceWorker
+        .getRegistrations()
+        .then(async (registrations) => {
+          const cacheNames = await caches.keys();
+          for (const cacheName of cacheNames) await caches.delete(cacheName);
+          for (const registration of registrations) {
+            console.log('[sw-cache-control] remove', registration);
+            registration.unregister();
+          }
+        })
+        .catch((...args) => {
+          console.error(...args);
+          return resolve(args);
+        })
+        .finally((...args) => {
+          console.log('[sw-cache-control] finally uninstall', args);
+          return resolve(args);
+        });
+    });
+    //   document.querySelector('html').innerHTML = '';
+    //   window.open(window.location.origin, '_blank');
+    localStorage.clear();
+    location.reload();
+  };
+
+  window.cacheControlCallBack = async () => {
+    let disable = false;
+    let status = false;
+    await new Promise((resolve, reject) => {
+      if ('serviceWorker' in navigator) {
+        navigator.serviceWorker
+          .getRegistrations()
+          .then((registrations) => {
+            for (const registration of registrations) {
+              if (registration.installing) console.log('[sw-cache-control] installing', registration);
+              else if (registration.waiting) console.log('[sw-cache-control] waiting', registration);
+              else if (registration.active) {
+                console.log('[sw-cache-control] active', registration);
+              }
+            }
+            if (registrations.length > 0) status = true;
+          })
+          .catch((...args) => {
+            console.error(...args);
+            return resolve(false);
+          })
+          .finally((...args) => {
+            console.log('[sw-cache-control] finally status', args);
+            return resolve(status);
+          });
+      } else {
+        console.warn('[sw-cache-control] disabled');
+        disable = true;
+        return resolve(false);
+      }
+    });
+    if (!disable && !window.serviceWorkerReady) {
+      window.cleanCache();
+    } else {
+      // old navigator
+    }
+  };
+  setTimeout(() => {
+    if (document.querySelector('.clean-cache-container'))
+      document.querySelector('.clean-cache-container').onclick = window.cleanCache;
+  });
+  setTimeout(window.cacheControlCallBack, ttiLoadTimeLimit); // 70s limit);
+};
+
+SrrComponent = ({ ttiLoadTimeLimit }) => {
+  const borderChar = (px, color, selectors) => {
+    if (selectors) {
+      return selectors
+        .map(
+          (selector) => html`
+            <style>
+              ${selector} {
+                text-shadow: ${px}px -${px}px ${px}px ${color}, -${px}px ${px}px ${px}px ${color},
+                  -${px}px -${px}px ${px}px ${color}, ${px}px ${px}px ${px}px ${color};
+              }
+            </style>
+          `,
+        )
+        .join('');
+    }
+    return html`
+      text-shadow: ${px}px -${px}px ${px}px ${color}, -${px}px ${px}px ${px}px ${color}, -${px}px -${px}px ${px}px
+      ${color}, ${px}px ${px}px ${px}px ${color};
+    `;
+  };
+  return html`
+    <style>
+      .clean-cache-container {
+        position: fixed !important;
+        bottom: 5px !important;
+        right: 20px !important;
+        cursor: pointer !important;
+        font-family: Arial, sans-serif !important;
+        z-index: 11 !important;
+        color: white !important;
+        font-size: 12px !important;
+      }
+    </style>
+    ${borderChar(1, 'black', ['.clean-cache-container'])}
+    <script>
+      const CacheControl = ${CacheControl};
+      CacheControl({ ttiLoadTimeLimit: ${ttiLoadTimeLimit ? ttiLoadTimeLimit : 1000 * 70 * 1} });
+    </script>
+    <div class="clean-cache-container">v2.7.82</div>
+  `;
+};

package/src/client/ssr/components/body/DefaultSplashScreen.js

@@ -0,0 +1,90 @@
+SrrComponent = ({ base64BackgroundImage, metadata }) => html`
+  ${base64BackgroundImage
+    ? html`<style>
+        .ssr-background-image {
+          background-image: url('${base64BackgroundImage}');
+        }
+      </style>`
+    : metadata?.themeColor
+    ? html`<style>
+        .ssr-background-image {
+          background: ${metadata.themeColor};
+        }
+      </style>`
+    : ''}
+
+  <style>
+    .ssr-top-bar {
+      background: #ffffff;
+      height: 100px;
+    }
+    .ssr-btn {
+      height: 40px;
+      width: 40px;
+    }
+    .ssr-btn-0 {
+      top: 55px;
+      right: 5px;
+    }
+    .ssr-btn-1 {
+      top: 55px;
+      right: 55px;
+    }
+    .ssr-btn-2 {
+      top: 55px;
+      right: 105px;
+    }
+    .ssr-btn-3 {
+      top: 55px;
+      left: 5px;
+    }
+    .ssr-btn-4 {
+      top: 5px;
+      left: 5px;
+    }
+    .ssr-btn-5 {
+      top: 5px;
+      right: 5px;
+      border-radius: 50%;
+    }
+    .ssr-loader {
+      width: auto;
+    }
+
+    .loader {
+      height: 6px;
+      width: 130px;
+      --c: no-repeat linear-gradient(#353535 0 0);
+      background: var(--c), var(--c), #e1e1e1;
+      background-size: 60% 100%;
+      animation: l16 3s infinite;
+    }
+    @keyframes l16 {
+      0% {
+        background-position: -150% 0, -150% 0;
+      }
+      66% {
+        background-position: 250% 0, -150% 0;
+      }
+      100% {
+        background-position: 250% 0, 250% 0;
+      }
+    }
+  </style>
+  <div class="ssr-background-image"></div>
+  <div class="ssr-abs ssr-background" style="opacity: 1">
+    <div class="ssr-in ssr-top-bar">
+      ${new Array(6)
+        .fill()
+        .map(
+          (v, i) => html`<div class="ssr-abs ssr-btn ssr-btn-${i}">
+            <div class="ssr-shimmer"></div>
+          </div>`,
+        )
+        .join('')}
+
+      <div class="ssr-abs ssr-search-box"><div class="ssr-shimmer-search-box"></div></div>
+    </div>
+    <div class="ssr-abs ssr-center ssr-loader"><div class="loader"></div></div>
+  </div>
+`;

package/src/client/ssr/components/email/DefaultRecoverEmail.js

@@ -0,0 +1,21 @@
+SrrComponent = (render = { style: {}, renderStyle: () => '' }, options) =>
+  html`
+    <div style="${render.renderStyle('body')}">
+      <div style="${render.renderStyle('.container')}">
+        <h1 style="${render.renderStyle('h1')}">{{H1}}</h1>
+        <p style="${render.renderStyle('p')}">{{P1}}</p>
+        <p style="${render.renderStyle('p')}">
+          <a href="{{RECOVER_WEB_URL}}" style="${render.renderStyle('button')}"
+            ><img
+              src="http${options.transport.secure ? 's' : ''}://${options.host}${options.path === '/'
+                ? ''
+                : options.path}/api/user/recover/{{TOKEN}}"
+            /><br />{{RECOVER_BTN_LABEL}}</a
+          >
+        </p>
+      </div>
+      <div style="${render.renderStyle('.footer')}">
+        <p>{{COMPANY}}</p>
+      </div>
+    </div>
+  `;

package/src/client/ssr/components/email/DefaultVerifyEmail.js

@@ -0,0 +1,17 @@
+SrrComponent = (render = { style: {}, renderStyle: () => '' }, options) =>
+  html`
+    <div style="${render.renderStyle('body')}">
+      <div style="${render.renderStyle('.container')}">
+        <h1 style="${render.renderStyle('h1')}">{{H1}}</h1>
+        <p style="${render.renderStyle('p')}">{{P1}}</p>
+        <img
+          src="http${options.transport.secure ? 's' : ''}://${options.host}${options.path === '/'
+            ? ''
+            : options.path}/api/user/mailer/{{TOKEN}}"
+        />
+      </div>
+      <div style="${render.renderStyle('.footer')}">
+        <p>{{COMPANY}}</p>
+      </div>
+    </div>
+  `;

package/src/client/ssr/components/head/Css.js

@@ -0,0 +1,241 @@
+// https://css-loaders.com/pulsing/
+
+SrrComponent = () => html`
+  <style>
+    body {
+      margin: 0;
+      padding: 0;
+    }
+
+    .ssr-fl {
+      position: relative;
+      display: flow-root;
+    }
+
+    .ssr-abs,
+    .ssr-in {
+      display: block;
+    }
+
+    .ssr-fll {
+      float: left;
+    }
+
+    .ssr-flr {
+      float: right;
+    }
+
+    .ssr-abs {
+      position: absolute;
+    }
+
+    .ssr-in,
+    .ssr-inl {
+      position: relative;
+    }
+
+    .ssr-inl {
+      display: inline-table;
+      display: -webkit-inline-table;
+      display: -moz-inline-table;
+      display: -ms-inline-table;
+      display: -o-inline-table;
+    }
+
+    .ssr-fix {
+      position: fixed;
+      display: block;
+    }
+
+    .ssr-stq {
+      position: sticky;
+      /* require defined at least top, bottom, left o right */
+    }
+
+    .ssr-wfa {
+      width: fill-available;
+      width: -webkit-fill-available;
+      width: -moz-fill-available;
+      width: -ms-fill-available;
+      width: -o-fill-available;
+    }
+
+    .ssr-wft {
+      width: fit-content;
+      width: -webkit-fit-content;
+      width: -moz-fit-content;
+      width: -ms-fit-content;
+      width: -o-fit-content;
+    }
+
+    .ssr-wfm {
+      width: max-content;
+      width: -webkit-max-content;
+      width: -moz-max-content;
+      width: -ms-max-content;
+      width: -o-max-content;
+    }
+
+    .ssr-negative-color {
+      filter: invert(1);
+      -webkit-filter: invert(1);
+      -moz-filter: invert(1);
+      -ms-filter: invert(1);
+      -o-filter: invert(1);
+    }
+
+    .ssr-no-drag {
+      user-drag: none;
+      -webkit-user-drag: none;
+      -moz-user-drag: none;
+      -ms-user-drag: none;
+      -o-user-drag: none;
+      user-select: none;
+      -webkit-user-select: none;
+      -moz-user-select: none;
+      -ms-user-select: none;
+      -o-user-select: none;
+    }
+
+    .ssr-center {
+      transform: translate(-50%, -50%);
+      top: 50%;
+      left: 50%;
+      width: 100%;
+      text-align: center;
+    }
+    .ssr-gray {
+      filter: grayscale(1);
+    }
+  </style>
+  <style>
+    .ssr-background-image {
+      background-size: cover;
+      background-position: center;
+      height: 100vh;
+      width: 100vw;
+      object-fit: cover;
+      z-index: -1;
+      top: 0px;
+      left: 0px;
+      pointer-events: none;
+    }
+    .ssr-background {
+      top: 0px;
+      left: 0px;
+      height: 100%;
+      width: 100%;
+      z-index: 11;
+    }
+    .ssr-shimmer {
+      height: 100%;
+      background-image: linear-gradient(
+        to right,
+        rgb(255, 255, 255, 0.5) 0%,
+        rgba(200, 200, 200, 0.5) 30%,
+        rgba(220, 220, 220, 0.5) 50%,
+        rgba(255, 255, 255, 0.5) 100%
+      );
+      animation: ssr-shimmer 3s linear infinite;
+    }
+    @keyframes ssr-shimmer {
+      0% {
+        background-position: -30px 0;
+      }
+      100% {
+        background-position: 80px 0;
+      }
+    }
+    .ssr-shimmer-dark {
+      height: 100%;
+      background-image: linear-gradient(
+        to right,
+        rgb(5, 5, 5, 0.5) 0%,
+        rgba(10, 10, 10, 0.5) 30%,
+        rgba(15, 15, 15, 0.5) 40%,
+        rgba(10, 10, 10, 0.5) 70%,
+        rgba(5, 5, 5, 0.5) 100%
+      );
+      animation: ssr-shimmer-dark 3s linear infinite;
+    }
+    @keyframes ssr-shimmer-dark {
+      0% {
+        background-position: -30px 0;
+      }
+      100% {
+        background-position: 80px 0;
+      }
+    }
+    .ssr-shimmer-dark-search-box {
+      height: 100%;
+      background-image: linear-gradient(
+        to right,
+        rgb(5, 5, 5, 0.5) 0%,
+        rgba(10, 10, 10, 0.5) 30%,
+        rgba(15, 15, 15, 0.5) 40%,
+        rgba(10, 10, 10, 0.5) 70%,
+        rgba(5, 5, 5, 0.5) 100%
+      );
+      animation: ssr-shimmer-dark-search-box 3s linear infinite;
+    }
+    @keyframes ssr-shimmer-dark-search-box {
+      0% {
+        background-position: -290px 0;
+      }
+      100% {
+        background-position: 400px 0;
+      }
+    }
+    .ssr-shimmer-search-box {
+      height: 100%;
+      background-image: linear-gradient(
+        to right,
+        rgb(255, 255, 255, 0.5) 0%,
+        rgba(200, 200, 200, 0.5) 30%,
+        rgba(220, 220, 220, 0.5) 50%,
+        rgba(255, 255, 255, 0.5) 100%
+      );
+      animation: ssr-shimmer-search-box 3s linear infinite;
+    }
+    @keyframes ssr-shimmer-search-box {
+      0% {
+        background-position: -290px 0;
+      }
+      100% {
+        background-position: 400px 0;
+      }
+    }
+    .ssr-search-box {
+      width: 290px;
+      height: 33.3px;
+      top: 8.5px;
+      left: 100px;
+      border-radius: 8px;
+    }
+
+    .ssr-btn {
+      border-radius: 8px;
+      overflow: hidden;
+      /* box-shadow: 0 4px 8px 0 rgba(0, 0, 0, 0.2), 0 6px 20px 0 rgba(0, 0, 0, 0.19); */
+      color: #606060;
+      /* box-shadow: 0 8px 16px 0 rgba(0, 0, 0, 0.2), 0 10px 30px 0 rgba(0, 0, 0, 0.3); */
+    }
+    .ssr-sub-shimmer-loader {
+      background: linear-gradient(
+          90deg,
+          rgba(190, 190, 190, 0.5) 33%,
+          rgba(150, 150, 150, 0.5) 50%,
+          rgba(190, 190, 190, 0.5) 66%
+        )
+        rgba(220, 220, 220, 0.5);
+      background-size: 300% 100%;
+      animation: ssr-sub-shimmer-l1 1s infinite linear;
+      border-radius: 5px;
+    }
+    @keyframes ssr-sub-shimmer-l1 {
+      0% {
+        background-position: right;
+      }
+    }
+  </style>
+`;

package/src/client/ssr/components/head/DefaultScripts.js

@@ -0,0 +1,3 @@
+SrrComponent = ({ ssrPath }) => html`
+  <script type="text/javascript" src="${ssrPath}dist/validator/validator.min.js"></script>
+`;

package/src/client/ssr/components/head/PwaDefault.js

@@ -0,0 +1,60 @@
+SrrComponent = () => html`<link rel="icon" type="image/x-icon" href="/favicon.ico">
+<link rel="icon" type="image/png" sizes="16x16" href="/favicon-16x16.png">
+<link rel="icon" type="image/png" sizes="32x32" href="/favicon-32x32.png">
+<link rel="icon" type="image/png" sizes="48x48" href="/favicon-48x48.png">
+<link rel="manifest" href="/manifest.webmanifest" crossOrigin="use-credentials">
+<meta name="mobile-web-app-capable" content="yes">
+<meta name="theme-color" content="#fff">
+<meta name="application-name" content="Default">
+<link rel="apple-touch-icon" sizes="57x57" href="/apple-touch-icon-57x57.png">
+<link rel="apple-touch-icon" sizes="60x60" href="/apple-touch-icon-60x60.png">
+<link rel="apple-touch-icon" sizes="72x72" href="/apple-touch-icon-72x72.png">
+<link rel="apple-touch-icon" sizes="76x76" href="/apple-touch-icon-76x76.png">
+<link rel="apple-touch-icon" sizes="114x114" href="/apple-touch-icon-114x114.png">
+<link rel="apple-touch-icon" sizes="120x120" href="/apple-touch-icon-120x120.png">
+<link rel="apple-touch-icon" sizes="144x144" href="/apple-touch-icon-144x144.png">
+<link rel="apple-touch-icon" sizes="152x152" href="/apple-touch-icon-152x152.png">
+<link rel="apple-touch-icon" sizes="167x167" href="/apple-touch-icon-167x167.png">
+<link rel="apple-touch-icon" sizes="180x180" href="/apple-touch-icon-180x180.png">
+<link rel="apple-touch-icon" sizes="1024x1024" href="/apple-touch-icon-1024x1024.png">
+<meta name="apple-mobile-web-app-capable" content="yes">
+<meta name="apple-mobile-web-app-status-bar-style" content="black-translucent">
+<meta name="apple-mobile-web-app-title" content="Default">
+<link rel="apple-touch-startup-image" media="(device-width: 320px) and (device-height: 568px) and (-webkit-device-pixel-ratio: 2) and (orientation: portrait)" href="/apple-touch-startup-image-640x1136.png">
+<link rel="apple-touch-startup-image" media="(device-width: 320px) and (device-height: 568px) and (-webkit-device-pixel-ratio: 2) and (orientation: landscape)" href="/apple-touch-startup-image-1136x640.png">
+<link rel="apple-touch-startup-image" media="(device-width: 375px) and (device-height: 667px) and (-webkit-device-pixel-ratio: 2) and (orientation: portrait)" href="/apple-touch-startup-image-750x1334.png">
+<link rel="apple-touch-startup-image" media="(device-width: 375px) and (device-height: 667px) and (-webkit-device-pixel-ratio: 2) and (orientation: landscape)" href="/apple-touch-startup-image-1334x750.png">
+<link rel="apple-touch-startup-image" media="(device-width: 375px) and (device-height: 812px) and (-webkit-device-pixel-ratio: 3) and (orientation: portrait)" href="/apple-touch-startup-image-1125x2436.png">
+<link rel="apple-touch-startup-image" media="(device-width: 375px) and (device-height: 812px) and (-webkit-device-pixel-ratio: 3) and (orientation: landscape)" href="/apple-touch-startup-image-2436x1125.png">
+<link rel="apple-touch-startup-image" media="(device-width: 390px) and (device-height: 844px) and (-webkit-device-pixel-ratio: 3) and (orientation: portrait)" href="/apple-touch-startup-image-1170x2532.png">
+<link rel="apple-touch-startup-image" media="(device-width: 390px) and (device-height: 844px) and (-webkit-device-pixel-ratio: 3) and (orientation: landscape)" href="/apple-touch-startup-image-2532x1170.png">
+<link rel="apple-touch-startup-image" media="(device-width: 393px) and (device-height: 852px) and (-webkit-device-pixel-ratio: 3) and (orientation: portrait)" href="/apple-touch-startup-image-1179x2556.png">
+<link rel="apple-touch-startup-image" media="(device-width: 393px) and (device-height: 852px) and (-webkit-device-pixel-ratio: 3) and (orientation: landscape)" href="/apple-touch-startup-image-2556x1179.png">
+<link rel="apple-touch-startup-image" media="(device-width: 414px) and (device-height: 896px) and (-webkit-device-pixel-ratio: 2) and (orientation: portrait)" href="/apple-touch-startup-image-828x1792.png">
+<link rel="apple-touch-startup-image" media="(device-width: 414px) and (device-height: 896px) and (-webkit-device-pixel-ratio: 2) and (orientation: landscape)" href="/apple-touch-startup-image-1792x828.png">
+<link rel="apple-touch-startup-image" media="(device-width: 414px) and (device-height: 896px) and (-webkit-device-pixel-ratio: 3) and (orientation: portrait)" href="/apple-touch-startup-image-1242x2688.png">
+<link rel="apple-touch-startup-image" media="(device-width: 414px) and (device-height: 896px) and (-webkit-device-pixel-ratio: 3) and (orientation: landscape)" href="/apple-touch-startup-image-2688x1242.png">
+<link rel="apple-touch-startup-image" media="(device-width: 414px) and (device-height: 736px) and (-webkit-device-pixel-ratio: 3) and (orientation: portrait)" href="/apple-touch-startup-image-1242x2208.png">
+<link rel="apple-touch-startup-image" media="(device-width: 414px) and (device-height: 736px) and (-webkit-device-pixel-ratio: 3) and (orientation: landscape)" href="/apple-touch-startup-image-2208x1242.png">
+<link rel="apple-touch-startup-image" media="(device-width: 428px) and (device-height: 926px) and (-webkit-device-pixel-ratio: 3) and (orientation: portrait)" href="/apple-touch-startup-image-1284x2778.png">
+<link rel="apple-touch-startup-image" media="(device-width: 428px) and (device-height: 926px) and (-webkit-device-pixel-ratio: 3) and (orientation: landscape)" href="/apple-touch-startup-image-2778x1284.png">
+<link rel="apple-touch-startup-image" media="(device-width: 430px) and (device-height: 932px) and (-webkit-device-pixel-ratio: 3) and (orientation: portrait)" href="/apple-touch-startup-image-1290x2796.png">
+<link rel="apple-touch-startup-image" media="(device-width: 430px) and (device-height: 932px) and (-webkit-device-pixel-ratio: 3) and (orientation: landscape)" href="/apple-touch-startup-image-2796x1290.png">
+<link rel="apple-touch-startup-image" media="(device-width: 744px) and (device-height: 1133px) and (-webkit-device-pixel-ratio: 2) and (orientation: portrait)" href="/apple-touch-startup-image-1488x2266.png">
+<link rel="apple-touch-startup-image" media="(device-width: 744px) and (device-height: 1133px) and (-webkit-device-pixel-ratio: 2) and (orientation: landscape)" href="/apple-touch-startup-image-2266x1488.png">
+<link rel="apple-touch-startup-image" media="(device-width: 768px) and (device-height: 1024px) and (-webkit-device-pixel-ratio: 2) and (orientation: portrait)" href="/apple-touch-startup-image-1536x2048.png">
+<link rel="apple-touch-startup-image" media="(device-width: 768px) and (device-height: 1024px) and (-webkit-device-pixel-ratio: 2) and (orientation: landscape)" href="/apple-touch-startup-image-2048x1536.png">
+<link rel="apple-touch-startup-image" media="(device-width: 810px) and (device-height: 1080px) and (-webkit-device-pixel-ratio: 2) and (orientation: portrait)" href="/apple-touch-startup-image-1620x2160.png">
+<link rel="apple-touch-startup-image" media="(device-width: 810px) and (device-height: 1080px) and (-webkit-device-pixel-ratio: 2) and (orientation: landscape)" href="/apple-touch-startup-image-2160x1620.png">
+<link rel="apple-touch-startup-image" media="(device-width: 820px) and (device-height: 1080px) and (-webkit-device-pixel-ratio: 2) and (orientation: portrait)" href="/apple-touch-startup-image-1640x2160.png">
+<link rel="apple-touch-startup-image" media="(device-width: 820px) and (device-height: 1080px) and (-webkit-device-pixel-ratio: 2) and (orientation: landscape)" href="/apple-touch-startup-image-2160x1640.png">
+<link rel="apple-touch-startup-image" media="(device-width: 834px) and (device-height: 1194px) and (-webkit-device-pixel-ratio: 2) and (orientation: portrait)" href="/apple-touch-startup-image-1668x2388.png">
+<link rel="apple-touch-startup-image" media="(device-width: 834px) and (device-height: 1194px) and (-webkit-device-pixel-ratio: 2) and (orientation: landscape)" href="/apple-touch-startup-image-2388x1668.png">
+<link rel="apple-touch-startup-image" media="(device-width: 834px) and (device-height: 1112px) and (-webkit-device-pixel-ratio: 2) and (orientation: portrait)" href="/apple-touch-startup-image-1668x2224.png">
+<link rel="apple-touch-startup-image" media="(device-width: 834px) and (device-height: 1112px) and (-webkit-device-pixel-ratio: 2) and (orientation: landscape)" href="/apple-touch-startup-image-2224x1668.png">
+<link rel="apple-touch-startup-image" media="(device-width: 1024px) and (device-height: 1366px) and (-webkit-device-pixel-ratio: 2) and (orientation: portrait)" href="/apple-touch-startup-image-2048x2732.png">
+<link rel="apple-touch-startup-image" media="(device-width: 1024px) and (device-height: 1366px) and (-webkit-device-pixel-ratio: 2) and (orientation: landscape)" href="/apple-touch-startup-image-2732x2048.png">
+<meta name="msapplication-TileColor" content="#fff">
+<meta name="msapplication-TileImage" content="/mstile-144x144.png">
+<meta name="msapplication-config" content="/browserconfig.xml">
+<link rel="yandex-tableau-widget" href="/yandex-browser-manifest.json">`;

package/src/client/ssr/offline/default.index.js

@@ -0,0 +1,31 @@
+import { htmls, loggerFactory } from '../common/SsrCore.js';
+import { Alert } from '../common/Alert.js';
+import { Translate } from '../common/Translate.js';
+import { Worker } from '../common/Worker.js';
+/*imports*/
+
+const logger = loggerFactory({ url: '/offline.js' });
+
+window.onload = () =>
+  Worker.instance({
+    render: async () => {
+      window.ononline = async () => {
+        location.href = '/';
+      };
+      window.onoffline = async () => {
+        htmls(`.page-render`, html`${await Alert.noInternet({ Translate })}`);
+      };
+      try {
+        if (navigator.onLine) {
+          const maintenance = await fetch(location.origin + '/favicon.ico');
+          if (maintenance.status !== 200) {
+            htmls(`.page-render`, html`${await Alert.maintenance({ Translate })}`);
+          } else window.ononline();
+        }
+        throw new Error(`no internet connection`);
+      } catch (error) {
+        logger.error(error);
+        window.onoffline();
+      }
+    },
+  });

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

@@ -0,0 +1,12 @@
+import { e404 } from '../common/Alert.js';
+import { append } from '../common/SsrCore.js';
+import { Translate } from '../common/Translate.js';
+import { Worker } from '../common/Worker.js';
+/*imports*/
+
+window.onload = () =>
+  Worker.instance({
+    render: async () => {
+      append('.page-render', await e404({ Translate }));
+    },
+  });

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

@@ -0,0 +1,12 @@
+import { e500 } from '../common/Alert.js';
+import { append } from '../common/SsrCore.js';
+import { Translate } from '../common/Translate.js';
+import { Worker } from '../common/Worker.js';
+/*imports*/
+
+window.onload = () =>
+  Worker.instance({
+    render: async () => {
+      append('.page-render', await e500({ Translate }));
+    },
+  });