- update three.js 0.129.0

- npm wanted updates
- changes of fragmentClippingMeshStandard property inside of js/clip/shader.js

package.json

@@ -5,12 +5,12 @@
     "main": "dist/main.js",
     "dependencies": {
         "@fortawesome/fontawesome-free": "^5.15.2",
-        "@types/three": "^0.128.0",
+        "@types/three": "^0.129.1",
         "bulma": "^0.9.2",
         "lodash": "^4.17.21",
         "normalize.css": "^8.0.1",
         "proj4": "^2.6.3",
-        "three": "^0.128.0"
+        "three": "^0.129.0"
     },
     "author": "Arno Kaimbacher",
     "license": "MIT",
@@ -31,7 +31,7 @@
         "mini-css-extract-plugin": "^1.3.1",
         "node-sass": "^6.0.0",
         "resolve-url-loader": "^4.0.0",
-        "sass-loader": "^11.0.1",
+        "sass-loader": "^12.1.0",
         "style-loader": "^2.0.0",
         "terser-webpack-plugin": "^5.0.3",
         "url-loader": "^4.1.1",

src/js/clip/Selection.ts

@@ -126,7 +126,7 @@ export class Selection extends Layer {
     toggle() {
         let visible = !this.visible;
         this.visible = visible;
-        this.boxMesh.visible = visible;
+        // this.boxMesh.visible = visible;
         this.displayMeshes.visible = visible;
         this.touchMeshes.visible = visible;
         this._map.update();

src/js/clip/shader.js

@@ -189,9 +189,9 @@ let shader = {
 		}`,
 
 	fragmentClippingMeshStandard: `
-		#ifdef GL_ES
-		precision highp float;
-		#endif
+		// #ifdef GL_ES
+		// precision highp float;
+		// #endif
 
 		#define STANDARD
 
@@ -219,8 +219,9 @@ let shader = {
 		#include <aomap_pars_fragment>
 		#include <lightmap_pars_fragment>
 		#include <emissivemap_pars_fragment>
-		#include <transmissionmap_pars_fragment>
+		// #include <transmissionmap_pars_fragment>
 		#include <bsdfs>
+		#include <transmission_pars_fragment>
 		#include <cube_uv_reflection_fragment>
 		#include <envmap_common_pars_fragment>
 		#include <envmap_physical_pars_fragment>
@@ -246,6 +247,7 @@ let shader = {
 		
 			#ifdef TRANSMISSION
 				float totalTransmission = transmission;
+				float thicknessFactor = thickness;
 			#endif
 		
 			#include <logdepthbuf_fragment>
@@ -260,8 +262,11 @@ let shader = {
 			#include <clearcoat_normal_fragment_begin>
 			#include <clearcoat_normal_fragment_maps>
 			#include <emissivemap_fragment>
-			#include <transmissionmap_fragment>
-		
+			//#include <transmissionmap_fragment>
+
+			vec3 rawDiffuseColor = diffuseColor.rgb;
+			#include <transmission_fragment>
+					
 			// accumulation
 			#include <lights_physical_fragment>
 			#include <lights_fragment_begin>
@@ -272,11 +277,6 @@ let shader = {
 			#include <aomap_fragment>
 		
 			vec3 outgoingLight = reflectedLight.directDiffuse + reflectedLight.indirectDiffuse + reflectedLight.directSpecular + reflectedLight.indirectSpecular + totalEmissiveRadiance;
-		
-			// // this is a stub for the transmission model
-			// #ifdef TRANSMISSION
-			// 	diffuseColor.a *= mix( saturate( 1. - totalTransmission + linearToRelativeLuminance( reflectedLight.directSpecular + reflectedLight.indirectSpecular ) ), 1.0, metalness );
-			// #endif	
 
 			if (
 				worldPosition.x < clippingLow.x  

src/js/main.js

@@ -93,8 +93,7 @@ class Application {
     }
 
     async createScene() {
-
-        var dirNode = document.getElementsByTagName("body")[0];
+        let dirNode = document.getElementsByTagName("body")[0];
         if (browser.touch == true && browser.mobile == true) {
             //dirNode.setAttribute("dir", "ltr");
             domUtil.addClass(dirNode, "touch");
@@ -103,7 +102,7 @@ class Application {
         }
 
         // let opt = { r: 200, c: 0x38eeff, o: 0.8 };
-        var opt = { r: 5, c: 0xffff00, o: 1 };
+        let opt = { r: 5, c: 0xffff00, o: 1 };
         this.queryMarker = new Mesh(new SphereGeometry(opt.r),
             new MeshLambertMaterial({ color: opt.c, opacity: opt.o, transparent: (opt.o < 1) }));