Configuration for external libs / worker source

.gitignore

@@ -2,3 +2,4 @@ build/*
 plugins/*
 node_modules
 __pycache__
+.idea

libs/occt/occt-import-js-worker.js

@@ -0,0 +1,14 @@
+
+importScripts ('occt-import-js.js');
+
+onmessage = async function (ev)
+{
+	let modulOverrides = {
+		locateFile: function (path) {
+			return path;
+		}
+	};
+	let occt = await occtimportjs (modulOverrides);
+	let result = occt.ReadFile (ev.data.format, ev.data.buffer, ev.data.params);
+	postMessage (result);
+};

package.json

@@ -1,6 +1,6 @@
 {
 	"name": "online-3d-viewer",
-	"version": "0.15.0",
+	"version": "0.16.0",
 	"description": "Online 3D Viewer",
 	"license": "MIT",
 	"type": "module",

source/engine/import/importerifc.js

@@ -43,7 +43,7 @@ export class ImporterIfc extends ImporterBase
     ImportContent (fileContent, onFinish)
     {
         if (this.ifc === null) {
-            LoadExternalLibrary ('webifc').then (() => {
+            LoadExternalLibrary ('web-ifc-api').then (() => {
                 this.ifc = new WebIFC.IfcAPI ();
                 this.ifc.Init ().then (() => {
                     this.ImportIfcContent (fileContent);

source/engine/import/importerutils.js

@@ -1,7 +1,7 @@
 import { IsLower } from '../geometry/geometry.js';
 import { PhongMaterial } from '../model/material.js';
 import { RGBColor, IntegerToHexString } from '../model/color.js';
-import { LoadExternalLibraryFromUrl } from '../io/externallibs.js';
+import {GetExternalLibPath, LoadExternalLibraryFromLibs, LoadExternalLibraryFromUrl} from '../io/externallibs.js';
 
 export function NameFromLine (line, startIndex, commentChar)
 {
@@ -102,11 +102,27 @@ export class ColorToMaterialConverter
 	}
 }
 
-let occtWorkerUrl = null;
 
+let shouldLoadExternalLibsFromCdn = false;
+
+/**
+ * Sets the location of the external libraries used by the engine for rhino3dm & draco. This is the content of the libs
+ * folder. Can be used to rely on jsdelivr to deliver theses libs to the client.
+ * @param {boolean} newValue.
+ */
+export function SetShouldLoadExternalLibsFromCdn (newValue) {
+	shouldLoadExternalLibsFromCdn = newValue;
+}
+
+let occtWorkerUrl = null;
 export function CreateOcctWorker (worker)
 {
 	return new Promise ((resolve, reject) => {
+		if(!shouldLoadExternalLibsFromCdn && occtWorkerUrl === null) {
+			resolve (new Worker (GetExternalLibPath('occt/occt-import-js-worker.js')));
+			return;
+		}
+
 		if (occtWorkerUrl !== null) {
 			resolve (new Worker (occtWorkerUrl));
 			return;
@@ -134,12 +150,37 @@ export function CreateOcctWorker (worker)
 export function LoadExternalLibrary (libraryName)
 {
 	if (libraryName === 'rhino3dm') {
-		return LoadExternalLibraryFromUrl ('https://cdn.jsdelivr.net/npm/rhino3dm@8.4.0/rhino3dm.min.js');
-	} else if (libraryName === 'webifc') {
-		return LoadExternalLibraryFromUrl ('https://cdn.jsdelivr.net/npm/web-ifc@0.0.55/web-ifc-api-iife.js');
+		return LoadRhino3dm ();
 	} else if (libraryName === 'draco3d') {
+		return LoadDraco ();
+	} else if (libraryName === 'web-ifc-api') {
+		return LoadIfcApi ();
+	}
+	else {
+		return null;
+	}
+}
+
+function LoadRhino3dm () {
+	if (shouldLoadExternalLibsFromCdn) {
+		return LoadExternalLibraryFromUrl ('https://cdn.jsdelivr.net/npm/rhino3dm@8.4.0/rhino3dm.min.js');
+	} else {
+		return LoadExternalLibraryFromLibs ('loaders/rhino3dm.min.js');
+	}
+}
+
+function LoadDraco () {
+	if (shouldLoadExternalLibsFromCdn) {
 		return LoadExternalLibraryFromUrl ('https://cdn.jsdelivr.net/npm/draco3d@1.5.7/draco_decoder_nodejs.min.js');
 	} else {
-		return null;
+		return LoadExternalLibraryFromLibs ('loaders/draco_decoder_nodejs.min.js');
 	}
 }
+
+function LoadIfcApi () {
+    if(shouldLoadExternalLibsFromCdn) {
+        return LoadExternalLibraryFromUrl('https://cdn.jsdelivr.net/npm/web-ifc@0.0.55/web-ifc-api-iife.js');
+    } else {
+        return LoadExternalLibraryFromLibs ('loaders/web-ifc-api-browser.js');
+    }
+}

source/engine/io/externallibs.js

@@ -1,8 +1,60 @@
+let externalLibLocation = null;
+let loadedExternalLibs = new Set ();
 let loadedExternalLibUrls = new Set ();
 
+/**
+ * Sets the location of the external libraries used by the engine. This is the content of the libs
+ * folder in the package. The location must be relative to the main file.
+ * @param {string} newExternalLibLocation Relative path to the libs folder.
+ */
+export function SetExternalLibLocation (newExternalLibLocation)
+{
+    externalLibLocation = newExternalLibLocation;
+}
+
+export function GetExternalLibPath (libName)
+{
+    if (externalLibLocation === null) {
+        return null;
+    }
+    return externalLibLocation + '/' + libName;
+}
+
+export function LoadExternalLibraryFromLibs (libName)
+{
+    return new Promise ((resolve, reject) => {
+        if (externalLibLocation === null) {
+            reject ();
+            return;
+        }
+
+        if (loadedExternalLibs.has (libName)) {
+            resolve ();
+            return;
+        }
+
+        let scriptElement = document.createElement ('script');
+        scriptElement.type = 'text/javascript';
+        scriptElement.src = GetExternalLibPath (libName);
+        scriptElement.onload = () => {
+            loadedExternalLibs.add (libName);
+            resolve ();
+        };
+        scriptElement.onerror = () => {
+            reject ();
+        };
+        document.head.appendChild (scriptElement);
+    });
+}
+
 export function LoadExternalLibraryFromUrl (libraryUrl)
 {
     return new Promise ((resolve, reject) => {
+        if (externalLibLocation === null) {
+            reject ();
+            return;
+        }
+
         if (loadedExternalLibUrls.has (libraryUrl)) {
             resolve ();
             return;
@@ -20,4 +72,4 @@ export function LoadExternalLibraryFromUrl (libraryUrl)
         };
         document.head.appendChild (scriptElement);
     });
-}
+}

source/engine/main.js

@@ -39,11 +39,11 @@ import { ImporterPly } from './import/importerply.js';
 import { ImporterStl } from './import/importerstl.js';
 import { ImporterThreeSvg } from './import/importersvg.js';
 import { ImporterThreeBase, ImporterThreeFbx, ImporterThreeDae, ImporterThreeWrl, ImporterThree3mf, ImporterThreeAmf } from './import/importerthree.js';
-import { ColorToMaterialConverter, NameFromLine, ParametersFromLine, ReadLines, IsPowerOfTwo, NextPowerOfTwo, UpdateMaterialTransparency, CreateOcctWorker, LoadExternalLibrary } from './import/importerutils.js';
+import { ColorToMaterialConverter, NameFromLine, ParametersFromLine, ReadLines, IsPowerOfTwo, NextPowerOfTwo, UpdateMaterialTransparency, SetShouldLoadExternalLibsFromCdn, CreateOcctWorker, LoadExternalLibrary } from './import/importerutils.js';
 import { BinaryReader } from './io/binaryreader.js';
 import { BinaryWriter } from './io/binarywriter.js';
 import { ArrayBufferToUtf8String, ArrayBufferToAsciiString, AsciiStringToArrayBuffer, Utf8StringToArrayBuffer, Base64DataURIToArrayBuffer, GetFileExtensionFromMimeType, CreateObjectUrl, CreateObjectUrlWithMimeType, RevokeObjectUrl } from './io/bufferutils.js';
-import { LoadExternalLibraryFromUrl } from './io/externallibs.js';
+import { SetExternalLibLocation, GetExternalLibPath, LoadExternalLibraryFromLibs, LoadExternalLibraryFromUrl } from './io/externallibs.js';
 import { GetFileName, GetFileExtension, RequestUrl, ReadFile, TransformFileHostUrls, IsUrl, FileSource, FileFormat } from './io/fileutils.js';
 import { TextWriter } from './io/textwriter.js';
 import { RGBColor, RGBAColor, ColorComponentFromFloat, ColorComponentToFloat, RGBColorFromFloatComponents, SRGBToLinear, LinearToSRGB, IntegerToHexString, RGBColorToHexString, RGBAColorToHexString, HexStringToRGBColor, HexStringToRGBAColor, ArrayToRGBColor, RGBColorIsEqual } from './model/color.js';
@@ -193,6 +193,7 @@ export {
     IsPowerOfTwo,
     NextPowerOfTwo,
     UpdateMaterialTransparency,
+    SetShouldLoadExternalLibsFromCdn,
     CreateOcctWorker,
     LoadExternalLibrary,
     BinaryReader,
@@ -206,6 +207,9 @@ export {
     CreateObjectUrl,
     CreateObjectUrlWithMimeType,
     RevokeObjectUrl,
+    SetExternalLibLocation,
+    GetExternalLibPath,
+    LoadExternalLibraryFromLibs,
     LoadExternalLibraryFromUrl,
     GetFileName,
     GetFileExtension,

source/website/index.js

@@ -1,3 +1,4 @@
+import { SetExternalLibLocation } from '../engine/io/externallibs.js';
 import { Loc } from '../engine/core/localization.js';
 import { AddDiv, AddDomElement } from '../engine/viewer/domutils.js';
 import { Embed } from './embed.js';
@@ -6,6 +7,7 @@ import { SetEventHandler, HandleEvent } from './eventhandler.js';
 import { PluginType, RegisterPlugin } from './pluginregistry.js';
 import { ButtonDialog, ProgressDialog } from './dialog.js';
 import { ShowMessageDialog } from './dialogs.js';
+import { SetShouldLoadExternalLibsFromCdn } from '../engine/import/importerutils.js';
 
 import * as Engine from '../engine/main.js';
 export { Engine };
@@ -45,7 +47,7 @@ export function RegisterToolbarPlugin (plugin)
     RegisterPlugin (PluginType.Toolbar, plugin);
 }
 
-export function StartWebsite ()
+export function StartWebsite (externalLibLocation)
 {
     window.addEventListener ('load', () => {
         if (window.self !== window.top) {
@@ -57,6 +59,9 @@ export function StartWebsite ()
             return;
         }
 
+        SetExternalLibLocation (externalLibLocation);
+        SetShouldLoadExternalLibsFromCdn (true);
+
         document.getElementById ('intro_dragdrop_text').innerHTML = Loc ('Drag and drop 3D models here.');
         document.getElementById ('intro_formats_title').innerHTML = Loc ('Check an example file:');
 
@@ -81,8 +86,10 @@ export function StartWebsite ()
     });
 }
 
-export function StartEmbed ()
+export function StartEmbed (externalLibLocation)
 {
+    SetExternalLibLocation (externalLibLocation);
+    SetShouldLoadExternalLibsFromCdn (true);
     window.addEventListener ('load', () => {
         let embed = new Embed ({
             viewerDiv : document.getElementById ('embed_viewer'),

website/index.html

@@ -32,7 +32,7 @@
     <!-- website analytics end -->
 
     <script type="text/javascript">
-        OV.StartWebsite ();
+        OV.StartWebsite ('../libs');
     </script>
 
 </head>