@operato/scene-visualizer 1.2.36 → 1.2.39

package/package.json

@@ -2,7 +2,7 @@
   "name": "@operato/scene-visualizer",
   "description": "visualizer component for operato-scene",
   "author": "heartyoh",
-  "version": "1.2.36",
+  "version": "1.2.39",
   "main": "dist/index.js",
   "module": "dist/index.js",
   "license": "MIT",
@@ -36,7 +36,7 @@
     "@hatiolab/prettier-config": "^1.0.0",
     "@things-factory/builder": "^6.0.0",
     "@things-factory/operato-board": "^6.0.0",
-    "@types/three": "^0.151.0",
+    "@types/three": "^0.152.0",
     "@types/tinycolor2": "^1.4.3",
     "@typescript-eslint/eslint-plugin": "^4.33.0",
     "@typescript-eslint/parser": "^4.33.0",
@@ -62,5 +62,5 @@
       "prettier --write"
     ]
   },
-  "gitHead": "65a40a190365b3b6256409b6491af360e36d1a98"
+  "gitHead": "b9e52c76a2cd160a6f7341aa26694c928ed1051a"
 }

package/schema.gql

@@ -1360,9 +1360,15 @@ type Mutation {
   """To start new scenario instance"""
   startScenario(instanceName: String, scenarioName: String!, variables: Object): ScenarioInstance!
 
+  """To start posting scenario based on the schedule of the given scenario"""
+  startScenarioSchedule(scenarioId: String!): Scenario!
+
   """To start new scenario instance"""
   stopScenario(instanceName: String): ScenarioInstance
 
+  """To stop posting scenario based on the schedule of the given scenario"""
+  stopScenarioSchedule(scenarioId: String!): Scenario
+
   """
   To synchronize privilege master from graphql directives. Only superuser is permitted.
   """
@@ -2193,6 +2199,9 @@ type Query {
 
   """To fetch multiple Fonts"""
   fonts(filters: [Filter!], pagination: Pagination, sortings: [Sorting!]): FontList!
+
+  """To fetch a Global Board Model"""
+  globalBoardByName(name: String!): Board
   grantedRoles: [GrantedRole!]!
   grantingRoles(customerId: String!): [GrantedRole!]!
 
@@ -2398,6 +2407,7 @@ type Scenario {
   instances: [ScenarioInstance!]
   name: String!
   schedule: String
+  scheduleId: String
   state: String
   steps: [Step!]
   timezone: String

package/src/index.ts

@@ -26,3 +26,4 @@ export * from './sphere'
 export * from './visualizer'
 export * from './three-container'
 export * from './wall'
+export * from './light'

package/src/light.ts

@@ -0,0 +1,155 @@
+/*
+ * Copyright © HatioLab Inc. All rights reserved.
+ */
+import { Anchor, Component, ComponentNature, Ellipse } from '@hatiolab/things-scene'
+import * as THREE from 'three'
+import { RealObject } from './threed/real-object'
+
+const NATURE = {
+  mutable: false,
+  resizable: true,
+  rotatable: true,
+  properties: [
+    {
+      type: 'select',
+      label: 'light-type',
+      name: 'lightType',
+      property: {
+        options: ['', 'point', 'directional']
+      }
+    },
+    {
+      type: 'number',
+      label: 'intensity',
+      name: 'intensity'
+    },
+    {
+      type: 'number',
+      label: 'distance',
+      name: 'distance'
+    },
+    {
+      type: 'number',
+      label: 'decay',
+      name: 'decay'
+    },
+    {
+      type: 'checkbox',
+      label: 'cast-shadow',
+      name: 'castShadow'
+    },
+    {
+      type: 'number',
+      label: 'near',
+      name: 'near',
+      placeholder: '0.5'
+    },
+    {
+      type: 'number',
+      label: 'far',
+      name: 'far',
+      placeholder: '1000'
+    },
+    {
+      type: 'number',
+      label: 'fov',
+      name: 'fov',
+      placeholder: '90'
+    },
+    {
+      type: 'number',
+      label: 'zoom',
+      name: 'zoom',
+      placeholder: '1'
+    },
+    {
+      type: 'checkbox',
+      label: 'show-helper',
+      name: 'showHelper'
+    }
+  ],
+  help: 'scene/component/light'
+}
+
+export class LightObject extends RealObject<THREE.Light> {
+  helper?: THREE.CameraHelper
+
+  updatePointLight() {
+    var {
+      lightType = 'point',
+      distance = 0, // unlimited
+      intensity = 10,
+      decay = 1,
+      fillStyle: color = 'white',
+      castShadow,
+      near = 0.5,
+      far = 1000,
+      fov = 90,
+      zoom = 1,
+      showHelper
+    } = this.component.state
+
+    this.object3d!.color = new THREE.Color(color)
+    if (lightType == 'point') {
+      ;(this.object3d as THREE.PointLight)!.distance = distance
+      ;(this.object3d as THREE.PointLight)!.decay = decay
+    }
+    this.object3d!.intensity = intensity
+    this.object3d!.castShadow = castShadow
+    if (castShadow) {
+      const camera = this.object3d!.shadow?.camera as THREE.PerspectiveCamera
+      camera.far = far
+      camera.near = near
+      camera.fov = fov
+      camera.zoom = zoom
+    }
+
+    if (showHelper) {
+      const camera = this.object3d!.shadow?.camera as THREE.PerspectiveCamera
+
+      if (!this.helper) {
+        this.helper = new THREE.CameraHelper(camera!)
+        this.object3d.add(this.helper)
+      }
+    } else if (this.helper) {
+      this.object3d.remove(this.helper)
+      delete this.helper
+    }
+  }
+
+  protected getObject3dInstance(): THREE.Light {
+    var { lightType = 'point' } = this.component.state
+
+    return lightType == 'point' ? new THREE.PointLight() : new THREE.DirectionalLight()
+  }
+
+  update() {
+    this.clear()
+    this.build()
+
+    this.updateDimension()
+    this.updateHidden()
+
+    this.updatePointLight()
+  }
+}
+
+export class PointLight extends Ellipse {
+  is3dish() {
+    return true
+  }
+
+  buildRealObject(): RealObject | undefined {
+    return new LightObject(this)
+  }
+
+  get anchors(): Array<Anchor> {
+    return []
+  }
+
+  get nature(): ComponentNature {
+    return NATURE
+  }
+}
+
+Component.register('light', PointLight)

package/src/templates/index.ts

@@ -9,6 +9,7 @@ import sprite from './sprite'
 import wall from './wall'
 import desk from './desk'
 import camera from './camera'
+import light from './light'
 import GLTFObject from './gltf-object'
 
 export default [
@@ -16,6 +17,7 @@ export default [
   visualizer,
   rackTable,
   camera,
+  light,
   cube,
   cylinder,
   sphere,

package/src/templates/light.ts

@@ -0,0 +1,23 @@
+const icon = new URL('../../icons/light.png', import.meta.url).href
+
+export default {
+  type: 'light',
+  description: 'Light',
+  group: '3D' /* line|shape|textAndMedia|chartAndGauge|table|container|dataSource|IoT|3D|warehouse|form|etc */,
+  icon,
+  model: {
+    type: 'light',
+    rx: 10,
+    ry: 10,
+    cx: 150,
+    cy: 150,
+    zPos: 1000,
+    fillStyle: '#fff',
+    strokeStyle: '#000',
+    alpha: 1,
+    hidden: false,
+    lineWidth: 1,
+    lineDash: 'solid',
+    lineCap: 'butt'
+  }
+}

package/src/templates/sprite.ts

@@ -11,7 +11,7 @@ export default {
     left: 100,
     width: 200,
     height: 80,
-    zPos: 1,
+    zPos: 40,
     depth: 10,
     fillStyle: '#ffffff',
     strokeStyle: '#999',

package/src/three-container.ts

@@ -232,21 +232,8 @@ export class ThreeContainer extends Container implements ThreeDimensionalContain
 
     // Lights
     var _hemiLight = new THREE.HemisphereLight(0xdddddd, 0x333333, 0.035)
-    var _directionalLight = new THREE.DirectionalLight(0xd6e1ff, 0.01)
-    var _pointLight1 = new THREE.PointLight(0xd6e1ff, 1, undefined, 2)
-
-    _pointLight1.power = cameraZPos * 50
-    _pointLight1.castShadow = true
-    _pointLight1.position.set(0, cameraZPos, 0)
-    _pointLight1.shadow.camera.near = 0.1
-    _pointLight1.shadow.camera.far = cameraZPos * 2
-
-    // const helper = new THREE.CameraHelper(_pointLight1.shadow.camera)
-    // this._scene3d?.add(helper)
 
     this.scene3d!.add(_hemiLight)
-    this.scene3d!.add(_pointLight1)
-    this._camera.add(_directionalLight)
 
     this._mouse = new THREE.Vector2()
 
@@ -258,19 +245,11 @@ export class ThreeContainer extends Container implements ThreeDimensionalContain
     this._camera.updateProjectionMatrix()
 
     const floor = createFloor(this)
-    // if (this._floor) {
-    //   this.object3d.remove(this._floor)
-    //   this._floor.clear()
-    //   delete this._floor
-    // }
 
     if (floor) {
-      // this._floor = floor
       this._scene3d.add(floor)
     }
 
-    // this.invalidate()
-
     // postprocessing
 
     var composer = (this.composer = new EffectComposer(renderer3d!))