volview 4.0.0

package/documentation/tpl/__en__

@@ -0,0 +1,31 @@
+menu:
+  documentation: Documentation
+  gallery: Gallery
+  app: Try VolView
+  nightly: Nightly
+  news: News
+  search: Search
+
+index:
+  get_started: Get started
+
+page:
+  contents: Contents
+  back_to_top: Back to Top
+  improve: Improve this doc
+  prev: Prev
+  next: Next
+  last_updated: "Last updated: %s"
+
+sidebar:
+  doc:
+    introduction: Introduction
+    what_is_volview: What is VolView?
+    quick_start_guide: Quick Start Guide
+    details: Details
+    welcome_screen: Welcome Screen
+    loading_data: Loading Data
+    toolbar: Toolbar
+    mouse_controls: Mouse/Keyboard Controls
+    rendering: Cinematic Rendering
+    state_files: State Files

package/documentation/tpl/__sidebar__

@@ -0,0 +1,11 @@
+doc:
+  introduction: 
+    what_is_volview: index.html
+    quick_start_guide: quick_start_guide.html
+  details: 
+    welcome_screen: welcome_screen.html
+    loading_data: loading_data.html
+    toolbar: toolbar.html
+    mouse_controls: mouse_controls.html
+    rendering: rendering.html
+    state_files: state_files.html

package/package.json

@@ -0,0 +1,96 @@
+{
+  "name": "volview",
+  "version": "4.0.0",
+  "scripts": {
+    "serve": "vue-cli-service serve",
+    "build": "vue-cli-service build",
+    "test:unit": "vue-cli-service test:unit -- ./src/**/__tests__/*.spec.[jt]s",
+    "lint": "vue-cli-service lint",
+    "build:all": "npm run build:dicom && npm run build",
+    "build:dicom": "itk-wasm -s src/io/itk-dicom/ build ",
+    "build:dicom:debug": "itk-wasm -s src/io/itk-dicom/ build -- -DCMAKE_BUILD_TYPE=Debug",
+    "postinstall": "patch-package",
+    "prettify": "prettier --write src tests",
+    "doc": "kw-doc -c ./documentation/config.js",
+    "doc:www": "kw-doc -c ./documentation/config.js -s",
+    "doc:publish": "kw-doc -c ./documentation/config.js -mp"
+  },
+  "dependencies": {
+    "@kitware/vtk.js": "^25.13.0",
+    "@vue/composition-api": "1.6.3",
+    "@vueuse/core": "^8.5.0",
+    "@vueuse/shared": "^9.2.0",
+    "core-js": "3.22.5",
+    "deep-equal": "^2.0.5",
+    "file-saver": "^2.0.5",
+    "gl-matrix": "3.4.3",
+    "itk-image-io": "1.0.0-b.19",
+    "itk-wasm": "1.0.0-b.19",
+    "jszip": "3.10.0",
+    "mitt": "^3.0.0",
+    "pinia": "^2.0.14",
+    "vue": "2.6.14",
+    "vue-toastification": "^1.7.14",
+    "vuetify": "2.6.10",
+    "wslink": "^1.6.4",
+    "zod": "^3.18.0"
+  },
+  "devDependencies": {
+    "@pinia/testing": "^0.0.12",
+    "@types/chai": "^4.3.1",
+    "@types/chai-almost": "^1.0.1",
+    "@types/chai-as-promised": "^7.1.5",
+    "@types/chai-subset": "^1.3.3",
+    "@types/deep-equal": "^1.0.1",
+    "@types/file-saver": "^2.0.5",
+    "@types/mocha": "^9.1.1",
+    "@types/sinon": "^10.0.11",
+    "@types/sinon-chai": "^3.2.8",
+    "@typescript-eslint/eslint-plugin": "^5.4.0",
+    "@typescript-eslint/parser": "^5.4.0",
+    "@vue/cli-plugin-babel": "~5.0.4",
+    "@vue/cli-plugin-eslint": "~5.0.4",
+    "@vue/cli-plugin-typescript": "~5.0.4",
+    "@vue/cli-plugin-unit-mocha": "~5.0.4",
+    "@vue/cli-plugin-vuex": "~5.0.4",
+    "@vue/cli-service": "~5.0.4",
+    "@vue/eslint-config-airbnb": "^6.0.0",
+    "@vue/eslint-config-typescript": "^9.1.0",
+    "@vue/test-utils": "1.3.0",
+    "babel-eslint": "10.1.0",
+    "canvas": "^2.9.3",
+    "chai": "4.3.6",
+    "chai-almost": "^1.0.1",
+    "chai-as-promised": "7.1.1",
+    "chai-subset": "^1.6.0",
+    "eslint": "^7.32.0",
+    "eslint-config-prettier": "6.15.0",
+    "eslint-import-resolver-typescript": "^2.7.1",
+    "eslint-plugin-import": "2.26.0",
+    "eslint-plugin-vue": "^8.0.3",
+    "eslint-plugin-vuejs-accessibility": "^1.1.0",
+    "kw-doc": "3.1.2",
+    "lint-staged": "10.5.4",
+    "null-loader": "4.0.1",
+    "patch-package": "^6.4.7",
+    "prettier": "2.6.2",
+    "sass": "~1.32.0",
+    "sass-loader": "10.2.1",
+    "shader-loader": "1.3.1",
+    "sinon": "14.0.0",
+    "sinon-chai": "3.7.0",
+    "typescript": "~4.6.4",
+    "vue-cli-plugin-vuetify": "2.4.8",
+    "vue-template-compiler": "2.6.14",
+    "vuetify-loader": "1.7.3"
+  },
+  "gitHooks": {
+    "pre-commit": "lint-staged"
+  },
+  "lint-staged": {
+    "*.{js,jsx,ts,tsx,vue}": [
+      "vue-cli-service lint",
+      "git add"
+    ]
+  }
+}

