@things-factory/reference-app 4.0.2 → 4.0.6

package/client/bootstrap.js

@@ -1,6 +1,7 @@
 import '@things-factory/auth-ui' /* for domain-switch */
 import '@things-factory/barcode-base' /* for <default-label-printer-setting-let> */
 import '@things-factory/notification' /* for notification-badge */
+import './components/ocr-viewpart'
 
 import { TOOL_POSITION, VIEWPART_POSITION, appendViewpart, toggleOverlay } from '@things-factory/layout-base'
 import { getEditor, registerEditor, registerRenderer } from '@operato/data-grist'
@@ -134,6 +135,24 @@ export default function bootstrap() {
   })
 
   /* setting app-tools */
+  store.dispatch({
+    type: APPEND_APP_TOOL,
+    tool: {
+      name: 'ocr-toggler',
+      template: html`
+        <mwc-icon
+          @click=${e => {
+            toggleOverlay('ocr-viewpart', {
+              backdrop: false
+            })
+          }}
+          >camera_enhance
+        </mwc-icon>
+      `,
+      position: TOOL_POSITION.REAR
+    }
+  })
+
   store.dispatch({
     type: APPEND_APP_TOOL,
     tool: {
@@ -162,6 +181,17 @@ export default function bootstrap() {
     position: VIEWPART_POSITION.HEADERBAR
   })
 
+  appendViewpart({
+    name: 'ocr-viewpart',
+    viewpart: {
+      show: false,
+      hovering: false,
+      resizable: true,
+      template: html` <ocr-viewpart style="min-width: 300px; height: 100%; width: 50vw;"></ocr-viewpart> `
+    },
+    position: VIEWPART_POSITION.ASIDEBAR
+  })
+
   appendViewpart({
     name: 'notification',
     viewpart: {

package/client/components/camera-capturer.js

@@ -119,8 +119,16 @@ export class CameraCapturer extends LitElement {
                   - ${file.name}
                   <mwc-icon
                     @click=${e => {
-                      this._files.splice(this._files.indexOf(file), 1)
-                      this.requestUpdate()
+                      this._files = [...this._files.splice(this._files.indexOf(file), 1)]
+                      this.dispatchEvent(
+                        new CustomEvent('files-change', {
+                          bubbles: true,
+                          composed: true,
+                          detail: {
+                            files: this._files
+                          }
+                        })
+                      )
                     }}
                     >delete_outline</mwc-icon
                   >
@@ -137,6 +145,15 @@ export class CameraCapturer extends LitElement {
 
     this.addEventListener('file-drop', e => {
       this._files = this.multiple ? e.detail : e.detail[0] ? [e.detail[0]] : []
+      this.dispatchEvent(
+        new CustomEvent('files-change', {
+          bubbles: true,
+          composed: true,
+          detail: {
+            files: this._files
+          }
+        })
+      )
     })
   }
 
@@ -151,6 +168,16 @@ export class CameraCapturer extends LitElement {
   reset() {
     this.fileInput.value = ''
     this._files = []
+
+    this.dispatchEvent(
+      new CustomEvent('files-change', {
+        bubbles: true,
+        composed: true,
+        detail: {
+          files: this._files
+        }
+      })
+    )
   }
 }
 

package/client/components/ocr-viewpart.js

@@ -0,0 +1,94 @@
+import './camera-capturer'
+import '@material/mwc-button'
+import '@operato/ocr'
+
+import { gql } from 'graphql-tag'
+import { css, html, LitElement } from 'lit-element'
+
+import { client } from '@things-factory/shell'
+
+var FILES = []
+var RESULT = []
+
+class OCRViewPart extends LitElement {
+  static get styles() {
+    return [
+      css`
+        :host {
+          display: flex;
+          flex-direction: column;
+          min-width: 240px;
+        }
+
+        ox-ocr-helper {
+          flex: 1;
+        }
+      `
+    ]
+  }
+
+  static get properties() {
+    return {
+      _result: Array,
+      _files: Array
+    }
+  }
+
+  connectedCallback() {
+    super.connectedCallback()
+
+    this._files = FILES
+    this._result = RESULT
+  }
+
+  render() {
+    const files = this._files || []
+    const index = this.index || 0
+    const file = files[index]
+    const image = file && URL.createObjectURL(file)
+    if (image) {
+      requestAnimationFrame(() => URL.revokeObjectURL(image))
+    }
+
+    return html`
+      <ox-ocr-helper @attached=${this.upload.bind(this)} .files=${this._files} .result=${this._result}> </ox-ocr-helper>
+    `
+  }
+
+  async upload(e) {
+    FILES = this._files = e.detail
+
+    const response = await client.query({
+      query: gql`
+        query ocrRequest($images: [Upload!]!) {
+          ocrRequest(images: $images)
+        }
+      `,
+      variables: {
+        images: this._files
+      },
+      context: { hasUpload: true }
+    })
+
+    if (!response.errors) {
+      const helper = this.shadowRoot.querySelector('ox-ocr-helper')
+      RESULT = helper.result = response.data.ocrRequest.map(result => {
+        return {
+          ...result,
+          boundaries: JSON.parse(result.boundaries)
+        }
+      })
+    } else {
+      document.dispatchEvent(
+        new CustomEvent('notify', {
+          detail: {
+            level: 'error',
+            message: response.errors
+          }
+        })
+      )
+    }
+  }
+}
+
+customElements.define('ocr-viewpart', OCRViewPart)

package/client/menu.js

@@ -80,7 +80,7 @@ export function getMenuTemplate() {
         },
         {
           name: 'Label Scan',
-          path: 'bizplace-register'
+          path: 'label-scan-page'
         },
         {
           name: 'Ghost Print',

package/client/pages/context-menu-page.js

@@ -1,9 +1,10 @@
 import '@material/mwc-icon'
-import '@operato/mini-popup'
+import '@operato/popup'
 
 import { css, html } from 'lit-element'
 import { connect } from 'pwa-helpers/connect-mixin.js'
 
+import { PopupMenu } from '@operato/popup'
 import { PageView, store } from '@things-factory/shell'
 
 import { referencePageStyles } from './reference-page-styles'
@@ -39,93 +40,114 @@ class ContextMenuPage extends connect(store)(PageView) {
         페이지내에 엘리먼트를 위치시키고 open method로 활성화 시키는 방법을 예시합니다. 데스크톱 브라우저 페이지 내 어느
         위치에서든 마우스 우측버튼을 클릭하고, 모바일 디바이스에서는 탭을 오래누르면(longpress) 팝업메뉴가 동작합니다.
       </p>
+    `
+  }
 
-      <popup-menu>
-        <popup-menuitem label="article">
-          <mwc-icon slot="icon">article</mwc-icon>
-        </popup-menuitem>
-
-        <popup-menuitem label="home">
-          <mwc-icon slot="icon">home</mwc-icon>
-        </popup-menuitem>
-
-        <popup-menuitem label="empty"> </popup-menuitem>
-
-        <popup-menuitem
-          label="click me to toggle"
-          @click=${function (e) {
-            const target = e.currentTarget
-            const icon = target.querySelector('mwc-icon')
-            icon.innerHTML = icon.innerHTML == 'check' ? '' : 'check'
-          }}
-        >
-          <mwc-icon slot="icon" style="width: 20px;height: 20px;"></mwc-icon>
-        </popup-menuitem>
-
-        <popup-menuitem label="verified">
-          <mwc-icon slot="icon">verified</mwc-icon>
-          <popup-menu>
-            <popup-menuitem label="article">
+  firstUpdated() {
+    this.addEventListener('contextmenu', e => {
+      e.preventDefault()
+
+      PopupMenu.open({
+        template: html`
+            <ox-popup-menuitem
+              label="article - click me"
+              @selected=${function (e) {
+                console.log('first level article selected')
+              }}
+            >
               <mwc-icon slot="icon">article</mwc-icon>
-            </popup-menuitem>
+            </ox-popup-menuitem>
 
-            <popup-menuitem label="home">
+            <ox-popup-menuitem label="home">
               <mwc-icon slot="icon">home</mwc-icon>
-            </popup-menuitem>
-
-            <popup-menuitem label="verified">
+            </ox-popup-menuitem>
+
+            <ox-popup-menuitem label="empty"> </ox-popup-menuitem>
+
+            <ox-popup-menuitem
+              label="click me to toggle"
+              @selected=${function (e) {
+                const icon = this.querySelector('mwc-icon')
+                icon.innerHTML = icon.innerHTML == 'check' ? '' : 'check'
+              }}
+              alive-on-select
+            >
+              <mwc-icon slot="icon" style="width: 20px;height: 20px;"></mwc-icon>
+            </ox-popup-menuitem>
+
+            <ox-popup-menuitem label="verified" @selected=${e => console.log('selected verified')}>
               <mwc-icon slot="icon">verified</mwc-icon>
-              <popup-menu>
-                <popup-menuitem label="article">
+              <ox-popup-menu>
+                <ox-popup-menuitem
+                  label="article"
+                  @selected=${function (e) {
+                    console.log('article selected')
+                  }}
+                  alive-on-select
+                >
                   <mwc-icon slot="icon">article</mwc-icon>
-                </popup-menuitem>
+                </ox-popup-menuitem>
 
-                <popup-menuitem label="home">
+                <ox-popup-menuitem label="home">
                   <mwc-icon slot="icon">home</mwc-icon>
-                </popup-menuitem>
+                </ox-popup-menuitem>
 
-                <popup-menuitem label="verified">
+                <ox-popup-menuitem label="verified">
                   <mwc-icon slot="icon">verified</mwc-icon>
-                </popup-menuitem>
+                  <ox-popup-menu>
+                    <ox-popup-menuitem label="article">
+                      <mwc-icon slot="icon">article</mwc-icon>
+                    </ox-popup-menuitem>
 
-                <popup-menuitem label="checkbox">
-                  <input type="checkbox" slot="icon" />
-                </popup-menuitem>
-
-                <div separator></div>
-              </popup-menu>
-            </popup-menuitem>
+                    <ox-popup-menuitem label="home">
+                      <mwc-icon slot="icon">home</mwc-icon>
+                    </ox-popup-menuitem>
 
-            <div separator></div>
+                    <ox-popup-menuitem label="verified">
+                      <mwc-icon slot="icon">verified</mwc-icon>
+                    </ox-popup-menuitem>
 
-            <popup-menuitem label="checkbox">
-              <input type="checkbox" slot="icon" />
-            </popup-menuitem>
-          </popup-menu>
-        </popup-menuitem>
+                    <ox-popup-menuitem label="checkbox">
+                      <input type="checkbox" slot="icon" />
+                    </ox-popup-menuitem>
 
-        <popup-menuitem label="checkbox">
-          <input type="checkbox" slot="icon" />
-        </popup-menuitem>
+                    <div separator></div>
+                  </ox-popup-menu>
+                </ox-popup-menuitem>
 
-        <div separator></div>
+                <div separator></div>
 
-        <div menu>Plain DIV</div>
-        <input type="checkbox" menu />
-        <input type="text" menu value="Plain text input" />
-      </popup-menu>
-    `
-  }
+                <ox-popup-menuitem label="checkbox">
+                  <input type="checkbox" slot="icon" />
+                </ox-popup-menuitem>
+              </ox-popup-menu>
+            </ox-popup-menuitem>
 
-  firstUpdated() {
-    this.addEventListener('contextmenu', e => {
-      const popupMenu = this.renderRoot.querySelector('popup-menu')
+            <ox-popup-menuitem label="checkbox in icon area" alive-on-select>
+              <input type="checkbox" slot="icon" />
+            </ox-popup-menuitem>
 
-      if (popupMenu) {
-        e.preventDefault()
+            <div separator></div>
 
-        popupMenu.open({ left: e.offsetX, top: e.offsetY })
-      }
+            <div menu>Plain Text</div>
+
+            <div menu alive-on-select>
+              <ox-checkbox label="checkbox" slot="icon" checked />checkbox</ox-checkbox>
+            </div>
+
+            <div menu alive-on-select>
+              <input id="checkbox-01" type="checkbox" />
+              <label for="checkbox-01">custom menu</label>
+            </div>
+            <div menu alive-on-select>
+              <label for="text-01">value</label>
+              <input id="text-01" type="text" value="Plain text input" />
+            </div>
+          `,
+        top: e.offsetY,
+        left: e.offsetX,
+        parent: this.renderRoot
+      })
     })
   }
 }

package/client/pages/grist-mode-page.js

@@ -1,12 +1,10 @@
-import '@operato/mini-popup'
+import '@operato/popup'
 import '@operato/data-grist'
 
 import { css, html } from 'lit-element'
-import { getEditor, getRenderer } from '@operato/data-grist'
-import { i18next, localize } from '@things-factory/i18n-base'
 
+import { i18next, localize } from '@things-factory/i18n-base'
 import { PageView } from '@things-factory/shell'
-import { isMobileDevice } from '@things-factory/utils'
 
 class GristModePage extends localize(i18next)(PageView) {
   static get styles() {
@@ -113,7 +111,7 @@ class GristModePage extends localize(i18next)(PageView) {
             <mwc-icon
               @click=${e => {
                 const target = e.currentTarget
-                this.renderRoot.querySelector('popup-menu').open({
+                this.renderRoot.querySelector('ox-popup-list').open({
                   left: target.offsetLeft,
                   top: target.offsetTop + target.offsetHeight
                 })
@@ -123,7 +121,7 @@ class GristModePage extends localize(i18next)(PageView) {
             <mwc-icon
               @click=${e => {
                 const target = e.currentTarget
-                this.renderRoot.querySelector('popup-menu').open({
+                this.renderRoot.querySelector('ox-popup-list').open({
                   left: target.offsetLeft,
                   top: target.offsetTop + target.offsetHeight
                 })
@@ -133,7 +131,7 @@ class GristModePage extends localize(i18next)(PageView) {
             <mwc-icon
               @click=${e => {
                 const target = e.currentTarget
-                this.renderRoot.querySelector('popup-menu').open({
+                this.renderRoot.querySelector('ox-popup-list').open({
                   left: target.offsetLeft,
                   top: target.offsetTop + target.offsetHeight
                 })
@@ -141,26 +139,28 @@ class GristModePage extends localize(i18next)(PageView) {
               >sort</mwc-icon
             >
 
-            <popup-menu>
-              <popup-menuitem
-                label="click me to toggle"
+            <ox-popup-list alive-on-select>
+              <div
+                option
                 @click=${function (e) {
                   const icon = e.currentTarget.querySelector('mwc-icon')
                   icon.innerHTML = icon.innerHTML == 'check' ? '' : 'check'
                 }}
               >
                 <mwc-icon slot="icon" style="width: 20px;height: 20px;"></mwc-icon>
-              </popup-menuitem>
-              <popup-menuitem
-                label="click me to toggle"
+                <span>click me to toggle</span>
+              </div>
+              <div
+                option
                 @click=${function (e) {
                   const icon = e.currentTarget.querySelector('mwc-icon')
                   icon.innerHTML = icon.innerHTML == 'check' ? '' : 'check'
                 }}
               >
                 <mwc-icon slot="icon" style="width: 20px;height: 20px;"></mwc-icon>
-              </popup-menuitem>
-            </popup-menu>
+                <span>click me to toggle</span>
+              </div>
+            </ox-popup-list>
           </div>
         </div>
       </ox-grist>

package/client/pages/label-scan-page.js

@@ -0,0 +1,189 @@
+import '@things-factory/barcode-ui'
+
+import { css, html } from 'lit-element'
+import { connect } from 'pwa-helpers/connect-mixin.js'
+
+import { PageView, store } from '@things-factory/shell'
+
+import { referencePageStyles } from './reference-page-styles'
+
+class LabelScanPage extends connect(store)(PageView) {
+  static get styles() {
+    return [
+      referencePageStyles,
+      css`
+        :host {
+          display: block;
+        }
+
+        div {
+          overflow-wrap: anywhere;
+        }
+      `
+    ]
+  }
+
+  static get properties() {
+    return {
+      bcid: String,
+      value: String,
+      bcWidth: Number,
+      bcHeight: Number,
+      bcScale: Number,
+      padding: Number
+    }
+  }
+
+  get context() {
+    return {
+      title: 'Barcode Scan Input and Tag Component'
+    }
+  }
+
+  render() {
+    const bcid = this.bcid || 'code128'
+    const value = this.value || '213439240572'
+    const bcWidth = this.bcWidth || 30
+    const bcHeight = this.bcHeight || 30
+    const bcScale = this.bcScale || 3
+    const padding = this.padding || 5
+
+    return html`
+      <section>
+        <h2>Barcode Scanable Input</h2>
+        <p>
+          barcode-scanable-input 컴포넌트는 카메라 입력을 통해서 바코드를 스캔하고, 스캔한 결과를 입력 필드에 적용한다.
+        </p>
+        <barcode-scanable-input
+          name="barcode-input"
+          custom-input
+          @keypress=${e => {
+            if (e.keyCode === 13) {
+              e.preventDefault()
+              this.value = e.target.shadowRoot.querySelector('input').value
+              console.log('input completed.', e.target.value)
+            }
+          }}
+        ></barcode-scanable-input>
+      </section>
+
+      <section>
+        <h2>Input Field with Barcode Image</h2>
+        <p>barcode-input 컴포넌트는 입력필드에 입력된 결과를 바코드 이미지로도 보여준다.</p>
+
+        <label>bacode type</label>
+        <select
+          @change=${e => {
+            this.bcid = e.target.value
+          }}
+          .value=${bcid}
+        >
+          <option value="code39">code39</option>
+          <option value="code128" selected>code128</option>
+          <option value="qrcode">QR</option>
+        </select>
+
+        <label>bacode width</label>
+        <select
+          @change=${e => {
+            this.bcWidth = Number(e.target.value)
+          }}
+          .value=${bcWidth}
+        >
+          <option value="10">10</option>
+          <option value="30" selected>30</option>
+          <option value="50">50</option>
+        </select>
+
+        <label>bacode height</label>
+        <select
+          @change=${e => {
+            this.bcHeight = Number(e.target.value)
+          }}
+          .value=${bcHeight}
+        >
+          <option value="10">10</option>
+          <option value="30" selected>30</option>
+          <option value="50">50</option>
+        </select>
+
+        <label>bacode scale</label>
+        <select
+          @change=${e => {
+            this.bcScale = Number(e.target.value)
+          }}
+          .value=${bcScale}
+        >
+          <option value="2">2</option>
+          <option value="3" selected>3</option>
+          <option value="4">4</option>
+        </select>
+
+        <label>padding</label>
+        <select
+          @change=${e => {
+            this.padding = Number(e.target.value)
+          }}
+          .value=${padding}
+        >
+          <option value="3">3</option>
+          <option value="5" selected>5</option>
+          <option value="10">10</option>
+        </select>
+
+        <barcode-input
+          .bcid=${bcid}
+          .value=${value}
+          .bcWidth=${bcWidth}
+          .bcHeight=${bcHeight}
+          .bcScale=${bcScale}
+          @change=${e => {
+            this.value = e.target.value
+          }}
+        ></barcode-input>
+      </section>
+
+      <section>
+        <h2>Barcode Image Component</h2>
+        <p>
+          barcode-tag 컴포넌트는 바코드 이미지를 보여준다. 바코드 이미지를 클릭하면 이미지 파일을 다운로드 받을 수 있다.
+        </p>
+
+        <barcode-tag
+          .bcid=${bcid}
+          .value=${value}
+          .bcWidth=${bcWidth}
+          .bcHeight=${bcHeight}
+          .bcScale=${bcScale}
+          .padding=${padding}
+        ></barcode-tag>
+      </section>
+    `
+  }
+
+  updated(changes) {
+    /*
+     * If this page properties are changed, this callback will be invoked.
+     * This callback will be called back only when this page is activated.
+     */
+    if (changes.has('itemId') || changes.has('params')) {
+      /* do something */
+    }
+  }
+
+  stateChanged(state) {
+    /*
+     * application wide state changed
+     *
+     */
+  }
+
+  pageUpdated(changes, lifecycle, before) {
+    if (this.active) {
+    } else {
+      /* this page is deactivated */
+    }
+  }
+}
+
+customElements.define('label-scan-page', LabelScanPage)

package/client/pages/ocr-page.js

@@ -1,12 +1,13 @@
 import '@things-factory/form-ui'
 import '../components/camera-capturer'
 
-import { PageView, client, store } from '@things-factory/shell'
+import { gql } from 'graphql-tag'
 import { css, html } from 'lit-element'
+import { connect } from 'pwa-helpers/connect-mixin.js'
 
+import { client, PageView, store } from '@things-factory/shell'
 import { CommonButtonStyles } from '@things-factory/styles'
-import { connect } from 'pwa-helpers/connect-mixin.js'
-import { gql } from 'graphql-tag'
+
 import { referencePageStyles } from './reference-page-styles'
 
 class OCRPage extends connect(store)(PageView) {

package/client/route.js

@@ -55,6 +55,10 @@ export default function route(page) {
       import('./pages/direct-print')
       return page
 
+    case 'label-scan-page':
+      import('./pages/label-scan-page')
+      return page
+
     case 'ghost-print-page':
       import('./pages/ghost-print-page')
       return page

package/config/config.development.js

@@ -1,3 +1,7 @@
 module.exports = {
-  subdomain: "system"
+  subdomain: 'system',
+  awsAppSync: {
+    apiUrl: '',
+    apiKey: ''
+  }
 }

package/dist-server/service/reference/lambda-call.js

@@ -0,0 +1,68 @@
+"use strict";
+var __importDefault = (this && this.__importDefault) || function (mod) {
+    return (mod && mod.__esModule) ? mod : { "default": mod };
+};
+Object.defineProperty(exports, "__esModule", { value: true });
+exports.interpretImages = void 0;
+const node_fetch_1 = __importDefault(require("node-fetch"));
+const env_1 = require("@things-factory/env");
+const utils_1 = require("@things-factory/utils");
+const appSyncConfig = env_1.config.get('awsAppSync');
+async function interpretImages(images) {
+    const query = utils_1.gqlBuilder.jsonToGraphQLQuery({
+        mutation: {
+            upload: {
+                __args: {
+                    images
+                },
+                success_count: true,
+                failure_count: true,
+                result: {
+                    key_values: true,
+                    boundaries: true,
+                    texts: true
+                }
+            }
+        }
+    });
+    const body = JSON.stringify({ query });
+    const response = await (0, node_fetch_1.default)(appSyncConfig['apiUrl'], {
+        method: 'POST',
+        headers: {
+            'Content-Type': 'application/graphql',
+            'x-api-key': appSyncConfig['apiKey']
+        },
+        body
+    });
+    const jsonRes = await response.json();
+    return jsonRes;
+}
+exports.interpretImages = interpretImages;
+// @deprecated
+function getRequestBody(images) {
+    // @things-factory/utils gqlBuilder.buildArgs 와 유사
+    const imageArgs = images.map(obj => {
+        const args = [];
+        for (let key in obj) {
+            args.push(`${key}: \"${obj[key]}\"`);
+        }
+        return '{' + args.join(',') + '}';
+    });
+    // console.log(gqlBuilder.buildArgs(images))
+    // console.log(imageArgs)
+    const body = JSON.stringify({
+        query: `mutation {
+      upload(images: ${imageArgs}) { 
+        success_count
+        failure_count
+        results {
+          key_values
+          boundaries
+          texts
+        } 
+      }
+    }`
+    });
+    return body;
+}
+//# sourceMappingURL=lambda-call.js.map

package/dist-server/service/reference/lambda-call.js.map

@@ -0,0 +1 @@
+{"version":3,"file":"lambda-call.js","sourceRoot":"","sources":["../../../server/service/reference/lambda-call.ts"],"names":[],"mappings":";;;;;;AAAA,4DAA8B;AAE9B,6CAA4C;AAC5C,iDAAkD;AAElD,MAAM,aAAa,GAAG,YAAM,CAAC,GAAG,CAAC,YAAY,CAAC,CAAA;AAEvC,KAAK,UAAU,eAAe,CAAC,MAAM;IAC1C,MAAM,KAAK,GAAG,kBAAU,CAAC,kBAAkB,CAAC;QAC1C,QAAQ,EAAE;YACR,MAAM,EAAE;gBACN,MAAM,EAAE;oBACN,MAAM;iBACP;gBACD,aAAa,EAAE,IAAI;gBACnB,aAAa,EAAE,IAAI;gBACnB,MAAM,EAAE;oBACN,UAAU,EAAE,IAAI;oBAChB,UAAU,EAAE,IAAI;oBAChB,KAAK,EAAE,IAAI;iBACZ;aACF;SACF;KACF,CAAC,CAAA;IAEF,MAAM,IAAI,GAAG,IAAI,CAAC,SAAS,CAAC,EAAE,KAAK,EAAE,CAAC,CAAA;IACtC,MAAM,QAAQ,GAAG,MAAM,IAAA,oBAAK,EAAC,aAAa,CAAC,QAAQ,CAAC,EAAE;QACpD,MAAM,EAAE,MAAM;QACd,OAAO,EAAE;YACP,cAAc,EAAE,qBAAqB;YACrC,WAAW,EAAE,aAAa,CAAC,QAAQ,CAAC;SACrC;QACD,IAAI;KACL,CAAC,CAAA;IAEF,MAAM,OAAO,GAAG,MAAM,QAAQ,CAAC,IAAI,EAAE,CAAA;IACrC,OAAO,OAAO,CAAA;AAChB,CAAC;AA9BD,0CA8BC;AAED,cAAc;AACd,SAAS,cAAc,CAAC,MAAM;IAC5B,kDAAkD;IAClD,MAAM,SAAS,GAAG,MAAM,CAAC,GAAG,CAAC,GAAG,CAAC,EAAE;QACjC,MAAM,IAAI,GAAG,EAAE,CAAA;QACf,KAAK,IAAI,GAAG,IAAI,GAAG,EAAE;YACnB,IAAI,CAAC,IAAI,CAAC,GAAG,GAAG,OAAO,GAAG,CAAC,GAAG,CAAC,IAAI,CAAC,CAAA;SACrC;QACD,OAAO,GAAG,GAAG,IAAI,CAAC,IAAI,CAAC,GAAG,CAAC,GAAG,GAAG,CAAA;IACnC,CAAC,CAAC,CAAA;IAEF,4CAA4C;IAC5C,yBAAyB;IAEzB,MAAM,IAAI,GAAG,IAAI,CAAC,SAAS,CAAC;QAC1B,KAAK,EAAE;uBACY,SAAS;;;;;;;;;MAS1B;KACH,CAAC,CAAA;IAEF,OAAO,IAAI,CAAA;AACb,CAAC"}

package/dist-server/service/reference/reference-query.js

@@ -13,13 +13,16 @@ var __param = (this && this.__param) || function (paramIndex, decorator) {
 };
 Object.defineProperty(exports, "__esModule", { value: true });
 exports.ReferenceQuery = void 0;
-const type_graphql_1 = require("type-graphql");
 const graphql_upload_1 = require("graphql-upload");
+const type_graphql_1 = require("type-graphql");
+const attachment_base_1 = require("@things-factory/attachment-base");
 const shell_1 = require("@things-factory/shell");
 const utils_1 = require("@things-factory/utils");
-const attachment_base_1 = require("@things-factory/attachment-base");
+const lambda_call_1 = require("./lambda-call");
+const debug = require('debug')('things-factory:reference-app');
 let ReferenceQuery = class ReferenceQuery {
     async ocrRequest(_, images, context) {
+        var _a, _b;
         const { domain, user, tx } = context.state;
         const all = Promise.all(images);
         if ((images === null || images === void 0 ? void 0 : images.length) > 0) {
@@ -31,8 +34,27 @@ let ReferenceQuery = class ReferenceQuery {
                 };
             });
             await (0, attachment_base_1.createAttachments)(_, { attachments }, context);
+            const files = await Promise.all(images.map(async (file) => {
+                const { createReadStream, filename, mimetype } = await file;
+                const readStream = createReadStream();
+                const image = await this.streamToString(readStream);
+                // format is 'image/jpeg'
+                const formatArr = mimetype.split('/');
+                return { data: image, name: filename, format: formatArr[formatArr.length - 1] };
+            }));
+            const res = await (0, lambda_call_1.interpretImages)(files);
+            console.log('interpretImages response', JSON.stringify(res, null, ' '));
+            return (_b = (_a = res.data) === null || _a === void 0 ? void 0 : _a.upload) === null || _b === void 0 ? void 0 : _b.result;
         }
-        return 'success';
+        return [];
+    }
+    streamToString(stream) {
+        const chunks = [];
+        return new Promise((resolve, reject) => {
+            stream.on('data', (chunk) => chunks.push(Buffer.from(chunk)));
+            stream.on('error', (err) => reject(err));
+            stream.on('end', () => resolve(Buffer.concat(chunks).toString('base64')));
+        });
     }
     async ocrPendingJob(_, tag, context) {
         const { domain } = context.state;
@@ -49,7 +71,7 @@ let ReferenceQuery = class ReferenceQuery {
     }
 };
 __decorate([
-    (0, type_graphql_1.Query)(returns => String, { description: 'To reference of ocr request' }),
+    (0, type_graphql_1.Query)(returns => shell_1.ScalarAny, { description: 'To reference of ocr request' }),
     __param(0, (0, type_graphql_1.Root)()),
     __param(1, (0, type_graphql_1.Arg)('images', () => [graphql_upload_1.GraphQLUpload])),
     __param(2, (0, type_graphql_1.Ctx)()),

package/dist-server/service/reference/reference-query.js.map

@@ -1 +1 @@
-{"version":3,"file":"reference-query.js","sourceRoot":"","sources":["../../../server/service/reference/reference-query.ts"],"names":[],"mappings":";;;;;;;;;;;;;;;AAAA,+CAAmF;AACnF,mDAA0D;AAC1D,iDAAuD;AACvD,iDAA6C;AAC7C,qEAA+E;AAG/E,IAAa,cAAc,GAA3B,MAAa,cAAc;IAEzB,KAAK,CAAC,UAAU,CACN,CAAC,EAET,MAAoB,EACb,OAAY;QAEnB,MAAM,EAAE,MAAM,EAAE,IAAI,EAAE,EAAE,EAAE,GAAG,OAAO,CAAC,KAAK,CAAA;QAC1C,MAAM,GAAG,GAAG,OAAO,CAAC,GAAG,CAAC,MAAM,CAAC,CAAA;QAE/B,IAAI,CAAA,MAAM,aAAN,MAAM,uBAAN,MAAM,CAAE,MAAM,IAAG,CAAC,EAAE;YACtB,MAAM,WAAW,GAAiB,MAAM,CAAC,GAAG,CAAC,UAAU,CAAC,EAAE;gBACxD,OAAO;oBACL,IAAI,EAAE,UAAU;oBAChB,KAAK,EAAE,GAAG;oBACV,QAAQ,EAAE,WAAW;iBACtB,CAAA;YACH,CAAC,CAAC,CAAA;YACF,MAAM,IAAA,mCAAiB,EAAC,CAAC,EAAE,EAAE,WAAW,EAAE,EAAE,OAAO,CAAC,CAAA;SACrD;QAED,OAAO,SAAS,CAAA;IAClB,CAAC;IAGD,KAAK,CAAC,aAAa,CAAS,CAAC,EAAc,GAAW,EAAS,OAAY;QACzE,MAAM,EAAE,MAAM,EAAE,GAAG,OAAO,CAAC,KAAK,CAAA;QAEhC,KAAK,IAAI,CAAC,GAAG,CAAC,EAAE,CAAC,IAAI,GAAG,EAAE,CAAC,EAAE,EAAE;YAC7B,MAAM,IAAA,aAAK,EAAC,GAAG,CAAC,CAAA;YAEhB,IAAA,uBAAe,EAAC;gBACd,MAAM;gBACN,GAAG;gBACH,QAAQ,EAAE,CAAC;gBACX,OAAO,EAAE,GAAG,CAAC,GAAG,EAAE,SAAS;aAC5B,CAAC,CAAA;SACH;QAED,OAAO,SAAS,CAAA;IAClB,CAAC;CACF,CAAA;AAxCC;IADC,IAAA,oBAAK,EAAC,OAAO,CAAC,EAAE,CAAC,MAAM,EAAE,EAAE,WAAW,EAAE,6BAA6B,EAAE,CAAC;IAEtE,WAAA,IAAA,mBAAI,GAAE,CAAA;IACN,WAAA,IAAA,kBAAG,EAAC,QAAQ,EAAE,GAAG,EAAE,CAAC,CAAC,8BAAa,CAAC,CAAC,CAAA;IAEpC,WAAA,IAAA,kBAAG,GAAE,CAAA;;;;gDAiBP;AAGD;IADC,IAAA,oBAAK,EAAC,OAAO,CAAC,EAAE,CAAC,MAAM,EAAE,EAAE,WAAW,EAAE,sCAAsC,EAAE,CAAC;IAC7D,WAAA,IAAA,mBAAI,GAAE,CAAA;IAAK,WAAA,IAAA,kBAAG,EAAC,KAAK,CAAC,CAAA;IAAe,WAAA,IAAA,kBAAG,GAAE,CAAA;;;;mDAe7D;AAzCU,cAAc;IAD1B,IAAA,uBAAQ,GAAE;GACE,cAAc,CA0C1B;AA1CY,wCAAc"}
+{"version":3,"file":"reference-query.js","sourceRoot":"","sources":["../../../server/service/reference/reference-query.ts"],"names":[],"mappings":"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"}

package/logs/.08636eb59927f12972f6774f5947c8507b3564c2-audit.json

@@ -6,14 +6,9 @@
     "auditLog": "logs/.08636eb59927f12972f6774f5947c8507b3564c2-audit.json",
     "files": [
         {
-            "date": 1636005255512,
-            "name": "logs/application-2021-11-04-14.log",
-            "hash": "82baeb9d01f51b2ebdb89d58c735e058"
-        },
-        {
-            "date": 1636103946107,
-            "name": "logs/application-2021-11-05-18.log",
-            "hash": "dca379ac4e315b99f4a38f1350437523"
+            "date": 1632981885831,
+            "name": "logs/application-2021-09-30-15.log",
+            "hash": "515e7b9c4a0e33cfa4f1218a88c8f042"
         }
     ]
 }

package/logs/.5e5d741d8b7784a2fbad65eedc0fd46946aaf6f2-audit.json

@@ -6,24 +6,9 @@
     "auditLog": "logs/.5e5d741d8b7784a2fbad65eedc0fd46946aaf6f2-audit.json",
     "files": [
         {
-            "date": 1635819464472,
-            "name": "logs/connections-2021-11-02-11.log",
-            "hash": "8bc1da3313a69261b4674f629d032e03"
-        },
-        {
-            "date": 1635906208371,
-            "name": "logs/connections-2021-11-03-11.log",
-            "hash": "a1311491c36196b33b2dd55f164b95f7"
-        },
-        {
-            "date": 1636005260004,
-            "name": "logs/connections-2021-11-04-14.log",
-            "hash": "6d9ee9a4066c730e14f77f0396879d64"
-        },
-        {
-            "date": 1636103949582,
-            "name": "logs/connections-2021-11-05-18.log",
-            "hash": "f7593c79bc2d00a3832d894f74b529f8"
+            "date": 1632981891881,
+            "name": "logs/connections-2021-09-30-15.log",
+            "hash": "96dfe267599a1dba08dca294e7d8d0d1"
         }
     ]
 }

package/logs/application-2021-09-30-15.log

@@ -0,0 +1,14 @@
+2021-09-30T06:04:49.542Z info: File Storage is Ready.
+2021-09-30T06:04:56.532Z info: Database connection established
+2021-09-30T06:04:57.913Z info: 🚀 Server ready at http://0.0.0.0:3000/graphql
+2021-09-30T06:04:57.915Z info: 🚀 Subscriptions ready at ws://0.0.0.0:3000/subscriptions
+2021-09-30T06:05:31.284Z info: File Storage is Ready.
+2021-09-30T06:05:37.067Z info: Database connection established
+2021-09-30T06:05:38.136Z info: 🚀 Server ready at http://0.0.0.0:3000/graphql
+2021-09-30T06:05:38.148Z info: 🚀 Subscriptions ready at ws://0.0.0.0:3000/subscriptions
+2021-09-30T06:07:44.914Z info: File Storage is Ready.
+2021-09-30T06:08:06.103Z info: File Storage is Ready.
+2021-09-30T06:08:29.712Z info: File Storage is Ready.
+2021-09-30T06:08:32.447Z info: Database connection established
+2021-09-30T06:08:33.349Z info: 🚀 Server ready at http://0.0.0.0:3000/graphql
+2021-09-30T06:08:33.349Z info: 🚀 Subscriptions ready at ws://0.0.0.0:3000/subscriptions

package/package.json

@@ -1,6 +1,6 @@
 {
   "name": "@things-factory/reference-app",
-  "version": "4.0.2",
+  "version": "4.0.6",
   "main": "dist-server/index.js",
   "browser": "client/index.js",
   "things-factory": true,
@@ -37,49 +37,50 @@
     "docker:run": "docker run -it -p 4000:3000 hatiolab/reference-app:latest"
   },
   "dependencies": {
-    "@hatiolab/things-scene": "^2.7.11",
-    "@material/mwc-checkbox": "^0.22.1",
-    "@operato/data-grist": "^0.2.4",
-    "@operato/ghost-print": "0.1.14",
-    "@operato/mini-popup": "^0.2.3",
-    "@operato/pull-to-refresh": "^0.2.4",
-    "@things-factory/api": "^4.0.1",
-    "@things-factory/apptool-ui": "^4.0.1",
-    "@things-factory/auth-ui": "^4.0.2",
-    "@things-factory/board-service": "^4.0.1",
-    "@things-factory/board-ui": "^4.0.1",
-    "@things-factory/context-ui": "^4.0.1",
-    "@things-factory/dashboard": "^4.0.1",
-    "@things-factory/export-ui": "^4.0.1",
-    "@things-factory/export-ui-excel": "^4.0.1",
-    "@things-factory/grist-ui": "^4.0.1",
-    "@things-factory/help": "^4.0.1",
-    "@things-factory/i18n-ui": "^4.0.1",
-    "@things-factory/integration-ui": "^4.0.1",
-    "@things-factory/lite-menu": "^4.0.1",
-    "@things-factory/more-ui": "^4.0.1",
-    "@things-factory/notification": "^4.0.1",
-    "@things-factory/oauth2-client": "^4.0.1",
-    "@things-factory/print-ui": "^4.0.1",
-    "@things-factory/resource-ui": "^4.0.2",
-    "@things-factory/scene-chartjs": "^4.0.1",
-    "@things-factory/scene-clock": "^4.0.1",
-    "@things-factory/scene-form": "^4.0.1",
-    "@things-factory/scene-gauge": "^4.0.1",
-    "@things-factory/scene-half-roundrect": "^4.0.1",
-    "@things-factory/scene-indoor-map": "^4.0.1",
-    "@things-factory/scene-news-ticker": "^4.0.1",
-    "@things-factory/scene-progressbar": "^4.0.1",
-    "@things-factory/scene-random": "^4.0.1",
-    "@things-factory/scene-switch": "^4.0.1",
-    "@things-factory/scene-tab": "^4.0.1",
-    "@things-factory/setting-base": "^4.0.1",
-    "@things-factory/setting-ui": "^4.0.1",
-    "@things-factory/shell": "^4.0.1",
-    "@things-factory/system-ui": "^4.0.1"
+    "@hatiolab/things-scene": "^2.7.12",
+    "@material/mwc-checkbox": "^0.25.3",
+    "@operato/data-grist": "^0.2.28",
+    "@operato/ghost-print": "0.2.26",
+    "@operato/ocr": "^0.2.26",
+    "@operato/popup": "^0.2.26",
+    "@operato/pull-to-refresh": "^0.2.26",
+    "@operato/scene-switch": "^0.0.3",
+    "@things-factory/api": "^4.0.6",
+    "@things-factory/apptool-ui": "^4.0.6",
+    "@things-factory/auth-ui": "^4.0.6",
+    "@things-factory/board-service": "^4.0.6",
+    "@things-factory/board-ui": "^4.0.6",
+    "@things-factory/context-ui": "^4.0.6",
+    "@things-factory/dashboard": "^4.0.6",
+    "@things-factory/export-ui": "^4.0.6",
+    "@things-factory/export-ui-excel": "^4.0.6",
+    "@things-factory/grist-ui": "^4.0.6",
+    "@things-factory/help": "^4.0.6",
+    "@things-factory/i18n-ui": "^4.0.6",
+    "@things-factory/integration-ui": "^4.0.6",
+    "@things-factory/lite-menu": "^4.0.6",
+    "@things-factory/more-ui": "^4.0.6",
+    "@things-factory/notification": "^4.0.6",
+    "@things-factory/oauth2-client": "^4.0.6",
+    "@things-factory/print-ui": "^4.0.6",
+    "@things-factory/resource-ui": "^4.0.6",
+    "@things-factory/scene-chartjs": "^4.0.6",
+    "@things-factory/scene-clock": "^4.0.6",
+    "@things-factory/scene-form": "^4.0.6",
+    "@things-factory/scene-gauge": "^4.0.6",
+    "@things-factory/scene-half-roundrect": "^4.0.6",
+    "@things-factory/scene-indoor-map": "^4.0.6",
+    "@things-factory/scene-news-ticker": "^4.0.6",
+    "@things-factory/scene-progressbar": "^4.0.6",
+    "@things-factory/scene-random": "^4.0.6",
+    "@things-factory/scene-tab": "^4.0.6",
+    "@things-factory/setting-base": "^4.0.6",
+    "@things-factory/setting-ui": "^4.0.6",
+    "@things-factory/shell": "^4.0.6",
+    "@things-factory/system-ui": "^4.0.6"
   },
   "devDependencies": {
-    "@things-factory/builder": "^4.0.1"
+    "@things-factory/builder": "^4.0.6"
   },
-  "gitHead": "db0fba9891f6706d3e07a2b2deab1e81eb064135"
+  "gitHead": "471247c3499ba439b074c7654ae8d8e9fc3972f0"
 }

package/server/service/reference/lambda-call.ts

@@ -0,0 +1,69 @@
+import fetch from 'node-fetch'
+
+import { config } from '@things-factory/env'
+import { gqlBuilder } from '@things-factory/utils'
+
+const appSyncConfig = config.get('awsAppSync')
+
+export async function interpretImages(images) {
+  const query = gqlBuilder.jsonToGraphQLQuery({
+    mutation: {
+      upload: {
+        __args: {
+          images
+        },
+        success_count: true,
+        failure_count: true,
+        result: {
+          key_values: true,
+          boundaries: true,
+          texts: true
+        }
+      }
+    }
+  })
+
+  const body = JSON.stringify({ query })
+  const response = await fetch(appSyncConfig['apiUrl'], {
+    method: 'POST',
+    headers: {
+      'Content-Type': 'application/graphql',
+      'x-api-key': appSyncConfig['apiKey']
+    },
+    body
+  })
+
+  const jsonRes = await response.json()
+  return jsonRes
+}
+
+// @deprecated
+function getRequestBody(images) {
+  // @things-factory/utils gqlBuilder.buildArgs 와 유사
+  const imageArgs = images.map(obj => {
+    const args = []
+    for (let key in obj) {
+      args.push(`${key}: \"${obj[key]}\"`)
+    }
+    return '{' + args.join(',') + '}'
+  })
+
+  // console.log(gqlBuilder.buildArgs(images))
+  // console.log(imageArgs)
+
+  const body = JSON.stringify({
+    query: `mutation {
+      upload(images: ${imageArgs}) { 
+        success_count
+        failure_count
+        results {
+          key_values
+          boundaries
+          texts
+        } 
+      }
+    }`
+  })
+
+  return body
+}

package/server/service/reference/reference-query.ts

@@ -1,18 +1,23 @@
-import { Resolver, Mutation, Query, Root, Arg, Ctx, Directive } from 'type-graphql'
-import { GraphQLUpload, FileUpload } from 'graphql-upload'
-import { publishProgress } from '@things-factory/shell'
-import { sleep } from '@things-factory/utils'
+import { FileUpload, GraphQLUpload } from 'graphql-upload'
+import { Arg, Ctx, Query, Resolver, Root } from 'type-graphql'
+
 import { Attachment, createAttachments } from '@things-factory/attachment-base'
+import { publishProgress, ScalarAny } from '@things-factory/shell'
+import { sleep } from '@things-factory/utils'
+
+import { interpretImages } from './lambda-call'
+
+const debug = require('debug')('things-factory:reference-app')
 
 @Resolver()
 export class ReferenceQuery {
-  @Query(returns => String, { description: 'To reference of ocr request' })
+  @Query(returns => ScalarAny, { description: 'To reference of ocr request' })
   async ocrRequest(
     @Root() _,
     @Arg('images', () => [GraphQLUpload])
     images: FileUpload[],
     @Ctx() context: any
-  ): Promise<string> {
+  ): Promise<ScalarAny> {
     const { domain, user, tx } = context.state
     const all = Promise.all(images)
 
@@ -25,9 +30,32 @@ export class ReferenceQuery {
         }
       })
       await createAttachments(_, { attachments }, context)
+
+      const files = await Promise.all(
+        images.map(async file => {
+          const { createReadStream, filename, mimetype } = await file
+          const readStream = createReadStream()
+          const image = await this.streamToString(readStream)
+          // format is 'image/jpeg'
+          const formatArr = mimetype.split('/')
+          return { data: image, name: filename, format: formatArr[formatArr.length - 1] }
+        })
+      )
+      const res = await interpretImages(files)
+      console.log('interpretImages response', JSON.stringify(res, null, ' '))
+      return res.data?.upload?.result
     }
 
-    return 'success'
+    return []
+  }
+
+  streamToString (stream) {
+    const chunks = [];
+    return new Promise((resolve, reject) => {
+      stream.on('data', (chunk) => chunks.push(Buffer.from(chunk)));
+      stream.on('error', (err) => reject(err));
+      stream.on('end', () => resolve(Buffer.concat(chunks).toString('base64')));
+    })
   }
 
   @Query(returns => String, { description: 'To reference of pending job progress' })

package/things-factory.config.js

@@ -56,6 +56,10 @@ export default {
       tagname: 'direct-print',
       page: 'direct-print'
     },
+    {
+      tagname: 'label-scan-page',
+      page: 'label-scan-page'
+    },
     {
       tagname: 'ghost-print-page',
       page: 'ghost-print-page'

package/translations/en.json

@@ -6,5 +6,6 @@
   "field.color": "color",
   "field.role": "role",
   "field.dynamic_type": "dynamic type",
-  "field.dynamic_value": "dynamic value"
-}
+  "field.dynamic_value": "dynamic value",
+  "text.ox-data-report-grand-total": "grand total"
+}

package/translations/ko.json

@@ -6,5 +6,6 @@
   "field.color": "색상",
   "field.role": "역할",
   "field.dynamic_type": "변화 타입",
-  "field.dynamic_value": "변화타입 값"
-}
+  "field.dynamic_value": "변화타입 값",
+  "text.ox-data-report-grand-total": "총합계"
+}

package/translations/ms.json

@@ -6,5 +6,6 @@
   "field.color": "color",
   "field.role": "role",
   "field.dynamic_type": "dynamic type",
-  "field.dynamic_value": "dynamic value"
-}
+  "field.dynamic_value": "dynamic value",
+  "text.ox-data-report-grand-total": "grand total"
+}

package/translations/zh.json

@@ -6,5 +6,6 @@
   "field.color": "color",
   "field.role": "role",
   "field.dynamic_type": "dynamic type",
-  "field.dynamic_value": "dynamic value"
-}
+  "field.dynamic_value": "dynamic value",
+  "text.ox-data-report-grand-total": "grand total"
+}

package/views/auth-page.html

@@ -80,7 +80,6 @@
     <!-- Load webcomponents-loader.js to check and load any polyfills your browser needs -->
     <script src="node_modules/@webcomponents/webcomponentsjs/webcomponents-loader.js"></script>
     <script src="node_modules/web-animations-js/web-animations-next.min.js"></script>
-    <script src="node_modules/@lottiefiles/lottie-player/dist/lottie-player.js"></script>
     <!-- Built with love using PWA Starter Kit -->
 
     <script src="<%- elementScript %>"></script>

package/logs/application-2021-11-04-14.log

@@ -1,4 +0,0 @@
-2021-11-04T05:54:18.294Z info: File Storage is Ready.
-2021-11-04T05:54:26.107Z info: Database connection established
-2021-11-04T05:54:30.807Z info: 🚀 Server ready at http://0.0.0.0:3000/graphql
-2021-11-04T05:54:30.812Z info: 🚀 Subscriptions ready at ws://0.0.0.0:3000/subscriptions

package/logs/application-2021-11-05-18.log

@@ -1,6 +0,0 @@
-2021-11-05T09:19:08.124Z info: File Storage is Ready.
-2021-11-05T09:19:12.759Z info: Database connection established
-2021-11-05T09:19:47.437Z info: File Storage is Ready.
-2021-11-05T09:19:51.042Z info: Database connection established
-2021-11-05T09:19:51.851Z info: 🚀 Server ready at http://0.0.0.0:3000/graphql
-2021-11-05T09:19:51.851Z info: 🚀 Subscriptions ready at ws://0.0.0.0:3000/subscriptions