GitButler Integration Commit

This is an integration commit for the virtual branches that GitButler is tracking.

Due to GitButler managing multiple virtual branches, you cannot switch back and
forth between git branches and virtual branches easily. 

If you switch to another branch, GitButler will need to be reinitialized.
If you commit on this branch, GitButler will throw it away.

Here are the branches that are currently applied:
 - Virtual branch (refs/gitbutler/Virtual-branch)
   branch head: 6e6eb5069f
   - .gitignore
 - update-frostbite-images-2024 (refs/gitbutler/update-frostbite-images-2024)
   branch head: 6e6eb5069f
   - .gitignore
 - master (refs/gitbutler/master)

Your previous branch was: 073d474bc3

The sha for that commit was: 073d474bc3

For more information about what we're doing here, check out our docs:
https://docs.gitbutler.com/features/virtual-branches/integration-branch

src/components/publics/PublicPreview.svelte

@@ -22,9 +22,8 @@
     import { GLTFLoader } from "three/addons/loaders/GLTFLoader.js";
     import { OrbitControls } from "three/addons/controls/OrbitControls.js";
     import {onDestroy, onMount} from "svelte";
-    import { CollectionEntry } from "astro:content";
 
-    export let pub: CollectionEntry<"publics">;
+    export let file: string;
     export let fov: number = 60;
     export let near: number = 1
     export let far: number = 1000;
@@ -41,10 +40,6 @@
     let observer: ResizeObserver;
 
     onMount(() => {
-        if (!pub.data["3d"]) {
-            return;
-        }
-
         scene = new THREE.Scene();
         scene.background = new THREE.Color(0x171717);
         camera = new THREE.PerspectiveCamera(fov, 1, near, far);
@@ -57,8 +52,8 @@
 
         const loader = new GLTFLoader();
 
-        loader.load(`/3d/${pub.id}.glb`, (gltf) => {
-            scene.add(gltf.scene);
+        loader.load(`/3d/${file}.glb`, (gltf) => {
+            let s = scene.add(gltf.scene);
 
             let cube_bbox = new THREE.Box3();
             cube_bbox.setFromObject(gltf.scene);
@@ -69,9 +64,7 @@
             camera.position.set(0, center.y, distance);
 
             controls.update();
-        }, undefined, (e) => {
-            console.error(e);
-        });
+        }, undefined, console.log);
 
         div.append(renderer.domElement);
 

src/components/publics/XRayPreview.svelte

@@ -20,19 +20,29 @@
 <script lang="ts">
     let xray: HTMLDivElement;
 
+    let size = 100;
+
     function mouseMove(e: MouseEvent) {
         let x = e.offsetX;
         let y = e.offsetY;
 
-        xray.style.clipPath = `circle(100px at ${x}px ${y}px)`;
+        xray.style.clipPath = `circle(${size}px at ${x}px ${y}px)`;
     }
 
     function reset() {
         xray.style.clipPath = 'circle(0px at 0 0)';
     }
+
+    function handleScroll(e: WheelEvent) {
+        size += e.deltaY / -20;
+        if (size < 20) {
+            size = 20;
+        }
+        mouseMove(e);
+    }
 </script>
 
-<div class="relative overflow-hidden rounded-xl" on:mousemove={mouseMove} on:mouseleave={reset} role="img">
+<div class="relative overflow-hidden rounded-xl" on:mousemove={mouseMove} on:mousewheel|preventDefault={handleScroll} on:mouseleave={reset} role="img">
     <slot name="normal"></slot>
     <div bind:this={xray} class="absolute top-0 left-0 right-0 bottom-0 xray" style="clip-path: circle(0px at 0 0);">
         <slot name="xray">