@fmsim/machine 0.0.67 → 0.0.69

package/src/data-subscription.ts

@@ -1,141 +0,0 @@
-import { SubscriptionClient } from 'subscriptions-transport-ws'
-import { Component, ComponentNature, DataSource, RectPath, Shape } from '@hatiolab/things-scene'
-import { getRestServiceFullPath } from '@fmsim/api/restful.js'
-
-const COMPONENT_IMAGE = new URL('../icons/symbol-data-subscription.png', import.meta.url).href
-
-const NATURE: ComponentNature = {
-  mutable: false,
-  resizable: true,
-  rotatable: true,
-  properties: [
-    {
-      type: 'string',
-      label: 'tag',
-      name: 'tag'
-    }
-  ],
-  'value-property': 'tag',
-  help: 'scene/component/data-subscription'
-}
-
-export default class DataSubscription extends DataSource(RectPath(Shape)) {
-  static _image
-  subscription
-  client
-  disposed
-
-  static get image() {
-    if (!DataSubscription._image) {
-      DataSubscription._image = new Image()
-      DataSubscription._image.src = COMPONENT_IMAGE
-    }
-
-    return DataSubscription._image
-  }
-
-  dispose() {
-    if (this.subscription) {
-      this.subscription.unsubscribe()
-    }
-    if (this.client) {
-      this.client.unsubscribeAll()
-      this.client.close(true)
-    }
-
-    super.dispose()
-  }
-
-  render(context) {
-    var { left, top, width, height } = this.bounds
-
-    context.beginPath()
-    this.drawImage(context, DataSubscription.image, left, top, width, height)
-  }
-
-  ready() {
-    this._initDataSubscription()
-  }
-
-  get nature() {
-    return NATURE
-  }
-
-  get tag() {
-    return this.state.tag
-  }
-
-  set tag(tag) {
-    this.setState('tag', tag)
-  }
-
-  _initDataSubscription() {
-    if (!this.app.isViewMode) return
-
-    this.requestData()
-  }
-
-  async requestData() {
-    var { tag } = this.state
-    var self = this
-    var query = `"${tag}"`
-    // var query = `
-    // subscription {
-    //   data(tag: "${tag}") {
-    //     tag
-    //     data
-    //   }
-    // }`
-    let wsKey = guid()
-    // url = 'ws://' + mcsAutoConfig.serverInfo.address + mcsAutoConfig.serverInfo.prefix + '/ws/fmbServer/' + wsKey
-    var endpoint = getRestServiceFullPath().replace(/^http/, 'ws') + '/ws/fmbServer/' + wsKey
-    // sessionStorage.getItem('')
-    this.client = new SubscriptionClient(
-      endpoint,
-      {
-        reconnect: true,
-        connectionParams: {
-          headers: {}
-        }
-      },
-      null
-    )
-
-    this.client.onError(e => {
-      var client = this.client
-      // 보드가 실행중이면 재시도, 아니면 재연결 취소
-      if (this.disposed) {
-        client.reconnect = false
-
-        this.client.unsubscribeAll()
-        this.client.close(true)
-      }
-    })
-    this.client.onConnected(() => {
-      this.subscription = this.client.request({ query }).subscribe({
-        next({ data }) {
-          if (data) {
-            self.data = data.data.data
-          }
-        }
-      })
-      console.log('this.subscription : ', this.subscription)
-    })
-    // this.subscription = this.client.request({ query }).subscribe({
-    //   next({ data }) {
-    //     if (data) {
-    //       self.data = data.data.data
-    //     }
-    //   }
-    // })
-
-    function guid() {
-      function s4() {
-        return (((1 + Math.random()) * 0x10000) | 0).toString(16).substring(1)
-      }
-      return s4() + s4() + '-' + s4() + '-' + s4() + '-' + s4() + '-' + s4() + s4() + s4()
-    }
-  }
-}
-
-Component.register('data-subscription', DataSubscription)

package/src/features/client-api-restful.ts

@@ -1,45 +0,0 @@
-import { getThemes } from '@fmsim/api/restful.js'
-
-export const themesColorMap = async () => {
-  var result = (await getThemes())?.data
-  if (!result || !result.status) {
-    document.dispatchEvent(
-      new CustomEvent('notify', {
-        detail: {
-          level: 'info',
-          message: `Fetch Connection List Error!`
-        }
-      })
-    )
-  }
-
-  const items = ((result && result.themeList.items) || [])
-    .filter((item: any) => item.type == 'color-map')
-    .map((item: any) => item.name)
-
-  const sorted = items.sort()
-
-  return [''].concat(sorted)
-}
-
-export const themesColorRange = async () => {
-  var result = (await getThemes())?.data
-  if (!result || !result.status) {
-    document.dispatchEvent(
-      new CustomEvent('notify', {
-        detail: {
-          level: 'info',
-          message: `Fetch Connection List Error!`
-        }
-      })
-    )
-  }
-
-  const items = ((result && result.themeList.items) || [])
-    .filter((item: any) => item.type == 'color-ranges')
-    .map((item: any) => item.name)
-
-  const sorted = items.sort()
-
-  return [''].concat(sorted)
-}

