@operato/scene-integration 8.0.0-beta.0 → 8.0.0-beta.2

package/src/client-api.ts

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

package/src/connection-control.ts

@@ -1,127 +0,0 @@
-import gql from 'graphql-tag'
-
-import { Component, ComponentNature, RectPath, Shape } from '@hatiolab/things-scene'
-import { client } from '@operato/graphql'
-
-const NATURE: ComponentNature = {
-  mutable: false,
-  resizable: true,
-  rotatable: true,
-  properties: [
-    {
-      type: 'select',
-      label: 'connection-name',
-      name: 'connectionName',
-      property: {
-        options: async () => {
-          var response = await client.query({
-            query: gql`
-              query {
-                connections {
-                  items {
-                    name
-                  }
-                }
-              }
-            `
-          })
-          if (response.errors) {
-            return ['']
-          }
-
-          return [''].concat(response.data.connections.items.map((item: any) => item.name))
-        }
-      }
-    },
-    {
-      type: 'select',
-      label: 'control-type',
-      name: 'controlType',
-      property: {
-        options: [
-          {
-            display: '',
-            value: ''
-          },
-          {
-            display: 'connect',
-            value: 'connect'
-          },
-          {
-            display: 'disconnect',
-            value: 'disconnect'
-          }
-        ]
-      }
-    }
-  ],
-  'value-property': 'controlType',
-  help: 'scene/component/connection-control'
-}
-
-export default class ConnectionControl extends RectPath(Shape) {
-  static _image: HTMLImageElement
-
-  static get image() {
-    if (!ConnectionControl._image) {
-      ConnectionControl._image = new Image()
-      ConnectionControl._image.src = new URL('../icons/symbol-connection-control.png', import.meta.url).href
-    }
-    return ConnectionControl._image
-  }
-
-  render(context: CanvasRenderingContext2D) {
-    var { left, top, width, height } = this.bounds
-    context.beginPath()
-    this.drawImage(context, ConnectionControl.image, left, top, width, height)
-  }
-
-  get nature() {
-    return NATURE
-  }
-
-  get controlType() {
-    return this.getState('controlType')
-  }
-
-  set controlType(controlType: string) {
-    this.setState('controlType', controlType)
-    this.controlConnect()
-  }
-
-  async controlConnect() {
-    let { controlType, connectionName } = this.state
-
-    if (!connectionName || !this.app.isViewMode) return
-
-    switch (controlType) {
-      case 'connect':
-      case true:
-      case 1:
-        controlType = 'connect'
-        break
-      default:
-        controlType = 'disconnect'
-    }
-
-    var query = ''
-
-    query = `mutation{
-      ${controlType}Connection(name: "${connectionName}") {
-        status
-      }
-    }`
-
-    if (client) {
-      var response = await client.query({
-        query: gql`
-          ${query}
-        `
-      })
-
-      this.data = response
-    }
-  }
-}
-
-Component.register('connection-control', ConnectionControl)

package/src/connection-state-subscription.ts

@@ -1,110 +0,0 @@
-import gql from 'graphql-tag'
-
-import { Component, ComponentNature, DataSource, RectPath, Shape } from '@hatiolab/things-scene'
-import { client, subscribe } from '@operato/graphql'
-
-const NATURE: ComponentNature = {
-  mutable: false,
-  resizable: true,
-  rotatable: true,
-  properties: [
-    {
-      type: 'select',
-      label: 'connection-name',
-      name: 'connectionName',
-      property: {
-        options: async () => {
-          var response = await client.query({
-            query: gql`
-              query {
-                connections {
-                  items {
-                    name
-                  }
-                }
-              }
-            `
-          })
-          if (response.errors) {
-            return ['']
-          }
-
-          return [''].concat(response.data.connections.items.map((item: any) => item.name))
-        }
-      }
-    }
-  ],
-  help: 'scene/component/connection-state-subscription'
-}
-
-export default class ConnectionStateSubscription extends DataSource(RectPath(Shape)) {
-  static _image: HTMLImageElement
-  static get image() {
-    if (!ConnectionStateSubscription._image) {
-      ConnectionStateSubscription._image = new Image()
-      ConnectionStateSubscription._image.src = new URL(
-        '../icons/symbol-connection-state-subscription.png',
-        import.meta.url
-      ).href
-    }
-
-    return ConnectionStateSubscription._image
-  }
-
-  private subscription?: {
-    unsubscribe(): void
-  }
-
-  dispose() {
-    super.dispose()
-
-    this.subscription?.unsubscribe()
-    delete this.subscription
-  }
-
-  render(context: CanvasRenderingContext2D) {
-    var { left, top, width, height } = this.bounds
-
-    context.beginPath()
-    this.drawImage(context, ConnectionStateSubscription.image, left, top, width, height)
-  }
-
-  ready() {
-    if (!this.app.isViewMode) return
-    this._initConnectionStateSubscription()
-  }
-
-  get nature() {
-    return NATURE
-  }
-
-  _initConnectionStateSubscription() {
-    if (!this.app.isViewMode) return
-    this.startSubscribe()
-  }
-
-  async startSubscribe() {
-    var { connectionName } = this.state
-
-    this.subscription = await subscribe(
-      {
-        query: gql`subscription {
-          connectionState(name: "${connectionName}") {
-            name
-            state
-            timestamp
-          }
-        }`
-      },
-      {
-        next: async ({ data }: { data: any }) => {
-          if (data) {
-            this.data = data.connectionState
-          }
-        }
-      }
-    )
-  }
-}
-
-Component.register('connection-state-subscription', ConnectionStateSubscription)

