Enable storing settings

OPC_UA_Clients/Release2/IJT_Web_Client/Javascripts/Views/Servers/EndpointGraphics.mjs

@@ -15,7 +15,7 @@ import TraceGraphics from 'views/Trace/TraceGraphics.mjs'
 import AddressSpaceGraphics from 'views/AddressSpace/AddressSpaceGraphics.mjs'
 import EventGraphics from 'views/Events/EventGraphics.mjs'
 import MethodGraphics from 'views/Methods/MethodGraphics.mjs'
-import USDemoSettings from 'views/Demo/USDemoSettings.mjs'
+import Settings from 'views/Servers/Settings.mjs'
 import USDemo from 'views/Demo/USDemo.mjs'
 import AssetGraphics from 'views/Assets/AssetGraphics.mjs'
 import ConnectionGraphics from 'views/Connection/ConnectionGraphics.mjs'
@@ -54,6 +54,9 @@ export default class EndpointGraphics extends BasicScreen {
     const connectionGraphics = new ConnectionGraphics(this.connectionManager)
     tabGenerator.generateTab(connectionGraphics, true)
 
+    const settings = new Settings(webSocketManager)
+    tabGenerator.generateTab(settings)
+
     const addressSpace = new AddressSpace(this.connectionManager)
     const addressSpaceGraphics = new AddressSpaceGraphics(addressSpace)
     tabGenerator.generateTab(addressSpaceGraphics, false)
@@ -75,10 +78,7 @@ export default class EndpointGraphics extends BasicScreen {
     const methodGraphics = new MethodGraphics(methodManager, addressSpace)
     tabGenerator.generateTab(methodGraphics)
 
-    const demoSettings = new USDemoSettings()
-    tabGenerator.generateTab(demoSettings)
-
-    const demoGraphics = new USDemo(methodManager, resultManager, this.connectionManager, demoSettings)
+    const demoGraphics = new USDemo(methodManager, resultManager, this.connectionManager, settings)
     tabGenerator.generateTab(demoGraphics)
 
     const resultGraphics = new ResultGraphics(resultManager)

OPC_UA_Clients/Release2/IJT_Web_Client/Javascripts/Views/Servers/Settings.mjs

@@ -0,0 +1,101 @@
+import BasicScreen from '../GraphicSupport/BasicScreen.mjs' // Basic functionality application code for the screen functionality
+
+/**
+ * The purpose of this class is to generate an HTML representation of tightening selection and basic
+ * display of a result for OPC UA Industrial Joining Technologies communication
+ */
+export default class Settings extends BasicScreen {
+  constructor (webSocketManager) {
+    super('Settings', 'tighteningsystem')
+
+    this.webSocketManager = webSocketManager
+    this.productId = 'www.atlascopco.com/CABLE-B0000000-'
+    this.JoiningProcess1 = 'ProgramIndex_1'
+    this.JoiningProcess2 = 'ProgramIndex_2'
+
+    // Listen to the tree of possible connection points (Available OPC UA servers)
+    this.webSocketManager.subscribe(null, 'get settings', (msg) => {
+      this.settings = msg
+      this.productId = msg.productid
+      this.JoiningProcess1 = msg.button1selection
+      this.JoiningProcess2 = msg.button2selection
+
+      this.container.innerHTML = ''
+
+      const labelElement = document.createElement('label')
+      labelElement.innerHTML = 'ProductId   '
+      this.container.appendChild(labelElement)
+
+      this.createInput(this.productId, this.container, (evt) => {
+        this.productId = evt.srcElement.value
+      }, '40')
+      this.container.appendChild(document.createElement('br'))
+
+      const labelElement2 = document.createElement('label')
+      labelElement2.innerHTML = 'Button 1 selection   '
+      this.container.appendChild(labelElement2)
+
+      this.createInput(this.JoiningProcess1, this.container, (evt) => {
+        this.JoiningProcess1 = evt.srcElement.value
+        console.log(evt.srcElement.value)
+      }, '40')
+      this.container.appendChild(document.createElement('br'))
+
+      const labelElement3 = document.createElement('label')
+      labelElement3.innerHTML = 'Button 2 selection   '
+      this.container.appendChild(labelElement3)
+
+      this.createInput(this.JoiningProcess2, this.container, (evt) => {
+        this.JoiningProcess2 = evt.srcElement.value
+      }, '40')
+    })
+
+    this.webSocketManager.send('get settings')
+
+    this.fadeList = {}
+    this.fadeTime = 10000
+    this.fadeSteps = 5
+
+    this.refreshTraceCallbackFade = (trace, traceOwner) => {
+      const fadeFunc = () => {
+        if (trace.fadeCounter < 1) {
+          traceOwner.deleteSelected(trace)
+          this.fadeList[trace.resultId] = false
+        } else {
+          trace.fadeCounter--
+          trace.fade(1 / (this.fadeSteps + 1))
+          setTimeout(fadeFunc, this.fadeTime / this.fadeSteps)
+        }
+      }
+      const currentCounter = this.fadeList[trace.resultId]
+      if (!currentCounter) {
+        this.fadeList[trace.resultId] = true
+        trace.fadeCounter = this.fadeSteps
+        setTimeout(fadeFunc, this.fadeTime / this.fadeSteps)
+      }
+    }
+
+    this.refreshTraceCallback = (trace, traceOwner) => {
+      traceOwner.deleteSelected(trace)
+    }
+
+    const editArea = document.createElement('div')
+    editArea.classList.add('demosettingArea')
+    this.backGround.appendChild(editArea)
+
+    this.displayArea = document.createElement('div')
+    this.backGround.appendChild(this.displayArea)
+
+    this.container = editArea
+
+    this.createButton('Save', this.displayArea, () => {
+      this.settings.productId = this.productId
+      this.settings.button1selection = this.JoiningProcess1
+      this.settings.button2selection = this.JoiningProcess2
+
+      this.webSocketManager.send('set settings', null, null, this.settings)
+    })
+
+    // this.container.innerHTML += '<p>ProductId'
+  }
+}

OPC_UA_Clients/Release2/IJT_Web_Client/Python/IJTInterface.py

@@ -45,6 +45,14 @@ async def handle(self, websocket, data):
             file = open('./Resources/connectionpoints.json', 'w+')
             json.dump(data, file)
             return 
+          case "get settings":
+             with open('./Resources/settings.json') as json_file:
+              returnValues = json.load(json_file)
+
+          case "set settings":
+            file = open('./Resources/settings.json', 'w+')
+            json.dump(data, file)
+            return 
           case "connect to":
               print("SOCKET: Connect")
               endpoint = data["endpoint"]

OPC_UA_Clients/Release2/IJT_Web_Client/Python/Serialize.py

@@ -38,7 +38,7 @@ def serializeValue(value):
             result = result + serializeValue(item)
         return result + "]"
     else:
-        return "\"" + str(value).replace('\n', 'XXX') + "\""
+        return "\"" + str(value).replace('\n', '\\n') + "\""
 
 def serializeClassInstance(obj):
     """

OPC_UA_Clients/Release2/IJT_Web_Client/Resources/settings.json

@@ -0,0 +1 @@
+{"productid": "www.atlascopco.com/CABLE-B0000000-", "button1selection": "ProgramIndex_1", "button2selection": "ProgramIndex_2", "productId": "www.atlascopco.com/CABLE-B0000000-", "command": "set settings", "endpoint": "common"}

OPC_UA_Clients/Release2/IJT_Web_Client/nodeStyle.css

@@ -932,7 +932,7 @@ html {
 
 .demoButton {
   background-color: black;
-  color: gray;
+  color: yellow;
   padding: 5px;
   border: 1px solid yellow;
   border-radius: 5px;
@@ -959,6 +959,10 @@ html {
   font-weight: 600;
 }
 
+.demosettingArea {
+  margin: 5px
+}
+
 .buttonArea {
   margin: 0px 0px 0px 10px;
   overflow:hidden;