package/patches/jsdom-global+3.0.2.patch

@@ -0,0 +1,12 @@
+diff --git a/node_modules/jsdom-global/keys.js b/node_modules/jsdom-global/keys.js
+index 7777e32..6a56d5d 100644
+--- a/node_modules/jsdom-global/keys.js
++++ b/node_modules/jsdom-global/keys.js
+@@ -119,6 +119,7 @@ var LIVING_KEYS = [
+   'Blob',
+   'File',
+   'FileList',
++  'FileReader',
+   'FormData',
+   'XMLHttpRequest',
+   'XMLHttpRequestEventTarget',

package/patches/vue-toastification+1.7.14.patch

@@ -0,0 +1,41 @@
+diff --git a/node_modules/vue-toastification/src/types/index.ts b/node_modules/vue-toastification/src/types/index.ts
+index 1e27d73..4d9da87 100644
+--- a/node_modules/vue-toastification/src/types/index.ts
++++ b/node_modules/vue-toastification/src/types/index.ts
+@@ -236,16 +236,6 @@ export type ToastOptionsAndRequiredContent = ToastOptions & {
+   content: ToastContent;
+ };
+ 
+-export interface NuxtModuleOptions extends PluginOptions {
+-  /**
+-   * Path to the CSS file containing styles for the toasts.
+-   * By default it is original Vue Toastification CSS file.
+-   *
+-   * If set to false, no CSS file is injected.
+-   */
+-  cssFile?: string | false;
+-}
+-
+ declare module "vue/types/vue" {
+   interface Vue {
+     $toast: ReturnType<typeof ToastInterface>;
+@@ -255,19 +245,3 @@ declare module "vue/types/vue" {
+     $toast: ReturnType<typeof ToastInterface>;
+   }
+ }
+-
+-declare module "@nuxt/types" {
+-  interface NuxtAppOptions {
+-    $toast: ReturnType<typeof ToastInterface>;
+-  }
+-
+-  interface NuxtOptions {
+-    toast?: NuxtModuleOptions;
+-  }
+-}
+-
+-declare module "vuex/types/index" {
+-  interface Store<S> {
+-    $toast: ReturnType<typeof ToastInterface>;
+-  }
+-}

package/patches/vuetify+2.6.10.patch

@@ -0,0 +1,13 @@
+diff --git a/node_modules/vuetify/lib/directives/ripple/index.js b/node_modules/vuetify/lib/directives/ripple/index.js
+index c895ae0..44249ae 100644
+--- a/node_modules/vuetify/lib/directives/ripple/index.js
++++ b/node_modules/vuetify/lib/directives/ripple/index.js
+@@ -120,7 +120,7 @@ const ripples = {
+           delete el.dataset.previousPosition;
+         }
+ 
+-        animation.parentNode && el.removeChild(animation.parentNode);
++        animation.parentNode && animation.parentNode.parentNode.removeChild(animation.parentNode);
+       }, 300);
+     }, delay);
+   }

