Update 4.5.8

nimadez · Nov 16, 2024 · 9839435 · 9839435
1 parent d98b011
commit 9839435
Show file tree

Hide file tree

Showing 11 changed files with 45 additions and 36 deletions.
diff --git a/package.json b/package.json
@@ -1,6 +1,6 @@
 {
     "name": "voxel-builder",
-    "version": "4.5.7",
+    "version": "4.5.8",
     "description": "Voxel-based 3D modeling application",
     "main": "electron.js",
     "scripts": {
@@ -11,9 +11,9 @@
     "license": "MIT",
     "devDependencies": {
         "electron": "^30.0.0",
-        "babylonjs": "^7.32.0",
+        "babylonjs": "^7.33.0",
         "three": "^0.170.0",
-        "three-mesh-bvh": "^0.8.2",
+        "three-mesh-bvh": "^0.8.3",
         "three-gpu-pathtracer": "^0.0.23",
         "@tweenjs/tween.js": "^25.0.0"
     }

diff --git a/src/index.html b/src/index.html
@@ -83,7 +83,7 @@
         ul { list-style-type: none; }
         ul li { font-family: var(--font); font-size: var(--font-size); color: var(--btn-color); border-radius: 2px; text-align: center; }
         ul li:hover, .tool_selector, .tool_mesh_selector { background: orange; color: #444; box-shadow: inset 10px 10px 10px var(--btn-shadow); }
-        #introscreen { z-index: 99999; display: unset; background: #1C2128; position: absolute; width: 100%; height: 100%; }
+        #introscreen { z-index: 99999; display: unset; position: absolute; width: 100%; height: 100%; }
         #introscreen .logo { width: fit-content; padding: 10px 15px 10px 15px; position: absolute; left: 50%; top: 50%; transform: translate(-50%,-50%); border-radius: 10px; text-align: center; }
         #introscreen .logo img { width: 192px; height: 192px; image-rendering: optimizeQuality; }
         #canvas { z-index: 0; pointer-events: none; background: #3c4253; position: absolute; width: 100%; height: 100%; }
@@ -159,7 +159,7 @@
         #menu-inscreen-export button { width: 68px; height: 32px; font-size: 11px; }
         #colorpicker { z-index: 500; width: 45px; height: 32px; }
         #colorpicker :first-child { height: 32px; }
-        #info { z-index: 2; display: none; color: var(--info-color); letter-spacing: 0.06em; text-shadow: var(--text-shadow); font-size: 10px; position: absolute; padding: 2px; width: 100%; bottom: 2px; text-align: center; pointer-events: none; }
+        #info { z-index: 2; display: none; color: var(--info-color); letter-spacing: 0.06em; text-shadow: var(--text-shadow); font-size: 10px; position: absolute; margin-bottom: 2px; width: 100%; bottom: 2px; text-align: center; pointer-events: none; }
         #info_tool { z-index: 2; display: none; opacity: 0.8; color: var(--info-color); letter-spacing: 0.06em; text-shadow: var(--text-shadow); font-size: 10px; position: absolute; padding: 2px; width: auto; top: 47px; left: 50%; transform: translateX(-50%); text-align: center; text-transform: uppercase; pointer-events: none; }
         #info_render { z-index: 301; display: none; color: var(--info-color); letter-spacing: 0.06em; text-shadow: var(--text-shadow); font-size: 10px; position: absolute; padding: 2px; width: 100%; bottom: 2px; text-align: center; pointer-events: none; }
         #progressbar { z-index: 2000; background: linear-gradient(90deg, orange, orange, orange, white); width: 0; max-width: 100%; height: 3px; bottom: 0; position: fixed; }
@@ -182,7 +182,7 @@
         .row_input { display: flex; width: 100%; gap: 5px; align-items: center; }
         .row_input :first-child { width: 100%; }
         .row_panel { display: flex; width: 100%; height: 25px; align-items: center; gap: 0; }
-        .row_panel div { width: 31px; padding: 5px; text-align: center; }
+        .row_panel div { width: 100%; padding: 5px; text-align: center; }
         .row_panel:hover { box-shadow: none; }
         .material-icons { font-family: 'Material Icons'; font-weight: normal; font-style: normal; font-size: 16px; vertical-align: middle; text-align: center; line-height: 1; letter-spacing: normal; text-transform: none; display: inline-block; white-space: nowrap; word-wrap: normal; direction: ltr; pointer-events: none; font-feature-settings: 'liga'; -webkit-font-feature-settings: 'liga'; -webkit-font-smoothing: antialiased; }
         ::placeholder { color: #45515c; }
@@ -275,7 +275,7 @@
             <li class="spacer"></li>
             <li class="about">
                 VOXEL BUILDER
-                <br>&#8627; 4.5.7 Beta
+                <br>&#8627; 4.5.8 Beta
                 <br>&#8627; <a href="https://github.com/nimadez/voxel-builder/">GitHub</a>
                 <br>&#8627; <a href="https://github.com/nimadez/voxel-builder/releases">Changelog</a>
                 <br>Developer
@@ -415,7 +415,7 @@
             <li class="category">MATERIAL</li>
             <li class="row_input"><label for="input-pt-roughness">Roughness</label> <input id="input-pt-roughness" class="ignorekeys" type="number" value="0.8" min="0" step="0.01"></input></li>
             <li class="row_input"><label for="input-pt-metalness" style="margin-right: 4px">Metalness</label> <input id="input-pt-metalness" class="ignorekeys" type="number" value="0" min="0" step="0.01"></input></li>
-            <li class="row_input"><label for="input-pt-transmission">Transmiss.</label> <input id="input-pt-transmission" class="ignorekeys" type="number" value="0" min="0" step="0.01"></input></li>
+            <li class="row_input"><label for="input-pt-transmission" style="font-size: 10px; margin-right: -1px">Transmission</label> <input id="input-pt-transmission" class="ignorekeys" type="number" value="0" min="0" step="0.01"></input></li>
             <li class="row_input" title="Black voxels are emissive"><label style="margin-right: 5px">Emissive</label> <input type="color" id="input-pt-emissive" value="#5EC3C5"></li>
             <li class="spacer"></li>
             <li class="row_input">
@@ -534,7 +534,7 @@
             <li><button id="btn_tool_bucket" class="tool_bucket">Bucket</button></li>
             <li><button id="paint_all">Paint All</button></li>
             <li class="category">PICK COLOR</li>
-            <li><button id="btn_tool_eyedrop" class="tool_eyedrop">Eyedropper</button></li>
+            <li><button id="btn_tool_eyedropper" class="tool_eyedropper">Eyedropper</button></li>
         </ul>
 
         <ul class="menu_L panel" id="menu-voxels">
@@ -631,7 +631,7 @@
     <ul id="menu-inscreen-right">
         <li id="colorpicker"><input type="color" id="input-color" value="#4674A4"></li>
         <li><button id="btn_tool_bucket_inscreen" class="tool_bucket" title="Bucket Tool"><i class="material-icons">format_color_fill</i></button></li>
-        <li><button id="btn_tool_eyedrop_inscreen" class="tool_eyedrop" title="Eyedropper Tool"><i class="material-icons">colorize</i></button></li>
+        <li><button id="btn_tool_eyedrop_inscreen" class="tool_eyedropper" title="Eyedropper Tool"><i class="material-icons">colorize</i></button></li>
         <li><button id="material-switch" title="Material Switch">CEL</button></li>
     </ul>
 

diff --git a/src/libs/babylon.gui.min.js b/src/libs/babylon.gui.min.js
diff --git a/src/libs/babylon.inspector.bundle.js b/src/libs/babylon.inspector.bundle.js
diff --git a/src/libs/babylon.js b/src/libs/babylon.js
diff --git a/src/libs/babylonjs.loaders.min.js b/src/libs/babylonjs.loaders.min.js
diff --git a/src/libs/three-mesh-bvh.js b/src/libs/three-mesh-bvh.js
diff --git a/src/main.js b/src/main.js
@@ -16,7 +16,7 @@ const adapter = navigator.gpu && await navigator.gpu.requestAdapter();
 
 CORE.preferences.init(adapter);
 
-engine.init(CORE.preferences.isWebGPU()).then(eng => {
+engine.init(adapter && CORE.preferences.isWebGPU()).then(eng => {
 
     CORE.mainScene.create(eng).then(scn => {
 

diff --git a/src/modules/core.js b/src/modules/core.js
@@ -1700,7 +1700,8 @@ class MeshPool {
         this.meshListSelect(mesh);
         this.getMaterial();
         helper.showBoundingBox(this.selected);
-        helper.highlightOutlineMesh(this.selected, COL_ORANGE_RGB);
+        if (!engine.engine.isWebGPU)
+            helper.highlightOutlineMesh(this.selected, COL_ORANGE_RGB);
     }
 
     deselectMesh() {
@@ -2352,7 +2353,7 @@ class Helper {
     }
 
     setBoxShapeSymmetry(pos, scale, color) {
-        this.boxShapeSymm.isVisible = true;
+        this.boxShapeSymm.isVisible = ui.domSymmPreview.checked;
         this.boxShapeSymm.position = pos;
         this.boxShapeSymm.scaling = scale;
         this.boxShapeSymm.overlayColor = color;
@@ -2693,7 +2694,7 @@ class Tool {
         }
     }
 
-    eyedrop(hex) {
+    eyedropper(hex) {
         currentColor = hex;
         uix.colorPicker.value = color3FromHex(currentColor);
     }
@@ -2718,7 +2719,7 @@ class Tool {
         helper.setBoxShape(start.add(end).divide(VEC3_TWO), scale, color, this.boxCount < MAX_VOXELS_DRAW);
         this.boxCount = helper.boxShape.scaling.x * helper.boxShape.scaling.y * helper.boxShape.scaling.z;
 
-        if (this.isSymmetry && ui.domSymmPreview.checked) {
+        if (this.isSymmetry) {
             helper.setBoxShapeSymmetry(
                 symmetry.invertPos(start).add(symmetry.invertPos(end)).divide(VEC3_TWO),
                 scale, color);
@@ -2879,8 +2880,8 @@ class Tool {
             case 'paint':
                 this.paint(index, this.pos);
                 break;
-            case 'eyedrop':
-                this.eyedrop(builder.voxels[index].color);
+            case 'eyedropper':
+                this.eyedropper(builder.voxels[index].color);
                 break;
             case 'bucket':
                 this.bucket(builder.voxels[index].color);
@@ -2989,8 +2990,8 @@ class Tool {
             case 'paint':
                 this.paint(index, this.pos);
                 break;
-            case 'eyedrop':
-                this.eyedrop(builder.voxels[index].color);
+            case 'eyedropper':
+                this.eyedropper(builder.voxels[index].color);
                 break;
             case 'box_add':
                 if (this.startBox)
@@ -3535,7 +3536,7 @@ class Project {
 
     serializeScene(voxels) {
         const json = {
-            version: "Voxel Builder 4.5.7",
+            version: "Voxel Builder 4.5.8",
             project: {
                 name: "name",
                 voxels: builder.voxels.length
@@ -4709,16 +4710,18 @@ class UserInterface {
                 item.style.display = 'none';
             this.domToolbarL.children[0].style.display = 'unset';
             this.domToolbarL.children[1].style.display = 'unset';
+            this.domToolbarL.children[2].style.display = 'unset';
+            this.domToolbarL.children[3].style.display = 'unset';
 
             this.domMenuInScreenStore.style.display = 'flex';
             this.domMenuInScreenRight.style.display = 'flex';
             this.domMenuInScreenRight.children[3].style.opacity = '0.5';
             this.domMenuInScreenRight.children[3].style.pointerEvents = 'none';
             this.domMenuInScreenBottom.style.display = 'flex';
             this.domMenuInScreenBottom.style.gap = '5px';
-            this.domMenuInScreenBottom.children[1].style.display = 'none';
             this.domMenuInScreenBottom.children[2].style.display = 'none';
-
+            this.domMenuInScreenBottom.children[4].style.display = 'none';
+
             this.domInfo[3].style.display = 'none';
             this.domInfoParent.innerHTML = '&nbsp;' + this.domInfoParent.innerHTML;
 
@@ -5286,7 +5289,7 @@ document.addEventListener("keydown", (ev) => {
             tool.toolSelector('bucket', true);
             break;
         case '8':
-            tool.toolSelector('eyedrop', true);
+            tool.toolSelector('eyedropper', true);
             break;
         case 't':
             tool.toolSelector('transform_box', true);
@@ -5508,7 +5511,7 @@ ui.domMenuInScreenRight.children[1].onclick = () => {
 
 ui.domMenuInScreenRight.children[2].onclick = () => {
     if (ui.checkMode(0))
-        tool.toolSelector('eyedrop', true);
+        tool.toolSelector('eyedropper', true);
 };
 
 ui.domMenuInScreenRight.children[3].onclick = () => {
@@ -5854,7 +5857,7 @@ document.getElementById('btn_tool_box_paint').onclick = () =>       { if (ui.che
 document.getElementById('btn_tool_rect_paint').onclick = () =>      { if (ui.checkMode(0)) tool.toolSelector('rect_paint') };
 document.getElementById('btn_tool_bucket').onclick = () =>          { if (ui.checkMode(0)) tool.toolSelector('bucket') };
 document.getElementById('paint_all').onclick = () =>                { if (ui.checkMode(0)) builder.setAllColorsAndUpdate() };
-document.getElementById('btn_tool_eyedrop').onclick = () =>         { if (ui.checkMode(0)) tool.toolSelector('eyedrop') };
+document.getElementById('btn_tool_eyedropper').onclick = () =>      { if (ui.checkMode(0)) tool.toolSelector('eyedropper') };
 document.getElementById('btn_tool_transform_box').onclick = () =>   { if (ui.checkMode(0)) tool.toolSelector('transform_box') };
 document.getElementById('btn_tool_transform_rect').onclick = () =>  { if (ui.checkMode(0)) tool.toolSelector('transform_rect') };
 document.getElementById('btn_tool_transform_group').onclick = () => { if (ui.checkMode(0)) tool.toolSelector('transform_group') };

diff --git a/src/modules/interfaces/panels.js b/src/modules/interfaces/panels.js
@@ -108,6 +108,13 @@ class Panels {
         };
 
         div_reset.onclick = () => {
+            this.panels.forEach(panel => {
+                if (!panel.detach && panel.x == 0 && panel.y == 0) {
+                    panel.elem.style.display = 'none';
+                    if (panel.button)
+                        panel.button.style.textDecoration = 'none';
+                }
+            });
             this.resetPanel(idx);
         };
 
@@ -177,9 +184,7 @@ class Panels {
         this.panels[idx].elem.style.borderRadius = '3px';
         this.panels[idx].elem.style.borderTopLeftRadius = '0';
         this.panels[idx].elem.style.borderTopRightRadius = '0';
-        this.panels[idx].elem.style.display = 'none';
         this.panels[idx].elem.style.zIndex = 1000;
-        this.panels[idx].button.style.textDecoration = 'none';
     }
 
     setTranslate(idx, x, y) {

diff --git a/src/modules/sandbox/sandbox.js b/src/modules/sandbox/sandbox.js
@@ -558,8 +558,8 @@ class PathTracer {
     constructor() {
         this.pt = new WebGLPathTracer(renderer);
         this.pt.bounces = 1;
-        this.pt.renderDelay = 300;
-        this.pt.fadeDuration = 300;
+        this.pt.renderDelay = 100;
+        this.pt.fadeDuration = 250;
         this.pt.minSamples = 1;
         this.pt.renderToCanvas = true;
         this.pt.textureSize = new THREE.Vector2(512, 512);