diff --git a/src/lib/layout/shellStudio.svelte b/src/lib/layout/shellStudio.svelte index 432ec1497..23d7a191c 100644 --- a/src/lib/layout/shellStudio.svelte +++ b/src/lib/layout/shellStudio.svelte @@ -42,7 +42,7 @@ }); const showChat = writable(false); - + $: if (page.url.pathname.endsWith('studio')) { showChat.set(true); } @@ -58,6 +58,8 @@ isResizing = true; window.addEventListener('mousemove', resize); window.addEventListener('mouseup', stopResize); + window.addEventListener('touchmove', resize); + window.addEventListener('touchend', stopResize); document.body.style.userSelect = 'none'; document.getElementById('preview-iframe').style.pointerEvents = 'none'; } @@ -66,7 +68,8 @@ if (!isResizing) return; if (resizer) { - resizerLeftPosition = page.data?.subNavigation ? event.clientX - 280 : event.clientX; + const clientX = event.touches ? event.touches[0].clientX : event.clientX; + resizerLeftPosition = page.data?.subNavigation ? clientX - 280 : clientX; const maxSize = page.data?.subNavigation ? window.innerWidth - 660 : window.innerWidth - 460; @@ -85,6 +88,8 @@ isResizing = false; window.removeEventListener('mousemove', resize); window.removeEventListener('mouseup', stopResize); + window.removeEventListener('touchmove', resize); + window.removeEventListener('touchend', stopResize); document.body.style.userSelect = ''; document.getElementById('preview-iframe').style.pointerEvents = ''; } @@ -142,7 +147,8 @@ class="resizer" style:left={`${resizerLeftPosition}px`} bind:this={resizer} - onmousedown={startResize}> + onmousedown={startResize} + ontouchmove={startResize}> {/if} {/if} diff --git a/src/routes/(console)/project-[project]/studio/+page.svelte b/src/routes/(console)/project-[project]/studio/+page.svelte index b47cd802c..a236eb202 100644 --- a/src/routes/(console)/project-[project]/studio/+page.svelte +++ b/src/routes/(console)/project-[project]/studio/+page.svelte @@ -42,6 +42,8 @@ isResizing = true; window.addEventListener('mousemove', resize); window.addEventListener('mouseup', stopResize); + window.addEventListener('touchmove', resize); + window.addEventListener('touchend', stopResize); document.body.style.userSelect = 'none'; document.getElementById('preview-iframe').style.pointerEvents = 'none'; } @@ -49,9 +51,11 @@ function resize(event) { if (!isResizing) return; + const clientY = event.touches ? event.touches[0].clientY : event.clientY; + terminalHeight = asideRef.getBoundingClientRect().y - - event.clientY + + clientY + asideRef.getBoundingClientRect().height - 32; } @@ -60,6 +64,8 @@ isResizing = false; window.removeEventListener('mousemove', resize); window.removeEventListener('mouseup', stopResize); + window.removeEventListener('touchmove', resize); + window.removeEventListener('touchend', stopResize); document.body.style.userSelect = ''; document.getElementById('preview-iframe').style.pointerEvents = ''; } @@ -93,7 +99,11 @@
- {#if terminalOpen}
+ {#if terminalOpen}
+
{/if}