package/prettier.config.js

@@ -0,0 +1,9 @@
+module.exports = {
+  printWidth: 80,
+  singleQuote: true,
+  trailingComma: 'es5',
+  arrowParens: 'always',
+  endOfLine: 'lf',
+  tabWidth: 2,
+  useTabs: false,
+};

package/public/global.css

@@ -0,0 +1,20 @@
+html {
+    overflow: hidden !important;
+}
+
+body {
+    position: fixed;
+    width: 100%;
+    height: 100%;
+    user-select: none;
+}
+
+.no-select {
+    user-select: none;
+}
+
+.text-ellipsis {
+    overflow: hidden;
+    text-overflow: ellipsis;
+    white-space: nowrap;
+}

package/public/index.html

@@ -0,0 +1,28 @@
+<!DOCTYPE html>
+<html lang="en">
+  <head>
+    <% if (htmlWebpackPlugin.options.ga) { %>
+      <script async src="https://www.googletagmanager.com/gtag/js?id=<%= htmlWebpackPlugin.options.ga %>"></script>
+      <script>
+        window.dataLayer = window.dataLayer || [];
+        function gtag(){dataLayer.push(arguments);}
+        gtag('js', new Date());
+        gtag('config', '<%= htmlWebpackPlugin.options.ga %>');
+      </script>
+    <% } %>
+    <meta charset="utf-8">
+    <meta http-equiv="X-UA-Compatible" content="IE=edge">
+    <meta name="viewport" content="width=device-width,initial-scale=1.0">
+    <link rel="icon" href="<%= BASE_URL %>favicon.ico">
+    <title><%= htmlWebpackPlugin.options.title %></title>
+    <link rel="stylesheet" href="https://fonts.googleapis.com/css?family=Roboto:100,300,400,500,700,900">
+    <link rel="stylesheet" href="https://cdn.jsdelivr.net/npm/@mdi/font@latest/css/materialdesignicons.min.css">
+  </head>
+  <body>
+    <noscript>
+      <strong>We're sorry but <%= htmlWebpackPlugin.options.title %> doesn't work properly without JavaScript enabled. Please enable it to continue.</strong>
+    </noscript>
+    <div id="app"></div>
+    <!-- built files will be auto injected -->
+  </body>
+</html>

package/server/helper.py