package/src/features/client-api.ts

@@ -1,52 +0,0 @@
-import gql from 'graphql-tag'
-
-import { client } from '@operato/graphql'
-
-export const themesColorMap = async () => {
-  var response = await client.query({
-    query: gql`
-      query {
-        themes {
-          items {
-            name
-            type
-          }
-        }
-      }
-    `
-  })
-
-  if (response.errors) {
-    return ['']
-  }
-
-  const items = response.data.themes.items.filter((item: any) => item.type == 'color-map').map((item: any) => item.name)
-  const sorted = items.sort()
-
-  return [''].concat(sorted)
-}
-
-export const themesColorRange = async () => {
-  var response = await client.query({
-    query: gql`
-      query {
-        themes {
-          items {
-            name
-            type
-          }
-        }
-      }
-    `
-  })
-  if (response.errors) {
-    return ['']
-  }
-
-  const items = response.data.themes.items
-    .filter((item: any) => item.type == 'color-ranges')
-    .map((item: any) => item.name)
-  const sorted = items.sort()
-
-  return [''].concat(sorted)
-}

package/src/mcs-gauge-capacity-circle.ts

@@ -1,113 +0,0 @@
-import { Component, ComponentNature, Ellipse, Properties } from '@hatiolab/things-scene'
-import { getVaueOnRanges } from './utils/get-value-on-ranges'
-import { MCSStatusMixin } from './features/mcs-status-mixin'
-import { LEGEND_CAPACITY, Legend } from './features/mcs-status-default'
-
-const NATURE: ComponentNature = {
-  mutable: false,
-  resizable: true,
-  rotatable: true,
-  properties: [
-    {
-      type: 'number',
-      name: 'currentUsage',
-      label: 'current-usage'
-    },
-    {
-      type: 'number',
-      name: 'highWatermark',
-      label: 'high-watermark'
-    },
-    {
-      type: 'number',
-      name: 'maxCapacity',
-      label: 'max-capacity'
-    },
-    {
-      type: 'hidden',
-      name: 'usage',
-      label: 'usage'
-    }
-  ],
-  'value-property': 'usage'
-}
-
-export default class MCSGaugeCapacityCircle extends MCSStatusMixin(Ellipse) {
-  static get nature() {
-    return NATURE
-  }
-
-  getTheme() {
-    const { legendName } = this.state
-
-    if (legendName) {
-      return (this.root as any)?.style?.[legendName]
-    }
-  }
-
-  get legend(): Legend {
-    return this.getTheme() || this.getLegendFallback()
-  }
-
-  getLegendFallback() {
-    return LEGEND_CAPACITY
-  }
-
-  get statusColor() {
-    return getVaueOnRanges(this.usage, this.legend)
-  }
-
-  render(context: CanvasRenderingContext2D) {
-    var { cx, cy, rx, ry } = this.state
-    const radius = Math.min(rx, ry)
-
-    context.beginPath()
-
-    context.arc(cx, cy, radius, 0, Math.PI * 2)
-    context.fillStyle = 'gray'
-    context.fill()
-    this.drawStroke(context)
-
-    const startAngle = Math.PI * -0.5
-    const endAngle = startAngle + Math.PI * 2 * (this.value / 100)
-
-    context.beginPath()
-
-    context.moveTo(cx, cy)
-    context.arc(cx, cy, radius, startAngle, endAngle)
-    context.lineTo(cx, cy)
-    context.fillStyle = this.statusColor!
-
-    context.fill()
-  }
-
-  get usage() {
-    const { currentUsage = 0, maxCapacity = 100 } = this.state
-    return Math.round((currentUsage / maxCapacity) * 100)
-  }
-
-  set usage(usage: number) {
-    // intentionally have done nothing
-  }
-
-  onchangeData(after: Properties, before: Properties): void {
-    const {
-      CURRENTCAPACITY = 0,
-      MAXCAPACITY = 100,
-      HIGHWATERMARK = 100
-    } = typeof this.data == 'object' ? this.data : {}
-
-    const currentUsage = Number(CURRENTCAPACITY) || 0
-    const maxCapacity = Number(MAXCAPACITY) || 100
-    const highWatermark = Number(HIGHWATERMARK) || 100
-
-    this.setState({
-      currentUsage,
-      maxCapacity,
-      highWatermark,
-      usage: Math.round((currentUsage / maxCapacity) * 100)
-    })
-  }
-}
-
-Component.register('MCSGaugeCapacityCircle', MCSGaugeCapacityCircle)