added module support and auto refreshing

Author: benmusson

libraries/javascript/perspective-client/src/globals/globals.ts

@@ -1,4 +1,5 @@
 export type EmbrGlobals = {
+  modules: Record<string, any>
   scripting: ScriptingProperties
 }
 
@@ -14,6 +15,7 @@ declare global {
 
 function createDefaultGlobals(): EmbrGlobals {
   window.__embrGlobals = {
+    modules: {},
     scripting: {
       globals: {},
     },

modules/periscope/common/src/main/resources/schemas/components/embr.periscope.embedding.react/variants/base.props.json

@@ -1,13 +1,6 @@
 {
-  "component": "(props) => <div>{props.text}</div>",
-  "props": {
-    "text": "Hello World!"
-  },
-  "options": {
-    "babel": {
-      "presets": ["react"]
-    }
-  },
+  "component": "",
+  "props": {},
   "style": {
     "classes": ""
   }

modules/periscope/designer/src/main/kotlin/com/mussonindustrial/ignition/embr/periscope/PeriscopeDesignerContext.kt

@@ -13,7 +13,6 @@ import com.mussonindustrial.embr.perspective.designer.component.removeComponent
 import com.mussonindustrial.ignition.embr.periscope.component.ComponentIdSuggestionSource
 import com.mussonindustrial.ignition.embr.periscope.component.TypeScriptResourceSuggestionSource
 import com.mussonindustrial.ignition.embr.periscope.component.embedding.*
-import com.mussonindustrial.ignition.embr.periscope.resources.typescript.TypeScriptResourceListener
 import com.mussonindustrial.ignition.embr.periscope.resources.typescript.TypeScriptResourceWorkspace
 import com.teamdev.jxbrowser.engine.Engine
 
@@ -55,8 +54,6 @@ class PeriscopeDesignerContext(val context: DesignerContext) :
             React.asDesignerComponent(),
         )
 
-    private val handlers = listOf(TypeScriptResourceListener(this))
-
     private val workspaces = listOf(TypeScriptResourceWorkspace(context, perspectiveNavNode))
 
     fun registerComponents() {
@@ -70,12 +67,4 @@ class PeriscopeDesignerContext(val context: DesignerContext) :
     fun registerResourceWorkspaces() {
         workspaces.forEach { registerResourceWorkspace(it) }
     }
-
-    fun registerProjectResourceHandlers() {
-        handlers.forEach { project?.addProjectResourceListener(it) }
-    }
-
-    fun removeProjectResourceHandlers() {
-        handlers.forEach { project?.removeProjectResourceListener(it) }
-    }
 }

modules/periscope/designer/src/main/kotlin/com/mussonindustrial/ignition/embr/periscope/PeriscopeDesignerHook.kt

@@ -40,9 +40,6 @@ class PeriscopeDesignerHook : AbstractDesignerModuleHook() {
 
         logger.debug("Registering resource editors...")
         this.context.registerResourceWorkspaces()
-
-        logger.debug("Registering project resource handlers...")
-        this.context.registerProjectResourceHandlers()
     }
 
     override fun shutdown() {
@@ -56,8 +53,5 @@ class PeriscopeDesignerHook : AbstractDesignerModuleHook() {
 
         logger.debug("Removing components...")
         this.context.removeComponents()
-
-        logger.debug("Removing project resource handlers...")
-        this.context.removeProjectResourceHandlers()
     }
 }

modules/periscope/designer/src/main/kotlin/com/mussonindustrial/ignition/embr/periscope/resources/typescript/TypeScriptResourceEditor.kt

@@ -77,7 +77,7 @@ class TypeScriptResourceEditor(workspace: TabbedResourceWorkspace?, path: Resour
     }
 
     override fun getObjectForSave(): TypeScriptResource {
-        val result = compiler.compile(textArea.text)
+        val result = compiler.compile(textArea.text, resourcePath.path.toString())
 
         return TypeScriptResource(
             textArea.text ?: "",

modules/periscope/designer/src/main/kotlin/com/mussonindustrial/ignition/embr/periscope/resources/typescript/TypeScriptResourceListener.kt

@@ -30,9 +30,9 @@ class TypeScriptCompiler(engine: Engine) {
         }
     val frame = browser.mainFrame().get()
 
-    fun compile(input: String): CompilationResult? {
+    fun compile(input: String, modulePath: String): CompilationResult? {
         val compiler = frame.executeJavaScript<JsObject>(compilerModule)!!
-        val result = compiler.call<JsObject>("compile", input)
+        val result = compiler.call<JsObject>("compile", input, modulePath)
 
         return try {
             CompilationResult(result)

modules/periscope/designer/src/main/kotlin/com/mussonindustrial/ignition/embr/periscope/typescript/TypeScriptCompiler.kt

@@ -22,6 +22,7 @@ import com.mussonindustrial.embr.perspective.gateway.component.removeComponent
 import com.mussonindustrial.embr.perspective.gateway.reflect.ViewLoader
 import com.mussonindustrial.embr.servlets.ModuleServletManager
 import com.mussonindustrial.ignition.embr.periscope.component.embedding.*
+import com.mussonindustrial.ignition.embr.periscope.resources.typescript.TypeScriptChangeListener
 import java.util.EnumSet
 import java.util.WeakHashMap
 
@@ -49,6 +50,8 @@ class PeriscopeGatewayContext(private val context: GatewayContext) :
             PerspectiveContext.get(context) as GatewayHook.PerspectiveGatewayContext
     }
 
+    private val projectLifecycles =
+        listOf(TypeScriptChangeListener(perspectiveContext, context.projectManager))
     private val viewLoaders = WeakHashMap<PageModel, ViewLoader>()
 
     fun getViewLoader(pageModel: PageModel): ViewLoader {
@@ -85,6 +88,14 @@ class PeriscopeGatewayContext(private val context: GatewayContext) :
         }
     }
 
+    fun startupProjectLifecycles() {
+        projectLifecycles.forEach { it.startup() }
+    }
+
+    fun shutdownProjectLifecycles() {
+        projectLifecycles.forEach { it.shutdown() }
+    }
+
     fun removeServlets() {
         servletManager.removeAllServlets()
     }

modules/periscope/gateway/src/main/kotlin/com/mussonindustrial/ignition/embr/periscope/PeriscopeGatewayContext.kt

@@ -36,6 +36,9 @@ class PeriscopeGatewayHook : AbstractGatewayModuleHook() {
 
         logger.debug("Registering components...")
         context.registerComponents()
+
+        logger.debug("Starting project lifecycles...")
+        context.startupProjectLifecycles()
     }
 
     override fun shutdown() {
@@ -50,6 +53,9 @@ class PeriscopeGatewayHook : AbstractGatewayModuleHook() {
 
         logger.debug("Removing servlets...")
         context.removeServlets()
+
+        logger.debug("Stopping project lifecycles...")
+        context.shutdownProjectLifecycles()
     }
 
     override fun getMountedResourceFolder(): Optional<String> {

modules/periscope/gateway/src/main/kotlin/com/mussonindustrial/ignition/embr/periscope/PeriscopeGatewayHook.kt

@@ -0,0 +1,53 @@
+package com.mussonindustrial.ignition.embr.periscope.resources.typescript
+
+import com.inductiveautomation.ignition.common.gson.JsonObject
+import com.inductiveautomation.ignition.common.project.RuntimeProject
+import com.inductiveautomation.ignition.common.project.resource.ProjectResource
+import com.inductiveautomation.ignition.common.project.resource.ProjectResourceId
+import com.inductiveautomation.ignition.gateway.project.ProjectLifecycle
+import com.inductiveautomation.ignition.gateway.project.ProjectLifecycleFactory
+import com.inductiveautomation.ignition.gateway.project.ProjectManager
+import com.inductiveautomation.ignition.gateway.project.ResourceFilter
+import com.inductiveautomation.perspective.gateway.api.PerspectiveContext
+import com.mussonindustrial.ignition.embr.periscope.resources.TypeScriptResource
+
+class TypeScriptChangeListener(val context: PerspectiveContext, projectManager: ProjectManager) :
+    ProjectLifecycleFactory<ProjectLifecycle>(projectManager) {
+    val filter: ResourceFilter =
+        ResourceFilter.newBuilder().addResourceType(TypeScriptResource.Companion.type).build()
+
+    override fun createProjectLifecycle(project: RuntimeProject): Notifier {
+        return Notifier(project)
+    }
+
+    override fun getResourceFilter(): ResourceFilter {
+        return filter
+    }
+
+    inner class Notifier(project: RuntimeProject) : ProjectLifecycle(project) {
+
+        fun notifyClients() {
+            context.sessionMonitor.getClientSessionsForProject(project.name).forEach {
+                it.pages.forEach { page ->
+                    page.send("periscope-client-resource-refresh", JsonObject())
+                }
+            }
+        }
+
+        override fun onStartup(resourceIds: List<ProjectResource>) {}
+
+        override fun onShutdown(resourceIds: List<ProjectResourceId>) {}
+
+        override fun onResourcesCreated(resources: List<ProjectResource>) {
+            notifyClients()
+        }
+
+        override fun onResourcesModified(resources: List<ProjectResource>) {
+            notifyClients()
+        }
+
+        override fun onResourcesDeleted(resources: List<ProjectResourceId>) {
+            notifyClients()
+        }
+    }
+}