@@ -0,0 +1,147 @@
+import traceback
+import wslink
+from serialize import RpcDecoder, RpcEncoder, DEFAULT_DECODERS, DEFAULT_ENCODERS
+from wslink.websocket import LinkProtocol
+
+
+RPC_DEFERRED_TYPE = 'rpc.deferred'
+RPC_RESULT_TYPE = 'rpc.result'
+RPC_ERROR_TYPE = 'rpc.error'
+DEFERRED_RESPONSE_TYPE = 'deferred.response'
+
+
+class FutureResult(object):
+    def __init__(self, id):
+        self._id = id
+        self._done = False
+        self._result = None
+        self._exception = None
+        self._callbacks = []
+
+    def id(self):
+        return self._id
+
+    def done(self):
+        return self._done
+
+    def result(self):
+        if not self._done:
+            raise Exception('Future is not done')
+        return self._result
+
+    def exception(self):
+        if not self._done:
+            raise Exception('Future is not done')
+        return self._exception
+
+    def has_result(self):
+        return self._done and bool(self._result)
+
+    def has_exception(self):
+        return self._done and bool(self._exception)
+
+    def add_done_callback(self, cb):
+        self._callbacks.append(cb)
+
+    def remove_done_callback(self, cb):
+        self._callbacks.remove(cb)
+
+    def set_result(self, result):
+        if not self._done:
+            self._done = True
+            self._result = result
+            self._trigger_callbacks()
+
+    def set_exception(self, exception):
+        if not self._done:
+            self._done = True
+            self._exception = exception
+            self._trigger_callbacks()
+
+    def _trigger_callbacks(self):
+        for cb in self._callbacks:
+            try:
+                cb(self)
+            except:
+                pass
+
+
+def make_deferred_response(future):
+    return {
+        'type': RPC_DEFERRED_TYPE,
+        'id': future.id(),
+    }
+
+
+def make_result_response(result):
+    return {
+        'type': RPC_RESULT_TYPE,
+        'result': result,
+    }
+
+
+def make_error_response(exc):
+    return {
+        'type': RPC_ERROR_TYPE,
+        'error': str(exc),
+    }
+
+
+def deserialize(args, kwargs):
+    decoder = RpcDecoder(hooks=DEFAULT_DECODERS)
+    new_args = [decoder.decode(arg) for arg in args]
+    return new_args, kwargs
+
+
+def rpc(name):
+    def wrapper(fn):
+        def handler(self, *args, **kwargs):
+
+            try:
+                args, kwargs = deserialize(args, kwargs)
+                result = fn(self, *args, **kwargs)
+            except Exception as e:
+                traceback.print_exc()
+                return make_error_response(e)
+            else:
+                if type(result) is FutureResult:
+                    self._futures.append(result)
+                    result.set_done_callback(self._handle_future_result)
+                    return make_deferred_response(result.id())
+
+                return make_result_response(self.serialize(result))
+
+        return wslink.register(name)(handler)
+    return wrapper
+
+
+class RpcApi(LinkProtocol):
+    def __init__(self, *args, **kwargs):
+        super().__init__(*args, **kwargs)
+        self._futures = []
+
+    def _handle_future_result(self, future):
+        self._futures.remove(future)
+        self.publish('deferred.responses',
+                     self._make_deferred_result_response(future))
+
+    def _make_deferred_result_response(self, future):
+        if future.has_exception():
+            return {
+                'type': DEFERRED_RESPONSE_TYPE,
+                'id': future.id(),
+                'rpcResponse': make_error_response(future.exception())
+            }
+        return {
+            'type': DEFERRED_RESPONSE_TYPE,
+            'id': future.id(),
+            'rpcResponse': make_result_response(self.serialize(future.result()))
+        }
+
+    def serialize(self, obj):
+        try:
+            encoder = RpcEncoder(encoders=DEFAULT_ENCODERS,
+                                 extra_args=(self.addAttachment,))
+            return encoder.encode(obj)
+        except:
+            traceback.print_exc()

package/server/host.js

@@ -0,0 +1,134 @@
+/* eslint-disable-next-line max-classes-per-file */
+import WebsocketConnection from 'wslink/src/WebsocketConnection';
+import { defer } from '../src/utils/common';
+
+import { deserialize, serialize } from './serialize';
+
+/**
+ * Matches a response against valid type names
+ */
+function isValidResponse(response, types) {
+  const rtype = response?.type;
+  if (!types.includes(rtype)) {
+    return false;
+  }
+  switch (rtype) {
+    case 'rpc.result':
+      return 'result' in response;
+    case 'rpc.error':
+      return 'error' in response;
+    case 'rpc.deferred':
+      return 'id' in response;
+    case 'deferred.response':
+      return 'id' in response && 'rpcResponse' in response;
+    default:
+      return false;
+  }
+}
+
+export class RpcError extends Error {}
+
+export default class HostConnection {
+  constructor(wsUrl) {
+    this.ws = null;
+    this.wsUrl = wsUrl;
+    this.connected = false;
+    this.deferredResponses = new Map();
+  }
+
+  async connect() {
+    return new Promise((resolve, reject) => {
+      if (!this.connected) {
+        this.ws = WebsocketConnection.newInstance({ urls: this.wsUrl });
+
+        this.ws.onConnectionReady(() => {
+          this.connected = true;
+          this.session = this.ws.getSession();
+
+          this.session.subscribe(
+            'deferred.responses',
+            this.handleDeferredResponse
+          );
+
+          resolve();
+        });
+
+        this.ws.onConnectionClose(() => {
+          this.connected = false;
+        });
+
+        this.ws.onConnectionError(() => {
+          reject(new Error('Failed to connect to ws endpoint'));
+        });
+
+        this.ws.connect();
+      }
+    });
+  }
+
+  async disconnect() {
+    if (this.connected) {
+      this.ws.destroy();
+    }
+  }
+
+  async call(endpoint, ...args) {
+    if (!this.connected) {
+      throw new Error('Not connected');
+    }
+
+    const attach = (obj) => {
+      if (ArrayBuffer.isView(obj) && !(obj instanceof DataView)) {
+        return this.session.addAttachment(obj.buffer);
+      }
+      return obj;
+    };
+
+    const preparedArgs = args.map((arg) => serialize(arg, attach));
+
+    const response = await this.session.call(endpoint, preparedArgs);
+    return this.handleRpcResponse(response);
+  }
+
+  async handleRpcResponse(response) {
+    if (
+      !isValidResponse(response, ['rpc.result', 'rpc.error', 'rpc.deferred'])
+    ) {
+      throw new Error('Invalid response from rpc');
+    }
+
+    if (response.type === 'rpc.deferred') {
+      const deferred = defer();
+      this.deferredResponses.set(response.id, deferred);
+      return deferred.promise;
+    }
+
+    if (response.type === 'rpc.error') {
+      throw new RpcError(response.error);
+    }
+
+    const result = await deserialize(response.result);
+    return result;
+  }
+
+  async handleDeferredResponse(response) {
+    if (!isValidResponse(response, ['deferred.result'])) {
+      throw new Error('Invalid deferred response');
+    }
+
+    const { id } = response;
+    if (!this.deferredResponses.has(id)) {
+      throw new Error('Received a deferred response for a nonexistent call');
+    }
+
+    const deferred = this.deferredResponses.get(id);
+    this.deferredResponses.delete(id);
+
+    try {
+      const result = await this.handleRpcResponse(response.rpcResponse);
+      deferred.resolve(result);
+    } catch (e) {
+      deferred.reject(e);
+    }
+  }
+}

