Add shaders in the web-app and process lighting there

BlueMapCore/src/main/webroot/js/libs/BlueMap.js

@@ -43,7 +43,7 @@ import {
 	Texture,
 	TextureLoader,
 	VertexColors,
-	WebGLRenderer,
+	WebGLRenderer, ShaderMaterial,
 } from 'three';
 
 import Compass from './modules/Compass.js';
@@ -55,6 +55,11 @@ import Settings from './modules/Settings.js';
 import Controls from './Controls.js';
 import TileManager from './TileManager.js';
 
+import HIRES_VERTEX_SHADER from './shaders/HiresVertexShader.js';
+import HIRES_FRAGMENT_SHADER from './shaders/HiresFragmentShader.js';
+import LOWRES_VERTEX_SHADER from './shaders/LowresVertexShader.js';
+import LOWRES_FRAGMENT_SHADER from './shaders/LowresFragmentShader.js';
+
 import { stringToImage, pathFromCoords } from './utils.js';
 
 import SKYBOX_NORTH from '../../assets/skybox/north.png';
@@ -367,16 +372,6 @@ export default class BlueMap {
 
 					let opaque = t['color'][3] === 1;
 					let transparent = t['transparent'];
-					let material = new MeshLambertMaterial({
-						transparent: transparent,
-						alphaTest: transparent ? 0 : (opaque ? 1 : 0.01),
-						depthWrite: true,
-						depthTest: true,
-						blending: NormalBlending,
-						vertexColors: VertexColors,
-						side: FrontSide,
-						wireframe: false
-					});
 
 					let texture = new Texture();
 					texture.image = stringToImage(t['texture']);
@@ -391,9 +386,29 @@ export default class BlueMap {
 					texture.flatShading = true;
 					texture.needsUpdate = true;
 
-					material.map = texture;
-					material.needsUpdate = true;
+					let uniforms = {
+						texture: {
+							type: 't',
+							value: texture
+						},
+						sunlightStrength: {
+							value: 1
+						}
+					};
 
+					let material = new ShaderMaterial({
+						uniforms: uniforms,
+						vertexShader: HIRES_VERTEX_SHADER,
+						fragmentShader: HIRES_FRAGMENT_SHADER,
+						transparent: transparent,
+						depthWrite: true,
+						depthTest: true,
+						vertexColors: VertexColors,
+						side: FrontSide,
+						wireframe: false,
+					});
+
+					material.needsUpdate = true;
 					materials[i] = material;
 				}
 
@@ -404,7 +419,9 @@ export default class BlueMap {
 	}
 
 	async loadLowresMaterial() {
-		this.lowresMaterial = new MeshLambertMaterial({
+		this.lowresMaterial = new ShaderMaterial({
+			vertexShader: LOWRES_VERTEX_SHADER,
+			fragmentShader: LOWRES_FRAGMENT_SHADER,
 			transparent: false,
 			depthWrite: true,
 			depthTest: true,

BlueMapCore/src/main/webroot/js/libs/shaders/HiresFragmentShader.js

@@ -0,0 +1,56 @@
+/*
+ * This file is part of BlueMap, licensed under the MIT License (MIT).
+ *
+ * Copyright (c) Blue (Lukas Rieger) <https://bluecolored.de>
+ * Copyright (c) contributors
+ *
+ * Permission is hereby granted, free of charge, to any person obtaining a copy
+ * of this software and associated documentation files (the 'Software'), to deal
+ * in the Software without restriction, including without limitation the rights
+ * to use, copy, modify, merge, publish, distribute, sublicense, and/or sell
+ * copies of the Software, and to permit persons to whom the Software is
+ * furnished to do so, subject to the following conditions:
+ *
+ * The above copyright notice and this permission notice shall be included in
+ * all copies or substantial portions of the Software.
+ *
+ * THE SOFTWARE IS PROVIDED 'AS IS', WITHOUT WARRANTY OF ANY KIND, EXPRESS OR
+ * IMPLIED, INCLUDING BUT NOT LIMITED TO THE WARRANTIES OF MERCHANTABILITY,
+ * FITNESS FOR A PARTICULAR PURPOSE AND NONINFRINGEMENT. IN NO EVENT SHALL THE
+ * AUTHORS OR COPYRIGHT HOLDERS BE LIABLE FOR ANY CLAIM, DAMAGES OR OTHER
+ * LIABILITY, WHETHER IN AN ACTION OF CONTRACT, TORT OR OTHERWISE, ARISING FROM,
+ * OUT OF OR IN CONNECTION WITH THE SOFTWARE OR THE USE OR OTHER DEALINGS IN
+ * THE SOFTWARE.
+ */
+
+const HIRES_FRAGMENT_SHADER = `
+uniform sampler2D texture;
+uniform float sunlightStrength;
+
+varying vec3 vPosition;
+varying vec3 vNormal;
+varying vec2 vUv;
+varying vec3 vColor;
+varying float vAo;
+varying float vSunlight;
+varying float vBlocklight;
+
+void main() {
+	vec4 color = texture2D(texture, vUv);
+	if (color.a == 0.0) discard;
+	
+	//apply vertex-color
+	color.rgb *= vColor;
+
+	//apply ao
+	color.rgb *= vAo;
+	
+	//apply light
+	float light = max(vSunlight * sunlightStrength, vBlocklight);
+	color.rgb *= light / 15.0;
+
+	gl_FragColor = color;
+}
+`;
+
+export default HIRES_FRAGMENT_SHADER;

BlueMapCore/src/main/webroot/js/libs/shaders/HiresVertexShader.js

@@ -0,0 +1,55 @@
+/*
+ * This file is part of BlueMap, licensed under the MIT License (MIT).
+ *
+ * Copyright (c) Blue (Lukas Rieger) <https://bluecolored.de>
+ * Copyright (c) contributors
+ *
+ * Permission is hereby granted, free of charge, to any person obtaining a copy
+ * of this software and associated documentation files (the 'Software'), to deal
+ * in the Software without restriction, including without limitation the rights
+ * to use, copy, modify, merge, publish, distribute, sublicense, and/or sell
+ * copies of the Software, and to permit persons to whom the Software is
+ * furnished to do so, subject to the following conditions:
+ *
+ * The above copyright notice and this permission notice shall be included in
+ * all copies or substantial portions of the Software.
+ *
+ * THE SOFTWARE IS PROVIDED 'AS IS', WITHOUT WARRANTY OF ANY KIND, EXPRESS OR
+ * IMPLIED, INCLUDING BUT NOT LIMITED TO THE WARRANTIES OF MERCHANTABILITY,
+ * FITNESS FOR A PARTICULAR PURPOSE AND NONINFRINGEMENT. IN NO EVENT SHALL THE
+ * AUTHORS OR COPYRIGHT HOLDERS BE LIABLE FOR ANY CLAIM, DAMAGES OR OTHER
+ * LIABILITY, WHETHER IN AN ACTION OF CONTRACT, TORT OR OTHERWISE, ARISING FROM,
+ * OUT OF OR IN CONNECTION WITH THE SOFTWARE OR THE USE OR OTHER DEALINGS IN
+ * THE SOFTWARE.
+ */
+
+const HIRES_VERTEX_SHADER = `
+attribute float ao;
+attribute float sunlight;
+attribute float blocklight;
+
+varying vec3 vPosition;
+varying vec3 vNormal;
+varying vec2 vUv;
+varying vec3 vColor;
+varying float vAo;
+varying float vSunlight;
+varying float vBlocklight;
+
+void main() {
+	vPosition = position;
+	vNormal = normal;
+	vUv = uv;
+	vColor = color;
+	vAo = ao;
+	vSunlight = sunlight;
+	vBlocklight = blocklight;
+	
+    gl_Position = 
+    	projectionMatrix *
+		modelViewMatrix *
+		vec4(position, 1);
+}
+`;
+
+export default HIRES_VERTEX_SHADER;

BlueMapCore/src/main/webroot/js/libs/shaders/LowresFragmentShader.js

@@ -0,0 +1,42 @@
+/*
+ * This file is part of BlueMap, licensed under the MIT License (MIT).
+ *
+ * Copyright (c) Blue (Lukas Rieger) <https://bluecolored.de>
+ * Copyright (c) contributors
+ *
+ * Permission is hereby granted, free of charge, to any person obtaining a copy
+ * of this software and associated documentation files (the 'Software'), to deal
+ * in the Software without restriction, including without limitation the rights
+ * to use, copy, modify, merge, publish, distribute, sublicense, and/or sell
+ * copies of the Software, and to permit persons to whom the Software is
+ * furnished to do so, subject to the following conditions:
+ *
+ * The above copyright notice and this permission notice shall be included in
+ * all copies or substantial portions of the Software.
+ *
+ * THE SOFTWARE IS PROVIDED 'AS IS', WITHOUT WARRANTY OF ANY KIND, EXPRESS OR
+ * IMPLIED, INCLUDING BUT NOT LIMITED TO THE WARRANTIES OF MERCHANTABILITY,
+ * FITNESS FOR A PARTICULAR PURPOSE AND NONINFRINGEMENT. IN NO EVENT SHALL THE
+ * AUTHORS OR COPYRIGHT HOLDERS BE LIABLE FOR ANY CLAIM, DAMAGES OR OTHER
+ * LIABILITY, WHETHER IN AN ACTION OF CONTRACT, TORT OR OTHERWISE, ARISING FROM,
+ * OUT OF OR IN CONNECTION WITH THE SOFTWARE OR THE USE OR OTHER DEALINGS IN
+ * THE SOFTWARE.
+ */
+
+const LOWRES_FRAGMENT_SHADER = `
+varying vec3 vPosition;
+varying vec3 vNormal;
+varying vec2 vUv;
+varying vec3 vColor;
+
+void main() {
+	vec4 color = vec4(vColor, 1.0);
+
+	float diff = sqrt(max(dot(vNormal, vec3(0.3637, 0.7274, 0.5819)), 0.0)) * 0.4 + 0.6;
+	color *= diff;
+
+	gl_FragColor = color;
+}
+`;
+
+export default LOWRES_FRAGMENT_SHADER;

BlueMapCore/src/main/webroot/js/libs/shaders/LowresVertexShader.js

@@ -0,0 +1,45 @@
+/*
+ * This file is part of BlueMap, licensed under the MIT License (MIT).
+ *
+ * Copyright (c) Blue (Lukas Rieger) <https://bluecolored.de>
+ * Copyright (c) contributors
+ *
+ * Permission is hereby granted, free of charge, to any person obtaining a copy
+ * of this software and associated documentation files (the 'Software'), to deal
+ * in the Software without restriction, including without limitation the rights
+ * to use, copy, modify, merge, publish, distribute, sublicense, and/or sell
+ * copies of the Software, and to permit persons to whom the Software is
+ * furnished to do so, subject to the following conditions:
+ *
+ * The above copyright notice and this permission notice shall be included in
+ * all copies or substantial portions of the Software.
+ *
+ * THE SOFTWARE IS PROVIDED 'AS IS', WITHOUT WARRANTY OF ANY KIND, EXPRESS OR
+ * IMPLIED, INCLUDING BUT NOT LIMITED TO THE WARRANTIES OF MERCHANTABILITY,
+ * FITNESS FOR A PARTICULAR PURPOSE AND NONINFRINGEMENT. IN NO EVENT SHALL THE
+ * AUTHORS OR COPYRIGHT HOLDERS BE LIABLE FOR ANY CLAIM, DAMAGES OR OTHER
+ * LIABILITY, WHETHER IN AN ACTION OF CONTRACT, TORT OR OTHERWISE, ARISING FROM,
+ * OUT OF OR IN CONNECTION WITH THE SOFTWARE OR THE USE OR OTHER DEALINGS IN
+ * THE SOFTWARE.
+ */
+
+const LOWRES_VERTEX_SHADER = `
+varying vec3 vPosition;
+varying vec3 vNormal;
+varying vec2 vUv;
+varying vec3 vColor;
+
+void main() {
+	vPosition = position;
+	vNormal = normal;
+	vUv = uv;
+	vColor = color;
+	
+    gl_Position = 
+    	projectionMatrix *
+		modelViewMatrix *
+		vec4(position, 1);
+}
+`;
+
+export default LOWRES_VERTEX_SHADER;