@things-factory/system 6.2.42

package/CHANGELOG.md

@@ -0,0 +1,8 @@
+# Changelog
+
+All notable changes to this project will be documented in this file.
+
+The format is based on [Keep a Changelog](http://keepachangelog.com/en/1.0.0/)
+and adheres to [Semantic Versioning](http://semver.org/spec/v2.0.0.html).
+
+<!-- ## [Unreleased] -->

package/client/bootstrap.ts

@@ -0,0 +1,23 @@
+import '@material/mwc-icon'
+import '@operato/i18n/ox-i18n.js'
+
+import { html } from 'lit'
+
+import { TOOL_POSITION } from '@operato/layout'
+import { navigate, store } from '@operato/shell'
+import { ADD_MORENDA } from '@things-factory/more-base'
+
+export default function bootstrap() {
+  /* add user profile morenda */
+  store.dispatch({
+    type: ADD_MORENDA,
+    morenda: {
+      icon: html` <mwc-icon>info</mwc-icon> `,
+      name: html` <ox-i18n msgid="label.about-system"></ox-i18n> `,
+      position: TOOL_POSITION.REAR_END,
+      action: () => {
+        navigate('system')
+      }
+    }
+  })
+}

package/client/index.ts

@@ -0,0 +1 @@
+export * from './viewparts/release-note-setting-let'

package/client/pages/system-info.ts

@@ -0,0 +1,172 @@
+import '@material/mwc-button'
+import '@operato/i18n/ox-i18n.js'
+import '../viewparts/opensource-license'
+import '../viewparts/license-info'
+
+import { css, html } from 'lit'
+import { customElement } from 'lit/decorators.js'
+
+import { openHelp } from '@operato/help'
+import { i18next, localize } from '@operato/i18n'
+import { openPopup } from '@operato/layout'
+import { PageView } from '@operato/shell'
+
+const ENV = process.env
+
+@customElement('system-info')
+export class SystemInfo extends localize(i18next)(PageView) {
+  static styles = css`
+    :host {
+      display: block;
+      position: relative;
+      text-align: center;
+
+      background-color: var(--system-info-background-color);
+      padding: var(--system-info-content-padding);
+      color: var(--system-info-color);
+      font: var(--system-info-font);
+    }
+    :host * {
+      vertical-align: middle;
+    }
+    #refresh-button {
+      border-radius: var(--border-radius);
+      border: 1px solid rgba(0, 0, 0, 0.1);
+    }
+    div {
+      padding: 10px;
+    }
+    strong {
+      font: var(--system-info-appname-font);
+      color: var(--system-info-appname-color);
+    }
+    span {
+      display: block;
+    }
+    span.description {
+      padding: 3px 10px;
+      font: var(--system-info-description-font);
+      color: var(--system-info-description-color);
+    }
+    span.version {
+      display: inline-block;
+      border-radius: 5px;
+      opacity: 0.8;
+      background-color: var(--system-info-version-background-color);
+      padding: 3px 10px;
+      font: var(--system-info-version-font);
+      color: var(--system-info-version-color);
+    }
+    .poweredBy {
+      background-color: #efefef;
+      position: absolute;
+      border-top: 1px solid rgba(0, 0, 0, 0.1);
+      padding: 7px 0;
+      width: 100%;
+      bottom: 0;
+      text-align: center;
+    }
+    .poweredBy mwc-icon {
+      opacity: var(--help-icon-opacity, 0.4);
+      font-size: var(--help-icon-size, 18px);
+      color: var(--help-icon-color);
+    }
+    .poweredBy mwc-icon:hover {
+      cursor: help;
+      opacity: var(--help-icon-hover-opacity, 1);
+      color: var(--help-icon-hover-color);
+    }
+  `
+
+  private _applicationMeta?: { icon?: string; title: string; description: string; copyright: string }
+
+  get context() {
+    return {
+      title: i18next.t('label.about-system')
+    }
+  }
+
+  get applicationMeta() {
+    if (!this._applicationMeta) {
+      var iconLink = document.querySelector('link[rel="application-icon"]') as HTMLLinkElement
+      var titleMeta = document.querySelector('meta[name="application-name"]') as HTMLMetaElement
+      var descriptionMeta = document.querySelector('meta[name="application-description"]') as HTMLMetaElement
+      var copyrightMeta = document.querySelector('meta[name="application-copyright"]') as HTMLMetaElement
+
+      this._applicationMeta = {
+        icon: iconLink?.href,
+        title: titleMeta ? titleMeta.content : 'Things Factory',
+        description: descriptionMeta ? descriptionMeta.content : 'Reimagining Software',
+        copyright: copyrightMeta ? copyrightMeta.content : 'Copyright © hatiolab.com. All Rights Reserved." />'
+      }
+    }
+
+    return this._applicationMeta
+  }
+
+  render() {
+    var { icon, title, description, copyright } = this.applicationMeta
+
+    return html`
+      <img src=${icon!} alt="system logo" />
+
+      <div>
+        <strong>${title}</strong>
+        <span class="description">${description}</span>
+        <span class="version"
+          ><ox-i18n msgid="field.version"></ox-i18n> : ${ENV['APP-VERSION']}-${ENV['NODE-ENV']}</span
+        >
+      </div>
+
+      <div>
+        <mwc-button
+          id="refresh-button"
+          icon="refresh"
+          label=${String(i18next.t('label.system reload'))}
+          @click=${e => {
+            location.reload()
+          }}
+        ></mwc-button>
+      </div>
+
+      <div>
+        <span>${copyright}</span>
+
+        <span
+          >${title} is built on several
+          <a href="#" @click=${e => this.onClickOpenSourceLicense(e)}>open source software</a></span
+        >
+        <span>We are using the <a href="#" @click=${e => this.onClickLicenseInfo(e)}>license</a> as permitted. </span>
+      </div>
+
+      <div class="poweredBy">
+        <span
+          >Powered by &trade;Things Factory <ox-i18n msgid="field.version"></ox-i18n> ${ENV['SHELL-VERSION']}
+          <mwc-icon @click=${e => openHelp('about/things-factory')}>help</mwc-icon>
+        </span>
+      </div>
+    `
+  }
+
+  onClickOpenSourceLicense(e) {
+    e.preventDefault()
+    e.stopPropagation()
+
+    openPopup(html` <opensource-license></opensource-license> `, {
+      backdrop: true,
+      size: 'large',
+      title: 'Open Source Licenses'
+    })
+  }
+
+  onClickLicenseInfo(e) {
+    e.preventDefault()
+    e.stopPropagation()
+
+    openPopup(html` <license-info></license-info> `, {
+      backdrop: true,
+      size: 'large',
+      title: 'License Info'
+    })
+  }
+}

package/client/route.ts

@@ -0,0 +1,7 @@
+export default function route(page) {
+  switch (page) {
+    case 'system':
+      import('./pages/system-info')
+      return page
+  }
+}

package/client/themes/system-theme.css

@@ -0,0 +1,14 @@
+body {
+  /* system info style */
+  --system-info-background-color: var(--main-section-background-color);
+  --system-info-content-padding: 40px 0 0 0;
+  --system-info-font: normal 14px/24px var(--theme-font);
+  --system-info-color: #666;
+  --system-info-appname-color: var(--secondary-color);
+  --system-info-appname-font: bold 20px/20px var(--theme-font);
+  --system-info-description-color: var(--primary-color);
+  --system-info-description-font: normal 15px/18px var(--theme-font);
+  --system-info-version-background-color: var(--secondary-color);
+  --system-info-version-color: #fff;
+  --system-info-version-font: normal 15px/15px var(--theme-font);
+}

package/client/viewparts/license-info.ts

@@ -0,0 +1,49 @@
+import { LitElement, html, css } from 'lit'
+import { customElement, state } from 'lit/decorators.js'
+import { ScrollbarStyles } from '@operato/styles'
+
+@customElement('license-info')
+export class LicenseInfo extends LitElement {
+  static styles = [
+    ScrollbarStyles,
+    css`
+      div {
+        font-family: Arial, sans-serif;
+        padding: 20px;
+        border: 1px solid #ccc;
+        border-radius: 5px;
+        box-shadow: 0 2px 4px rgba(0, 0, 0, 0.1);
+
+        background-color: white;
+        color: #333;
+      }
+    `
+  ]
+
+  @state() licenseInfo: { [key: string]: string } = {}
+
+  render() {
+    return html`
+      <div>
+        <h2>라이선스 정보</h2>
+        ${Object.entries(this.licenseInfo).map(([key, value]) => html` <p>${key} : ${value}</p> `)}
+      </div>
+    `
+  }
+
+  async firstUpdated() {
+    try {
+      const response = await fetch('/license-info', {
+        method: 'GET'
+      })
+
+      if (response.ok) {
+        this.licenseInfo = await response.json()
+      } else {
+        throw new Error(`Failed to fetch license-info. Status: ${response.status}`)
+      }
+    } catch (error) {
+      console.error('Error while fetching license-info:', error)
+    }
+  }
+}

package/client/viewparts/opensource-license.ts

@@ -0,0 +1,75 @@
+import { LitElement, html, css } from 'lit'
+import { customElement, state } from 'lit/decorators.js'
+import { ScrollbarStyles } from '@operato/styles'
+
+@customElement('opensource-license')
+export class OpenSourceLicense extends LitElement {
+  static styles = [
+    ScrollbarStyles,
+    css`
+      :host {
+        display: flex;
+        flex-direction: row;
+
+        background-color: white;
+        padding: 12px 5px 12px 15px;
+
+        font-size: 13px;
+        color: #333;
+      }
+
+      [licenses] {
+        flex: 1;
+        overflow: auto;
+        margin: 0;
+        padding: 0;
+      }
+      li::before {
+        content: '- ';
+      }
+      li {
+        padding: 2px 0 1px 0;
+      }
+      a {
+        color: #22a6a7;
+      }
+    `
+  ]
+
+  @state() licenses?: Object
+
+  async firstUpdated() {
+    try {
+      const response = await fetch('/opensource-licenses', {
+        method: 'GET'
+      })
+
+      if (response.ok) {
+        this.licenses = await response.json()
+      } else {
+        throw new Error(`Failed to fetch licenses. Status: ${response.status}`)
+      }
+    } catch (error) {
+      console.error('Error while fetching licenses:', error)
+    }
+  }
+
+  render() {
+    var licenses = this.licenses || {}
+
+    return html`
+      <ul licenses>
+        ${Object.keys(licenses).map(name => {
+          var license = licenses[name]
+
+          return html`
+            <li>
+              <span>${name}</span>
+              <a href=${license.licenseUrl}>${license.licenses}</a>
+            </li>
+          `
+        })}
+      </ul>
+    `
+  }
+}

package/client/viewparts/release-note-notice.ts

@@ -0,0 +1,53 @@
+import '@operato/markdown'
+
+import { LitElement, css, html } from 'lit'
+import { customElement } from 'lit/decorators.js'
+
+const ENV = process.env
+const version = ENV['APP-VERSION']
+const key = `release-note.${version}`
+
+@customElement('release-note-notice')
+export class ReleaseNoteNotice extends LitElement {
+  static get seen() {
+    return !!localStorage.getItem(key)
+  }
+
+  static styles = [
+    css`
+      :host {
+        display: flex;
+        flex-direction: column;
+
+        background-color: white;
+        padding: 12px 5px 12px 15px;
+
+        font-size: 13px;
+        color: #333;
+      }
+
+      ox-markdown {
+        overflow-y: auto;
+        flex: 1;
+      }
+    `
+  ]
+
+  render() {
+    return html`
+      <ox-markdown src="/helps/release-note.md"></ox-markdown>
+      <label> <input type="checkbox" @change=${e => this.onchangeClose(e)} /> do not show again</label>
+    `
+  }
+
+  onchangeClose(e) {
+    const checked = e.target.checked
+
+    if (checked) {
+      localStorage.setItem(key, 'true')
+      history.back()
+    } else {
+      localStorage.removeItem(key)
+    }
+  }
+}

package/client/viewparts/release-note-setting-let.ts

@@ -0,0 +1,55 @@
+import '@things-factory/setting-base'
+import './release-note-notice'
+import '@material/mwc-formfield'
+import '@material/mwc-button'
+import '@operato/i18n/ox-i18n.js'
+
+import { css, html, LitElement } from 'lit'
+import { customElement } from 'lit/decorators.js'
+
+import { i18next, localize } from '@operato/i18n'
+import { openPopup } from '@operato/layout'
+
+@customElement('release-note-setting-let')
+export class ReleaseNoteSettingLet extends localize(i18next)(LitElement) {
+  static styles = [
+    css`
+      div[onoff] {
+        display: flex;
+        align-items: center;
+        border-bottom: var(--border-dark-color);
+        margin-bottom: var(--margin-default);
+        padding-bottom: var(--padding-default);
+      }
+
+      [test] {
+        margin-left: auto;
+      }
+    `
+  ]
+
+  render() {
+    return html`
+      <setting-let>
+        <ox-i18n slot="title" msgid="title.release note setting"></ox-i18n>
+
+        <div slot="content" onoff>
+          <mwc-button
+            outlined
+            icon="article"
+            label=${String(i18next.t('button.view_release_note'))}
+            @click=${e => this.openReleaseNote()}
+          ></mwc-button>
+        </div>
+      </setting-let>
+    `
+  }
+
+  openReleaseNote() {
+    openPopup(html` <release-note-notice></release-note-notice> `, {
+      backdrop: true,
+      size: 'large',
+      title: i18next.t('title.release-note')
+    })
+  }
+}

package/dist-client/bootstrap.d.ts

@@ -0,0 +1,3 @@
+import '@material/mwc-icon';
+import '@operato/i18n/ox-i18n.js';
+export default function bootstrap(): void;

package/dist-client/bootstrap.js

@@ -0,0 +1,21 @@
+import '@material/mwc-icon';
+import '@operato/i18n/ox-i18n.js';
+import { html } from 'lit';
+import { TOOL_POSITION } from '@operato/layout';
+import { navigate, store } from '@operato/shell';
+import { ADD_MORENDA } from '@things-factory/more-base';
+export default function bootstrap() {
+    /* add user profile morenda */
+    store.dispatch({
+        type: ADD_MORENDA,
+        morenda: {
+            icon: html ` <mwc-icon>info</mwc-icon> `,
+            name: html ` <ox-i18n msgid="label.about-system"></ox-i18n> `,
+            position: TOOL_POSITION.REAR_END,
+            action: () => {
+                navigate('system');
+            }
+        }
+    });
+}
+//# sourceMappingURL=bootstrap.js.map

package/dist-client/bootstrap.js.map

@@ -0,0 +1 @@
+{"version":3,"file":"bootstrap.js","sourceRoot":"","sources":["../client/bootstrap.ts"],"names":[],"mappings":"AAAA,OAAO,oBAAoB,CAAA;AAC3B,OAAO,0BAA0B,CAAA;AAEjC,OAAO,EAAE,IAAI,EAAE,MAAM,KAAK,CAAA;AAE1B,OAAO,EAAE,aAAa,EAAE,MAAM,iBAAiB,CAAA;AAC/C,OAAO,EAAE,QAAQ,EAAE,KAAK,EAAE,MAAM,gBAAgB,CAAA;AAChD,OAAO,EAAE,WAAW,EAAE,MAAM,2BAA2B,CAAA;AAEvD,MAAM,CAAC,OAAO,UAAU,SAAS;IAC/B,8BAA8B;IAC9B,KAAK,CAAC,QAAQ,CAAC;QACb,IAAI,EAAE,WAAW;QACjB,OAAO,EAAE;YACP,IAAI,EAAE,IAAI,CAAA,6BAA6B;YACvC,IAAI,EAAE,IAAI,CAAA,kDAAkD;YAC5D,QAAQ,EAAE,aAAa,CAAC,QAAQ;YAChC,MAAM,EAAE,GAAG,EAAE;gBACX,QAAQ,CAAC,QAAQ,CAAC,CAAA;YACpB,CAAC;SACF;KACF,CAAC,CAAA;AACJ,CAAC","sourcesContent":["import '@material/mwc-icon'\nimport '@operato/i18n/ox-i18n.js'\n\nimport { html } from 'lit'\n\nimport { TOOL_POSITION } from '@operato/layout'\nimport { navigate, store } from '@operato/shell'\nimport { ADD_MORENDA } from '@things-factory/more-base'\n\nexport default function bootstrap() {\n  /* add user profile morenda */\n  store.dispatch({\n    type: ADD_MORENDA,\n    morenda: {\n      icon: html` <mwc-icon>info</mwc-icon> `,\n      name: html` <ox-i18n msgid=\"label.about-system\"></ox-i18n> `,\n      position: TOOL_POSITION.REAR_END,\n      action: () => {\n        navigate('system')\n      }\n    }\n  })\n}\n"]}

package/dist-client/index.d.ts

@@ -0,0 +1 @@
+export * from './viewparts/release-note-setting-let';

package/dist-client/index.js

@@ -0,0 +1,2 @@
+export * from './viewparts/release-note-setting-let';
+//# sourceMappingURL=index.js.map

package/dist-client/index.js.map

@@ -0,0 +1 @@
+{"version":3,"file":"index.js","sourceRoot":"","sources":["../client/index.ts"],"names":[],"mappings":"AAAA,cAAc,sCAAsC,CAAA","sourcesContent":["export * from './viewparts/release-note-setting-let'\n"]}

package/dist-client/pages/system-info.d.ts

@@ -0,0 +1,23 @@
+import '@material/mwc-button';
+import '@operato/i18n/ox-i18n.js';
+import '../viewparts/opensource-license';
+import '../viewparts/license-info';
+import { PageView } from '@operato/shell';
+declare const SystemInfo_base: (new (...args: any[]) => import("lit").LitElement) & typeof PageView;
+export declare class SystemInfo extends SystemInfo_base {
+    static styles: import("lit").CSSResult;
+    private _applicationMeta?;
+    get context(): {
+        title: string;
+    };
+    get applicationMeta(): {
+        icon?: string | undefined;
+        title: string;
+        description: string;
+        copyright: string;
+    };
+    render(): import("lit-html").TemplateResult<1>;
+    onClickOpenSourceLicense(e: any): void;
+    onClickLicenseInfo(e: any): void;
+}
+export {};