x_ite 8.6.1 → 8.6.3

package/docs/_config.yml

@@ -20,7 +20,7 @@ timezone:
 # ↓ --------------------------
 
 title: X_ITE X3D Browser               # the main title
-version: 8.6.1                         # x_ite latest version
+version: 8.6.3                         # x_ite latest version
 size: 287                              # size in kb
 x3d_latest_version: 4.0                # x3d latest version
 
@@ -180,7 +180,7 @@ compress_html:
   profile: false
   blanklines: false
   ignore:
-    envs: [x-development]
+    envs: [development]
 
 exclude:
   - "*.gem"

package/docs/_posts/getting-started.md

@@ -645,7 +645,7 @@ X_ITE can load several file formats, either directly as the source of the \<x3d-
 >**Tip:** All files can be compressed using GZip compression. This saves bandwidth and speeds up download time.
 {: .prompt-tip }
 
-For more information see [How to Configure Your Web Server](how-to-configure-your-web-server).
+If you have an own web-server see [How to Configure Your Web Server](how-to-configure-your-web-server). If you are looking for an online file format converter [see here](laboratory/x3d-file-converter).
 
 ### Fallback Content
 

package/docs/_posts/laboratory/x3d-file-converter.md

@@ -0,0 +1,183 @@
+---
+title: Free Online X3D File Format Converter
+date: 2023-02-21
+categories: [Laboratory]
+tags: [X3D, File, Format, Converter]
+x_ite: true
+---
+<style>
+#drop-zone {
+  box-sizing: border-box;
+  border: 8px dashed lightskyblue;
+}
+
+#drop-zone .center {
+  padding: 3rem;
+  text-align: center;
+  font-size: 200%;
+  font-weight: bold;
+  margin: 0;
+  background: aliceblue;
+}
+
+#convert-files,
+#converting-files {
+   display: none;
+}
+
+#drop-zone x3d-canvas,
+#drop-zone input[type=file] {
+  display: none;
+}
+
+#drop-zone a {
+  border: none;
+}
+
+#drop-zone select {
+  color: unset;
+  position: relative;
+  top: -6px;
+}
+</style>
+
+<script defer src="https://create3000.github.io/media/laboratory/l-system/FileSaver.js-2.0.0/dist/FileSaver.min.js"></script>
+<script defer>
+$(() =>
+{
+   $("#drop-zone") .on ("dragover", event =>
+   {
+      event .stopPropagation ();
+      event .preventDefault ();
+
+      event .originalEvent .dataTransfer .dropEffect = "copy";
+   });
+
+   $("#drop-zone") .on ("drop", event =>
+   {
+      event .stopPropagation ();
+      event .preventDefault ();
+
+      read (event .originalEvent .dataTransfer .files);
+   });
+
+   $("#open-files a") .on ("click", event =>
+   {
+      const input = $("<input></input>")
+         .attr ("type", "file")
+         .appendTo ($("#open-files"));
+
+      input .on ("change", event =>
+      {
+         read (event .target .files);
+         input .remove ();
+      });
+
+      input .trigger ("click");
+      return false;
+   });
+
+   function read (files)
+   {
+      read .files = [... files];
+
+      $("#open-files") .hide ();
+      $("#convert-files") .show ();
+   }
+
+   $("#convert-files a") .on ("click", event =>
+   {
+      $("#convert-files") .hide ();
+      $("#converting-files") .show ();
+
+      convert ($("#drop-zone select") .val (), read .files);
+
+      return false;
+   });
+
+   const formats = {
+      "XML":  ["model/x3d+xml",  ".x3d",  "toXMLString"],
+      "VRML": ["model/x3d+vrml", ".x3dv", "toVRMLString"],
+      "JSON": ["model/x3d+json", ".x3dj", "toJSONString"],
+   };
+
+   async function convert (encoding, files)
+   {
+      const [mimeType, extension, toString] = formats [encoding];
+
+      for (const file of files)
+      {
+         try
+         {
+            const
+               Browser = X3D .createBrowser () .browser,
+               url     = URL .createObjectURL (file);
+
+            Browser .endUpdate ();
+
+            await Browser .loadURL (new X3D .MFString (url));
+
+            link (mimeType, file .name .replace (/\.[^.]+$/, "") + extension, Browser .currentScene [toString] ());
+         }
+         catch (error)
+         {
+            console .error (error);
+         }
+      }
+
+      $("#converting-files") .hide ();
+      $("#open-files") .show ();
+   }
+
+   function link (mimeType, name, x3dSyntax)
+   {
+      const a = $("<a></a>")
+         .text (name)
+         .attr ("href", "#")
+         .on ("click", download .bind (null, mimeType, name, x3dSyntax));
+
+      $("<li></li>") .append (a) .appendTo ($("#download-links"));
+   }
+
+   function download (mimeType, name, x3dSyntax)
+   {
+      const blob = new Blob ([x3dSyntax], { type: `${mimeType};charset=utf-8` });
+
+      saveAs (blob, name);
+
+      return false;
+   }
+});
+</script>
+
+## Upload and Convert
+
+Convert **X3D, VRML, glTF (GLB), OBJ, STL,** and **SVG** to a X3D format of your choice.
+
+<div id="drop-zone">
+   <p id="open-files" class="center">
+      <a href="#">Choose a file</a> or drag it here.
+      <input type="file" />
+   </p>
+   <p id="convert-files" class="center">
+      <a href="#">Convert file to ...</a>
+      <select>
+         <option value="XML" selected>X3D XML Encoding</option>
+         <option value="VRML">X3D VRML Encoding</option>
+         <option value="JSON">X3D JSON Encoding</option>
+      </select>
+   </p>
+   <p id="converting-files" class="center">
+      Converting files ...
+   </p>
+</div>
+
+### Converted Files
+
+Your converted files will appear here.
+
+<ul id="download-links"></ul>
+
+## Command Line Tool
+
+If you are looking for a command line tool to convert files, have a look at [x3d-tidy](https://www.npmjs.com/package/x3d-tidy){:target="_blank"}. It is a Node program and it can be run via `npx x3d-tidy`.

package/docs/laboratory/3d-l-system-generator.html

@@ -3,7 +3,7 @@ title: 3D L-System Generator
 layout: wide
 collection: tabs
 categories: [Laboratory]
-tags: [3D, l-system, generator]
+tags: [3D, L-System, Generator]
 ---
 <style>
 .row, .post, .post-content {

package/docs/laboratory/gltf-sample-viewer.html

@@ -3,7 +3,7 @@ title: glTF Sample Viewer
 layout: wide
 collection: tabs
 categories: [Laboratory]
-tags: [glTF, sample, viewer]
+tags: [glTF, Sample, Viewer]
 ---
 <style>
 .post, .post-content {

package/docs/laboratory/online-dicom-and-nrrd-file-viewer.html

@@ -3,7 +3,7 @@ title: Online DICOM and NRRD file Viewer
 layout: wide
 collection: tabs
 categories: [Laboratory]
-tags: [online, dicom, nrrd, file, viewer]
+tags: [Online, DICOM, NRRD, File, Viewer]
 ---
 <style>
 .row, .post, .post-content {

package/docs/laboratory/real-time-earth-quake-information.html

@@ -3,7 +3,7 @@ title: Real Time Earth Quake Information
 layout: wide
 collection: tabs
 categories: [Laboratory]
-tags: [real time, earth quake]
+tags: [Real Time, Earth Quake]
 ---
 <style>
 /* Table */

package/docs/laboratory/x3d-visual-blend-mode-editor.html

@@ -3,7 +3,7 @@ title: X3D Visual Blend Mode Editor
 layout: wide
 collection: tabs
 categories: [Laboratory]
-tags: [X3D, visual, blend mode, editor]
+tags: [X3D, Visual, Blend Mode, Editor]
 ---
 <link rel="stylesheet" type="text/css" href="https://cdn.jsdelivr.net/gh/cferdinandi/tabby@12.0.0/dist/css/tabby-ui.min.css">
 <script src="https://cdn.jsdelivr.net/gh/cferdinandi/tabby@12.0.0/dist/js/tabby.polyfills.min.js"></script>

package/package.json

@@ -1,6 +1,6 @@
 {
 	"name": "x_ite",
-	"version": "8.6.1",
+	"version": "8.6.3",
 	"description": "X_ITE X3D Browser, view and manipulate X3D and VRML scenes in HTML.",
 	"homepage": "https://create3000.github.io/x_ite/",
 	"author": "Holger Seelig <holger.seelig@gmail.com>",

package/src/standard/Math/Algorithms/Bezier.js

@@ -64,10 +64,8 @@ const Bezier =
          c = new Matrix3 (1, 0, 0, -2, 2, 0, 1, -2, 1),
          p = new Matrix3 ();
 
-      return function (x0, y0, z0, x1, y1, z1, x2, y2, z2, steps)
+      return function (x0, y0, z0, x1, y1, z1, x2, y2, z2, steps, points)
       {
-         const points = [ ];
-
          p .set (x0, y0, z0, x1, y1, z1, x2, y2, z2)
             .multLeft (c);
 
@@ -77,8 +75,6 @@ const Bezier =
 
             points .push (p .multVecMatrix (new Vector3 (1, t, t * t)));
          }
-
-         return points;
       };
    })(),
    cubic: (function ()
@@ -88,10 +84,8 @@ const Bezier =
          c = new Matrix4 (1, 0, 0, 0, -3, 3, 0, 0, 3, -6, 3, 0, -1, 3, -3, 1),
          p = new Matrix4 ();
 
-      return function (x0, y0, z0, x1, y1, z1, x2, y2, z2, x3, y3, z3, steps)
+      return function (x0, y0, z0, x1, y1, z1, x2, y2, z2, x3, y3, z3, steps, points)
       {
-         const points = [ ];
-
          p .set (x0, y0, z0, 0, x1, y1, z1, 0, x2, y2, z2, 0, x3, y3, z3, 0)
             .multLeft (c);
 
@@ -103,14 +97,10 @@ const Bezier =
 
             points .push (new Vector3 (v .x, v .y, v .z));
          }
-
-         return points;
       };
    })(),