package/src/data-subscription.ts

@@ -1,41 +0,0 @@
-import { Component, ComponentNature, DataSource, RectPath, Shape } from '@hatiolab/things-scene'
-
-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: HTMLImageElement
-  static get image() {
-    if (!DataSubscription._image) {
-      DataSubscription._image = new Image()
-      DataSubscription._image.src = new URL('../icons/symbol-data-subscription.png', import.meta.url).href
-    }
-
-    return DataSubscription._image
-  }
-
-  render(context: CanvasRenderingContext2D) {
-    var { left, top, width, height } = this.bounds
-
-    context.beginPath()
-    this.drawImage(context, DataSubscription.image, left, top, width, height)
-  }
-
-  get nature() {
-    return NATURE
-  }
-}
-
-Component.register('data-subscription', DataSubscription)

package/src/editors/index.ts

@@ -1 +0,0 @@
-export default []

package/src/index.ts

@@ -1,21 +0,0 @@
-import DataSubscription from './data-subscription'
-import ScenarioControl from './scenario-control'
-import ScenarioRun from './scenario-run'
-import ScenarioStart from './scenario-start'
-import ScenarioStop from './scenario-stop'
-import ScenarioInstanceSubscription from './scenario-instance-subscription'
-import ScenarioQueueSubscription from './scenario-queue-subscription'
-import ConnectionStateSubscription from './connection-state-subscription'
-import ConnectionControl from './connection-control'
-
-export default [
-  DataSubscription,
-  ScenarioControl,
-  ScenarioRun,
-  ScenarioStart,
-  ScenarioStop,
-  ScenarioInstanceSubscription,
-  ScenarioQueueSubscription,
-  ConnectionStateSubscription,
-  ConnectionControl
-]

package/src/scenario-control.ts

@@ -1,121 +0,0 @@
-import gql from 'graphql-tag'
-
-import { Component, ComponentNature, DataSource, Properties, RectPath, Shape } from '@hatiolab/things-scene'
-import { client } from '@operato/graphql'
-
-import { scenarios } from './client-api'
-
-const NATURE: ComponentNature = {
-  mutable: false,
-  resizable: true,
-  rotatable: true,
-  properties: [
-    {
-      type: 'select',
-      label: 'scenario-name',
-      name: 'scenarioName',
-      property: {
-        options: scenarios
-      }
-    },
-    {
-      type: 'select',
-      label: 'control-type',
-      name: 'controlType',
-      property: {
-        options: [
-          {
-            display: '',
-            value: ''
-          },
-          {
-            display: 'start',
-            value: 'start'
-          },
-          {
-            display: 'stop',
-            value: 'stop'
-          }
-        ]
-      }
-    }
-  ],
-  'value-property': 'controlType',
-  help: 'scene/component/scenario-control'
-}
-
-export default class ScenarioControl extends DataSource(RectPath(Shape)) {
-  static _image: HTMLImageElement
-
-  static get image() {
-    if (!ScenarioControl._image) {
-      ScenarioControl._image = new Image()
-      ScenarioControl._image.src = new URL('../icons/symbol-scenario-control.png', import.meta.url).href
-    }
-    return ScenarioControl._image
-  }
-
-  render(context: CanvasRenderingContext2D) {
-    var { left, top, width, height } = this.bounds
-    context.beginPath()
-    this.drawImage(context, ScenarioControl.image, left, top, width, height)
-  }
-
-  ready() {
-    super.ready()
-
-    if (this.app.isViewMode) {
-      this.requestData()
-    }
-  }
-
-  get nature() {
-    return NATURE
-  }
-
-  onchange(after: Properties) {
-    if ('controlType' in after) {
-      this.requestData()
-    }
-  }
-
-  get controlType() {
-    return this.getState('controlType')
-  }
-
-  set controlType(controlType) {
-    this.setState('controlType', controlType)
-  }
-
-  async requestData() {
-    let { controlType, scenarioName } = this.state
-    if (!controlType || !scenarioName || !this.app.isViewMode) {
-      return
-    }
-
-    var query = ''
-    if (controlType == 'start') {
-      query = `mutation{
-        ${controlType}Scenario(instanceName: "${scenarioName}", scenarioName: "${scenarioName}", variables: {}) {
-          state
-        }
-      }`
-    } else {
-      query = `mutation{
-        ${controlType}Scenario(instanceName: "${scenarioName}") {
-          state
-        }
-      }`
-    }
-
-    var response = await client.query({
-      query: gql`
-        ${query}
-      `
-    })
-
-    this.data = response
-  }
-}
-
-Component.register('scenario-control', ScenarioControl)

