loupedeck-commander 1.2.11 → 1.3.0

package/common/touchbuttons.mjs

@@ -1,576 +0,0 @@
-import { loadImage } from 'canvas'
-//import { loadImage } from "https://deno.land/x/canvas/mod.ts";
-
-import * as shellif from '../interfaces/shellif.mjs'
-import * as httpif from '../interfaces/httpif.mjs'
-import * as opcuaif from '../interfaces/opcuaif.mjs'
-import format from 'string-template'
-import { calcDelta, invertColor } from './utils.mjs'
-import { EventEmitter } from 'node:events'
-
-
-export var opcuainterface = undefined
-var httpinterface = undefined
-var shellinterface = undefined
-export var profileEmitter = undefined
-export async function InitializeInterfaces(appConfig){
-  if (opcuainterface === undefined ){
-    opcuainterface = new opcuaif.OPCUAIf()
-  }
-  // the opcua interface needs the profile to register nodes with subscriptions:
-  opcuainterface.init(appConfig.parameters,appConfig)
-  if (httpinterface === undefined) 
-    httpinterface = new httpif.HTTPif()
-  if (shellinterface === undefined)
-    shellinterface = new shellif.SHELLif()
-  if (profileEmitter === undefined)
-    profileEmitter = new EventEmitter()
-}
-
-export async function StopInterfaces(){
-  if (opcuainterface !== undefined )
-    await opcuainterface.stop()
-  if (httpinterface !== undefined) 
-    await httpinterface.stop()
-  if (shellinterface !== undefined)
-    await shellinterface.stop()
-  
-  }
-
-export const ButtonIndex = {
-  BUTN_0: 0,
-  BUTN_1: 1,
-  BUTN_2: 2,
-  BUTN_3: 3,
-  BUTN_4: 3,
-  BUTN_5: 5,
-  BUTN_6: 6,
-  BUTN_7: 7,
-  home: 'home'
-}
-
-const ButtonType = {
-  NONE: '',
-  TOGGLE: 'TOGGLE',
-  PUSH: 'PUSH'
-}
-
-export class ButtonField {
-  #buttons = {}
-  #screen
-  width = 0
-  height = 0
-  #rows = 0
-  #columns = 0
-  #keys = []
-  #type
-  #name
-  #profile
-  
-  constructor (name, rows, columns, width, height, data, profile) {
-    console.info(`ButtonField ${name.padEnd(10, ' ')} Buttons: ${rows} x ${columns} , Pixels  ${width} x ${height}`)
-    this.#name = name
-    this.width = width
-    this.height = height
-    this.#rows = rows
-    this.#columns = columns
-    this.#screen = this.width > 0 && this.height > 0
-    this.#type = 'button'
-    this.#profile = profile
-    if (this.#screen) { this.#type = 'touch' }
-
-    const keys = Object.keys(data)
-    for (let i = 0; i < keys.length; i++) {
-      const key = keys[i]
-      const tb = new Button(`${this.#type}-${key}`, width / columns, height / rows, data[key],key,this.#profile)
-      this.#buttons[key] = tb
-    }
-
-    this.#keys = keys
-  }
-
-  
-  async draw (device) {
-    if (!this.#screen) {
-      // physical buttons:
-      for (let i = 0; i < this.#keys.length; i++) {
-        const key = this.#keys[i]
-        this.#buttons[key].drawPhysical(device, key)
-      }
-    } else {
-      // screen:
-      device.drawScreen(this.#name, ctx => {
-        ctx.globalCompositeOperation = 'source-atop'
-        for (let i = 0; i < this.#keys.length; i++) {
-          const key = this.#keys[i]
-          const iValue = parseInt(key, 10)
-          const row = Math.floor(iValue / device.columns)
-          const column = iValue % device.columns
-
-          this.#buttons[key].draw(row, column, ctx)
-        }
-      })
-    }
-  }
-
-  setState (id, val) {
-    this.#buttons[id].setState(val)
-  }
-
-  setIntState (id, val) {
-    this.#buttons[id].setIntState(val)
-  }
-
-  async load () {
-    for (let i = 0; i < this.#keys.length; i++) {
-      const key = this.#keys[i]
-      if (isNaN(key)) {
-        await this.#buttons[key].load(this.#profile)
-      } else {
-        const iVal = parseInt(key, 10)
-        await this.#buttons[iVal].load(this.#profile)
-      }
-    }
-  }
-
-  async pressed (id) {
-    this.checkAndCreateButton(id)
-    const result = await this.#buttons[id].pressed()
-    if (!result) {
-      console.info(`pressed ${this.#type} ${id}`)
-    }
-    return result
-  }
-
-  async released (id) {
-    const result = await this.#buttons[id].released()
-    if (result) {
-      // disable all other buttons of the group, if this one had been activated:
-      for (let i = 0; i < this.#keys.length; i++) {
-        let key = this.#keys[i]
-        if (!isNaN(key)) { key = parseInt(key, 10) }
-        if (id === key) { continue }
-        if (this.#buttons[key].group === this.#buttons[id].group) {
-          this.#buttons[key].setState(0)
-        }
-      }
-    }
-    if (!result) {
-      console.info(`released ${this.#type} ${id}`)
-    }
-    return result
-  }
-
-  async changed(buttonID,nodeid,val){
-    for (let i = 0; i < this.#keys.length; i++) {
-      let bID = this.#keys[i]
-      const result = await this.#buttons[bID].changed(i,nodeid,val)
-    } 
-  }
-
-  async rotated (id, delta) {
-    this.checkAndCreateButton(id)
-    const result = await this.#buttons[id].rotated(delta)
-    if (!result) { console.info(`rotated ${this.#type} ${id} ${delta}`) }
-    return result
-  }
-
-  async touchmove (id, x, y) {
-    this.checkAndCreateButton(id)
-    const result = await this.#buttons[id].touchmove(x, y)
-    if (!result) { console.info(`touchmove ${id} ${x} ${y}`) }
-    return result
-  }
-
-  checkAndCreateButton (id) {
-    if (!(id in this.#buttons)) {
-      const tb = new Button(id, 1, 1, id)
-      this.#buttons[id] = tb
-    }
-  }
-}
-
-export class Button {
-  #profile
-  #params
-  #data
-  width = 0
-  height = 0
-
-  #type = ButtonType.TOGGLE
-
-  #min = 0
-  #max = 100
-  #value = 50
-  #name = undefined
-  #nodeid = ""
-
-  #index = 0
-  #event
-  #keys
-  #states
-
-  group = ''
-
-  text = ''
-  font = '16px Arial'
-
-  #x = 0
-  #y = 0
-  #moveLeft
-  #moveRight
-  #moveUp
-  #moveDown
-
-  // Timestamp when button was pressed
-  timeStampPressed
-  // Timestamp when button was released
-  timeStampReleased
-  // Time actually hold the button in ms
-  timeHold
-  // Minimum ammount of time in ms to press a button:
-  minPressed = 25
-  key = -1
-
-  constructor (id, width, height, data,key,profile) {
-    this.id = id
-    this.key = key
-    this.width = width
-    this.height = height
-    this.#index = 0
-
-    if (data && data.states) {
-      this.#data = data
-
-      this.group = data.group
-      
-      this.#states = data.states
-      this.#keys = Object.keys(this.#states)
-      if (data.type) {
-        this.#type = data.type.toUpperCase()
-      }
-
-      if (data.minPressed) {
-        this.minPressed = data.minPressed
-      }
-
-      if (data.text) {
-        this.text = data.text
-      }
-    }
-    if (profile === undefined){
-      this.#profile = {}
-      this.#params = {}
-    }else{
-      this.#profile = profile
-      this.#params = profile.parameters
-      if (profile.parameters.min !== undefined)
-        this.#min = profile.parameters.min
-      if (profile.parameters.max !== undefined)
-        this.#max = profile.parameters.max
-    }
-    if (this.#states === undefined) {
-      this.#states = {}
-      this.#keys = []
-    }
-    if (data.nodeid){
-      this.#nodeid = format(data.nodeid, this.#params)
-    }
-    if (data.default) {
-      this.#index = this.#keys.indexOf(data.default)
-    }
-
-  }
-
-  setState (index = 0) {
-    this.#index = index
-  }
-
-  async drawPhysical (device, id) {
-    const elem = this.getCurrentElement()
-    if (!elem || !elem.color) { return }
-
-    const r = parseInt(elem.color.slice(1, 3), 16)
-    const g = parseInt(elem.color.slice(3, 5), 16)
-    const b = parseInt(elem.color.slice(5, 7), 16)
-
-    try {
-      var idx = parseInt(id, 10);
-
-      const val = {
-        id:idx,
-        color: `rgba(${r}, ${g}, ${b})`
-      }
-//      console.log(' Set Button Color',id, val.id,elem.color, val.color)
-      device.setButtonColor(val)
-    } catch (error) {
-      console.error(' Error', error)
-    }
-  }
-
-  async draw (row, column, ctx) {
-    const x = column * this.width
-    const y = row * this.height
-
-    const elem = this.getCurrentElement()
-
-    if (elem) {
-      if (elem.color) {
-        ctx.fillStyle = elem.color
-        ctx.fillRect(x, y, this.width, this.height)
-      }
-      if (elem.imgBuffer) {
-        ctx.drawImage(elem.imgBuffer, x, y, this.width, this.height)
-      }
-    }
-    if (this.text){
-      //const lastElem = this.getLastElement()
-      // Only change the text color, if it differnce from the currently set color
-      
-      ctx.fillStyle = invertColor(elem.color)
-      ctx.font = '20px Verdana'
-      ctx.textBaseline = 'top';
-      ctx.textAlign = 'left';
-      let dynamicText = format(this.text, this.getParams(elem))
-      ctx.fillText(dynamicText,x+6,y+6)  
-    }
-  }
-
-  async load (globalConfig) {
-    this.#profile = globalConfig
-    for (let i = 0; i < this.#keys.length; i++) {
-      const key = this.#keys[i]
-      const elem = this.#states[key]
-      const file = elem.image
-      if (file !== undefined && file !== '') {
-        try {
-          this.#states[key].imgBuffer = await loadImage(file)
-        } catch (e) {
-          console.error('No such image', file)
-          return false
-        }
-      }
-    }
-  }
-
-  getCurrentElement () {
-    const key = this.#keys[this.#index]
-    return this.#states[key]
-  }
-
-  getLastElement () {
-    let i=this.#index-1 
-    if (i < 0) { i = this.#keys.length - 1 }
-
-    const key = this.#keys[i]
-    return this.#states[key]
-  }
-
-  getCurrentText () {
-    return this.text
-  }
-
-  setIntState (val) {
-    this.#index = val
-  }
-
-  pressed () {
-    this.timeStampPressed = Date.now()
-
-    this.#index++
-    this.updateState(this.#index,"pressed")
-    return true
-  }
-
-  released () {
-    let elem = this.getCurrentElement()
-    if (!elem) { return false }
-    this.timeStampReleased = Date.now()
-    this.timeHold = this.timeStampReleased - this.timeStampPressed
-
-    if (this.timeHold < this.minPressed) {
-      // Update the State according to the not correct pressed state
-      console.log('Did not hold minimum time of ', this.minPressed, 'only', this.timeHold)
-      this.#index--
-      if (this.#index < 0) { this.#index = this.#keys.length - 1 }
-      return false
-    }
-
-    // Update the State according to the correctly pressed state
-    switch (this.#type) {
-      case ButtonType.TOGGLE:
-        // do nothing
-        break
-      default:
-        this.#index--
-        if (this.#index < 0) { this.#index = this.#keys.length - 1 }
-
-        break
-    }
-
-    this.updateState(this.#index,"released")
-    
-    return true // this.runCommand()
-  }
-
-  updateState(index,eventType){
-    this.#index = index
-    this.#event = eventType    
-    // Update the State according to the correctly pressed state
-    if (this.#index < 0) { this.#index = this.#keys.length - 1 }
-    this.#index %= this.#keys.length
-    this.runCommand()
-    //console.log("TODO: expect newState", newState)
-    return true // this.runCommand()
-  }
-
-  async rotated (delta) {
-    if (!this.getCurrentElement()) { return false }
-
-    this.#event = "rotated"
-    this.#value = calcDelta(this.#value, delta, this.#min, this.#max)
-    return this.runCommand()
-  }
-
-  async changed(buttonID,nodeid,val){
-    // Only handle updates within the same group identified by nodeid
-    if (nodeid !== this.#nodeid){
-        return
-    }
-
-    this.#index = 0;
-    for (let i = 0; i < this.#keys.length; i++) {
-      let key = this.#keys[i]
-      // check if the state-name is same as the value we get from outside:
-      if (val == key){
-        this.#index = i;
-        break;
-      }
-
-      // check if the nodeid is the same and the value is one of the states
-        let state = this.#states[key]
-        if (state.value === undefined)
-          continue
-
-        const params = {
-          id: buttonID,
-          key: buttonID,
-          state : key,
-          ...state
-        }
-        if (state && state.value !== undefined){
-          let strVal = state.value.toString()
-          let val1 = format(strVal,params)
-          if (val1 === val?.toString()){
-            this.#index = i;
-            break;
-          }
-        }
-        //break;
-    }
-  }
-
-  async touchmove (x, y) {
-    // if (!this.getCurrentElement()) { return false }
-
-    if (x > this.#x) {
-      this.#moveRight = true
-      this.#moveLeft = false
-    } else if (x < this.#x) {
-      this.#moveRight = false
-      this.#moveLeft = true
-    }
-
-    if (y > this.#y) {
-      this.#moveDown = true
-      this.#moveUp = false
-    } else if (y < this.#y) {
-      this.#moveDown = false
-      this.#moveUp = true
-    }
-
-    this.#x = x
-    this.#y = y
-    // console.log(`d: ${this.#moveDown}  r: ${this.#moveRight} `)
-    return false
-  }
-
-  getParams(elem){
-    // Call an action - include dynamic parameters
-    // and also all attributes of elem + global config
-    const params = {
-      text: this.getCurrentText(),
-      ...this.#profile.parameters,
-      ...elem,
-      id: this.id,
-      key: this.key,
-      event: this.#event,
-      pressed : this.#event == "pressed",
-      released : this.#event == "released",
-      rotated : this.#event == "rotated",
-      state: this.#keys[this.#index],
-      min: this.#min,
-      max: this.#max,
-      x: (this.#x %100),
-      y: (this.#y %100)
-    }
-
-    if (params.value === undefined)
-      params.value = this.#value
-
-    return params
-  }
-
-  async runCommand () {
-    const elem = this.getCurrentElement()
-    // Only continue, if we have an element:    
-    if (!elem) {
-      return
-    }
-    // Filter for Event Type:
-    if (elem.filter && elem.filter != this.#event){
-      return
-    }
-
-    if (elem.profile !== undefined) {
-      profileEmitter.emit("profileChanged", elem.profile)
-    }
-
-    // Only continue, if we have an element, that contains some kind of command:    
-    if (!elem.cmd && !elem.http && !elem.opcua) {
-      return
-    }
-
-    let params = this.getParams(elem)
-    let res = ''
-    if ('cmd' in elem) {
-      if (shellinterface){
-        res = await shellinterface.call(elem.cmd, params)
-      }else{
-        console.warn("shellinterface not started")
-      }
-    }
-    if ('http' in elem) {
-      if (httpinterface){
-        res = await httpinterface.call(elem.http, params)
-      }else{
-        console.warn("httpinterface not started")
-      }
-    }
-    if ('opcua' in elem) {
-      if (opcuainterface){
-        res = await opcuainterface.call(elem.opcua, params)
-
-        if (this.#data.statenodeid){
-          let stateParams = params
-          params.value = params.state
-          res = await opcuainterface.call(this.#data.statenodeid, params)
-        }
-      }else{
-        console.warn("opcuainterface not started")
-      }
-    }
-
-    return res
-  }
-}