feat: introduce switchVersion option in view manager

stropitek · stropitek · commit 23305c4f2aa3 · 2026-02-06T16:39:29.000+01:00
Allows to reload the view with a version of the visualizer matching the view.
diff --git a/src/index-lactame.html b/src/index-lactame.html
@@ -0,0 +1,31 @@
+<!doctype html>
+<html>
+<head>
+  <meta charset="utf-8" />
+  <title>Visualizer</title>
+  <script type="module">
+    const visualizer = document.getElementById('ci-visualizer');
+    const {searchParams, origin } = new URL(window.location.href);
+    const viewURL = searchParams.get('viewURL');
+    let version = searchParams.get('v') || 'latest';
+
+    const script = document.createElement("script");
+    script.src = `https://www.lactame.com/visualizer/${version}/components/requirejs/require.js`;
+    script.dataset.main = `https://www.lactame.com/visualizer/${version}/init.js`;
+
+    document.head.appendChild(script);
+  </script>
+
+  <style>
+      #ci-visualizer {
+          min-height: 100vh;
+      }
+      body {
+          margin: 0;
+      }
+  </style>
+</head>
+<body>
+  <div id="ci-visualizer" data-ci-config="./usr/config/default.json"></div>
+</body>
+</html>
diff --git a/src/src/header/components/roc-views.js b/src/src/header/components/roc-views.js
@@ -1124,10 +1124,28 @@ define([
 
     loadNode(node) {
       this.setLoadedNode(node);
-      var view = node.data.view;
-      Versioning.switchView(view.getViewSwitcher(), true, {
-        withCredentials: true,
-      });
+      const nodeView = node.data.view;
+
+      if (this.options.switchVersion) {
+        // When `switchVersion` is on, reload the page with the matching version of the visualizer
+        // This option is supported since v3.1.0
+        // It only works if the reloaded page supports the `v` query parameter. See `src/index-lactam.html`.
+        // ⚠️ After the switch of view, you might have loaded a version which does not support this.
+        const { view, data } = nodeView.getViewSwitcher();
+        const url = new URL(window.location.href);
+        url.searchParams.set('viewURL', view.url);
+        if (data.url) {
+          url.searchParams.set('dataURL', data.url);
+        }
+        if (node.data.view.view.$content.version) {
+          url.searchParams.set('v', `v${node.data.view.view.$content.version}`);
+        }
+        window.location.href = url.toString();
+      } else {
+        Versioning.switchView(nodeView.getViewSwitcher(), true, {
+          withCredentials: true,
+        });
+      }
     }
 
     getTree(views) {
diff --git a/src/usr/config/default.json b/src/usr/config/default.json
@@ -83,27 +83,18 @@
         "label": "Blank view"
       },
       {
-        "type": "pouchloadview",
-        "label": "Load local view"
-      },
-      {
-        "type": "pouchsaveview",
-        "label": "Save local view"
-      },
-      {
-        "type": "pouchloaddata",
-        "label": "Load local data"
-      },
-      {
-        "type": "pouchsavedata",
-        "label": "Save local data"
+        "type": "versionselector",
+        "label": "Switch version",
+        "url": "https://www.lactame.com/visualizer/versions.json",
+        "minVersion": "2.170.0"
       },
       {
         "type": "roc-views",
         "label": "View manager",
         "database": "visualizer",
         "url": "http://localhost:3000",
-        "hidePublicToggle": false
+        "hidePublicToggle": false,
+        "switchVersion": true
       }
     ]
   }
diff --git a/testcase/config/multiview.json b/testcase/config/multiview.json
@@ -31,4 +31,4 @@
       }
     ]
   }
-}
+}

Original file line number	Diff line number	Diff line change
`@@ -31,4 +31,4 @@`
`31`	`31`	`}`
`32`	`32`	`]`
`33`	`33`	`}`
`34`		`-}`
	`34`	`+}`