-   arc: function (ax, ay, rx, ry, xAxisRotation, largeArcFlag, sweepFlag, x, y, steps)
+   arc: function (ax, ay, rx, ry, xAxisRotation, largeArcFlag, sweepFlag, x, y, steps, points)
    {
-      const points = [ ];
-
       // https://ericeastwood.com/blog/25/curves-and-arcs-quadratic-cubic-elliptical-svg-implementations
       // See https://www.w3.org/TR/SVG/implnote.html#ArcImplementationNotes.
 
@@ -236,8 +226,6 @@ const Bezier =
       }
 
       points .push (new Vector3 (x, y, 0));
-
-      return points;
    }
 };
 

package/src/standard/Math/Numbers/Matrix2.js

@@ -145,7 +145,7 @@ Matrix2 .prototype =
    inverse: function ()
    {
       const
-         [A, B, C, D] = this [3],
+         { 0: A, 1: B, 2: C, 3: D } = this [3],
          d = A * D - B * C;
 
       // if (d === 0) ... determinant is zero.
@@ -160,8 +160,8 @@ Matrix2 .prototype =
    multLeft: function (matrix)
    {
       const
-         [a0, a1, a2, a3] = this,
-         [b0, b1, b2, b3] = matrix;
+         { 0: a0, 1: a1, 2: a2, 3: a3 } = this,
+         { 0: b0, 1: b1, 2: b2, 3: b3 } = matrix;
 
       this [0] = a0 * b0 + a2 * b1;
       this [1] = a1 * b0 + a3 * b1;
@@ -173,8 +173,8 @@ Matrix2 .prototype =
    multRight: function (matrix)
    {
       const
-         [a0, a1, a2, a3] = this,
-         [b0, b1, b2, b3] = matrix;
+         { 0: a0, 1: a1, 2: a2, 3: a3 } = this,
+         { 0: b0, 1: b1, 2: b2, 3: b3 } = matrix;
 
       this [0] = b0 * a0 + b2 * a1;
       this [1] = b1 * a0 + b3 * a1;

package/src/tests.js

@@ -103,9 +103,20 @@ const X_ITE_TESTS = [
    { component: "HAnim" },
    { path: "HAnim/BoxManC.x3d" },
    { component: "Interpolation" },
+   { path: "Interpolation/ComposeSFVec3f.wrl" },
+   { path: "Interpolation/Cube.wrl" },
+   { path: "Interpolation/EaseInEaseOut.wrl" },
+   { path: "Interpolation/Interpolators.wrl" },
+   { path: "Interpolation/LineTrail.wrl" },
    { path: "Interpolation/NormalInterpolator.x3d" },
    { path: "Interpolation/OrientationInterpolator.x3d" },
+   { path: "Interpolation/ParticleShape.wrl" },
    { path: "Interpolation/PositionInterpolator.x3d" },
+   { path: "Interpolation/SplinePositionInterpolator.wrl" },
+   { path: "Interpolation/SplinePositionInterpolator2.wrl" },
+   { path: "Interpolation/SplineScalarInterpolator.wrl" },
+   { path: "Interpolation/SquadOrientationInterpolator.wrl" },
+   { path: "Interpolation/warp.wrl" },
    { component: "Layering" },
    { path: "Layering/LayerSet.x3d" },
    { path: "Layering/Rotor.x3d" },

package/src/x_ite/Browser/Core/X3DCoreContext.js

@@ -121,7 +121,9 @@ function X3DCoreContext (element)
    this [_notification]        = new Notification        (this .getPrivateScene ());
    this [_contextMenu]         = new ContextMenu         (this .getPrivateScene ());
 
-   this [_pixelPerPoint] = 1; // default 72 dpi
+   const inches = $("<div></div>") .hide () .css ("height", "10in") .appendTo ($("body"));
+   this [_pixelPerPoint] = inches .height () / 720 || 1;
+   inches .remove ();
 
    this .addChildObjects ("controlKey", new Fields .SFBool (),
                           "shiftKey",   new Fields .SFBool (),
@@ -261,11 +263,7 @@ X3DCoreContext .prototype =
       return this [_pixelPerPoint] * this .getRenderingProperty ("ContentScale");
    },
    connectedCallback: function ()
-   {
-      const inches = $("<div></div>") .hide () .css ("height", "10in") .appendTo (this [_shadow]);
-      this [_pixelPerPoint] = inches .height () / 720 || 1;
-      inches .remove ();
-   },
+   { },
    attributeChangedCallback: function (name, oldValue, newValue)
    {
       switch (name)

package/src/x_ite/Browser/Text/PolygonText.js

@@ -256,47 +256,44 @@ PolygonText .prototype = Object .assign (Object .create (X3DTextGeometry .protot
          x        = 0,
          y        = 0;
 
-      for (const command of path .commands)
+      for (const { type, x1, y1, x2, y2, x: cx, y: cy } of path .commands)
       {
-         switch (command .type)
+         switch (type)
          {
             case "M": // Start
             case "Z": // End
             {
-               // Filter consecutive identical points.
-               points = points .filter ((p, i, a) => !p .equals (a [(i + 1) % a .length]));
-
                if (points .length > 2)
                   contours .push (points);
 
                points = [ ];
 
-               if (command .type === "M")
-                  points .push (new Vector3 (command .x, -command .y, 0));
+               if (type === "M")
+                  points .push (new Vector3 (cx, -cy, 0));
 
                break;
             }
             case "L": // Linear
             {
-               points .push (new Vector3 (command .x, -command .y, 0));
+               points .push (new Vector3 (cx, -cy, 0));
                break;
             }
             case "Q": // Quadric
             {
-               points .push (... Bezier .quadric (x, -y, 0, command .x1, -command .y1, 0, command .x, -command .y, 0, steps));
+               Bezier .quadric (x, -y, 0, x1, -y1, 0, cx, -cy, 0, steps, points);
                break;
             }
             case "C": // Cubic
             {
-               points .push (... Bezier .cubic (x, -y, 0, command .x1, -command .y1, 0, command .x2, -command .y2, 0, command .x, -command .y, 0, steps));
+               Bezier .cubic (x, -y, 0, x1, -y1, 0, x2, -y2, 0, cx, -cy, 0, steps, points);
                break;
             }
             default:
                continue;
          }
 
-         x = command .x;
-         y = command .y;
+         x = cx;
+         y = cy;
       }
 
       return this .triangulatePolygon (contours, vertices);

package/src/x_ite/Browser/VERSION.js

@@ -45,4 +45,4 @@
  *
  ******************************************************************************/
 
-export default "8.6.1";
+export default "8.6.3";

package/src/x_ite/Components/Core/X3DNode.js

@@ -804,7 +804,9 @@ X3DNode .prototype = Object .assign (Object .create (X3DBaseNode .prototype),
             generator .string += '"';
             generator .string += ':';
             generator .string += generator .TidySpace ();
+            generator .string += '"';
             generator .string += generator .JSONEncode (name);
+            generator .string += '"';
             generator .string += generator .TidyBreak ();
             generator .string += generator .DecIndent ();
             generator .string += generator .Indent ();
@@ -847,7 +849,9 @@ X3DNode .prototype = Object .assign (Object .create (X3DBaseNode .prototype),
          generator .string += '"';
          generator .string += ':';
          generator .string += generator .TidySpace ();
+         generator .string += '"';
          generator .string += generator .JSONEncode (name);
+         generator .string += '"';
          generator .string += ',';
          generator .string += generator .TidyBreak ();
       }
@@ -1008,7 +1012,9 @@ X3DNode .prototype = Object .assign (Object .create (X3DBaseNode .prototype),
             generator .string += '"';
             generator .string += ':';
             generator .string += generator .TidySpace ();
+            generator .string += '"';
             generator .string += generator .JSONEncode (field .getName ());
+            generator .string += '"';
 
             // If the field is a inputOutput and we have as reference only inputOnly or outputOnly we must output the value
             // for this field.
@@ -1131,7 +1137,9 @@ X3DNode .prototype = Object .assign (Object .create (X3DBaseNode .prototype),
          for (let i = 0, length = sourceTextLines .length; i < length; ++ i)
          {
             generator .string += generator .ListIndent ();
+            generator .string += '"';
             generator .string += generator .JSONEncode (sourceTextLines [i]);
+            generator .string += '"';
 
             if (i !== length - 1)
                generator .string += ',';
@@ -1187,7 +1195,9 @@ X3DNode .prototype = Object .assign (Object .create (X3DBaseNode .prototype),
                generator .string += '"';
                generator .string += ':';
                generator .string += generator .TidySpace ();
+               generator .string += '"';
                generator .string += generator .JSONEncode (field .getName ());
+               generator .string += '"';
                generator .string += ',';
                generator .string += generator .TidyBreak ();
 
@@ -1197,7 +1207,9 @@ X3DNode .prototype = Object .assign (Object .create (X3DBaseNode .prototype),
                generator .string += '"';
                generator .string += ':';
                generator .string += generator .TidySpace ();
+               generator .string += '"';
                generator .string += generator .JSONEncode (protoField .getName ());
+               generator .string += '"';
                generator .string += generator .TidyBreak ();
 
                generator .string += generator .DecIndent ();

package/src/x_ite/Components/Core/X3DPrototypeInstance.js

@@ -663,7 +663,9 @@ X3DPrototypeInstance .prototype = Object .assign (Object .create (X3DNode .proto
             generator .string += '"';
             generator .string += ':';
             generator .string += generator .TidySpace ();
+            generator .string += '"';
             generator .string += generator .JSONEncode (this .getTypeName ());
+            generator .string += '"';
             generator .string += ',';
             generator .string += generator .TidyBreak ();
 
@@ -673,7 +675,9 @@ X3DPrototypeInstance .prototype = Object .assign (Object .create (X3DNode .proto
             generator .string += '"';
             generator .string += ':';
             generator .string += generator .TidySpace ();
+            generator .string += '"';
             generator .string += generator .JSONEncode (name);
+            generator .string += '"';
             generator .string += generator .TidyBreak ();
 
             generator .string += generator .DecIndent ();
@@ -717,7 +721,9 @@ X3DPrototypeInstance .prototype = Object .assign (Object .create (X3DNode .proto
          generator .string += '"';
          generator .string += ':';
          generator .string += generator .TidySpace ();
+         generator .string += '"';
          generator .string += generator .JSONEncode (name);
+         generator .string += '"';
          generator .string += ',';
          generator .string += generator .TidyBreak ();
       }
@@ -731,7 +737,9 @@ X3DPrototypeInstance .prototype = Object .assign (Object .create (X3DNode .proto
       generator .string += '"';
       generator .string += ':';
       generator .string += generator .TidySpace ();
+      generator .string += '"';
       generator .string += generator .JSONEncode (this .getTypeName ());
+      generator .string += '"';
       generator .string += ',';
       generator .string += generator .TidyBreak ();
 
@@ -804,7 +812,9 @@ X3DPrototypeInstance .prototype = Object .assign (Object .create (X3DNode .proto
                   generator .string += '"';
                   generator .string += ':';
                   generator .string += generator .TidySpace ();
+                  generator .string += '"';
                   generator .string += generator .JSONEncode (field .getName ());
+                  generator .string += '"';
                   generator .string += ',';
                   generator .string += generator .TidyBreak ();
                   generator .string += generator .Indent ();
@@ -842,7 +852,9 @@ X3DPrototypeInstance .prototype = Object .assign (Object .create (X3DNode .proto
                   generator .string += '"';
                   generator .string += ':';
                   generator .string += generator .TidySpace ();
+                  generator .string += '"';
                   generator .string += generator .JSONEncode (field .getName ());
+                  generator .string += '"';
                   generator .string += ',';
                   generator .string += generator .TidyBreak ();
                   generator .string += generator .Indent ();
@@ -872,7 +884,9 @@ X3DPrototypeInstance .prototype = Object .assign (Object .create (X3DNode .proto
                   generator .string += '"';
                   generator .string += ':';
                   generator .string += generator .TidySpace ();
+                  generator .string += '"';
                   generator .string += generator .JSONEncode (field .getName ());
+                  generator .string += '"';
                   generator .string += ',';
                   generator .string += generator .TidyBreak ();
                   generator .string += generator .Indent ();
@@ -945,7 +959,9 @@ X3DPrototypeInstance .prototype = Object .assign (Object .create (X3DNode .proto
                   generator .string += '"';
                   generator .string += ':';
                   generator .string += generator .TidySpace ();
+                  generator .string += '"';
                   generator .string += generator .JSONEncode (field .getName ());
+                  generator .string += '"';
                   generator .string += ',';
                   generator .string += generator .TidyBreak ();
 
@@ -955,7 +971,9 @@ X3DPrototypeInstance .prototype = Object .assign (Object .create (X3DNode .proto
                   generator .string += '"';
                   generator .string += ':';
                   generator .string += generator .TidySpace ();
+                  generator .string += '"';
                   generator .string += generator .JSONEncode (protoField .getName ());
+                  generator .string += '"';
                   generator .string += generator .TidyBreak ();
 
                   generator .string += generator .DecIndent ();

package/src/x_ite/Configuration/UnitInfo.js

@@ -122,7 +122,9 @@ UnitInfo .prototype = Object .assign (Object .create (X3DObject .prototype),
       generator .string += '"';
       generator .string += ':';
       generator .string += generator .TidySpace ();
+      generator .string += '"';
       generator .string += generator .JSONEncode (this .name);
+      generator .string += '"';
       generator .string += ',';
       generator .string += generator .TidyBreak ();
 

package/src/x_ite/Execution/X3DExportedNode.js

@@ -133,7 +133,9 @@ X3DExportedNode .prototype = Object .assign (Object .create (X3DObject .prototyp
       generator .string += '"';
       generator .string += ':';
       generator .string += generator .TidySpace ();
+      generator .string += '"';
       generator .string += generator .JSONEncode (localName);
+      generator .string += '"';
 
       if (this [_exportedName] !== localName)
       {
@@ -145,7 +147,9 @@ X3DExportedNode .prototype = Object .assign (Object .create (X3DObject .prototyp
          generator .string += '"';
          generator .string += ':';
          generator .string += generator .TidySpace ();
+         generator .string += '"';
          generator .string += generator .JSONEncode (this [_exportedName]);
+         generator .string += '"';
          generator .string += generator .TidyBreak ();
       }
       else