1.0.75

fix(core): update
1.0.74
2023-10-06 17:43:15 +02:00 · 2023-10-06 17:43:14 +02:00 · 2023-10-06 17:42:41 +02:00 · 2023-10-06 17:42:41 +02:00 · 2023-10-06 16:31:50 +02:00 · 2023-10-06 16:31:49 +02:00
17 changed files with 3505 additions and 10844 deletions
--- a/.gitlab-ci.yml
+++ b/.gitlab-ci.yml
@ -1,137 +0,0 @@
-# gitzone ci_default
-image: registry.gitlab.com/hosttoday/ht-docker-node:npmci
-
-cache:
-  paths:
-    - .npmci_cache/
-  key: '$CI_BUILD_STAGE'
-
-stages:
-  - security
-  - test
-  - release
-  - metadata
-
-# ====================
-# security stage
-# ====================
-mirror:
-  stage: security
-  script:
-    - npmci git mirror
-  only:
-    - tags
-  tags:
-    - lossless
-    - docker
-    - notpriv
-
-auditProductionDependencies:
-  image: registry.gitlab.com/hosttoday/ht-docker-node:npmci
-  stage: security
-  script:
-    - npmci npm prepare
-    - npmci command npm install --production --ignore-scripts
-    - npmci command npm config set registry https://registry.npmjs.org
-    - npmci command npm audit --audit-level=high --only=prod --production
-  tags:
-    - docker
-
-auditDevDependencies:
-  image: registry.gitlab.com/hosttoday/ht-docker-node:npmci
-  stage: security
-  script:
-    - npmci npm prepare
-    - npmci command npm install --ignore-scripts
-    - npmci command npm config set registry https://registry.npmjs.org
-    - npmci command npm audit --audit-level=high --only=dev
-  tags:
-    - docker
-  allow_failure: true
-
-# ====================
-# test stage
-# ====================
-
-testStable:
-  stage: test
-  script:
-    - npmci npm prepare
-    - npmci node install stable
-    - npmci npm install
-    - npmci npm test
-  coverage: /\d+.?\d+?\%\s*coverage/
-  tags:
-    - docker
-
-testBuild:
-  stage: test
-  script:
-    - npmci npm prepare
-    - npmci node install stable
-    - npmci npm install
-    - npmci command npm run build
-  coverage: /\d+.?\d+?\%\s*coverage/
-  tags:
-    - docker
-
-release:
-  stage: release
-  script:
-    - npmci node install stable
-    - npmci npm publish
-  only:
-    - tags
-  tags:
-    - lossless
-    - docker
-    - notpriv
-
-# ====================
-# metadata stage
-# ====================
-codequality:
-  stage: metadata
-  allow_failure: true
-  only:
-    - tags
-  script:
-    - npmci command npm install -g tslint typescript
-    - npmci npm prepare
-    - npmci npm install
-    - npmci command "tslint -c tslint.json ./ts/**/*.ts"
-  tags:
-    - lossless
-    - docker
-    - priv
-
-trigger:
-  stage: metadata
-  script:
-    - npmci trigger
-  only:
-    - tags
-  tags:
-    - lossless
-    - docker
-    - notpriv
-
-pages:
-  stage: metadata
-  script:
-    - npmci node install lts
-    - npmci command npm install -g @gitzone/tsdoc
-    - npmci npm prepare
-    - npmci npm install
-    - npmci command tsdoc
-  tags:
-    - lossless
-    - docker
-    - notpriv
-  only:
-    - tags
-  artifacts:
-    expire_in: 1 week
-    paths:
-      - public
-  allow_failure: true
--- a/.vscode/launch.json
+++ b/.vscode/launch.json
@ -2,28 +2,10 @@
  "version": "0.2.0",
  "configurations": [
    {
-      "name": "current file",
-      "type": "node",
+      "command": "npm test",
+      "name": "Run npm test",
      "request": "launch",
-      "args": [
-        "${relativeFile}"
-      ],
-      "runtimeArgs": ["-r", "@gitzone/tsrun"],
-      "cwd": "${workspaceRoot}",
-      "protocol": "inspector",
-      "internalConsoleOptions": "openOnSessionStart"
-    },
-    {
-      "name": "test.ts",
-      "type": "node",
-      "request": "launch",
-      "args": [
-        "test/test.ts"
-      ],
-      "runtimeArgs": ["-r", "@gitzone/tsrun"],
-      "cwd": "${workspaceRoot}",
-      "protocol": "inspector",
-      "internalConsoleOptions": "openOnSessionStart"
+      "type": "node-terminal"
    }
  ]
 }
