claude-dev-server 1.2.2 → 1.2.3

package/dist/assets/dev.html

@@ -191,6 +191,18 @@ html, body {
     const originalPath = '__CLAUDE_ORIGINAL_PATH__';
     const iframeSrc = '__CLAUDE_IFRAME_SRC__';
 
+    // Prevent dev.html from being loaded inside an iframe (nested loading)
+    // If we detect we're in an iframe, redirect to the actual dev server content
+    (function preventNestedLoading() {
+      if (window.top !== window.self) {
+        // We're inside an iframe - this should not happen for dev.html
+        // Redirect this iframe to the actual dev server content
+        console.log('[Claude Dev Server Wrapper] Detected nested iframe loading, redirecting to:', iframeSrc);
+        window.location.href = iframeSrc;
+        return;
+      }
+    })();
+
     const urlParams = new URLSearchParams(window.location.search);
     const wsPort = urlParams.get('wsPort');
 
@@ -500,8 +512,35 @@ html, body {
       divider.addEventListener('touchstart', startDrag);
 
       // Listen for orientation changes
-      window.matchMedia('(orientation: portrait)').addEventListener('change', (e) => {
+      const orientationQuery = window.matchMedia('(orientation: portrait)');
+      orientationQuery.addEventListener('change', (e) => {
         isPortrait = e.matches;
+
+        // Only need to adjust leftPanel, rightPanel stays flex: 1
+        const leftPanelEl = document.querySelector('.claude-dev-server-left');
+
+        if (e.matches) {
+          // Switching to portrait: ensure leftPanel width is 100%
+          if (leftPanelEl) {
+            leftPanelEl.style.width = '100%';
+          }
+        } else {
+          // Switching to landscape: clear inline styles
+          if (leftPanelEl) {
+            leftPanelEl.style.width = '';
+            leftPanelEl.style.height = '';
+          }
+        }
+
+        // Trigger resize events in iframes to notify their content
+        setTimeout(() => {
+          const iframes = document.querySelectorAll('iframe');
+          iframes.forEach(iframe => {
+            if (iframe.contentWindow) {
+              iframe.contentWindow.dispatchEvent(new Event('resize'));
+            }
+          });
+        }, 100);
       });
 
       function startDrag(e) {
@@ -522,6 +561,7 @@ html, body {
 
         if (container && leftPanelEl) {
           containerSize = isPortrait ? container.offsetHeight : container.offsetWidth;
+          // Always measure leftPanel
           startSize = isPortrait ? leftPanelEl.offsetHeight : leftPanelEl.offsetWidth;
         }
 
@@ -541,25 +581,34 @@ html, body {
 
         // Use appropriate axis based on orientation
         const currentValue = isPortrait ? clientY : clientX;
-        const delta = currentValue - startValue;
+        // Calculate delta: dragging down/right = positive, dragging up/left = negative
+        let delta = currentValue - startValue;
+
+        // In portrait with column-reverse: dragging down (positive) should make leftPanel smaller
+        if (isPortrait) {
+          delta = -delta;
+        }
 
         let newSize = startSize + delta;
         let percentage = (newSize / containerSize) * 100;
         const clamped = Math.max(20, Math.min(80, percentage));
 
         const leftPanelEl = document.querySelector('.claude-dev-server-left');
+
         if (leftPanelEl) {
-          leftPanelEl.style.flex = 'none';
           if (isPortrait) {
-            // Portrait: adjust height
+            // Portrait: adjust leftPanel (bottom) height, width is 100%
+            leftPanelEl.style.flex = 'none';
             leftPanelEl.style.height = clamped + '%';
-            leftPanelEl.style.width = '';
+            leftPanelEl.style.width = '100%';
           } else {
-            // Landscape: adjust width
+            // Landscape: adjust leftPanel (left) width
+            leftPanelEl.style.flex = 'none';
             leftPanelEl.style.width = clamped + '%';
-            leftPanelEl.style.height = '';
           }
         }
+
+        // rightPanel stays flex: 1, no modifications needed
       }
 
       function endDrag() {