package/server/serialize.js

@@ -0,0 +1,111 @@
+import vtk from '@kitware/vtk.js/vtk';
+
+export const BREAK = Symbol('Break');
+
+export function vtkObjectReplacer(vo) {
+  if (vo?.isA?.('vtkObject')) {
+    return vo.getState();
+  }
+  return vo;
+}
+
+export function vtkDataArrayJSONReplacer(da, attach) {
+  if (da?.classHierarchy?.includes?.('vtkDataArray')) {
+    const values = new globalThis[da.dataType](da.values);
+    return {
+      ...da,
+      values: attach(values),
+    };
+  }
+  return da;
+}
+
+/**
+ * Serializes typed arrays into regular arrays
+ */
+export function typedArrayReplacer(ta) {
+  if (ArrayBuffer.isView(ta) && !(ta instanceof DataView)) {
+    return Array.from(ta);
+  }
+  return ta;
+}
+
+export async function vtkDataArrayValueReviver(da) {
+  if (da?.vtkClass === 'vtkDataArray' && da?.values instanceof Blob) {
+    const ab = await da.values.arrayBuffer();
+    return {
+      ...da,
+      values: new globalThis[da.dataType](ab),
+    };
+  }
+  return da;
+}
+
+export function vtkObjectReviver(obj) {
+  if ('vtkClass' in obj) {
+    return vtk(obj);
+  }
+  return obj;
+}
+
+const REPLACERS = [
+  vtkObjectReplacer,
+  vtkDataArrayJSONReplacer,
+  typedArrayReplacer,
+];
+
+const REVIVERS = [
+  vtkDataArrayValueReviver,
+  // should be after the vtkDataArrayValueReviver
+  vtkObjectReviver,
+];
+
+export function serialize(obj, attach) {
+  return JSON.parse(
+    JSON.stringify(obj, (key, value) => {
+      let transformed = value;
+      for (let i = 0; i < REPLACERS.length; i += 1) {
+        const result = REPLACERS[i](transformed, attach);
+        if (result === BREAK) {
+          break;
+        }
+        transformed = result;
+      }
+      return transformed;
+    })
+  );
+}
+
+export async function deserialize(obj) {
+  async function revive(o) {
+    let transformed = o;
+    for (let i = 0; i < REVIVERS.length; i += 1) {
+      // eslint-disable-next-line no-await-in-loop
+      const result = await REVIVERS[i](transformed);
+      if (result === BREAK) {
+        break;
+      }
+      transformed = result;
+    }
+    return transformed;
+  }
+
+  async function recurseHelper(o) {
+    if (Array.isArray(o)) {
+      const newArray = await Promise.all(o.map((item) => recurseHelper(item)));
+      return revive(newArray);
+    }
+    if (o instanceof Object && o.constructor === Object) {
+      const newO = {};
+      await Promise.all(
+        Object.keys(o).map(async (k) => {
+          newO[k] = await recurseHelper(o[k]);
+        })
+      );
+      return revive(newO);
+    }
+    return o;
+  }
+
+  return recurseHelper(obj);
+}