--- a/html/index.html
+++ b/html/index.html
@ -1,5 +1,5 @@
 <!--gitzone element-->
-<!-- made by Lossless GmbH -->
+<!-- made by Task Venture Capital GmbH -->
 <!-- checkout https://maintainedby.lossless.com for awesome OpenSource projects -->
 <html lang="en">
  <head>
@ -10,6 +10,10 @@
    />
    <meta http-equiv="Content-Type" content="text/html; charset=utf-8" />

+    <!--Lets load standard fonts-->
+    <link rel="preconnect" href="https://assetbroker.lossless.one/" crossorigin>
+    <link rel="stylesheet" href="https://assetbroker.lossless.one/fonts/fonts.css">
+
    <style>
      body {
        margin: 0px;
@ -17,7 +21,7 @@
      }
    </style>

-    <script src="./index.ts"></script>
+    <script type="module" src="/bundle.js"></script>
  </head>
  <body>
  </body>
--- a/html/index.ts
+++ b/html/index.ts
@ -1,10 +1,10 @@
 // dees tools
-import * as deesWccTools from '@designestate/dees-wcctools';
-import * as deesDomTools from '@designestate/dees-domtools';
+import * as deesWccTools from '@design.estate/dees-wcctools';
+import * as deesDomTools from '@design.estate/dees-domtools';

 // elements and pages
-import * as elements from '../ts_web/elements';
-import * as pages from '../ts_web/pages';
+import * as elements from '../ts_web/elements/index.js';
+import * as pages from '../ts_web/pages/index.js';

 deesWccTools.setupWccTools(elements as any, pages);
 deesDomTools.elementBasic.setup();
--- a/npmextra.json
+++ b/npmextra.json
@ -5,7 +5,7 @@
      "githost": "gitlab.com",
      "gitscope": "uptimelink",
      "gitrepo": "webwidget",
-      "shortDescription": "the webwidget for public use of uptimelink",
+      "description": "the webwidget for public use of uptimelink",
      "npmPackagename": "@uptimelink/webwidget",
      "license": "UNLICENSED",
      "projectDomain": "uptime.link"
