Rewild Your Web
web browser dweb

system: improve edge gestures management

+78 -3
+15
ui/system/edge_gesture_handler.js
··· 332 this.peekPreview.style.transform = ""; 333 } 334 } 335 }
··· 332 this.peekPreview.style.transform = ""; 333 } 334 } 335 + 336 + // Enable or disable specific edge overlays 337 + // edges: object with left, right, bottom, top boolean properties 338 + setEdgesEnabled(edges) { 339 + for (const [edge, enabled] of Object.entries(edges)) { 340 + const overlay = this.edgeOverlays[edge]; 341 + if (overlay) { 342 + if (edge === "left" || edge === "right") { 343 + overlay.style.width = enabled ? `${this.edgeThreshold}px` : "0"; 344 + } else { 345 + overlay.style.height = enabled ? `${this.edgeThreshold}px` : "0"; 346 + } 347 + } 348 + } 349 + } 350 }
+1 -1
ui/system/mobile.css
··· 296 touch-action: none; 297 pointer-events: auto; 298 background: transparent; 299 - /* rgba(77, 215, 220, 0.49); */ 300 } 301 302 /* Expand edge overlay to full screen during active gesture,
··· 296 touch-action: none; 297 pointer-events: auto; 298 background: transparent; 299 + /* background: rgba(77, 215, 220, 0.49); */ 300 } 301 302 /* Expand edge overlay to full screen during active gesture,
+6 -1
ui/system/mobile_action_bar.js
··· 56 show() { 57 this.updateState(); 58 this.open = true; 59 } 60 61 hide() { ··· 63 this.results = []; 64 this.groups = []; 65 this.searchController.clear(); 66 } 67 68 toggle() { ··· 167 if (this.layoutManager) { 168 this.layoutManager.reload(); 169 } 170 - this.hide(); 171 } 172 173 handleViews() {
··· 56 show() { 57 this.updateState(); 58 this.open = true; 59 + this.dispatchEvent( 60 + new CustomEvent("action-bar-opened", { bubbles: true, composed: true }), 61 + ); 62 } 63 64 hide() { ··· 66 this.results = []; 67 this.groups = []; 68 this.searchController.clear(); 69 + this.dispatchEvent( 70 + new CustomEvent("action-bar-closed", { bubbles: true, composed: true }), 71 + ); 72 } 73 74 toggle() { ··· 173 if (this.layoutManager) { 174 this.layoutManager.reload(); 175 } 176 } 177 178 handleViews() {
+42
ui/system/mobile_layout_manager.js
··· 47 this.actionBar.updateState(); 48 } 49 }); 50 } 51 52 generateId() { ··· 56 // Set the homescreen webview 57 setHomescreen(webviewId) { 58 this.homescreenWebviewId = webviewId; 59 } 60 61 // Check if a webview is the homescreen ··· 178 container.classList.add("active"); 179 } 180 } 181 } 182 183 // Switch to webview at given index
··· 47 this.actionBar.updateState(); 48 } 49 }); 50 + 51 + // Disable all edges when action bar or notification sheet opens 52 + document.addEventListener("action-bar-opened", () => { 53 + this.disableAllEdges(); 54 + }); 55 + document.addEventListener("action-bar-closed", () => { 56 + this.restoreEdges(); 57 + }); 58 + document.addEventListener("sheet-opened", () => { 59 + this.disableAllEdges(); 60 + }); 61 + document.addEventListener("sheet-closed", () => { 62 + this.restoreEdges(); 63 + }); 64 + } 65 + 66 + // Disable all edge gestures (when overlay UI is open) 67 + disableAllEdges() { 68 + this.gestureHandler.setEdgesEnabled({ 69 + left: false, 70 + right: false, 71 + bottom: false, 72 + top: false, 73 + }); 74 + } 75 + 76 + // Restore edge gestures based on current state 77 + restoreEdges() { 78 + const onHomescreen = this.isHomescreen(this.activeWebviewId); 79 + this.gestureHandler.setEdgesEnabled({ 80 + left: !onHomescreen, 81 + right: !onHomescreen, 82 + bottom: !onHomescreen, 83 + top: true, 84 + }); 85 } 86 87 generateId() { ··· 91 // Set the homescreen webview 92 setHomescreen(webviewId) { 93 this.homescreenWebviewId = webviewId; 94 + // Update edge gestures if homescreen is currently active 95 + if (this.activeWebviewId === webviewId) { 96 + this.restoreEdges(); 97 + } 98 } 99 100 // Check if a webview is the homescreen ··· 217 container.classList.add("active"); 218 } 219 } 220 + 221 + // Update edge gesture areas based on whether we're on the homescreen 222 + this.restoreEdges(); 223 } 224 225 // Switch to webview at given index
+14 -1
ui/system/mobile_notification_sheet.js
··· 57 58 close() { 59 this.open = false; 60 - this.dispatchEvent(new CustomEvent("sheet-closed", { bubbles: true })); 61 } 62 63 handleNotificationClick(notification) {
··· 57 58 close() { 59 this.open = false; 60 + } 61 + 62 + updated(changedProperties) { 63 + if (changedProperties.has("open")) { 64 + if (this.open) { 65 + this.dispatchEvent( 66 + new CustomEvent("sheet-opened", { bubbles: true, composed: true }), 67 + ); 68 + } else { 69 + this.dispatchEvent( 70 + new CustomEvent("sheet-closed", { bubbles: true, composed: true }), 71 + ); 72 + } 73 + } 74 } 75 76 handleNotificationClick(notification) {