Update Texture Viewer

Author: GitHubDragonFly

viewers/templates/Texture Viewer.html

@@ -556,7 +556,7 @@
         const arrow_keys = [ 'ArrowUp', 'ArrowDown', 'ArrowRight', 'ArrowLeft' ];
 
         window.addEventListener( 'pointerdown', ( event ) => { mouse_down = true; }, false);
-        window.addEventListener( 'pointerup', ( event ) => { mouse_down = false; }, false);
+        window.addEventListener( 'pointerup', ( event ) => { mouse_down = false; mouse_wheel = true; }, false);
         window.addEventListener( 'wheel', ( event ) => { mouse_wheel = true; }, false);
         window.addEventListener( 'keydown', ( event ) => {
           if (arrow_keys.some( k => k === event.key ) || event.ctrlKey || event.metaKey || event.shiftKey) {
@@ -723,7 +723,7 @@
           bgnd_linear_gradient = true;
 
           let canvas = document.createElement('canvas');
-          let context = canvas.getContext("2d");
+          let context = canvas.getContext('2d');
           canvas.width = ww;
           canvas.height = wh;
 
@@ -737,9 +737,10 @@
 
           let texture = new THREE.Texture( canvas );
           texture.mapping = THREE.EquirectangularReflectionMapping;
-          scene.background = texture.clone();
           texture.needsUpdate = true;
 
+          scene.background = texture.clone();
+
           texture.dispose();
 
           document.getElementById('file_image_input').value = '';
@@ -1100,6 +1101,7 @@
 
         if (renderer === undefined) {
           renderer = new THREE.WebGLRenderer( { antialias: true, alpha: true } );
+          renderer.outputColorSpace = THREE.SRGBColorSpace;
           renderer.setPixelRatio( window.devicePixelRatio );
           renderer.toneMapping = THREE.NeutralToneMapping;
           renderer.toneMappingExposure = 1.0;
@@ -1121,7 +1123,7 @@
 
         if (scene === undefined) scene = new THREE.Scene();
 
-        scene.backgroundIntensity = 1.155;
+        scene.backgroundIntensity = 1.0;
 
         if (css_renderer === undefined) {
           css_renderer = new css2d_renderer();
@@ -1628,9 +1630,11 @@
       async function loadPlane() {
         let geometry = new THREE.PlaneGeometry();
 
-        let material = new THREE.MeshLambertMaterial( {
+        let material = new THREE.MeshStandardMaterial( {
           side: THREE.DoubleSide,
           color: 0xFFFFFF,
+          metalness: 0.8,
+          roughness: 0.5,
           opacity: 1,
           transparent: true
         } );
@@ -2866,8 +2870,6 @@
                       texture_files[ current_texture ].tex.colorSpace = THREE.SRGBColorSpace;
                       texture_files[ current_texture ].tex.wrapS = THREE.RepeatWrapping;
                       texture_files[ current_texture ].tex.wrapT = THREE.RepeatWrapping;
-                      texture_files[ current_texture ].tex.minFilter = THREE.NearestMipmapNearestFilter;
-                      texture_files[ current_texture ].tex.maxFilter = THREE.NearestMipmapNearestFilter;
 
                       if (texture_files[ current_texture ].tex.image.length > 0 && !texture_files[ current_texture ].tex.mipmaps) {
                         texture_files[ current_texture ].tex.mipmaps = texture_files[ current_texture ].tex.image[ 0 ].mipmaps;
@@ -2887,8 +2889,6 @@
                       texture_files[ current_texture ].tex.colorSpace = THREE.SRGBColorSpace;
                       texture_files[ current_texture ].tex.wrapS = THREE.RepeatWrapping;
                       texture_files[ current_texture ].tex.wrapT = THREE.RepeatWrapping;
-                      texture_files[ current_texture ].tex.minFilter = THREE.NearestMipmapNearestFilter;
-                      texture_files[ current_texture ].tex.maxFilter = THREE.NearestMipmapNearestFilter;
 
                       if (texture_files[ current_texture ].image && texture_files[ current_texture ].image.length > 0 && !texture_files[ current_texture ].mipmaps) {
                         texture_files[ current_texture ].mipmaps = texture_files[ current_texture ].image[ 0 ].mipmaps;
@@ -3053,7 +3053,7 @@
             }
 
             if (mouse_wheel === true) {
-              if (count > 30) {
+              if (count > 40) {
                 mouse_wheel = false;
                 count = 0;
               } else {