package/src/scenario-instance-subscription.ts

@@ -1,115 +0,0 @@
-import gql from 'graphql-tag'
-
-import { Component, ComponentNature, DataSource, RectPath, Shape } from '@hatiolab/things-scene'
-import { subscribe } from '@operato/graphql'
-
-import { scenarios } from './client-api'
-
-const NATURE: ComponentNature = {
-  mutable: false,
-  resizable: true,
-  rotatable: true,
-  properties: [
-    {
-      type: 'select',
-      label: 'scenario-name',
-      name: 'scenarioName',
-      property: {
-        options: scenarios
-      }
-    },
-    {
-      type: 'string',
-      label: 'instance-name',
-      name: 'instanceName'
-    }
-  ],
-  help: 'scene/component/scenario-instance-subscription'
-}
-
-export default class ScenarioInstanceSubscription extends DataSource(RectPath(Shape)) {
-  static _image: HTMLImageElement
-
-  static get image() {
-    if (!ScenarioInstanceSubscription._image) {
-      ScenarioInstanceSubscription._image = new Image()
-      ScenarioInstanceSubscription._image.src = new URL(
-        '../icons/symbol-scenario-instance-subscription.png',
-        import.meta.url
-      ).href
-    }
-
-    return ScenarioInstanceSubscription._image
-  }
-
-  private subscription?: {
-    unsubscribe(): void
-  }
-
-  dispose() {
-    super.dispose()
-
-    this.subscription?.unsubscribe()
-    delete this.subscription
-  }
-
-  render(context: CanvasRenderingContext2D) {
-    var { left, top, width, height } = this.bounds
-
-    context.beginPath()
-    this.drawImage(context, ScenarioInstanceSubscription.image, left, top, width, height)
-  }
-
-  ready() {
-    if (!this.app.isViewMode) return
-    this._initScenarioInstanceSubscription()
-  }
-
-  get nature() {
-    return NATURE
-  }
-
-  _initScenarioInstanceSubscription() {
-    if (!this.app.isViewMode) return
-    this.startSubscribe()
-  }
-
-  async startSubscribe() {
-    var { instanceName, scenarioName = '' } = this.state
-
-    instanceName = instanceName || scenarioName
-
-    this.subscription = await subscribe(
-      {
-        query: gql`
-        subscription {
-          scenarioInstanceState(instanceName: "${instanceName}", scenarioName: "${scenarioName}") {
-            instanceName
-            scenarioName
-            state
-            variables
-            progress{
-              rounds
-              rate
-              steps
-              step
-            }
-            data
-            message
-            timestamp
-          }
-        }
-      `
-      },
-      {
-        next: async ({ data }: { data: any }) => {
-          if (data) {
-            this.data = data.scenarioInstanceState
-          }
-        }
-      }
-    )
-  }
-}
-
-Component.register('scenario-instance-subscription', ScenarioInstanceSubscription)

package/src/scenario-queue-subscription.ts

@@ -1,88 +0,0 @@
-import gql from 'graphql-tag'
-
-import { Component, ComponentNature, DataSource, RectPath, Shape } from '@hatiolab/things-scene'
-import { subscribe } from '@operato/graphql'
-
-const NATURE: ComponentNature = {
-  mutable: false,
-  resizable: true,
-  rotatable: true,
-  properties: [],
-  help: 'scene/component/scenario-queue-subscription'
-}
-
-export default class ScenarioQueueSubscription extends DataSource(RectPath(Shape)) {
-  static _image: HTMLImageElement
-
-  static get image() {
-    if (!ScenarioQueueSubscription._image) {
-      ScenarioQueueSubscription._image = new Image()
-      ScenarioQueueSubscription._image.src = new URL(
-        '../icons/symbol-scenario-queue-subscription.png',
-        import.meta.url
-      ).href
-    }
-
-    return ScenarioQueueSubscription._image
-  }
-
-  private subscription?: {
-    unsubscribe(): void
-  }
-
-  dispose() {
-    super.dispose()
-
-    this.subscription?.unsubscribe()
-    delete this.subscription
-  }
-
-  render(context: CanvasRenderingContext2D) {
-    var { left, top, width, height } = this.bounds
-
-    context.beginPath()
-    this.drawImage(context, ScenarioQueueSubscription.image, left, top, width, height)
-  }
-
-  ready() {
-    if (!this.app.isViewMode) return
-    this._initScenarioQueueSubscription()
-  }
-
-  get nature() {
-    return NATURE
-  }
-
-  _initScenarioQueueSubscription() {
-    if (!this.app.isViewMode) return
-    this.startSubscribe()
-  }
-
-  async startSubscribe() {
-    this.subscription = await subscribe(
-      {
-        query: gql`
-          subscription {
-            scenarioQueueState {
-              queue {
-                stuff
-                due
-                priority
-                tag
-              }
-            }
-          }
-        `
-      },
-      {
-        next: async ({ data }: { data: any }) => {
-          if (data) {
-            this.data = data.scenarioQueueState
-          }
-        }
-      }
-    )
-  }
-}
-
-Component.register('scenario-queue-subscription', ScenarioQueueSubscription)