v0.7.6: geen wolfsdak bij een overkapping (veranda, inpandig of uitpandig: het dak van een unit steekt buiten zijn vloer, HouseModel.hasCover): de keuze verdwijnt in configurator en light, een bestaand wolfsdak wordt een zadeldak met dezelfde goot en nok; afdekker op een stenen trasraam onder rabat, felsplaten of stuc (WallModel.TRAS_CAP): zetwerk achter de bekleding, 5° aflopend, neus 25 mm over de steen, onderbroken bij openingen, bij een buitenhoek door tot voorbij de buursteen, zwart/antraciet/wit (WallModel.TRIM_COLORS), in 3D, PDF-aanzichten, materialen, rapport en kosten; ventilatierooster van 40 mm op de gevel direct onder de onderplaat van alle boeidelen (RoofModel.VENT, niet boven een veranda of tegen een hogere gevel), sleuven in de textuur, aan/uit en kleur bij Dak › Boeideel, in 3D, PDF, rapport en kosten; light-versie: boeidelen of daktrim met kleur boeidelen (Dak) en één zetwerk-kleur voor afdekker en rooster (Gevel); 3D zijwaarts schuiven ook met de middelste muisknop, Shift/Ctrl/⌘ + slepen en de pijltjestoetsen met de muis boven de weergave (configurator en light, hints en sneltoetsenoverzicht bijgewerkt)

Co-Authored-By: Claude Opus 5.5 <noreply@anthropic.com>

js/vendor/OrbitControls.js

@@ -4,7 +4,8 @@
 // hebben om het origineel te vendoren; dekt precies de subset die wall.js
 // gebruikt (`new THREE.OrbitControls(camera, domElement)`,
 // `controls.target.set(...)`, `controls.update()`), plus interactie:
-// links-slepen = roteren, scrollwiel = zoomen, rechts-slepen = pannen;
+// links-slepen = roteren, scrollwiel = zoomen; zijwaarts schuiven (pannen) met rechts- of middelste-knop-slepen,
+// Shift/Ctrl/⌘ + links-slepen, of de pijltjestoetsen terwijl de muis boven de weergave staat;
 // touch: één vinger = roteren, twee vingers = knijpen (zoomen) en samen schuiven (pannen).
 //
 // Moet NA three.min.js geladen worden (leunt op window.THREE).
@@ -50,7 +51,9 @@
     };
 
     function onPointerDown(event) {
-      if (event.button === 2) {
+      const panButton = event.button === 2 || event.button === 1 || (event.button === 0 && (event.shiftKey || event.ctrlKey || event.metaKey));
+      if (event.button === 1) event.preventDefault(); // geen autoscroll
+      if (panButton) {
         if (!scope.enablePan) return;
         isPanning = true;
       } else {
@@ -138,11 +141,29 @@
 
     function onContextMenu(event) { event.preventDefault(); }
 
+    // Pijltjestoetsen: schuiven terwijl de muis boven de weergave staat (niet in een invoerveld).
+    let hover = false;
+    const onEnter = () => { hover = true; };
+    const onLeave = () => { hover = false; };
+    const KEY_PAN = { ArrowLeft: [1, 0], ArrowRight: [-1, 0], ArrowUp: [0, 1], ArrowDown: [0, -1] };
+    function onKeyDown(event) {
+      const d = KEY_PAN[event.key];
+      if (!d || !hover || !scope.enablePan || event.altKey || event.ctrlKey || event.metaKey) return;
+      const t = event.target, tag = t && t.tagName;
+      if (tag === 'INPUT' || tag === 'TEXTAREA' || tag === 'SELECT' || (t && t.isContentEditable)) return;
+      event.preventDefault();
+      const step = (scope.domElement.clientHeight || 400) * (event.shiftKey ? 0.25 : 0.08);
+      pan(d[0] * step, d[1] * step);
+    }
+
     this.domElement.addEventListener('mousedown', onPointerDown);
     window.addEventListener('mousemove', onPointerMove);
     window.addEventListener('mouseup', onPointerUp);
     this.domElement.addEventListener('wheel', onWheel, { passive: false });
     this.domElement.addEventListener('contextmenu', onContextMenu);
+    this.domElement.addEventListener('mouseenter', onEnter);
+    this.domElement.addEventListener('mouseleave', onLeave);
+    window.addEventListener('keydown', onKeyDown);
     this.domElement.addEventListener('touchstart', onTouchStart, { passive: false });
     this.domElement.addEventListener('touchmove', onTouchMove, { passive: false });
     this.domElement.addEventListener('touchend', onTouchEnd);
@@ -154,6 +175,9 @@
       window.removeEventListener('mouseup', onPointerUp);
       scope.domElement.removeEventListener('wheel', onWheel);
       scope.domElement.removeEventListener('contextmenu', onContextMenu);
+      scope.domElement.removeEventListener('mouseenter', onEnter);
+      scope.domElement.removeEventListener('mouseleave', onLeave);
+      window.removeEventListener('keydown', onKeyDown);
       scope.domElement.removeEventListener('touchstart', onTouchStart);
       scope.domElement.removeEventListener('touchmove', onTouchMove);
       scope.domElement.removeEventListener('touchend', onTouchEnd);