--- a/package-lock.json
+++ b/package-lock.json
--- a/package.json
+++ b/package.json
@ -1,31 +1,29 @@
 {
-  "name": "@uptimelink/webwidget",
-  "version": "1.0.61",
+  "name": "@uptime.link/webwidget",
+  "version": "1.0.75",
  "private": false,
  "description": "the webwidget for public use of uptimelink",
  "main": "dist_ts_web/index.js",
  "typings": "dist_ts_web/index.d.ts",
+  "type": "module",
  "scripts": {
    "test": "npm run build",
-    "build": "tsbuild element && tsbundle element --production",
+    "build": "tsbuild element --allowimplicitany && tsbundle element --production",
    "watch": "tswatch element"
  },
  "author": "Lossless GmbH",
  "license": "UNLICENSED",
  "dependencies": {
-    "@designestate/dees-domtools": "^1.0.74",
-    "@designestate/dees-element": "^1.0.6",
-    "@designestate/dees-wcctools": "^1.0.47",
-    "@gitzone/tsrun": "^1.2.12",
-    "typescript": "^4.1.2"
+    "@design.estate/dees-domtools": "^2.0.1",
+    "@design.estate/dees-element": "^2.0.4",
+    "@design.estate/dees-wcctools": "^1.0.73"
  },
  "devDependencies": {
-    "@gitzone/tsbuild": "^2.1.24",
-    "@gitzone/tsbundle": "^1.0.72",
-    "@gitzone/tswatch": "^1.0.50",
-    "@pushrocks/projectinfo": "^4.0.5",
-    "tslint": "^6.1.3",
-    "tslint-config-prettier": "^1.17.0"
+    "@git.zone/tsbuild": "^2.1.61",
+    "@git.zone/tsbundle": "^2.0.10",
+    "@git.zone/tsrun": "^1.2.32",
+    "@git.zone/tswatch": "^2.0.13",
+    "@push.rocks/projectinfo": "^5.0.2"
  },
  "files": [
    "ts/**/*",
--- a/pnpm-lock.yaml
+++ b/pnpm-lock.yaml
--- a/ts_web/00_commitinfo_data.ts
+++ b/ts_web/00_commitinfo_data.ts
@ -0,0 +1,8 @@
+/**
+ * autocreated commitinfo by @pushrocks/commitinfo
+ */
+export const commitinfo = {
+  name: '@uptime.link/webwidget',
+  version: '1.0.75',
+  description: 'the webwidget for public use of uptimelink'
+}
--- a/ts_web/elements/index.ts
+++ b/ts_web/elements/index.ts
@ -1 +1 @@
-export * from './uptimelink-webwidget';
+export * from './uptimelink-webwidget.js';
--- a/ts_web/elements/uptimelink
+++ b/ts_web/elements/uptimelink
--- a/ts_web/elements/uptimelink-webwidget.ts
+++ b/ts_web/elements/uptimelink-webwidget.ts
@ -1,5 +1,12 @@
-import { DeesElement, property, html, customElement, TemplateResult } from '@designestate/dees-element';
-import * as domtools from '@designestate/dees-domtools';
+import { DeesElement, property, html, customElement, type TemplateResult, cssManager } from '@design.estate/dees-element';
+
+import { UptimelinkWindowLayer } from './uptimelink-windowlayer.js';
+
+declare global {
+  interface HTMLElementTagNameMap {
+    'uptimelink-webwidget': UptimelinkWebwidget;
+  }
+}

@customElement('uptimelink-webwidget')
 export class UptimelinkWebwidget extends DeesElement {
@ -7,39 +14,71 @@ export class UptimelinkWebwidget extends DeesElement {
    <uptimelink-webwidget projectSlug="uptime.link"></uptimelink-webwidget>
  `;

+  @property({
+    type: Boolean
+  })
+  isOnTop = false;
+
  @property()
  public projectSlug: string;

+  @property()
+  public isFocused = false;
+
+  @property()
+  public isElevated = false;
+
+  @property()
+  public showExpanded: boolean = false;
+
  constructor() {
    super();
-    domtools.DomTools.setupDomTools();
+    this.setupEventing();
  }

+  public static styles = [
+    cssManager.defaultStyles,
+  ]
+
  public render(): TemplateResult {
    return html`
-      ${domtools.elementBasic.styles}
      <style>
        :host {
+          position: relative;
          display: block;
+          height: 30px;
+          z-index: ${this.isElevated ? '1000' : 'auto'} ;
        }
        .mainbox {
+          position: relative;
          line-height: 1em;
          margin: auto;
-          display: grid;
-          grid-template-columns: 26px auto;
          font-family: Roboto;
-          font-weight: 400;
-          font-size: 13px;
+          font-weight: 540;
+          font-size: 12px;
          box-sizing: border-box;
          width: 150px;
-          border-radius: 20px;
+          border-radius: 15px;
          height: 30px;
          background: ${this.goBright ? '#fff' : '#222' };
          box-shadow: ${this.goBright ? '0px 0px 5px rgba(0,0,0,0.1)' : ''};
          padding: 5px;
          color: ${this.goBright ? '#333' : '#CCC' };
          cursor: pointer;
+          transition: all 0.2s;
+          overflow: hidden;
        }
+
+        .firstLine {
+          display: grid;
+          grid-template-columns: 26px auto;
+        }
+
+        .mainbox.focused {
+          width: 182px;
+          height: 117px;
+        }
+
        .statusindicator {
          height: 20px;
          width: 20px;
@ -47,13 +86,141 @@ export class UptimelinkWebwidget extends DeesElement {
          border-radius: 10px;
        }
        .statustext {
-          padding-top: 3px;
+          line-height: 20px;
+        }
+
+        .expanded {
+          opacity: 0;
+          transition: opacity 0.2s;
+        }
+
+        .miniHeading {
+          position: absolute;
+          width: 190px;
+          top: 25px;
+          left: 5px;
+          margin-top: 10px;
+          font-size: 12px;
+        }
+
+        .miniOverview24h {
+          position: absolute;
+          top: 55px;
+          left: 5px;
+          background: ${this.goBright ? 'rgba(0,0,0,0.07)' : 'rgba(255,255,255,0.07)'};
+          border-radius: 3px;
+          width: 172px;
+          height: 30px;
+          display: grid;
+          padding: 3px 3px;
+          grid-template-columns: repeat(30, 4px);
+          grid-column-gap: 3px;
+        }
+
+        .miniOverview24h .statusBar {
+          background: ${this.goBright ? 'rgba(0,0,0,0.15)' : 'rgba(255,255,255,0.15)'};
+          border-radius: 10px;
+        }
+
+        .miniOverview24h .statusBar.ok {
+          background:  #66BB6A;
+        }
+
+        .viewStatuspage {
+          position: absolute;
+          width: 172px;
+          top: 80px;
+          left: 5px;
+          text-align: center;
+          background: ${this.goBright ? 'rgba(0,0,0,0.07)' : 'rgba(255,255,255,0.07)'};
+          border-radius: 3px 3px 10px 10px;
+          padding: 5px;
+          margin-top: 10px;
+          transition: background 0.1s;
+        }
+
+        .viewStatuspage:hover {
+          background: ${this.goBright ? 'rgba(0,0,0,0.1)' : 'rgba(255,255,255,0.1)'};
        }
      </style>
-      <div class="mainbox">
-        <div class="statusindicator"></div>
-        <div class="statustext">All systems are up!</div>
+      <div class="mainbox ${this.isFocused ? 'focused' : null}">
+        <div class="firstLine">
+          <div class="statusindicator"></div>
+          <div class="statustext">All systems are up!</div>
+        </div>
+        ${this.showExpanded ? html`
+          <div class="expanded">
+            <div class="miniHeading">
+              last 24 hours:
+            </div>
+            <div class="miniOverview24h">
+              ${(() => {
+                let counter = 0;
+                const returnArray = [];
+                while(counter < 24) {
+                  returnArray.push(html`<div class="statusBar ok"></div>`)
+                  counter++;
+                };
+                return returnArray;
+              })()}
+            </div>
+            <div class="viewStatuspage">View full Statuspage ...</div>
+          </div>
+        ` : null}
      </div>
    `;
  }
+
+  public windowLayer: UptimelinkWindowLayer;
+  private async setupEventing() {
+    const domtools = await this.domtoolsPromise;
+    await this.updateComplete;
+    const mainbox: HTMLDivElement = this.shadowRoot.querySelector('.mainbox');
+    mainbox.onmouseenter = async () => {
+      if (!this.isOnTop) {
+        const mainbox = this.shadowRoot.querySelector('.mainbox') as HTMLElement;
+        const rect = mainbox.getBoundingClientRect();
+        const uptimelinkWidget = new UptimelinkWebwidget();
+        uptimelinkWidget.isOnTop = true;
+        uptimelinkWidget.style.position = 'fixed';
+        uptimelinkWidget.style.top = `${rect.top}px`;
+        uptimelinkWidget.style.left = `${rect.left}px`;
+        document.body.append(uptimelinkWidget);
+        return;
+      }
+      this.isElevated = true;
+      this.isFocused = true;
+      this.windowLayer = await UptimelinkWindowLayer.createAndShow({
+        blur: true,
+      });
+      await domtools.convenience.smartdelay.delayFor(200);
+      if (!this.isFocused) {
+        return;
+      }
+      this.showExpanded = true;
+      await this.performUpdate();
+      await (await this.domtoolsPromise).convenience.smartdelay.delayFor(50);
+      const expandedDiv = this.shadowRoot.querySelector('.expanded') as HTMLElement;
+      expandedDiv.style.opacity = '1';
+    };
+    mainbox.onmouseleave = async () => {
+      if (!this.isOnTop) {
+        return;
+      }
+      this.windowLayer.destroy();
+      domtools.convenience.smartdelay.delayFor(200).then(() => {
+        if (!this.isFocused) {
+          this.isElevated = false;
+          this.remove();
+        }
+      });
+      if (!this.showExpanded) {
+        this.isFocused = false;
+        return;
+      }
+      this.showExpanded = false;
+      await domtools.convenience.smartdelay.delayFor(50);
+      this.isFocused = false;
+    }
+  }
 }
--- a/ts_web/elements/uptimelink-windowlayer.ts
+++ b/ts_web/elements/uptimelink-windowlayer.ts
@ -0,0 +1,113 @@
+import { customElement, DeesElement, type TemplateResult, html, property, type CSSResult, state, } from '@design.estate/dees-element';
+
+import * as domtools from '@design.estate/dees-domtools';
+
+declare global {
+  interface HTMLElementTagNameMap {
+    'uptimelink-windowlayer': UptimelinkWindowLayer;
+  }
+}
+
+export interface IOptions_UptimeLinkWindowLayer {
+  blur: boolean;
+}
+
+@customElement('dees-windowlayer')
+export class UptimelinkWindowLayer extends DeesElement {
+  // STATIC
+  public static demo = () => html`<uptimelink-windowlayer></uptimelink-windowlayer>`;
+
+  public static async createAndShow(optionsArg?: IOptions_UptimeLinkWindowLayer) {
+    const domtoolsInstance = domtools.DomTools.getGlobalDomToolsSync();
+    const windowLayer = new UptimelinkWindowLayer();
+    windowLayer.options = {
+      ...windowLayer.options,
+      ...optionsArg,
+    }
+    document.body.append(windowLayer);
+    await domtoolsInstance.convenience.smartdelay.delayFor(0);
+    windowLayer.show();
+    return windowLayer;
+  }
+
+  @state()
+  public options: IOptions_UptimeLinkWindowLayer = {
+    blur: false
+  };
+
+  // INSTANCE
+  @property({
+    type: Boolean
+  })
+  public visible = false;
+
+  constructor() {
+    super();
+    domtools.elementBasic.setup();
+  }
+
+  public render(): TemplateResult {
+    return html`
+      ${domtools.elementBasic.styles}
+      <style>
+        .windowOverlay {
+          transition: all 0.2s;
+          will-change: transform;
+          position: fixed;
+          top: 0px;
+          left: 0px;
+          height: 100vh;
+          width: 100vw;
+          display: flex;
+          justify-content: center;
+          align-items: center;
+          background: rgba(0, 0, 0, 0.0);
+          backdrop-filter: brightness(1) ${this.options.blur ? 'blur(0px)' : ''};
+          pointer-events: none;
+          z-index: 200;
+        }
+        
+        .visible {
+          background: rgba(0, 0, 0, 0.2);
+          backdrop-filter: brightness(0.9) ${this.options.blur ? 'blur(2px)' : ''};
+        }
+      </style>
+      <div @click=${this.dispatchClicked} class="windowOverlay ${this.visible ? 'visible' : null}">
+        <slot></slot>
+      </div>
+    `;
+  }
+
+  firstUpdated() {
+    setTimeout(() => {
+      this.visible = true;
+    }, 100);
+  }
+
+  dispatchClicked() {
+    this.dispatchEvent(new CustomEvent('clicked'));
+  }
+
+  public toggleVisibility () {
+    this.visible = !this.visible;
+  }
+
+  public async show() {
+    const domtools = await this.domtoolsPromise;
+    await domtools.convenience.smartdelay.delayFor(0);
+    this.visible = true;
+  }
+
+  public async hide() {
+    const domtools = await this.domtoolsPromise;
+    await domtools.convenience.smartdelay.delayFor(0);
+    this.visible = false;
+  }
+
+  public async destroy() {
+    const domtools = await this.domtoolsPromise;
+    await this.hide();
+    await domtools.convenience.smartdelay.delayFor(300);
+    this.remove();
+  }
+}
--- a/ts_web/index.ts
+++ b/ts_web/index.ts
@ -1 +1 @@
-export * from './elements/index';
+export * from './elements/index.js';
--- a/ts_web/tsconfig.json
+++ b/ts_web/tsconfig.json
@ -1,16 +0,0 @@
-{
-  "compilerOptions": {
-    "target": "es2017",
-    "module": "es2015",
-    "moduleResolution": "node",
-    "lib": ["es2017", "dom"],
-    "declaration": true,
-    "inlineSources": true,
-    "inlineSourceMap": true,
-    "noUnusedLocals": true,
-    "noFallthroughCasesInSwitch": true,
-    "outDir": "dist/",
-    "skipLibCheck": true,
-    "experimentalDecorators": true
-  }
-}
--- a/tsconfig.json
+++ b/tsconfig.json
@ -0,0 +1,14 @@
+{
+  "compilerOptions": {
+    "experimentalDecorators": true,
+    "useDefineForClassFields": false,
+    "target": "ES2022",
+    "module": "NodeNext",
+    "moduleResolution": "NodeNext",
+    "esModuleInterop": true,
+    "verbatimModuleSyntax": true
+  },
+  "exclude": [
+    "dist_*/**/*.d.ts"
+  ]
+}
--- a/tslint.json
+++ b/tslint.json
@ -1,17 +0,0 @@
-{
-  "extends": ["tslint:latest", "tslint-config-prettier"],
-  "rules": {
-    "semicolon": [true, "always"],
-    "no-console": false,
-    "ordered-imports": false,
-    "object-literal-sort-keys": false,
-    "member-ordering": {
-      "options":{
-        "order": [
-          "static-method"
-        ]
-      }
-    }
-  },
-  "defaultSeverity": "warning"
-}
Author	SHA1	Message	Date
Philipp Kunz	326fed9bb5	1.0.75	2023-10-06 17:43:15 +02:00
Philipp Kunz	ae9f65e9f5	fix(core): update	2023-10-06 17:43:14 +02:00
Philipp Kunz	4d5e2f824a	1.0.74	2023-10-06 17:42:41 +02:00
Philipp Kunz	3aeb16f0a3	fix(core): update	2023-10-06 17:42:41 +02:00
Philipp Kunz	2a5792e3b4	1.0.73	2023-10-06 16:31:50 +02:00
Philipp Kunz	10d59a6947	fix(core): update	2023-10-06 16:31:49 +02:00
Philipp Kunz	af23ed0ad2	1.0.72	2023-10-06 16:26:35 +02:00
Philipp Kunz	fe6cd43047	fix(core): update	2023-10-06 16:26:34 +02:00
Philipp Kunz	d7830def2d	1.0.71	2023-10-06 16:25:58 +02:00
Philipp Kunz	7f14fc3790	fix(core): update	2023-10-06 16:25:57 +02:00
Philipp Kunz	35aea33703	1.0.70	2023-10-06 13:58:04 +02:00
Philipp Kunz	0c4f2773cf	fix(core): update	2023-10-06 13:58:03 +02:00
Philipp Kunz	2e24d99f56	1.0.69	2022-03-25 02:09:27 +01:00
Philipp Kunz	d5a2d4b83e	fix(core): update	2022-03-25 02:09:27 +01:00
Philipp Kunz	581a046997	1.0.68	2022-03-25 02:07:08 +01:00
Philipp Kunz	ee168a8ebc	fix(core): update	2022-03-25 02:07:07 +01:00
Phil Kunz	a955240dd2	1.0.67	2021-03-09 20:47:00 +00:00
Phil Kunz	29900c458b	fix(core): update	2021-03-09 20:47:00 +00:00
Phil Kunz	2ef19ab203	1.0.66	2021-03-09 13:54:01 +00:00
Phil Kunz	bcea796d69	fix(core): update	2021-03-09 13:54:01 +00:00
Phil Kunz	1fc79c3ba2	1.0.65	2021-03-09 13:41:17 +00:00
Phil Kunz	cafe63348b	fix(core): update	2021-03-09 13:41:16 +00:00
Phil Kunz	830eab2b18	1.0.64	2021-03-08 23:58:57 +00:00
Phil Kunz	89bd6259df	fix(core): update	2021-03-08 23:58:57 +00:00
Phil Kunz	d8ee065e25	1.0.63	2021-03-08 23:27:51 +00:00
Phil Kunz	058384e0a0	fix(core): update	2021-03-08 23:27:50 +00:00
Phil Kunz	b637f4e53a	1.0.62	2021-03-08 23:11:57 +00:00
Phil Kunz	0122b2dd20	fix(core): update	2021-03-08 23:11:56 +00:00