Skip to content

Commit

Permalink
fix(core): allow canceling data-tauri-drag-region maximization on m…
Browse files Browse the repository at this point in the history
…acOS, closes #8306 (#8312)

* fix(core): allow canceling `data-tauri-drag-region` maximization on macOS, closes #8306

* Update .changes/tauri-data-drag-region-macos-maximize.md

* fix typo

* cancel if mouse moves

* Update tauri-data-drag-region-macos-maximize.md

[skip ci]

* Update core/tauri/scripts/core.js [skip ci]

---------

Co-authored-by: Lucas Fernandes Nogueira <lucas@tauri.app>
  • Loading branch information
amrbashir and lucasfernog authored Dec 28, 2023
1 parent 446fc99 commit 8f8729d
Show file tree
Hide file tree
Showing 2 changed files with 60 additions and 3 deletions.
5 changes: 5 additions & 0 deletions .changes/tauri-data-drag-region-macos-maximize.md
Original file line number Diff line number Diff line change
@@ -0,0 +1,5 @@
---
'tauri': 'patch:bug'
---

On macOS, allow cancelling maximization when doubleclick happens on `data-tauri-drag-region` by simply keeping the left moust button pressed and then moving the mouse away of the starting position of the click, which is consistent with the native behavior of macOS.
58 changes: 55 additions & 3 deletions core/tauri/scripts/core.js
Original file line number Diff line number Diff line change
Expand Up @@ -142,16 +142,40 @@
)
}

// drag region
//-----------------------//
// data-tauri-drag-region
//
// drag on mousedown and maximize on double click on Windows and Linux
// while macOS macos maximization should be on mouseup and if the mouse
// moves after the double click, it should be cancelled (see https://github.com/tauri-apps/tauri/issues/8306)
//-----------------------//
const TAURI_DRAG_REGION_ATTR = 'data-tauri-drag-region';
let x = 0, y = 0;
document.addEventListener('mousedown', (e) => {
if (e.target.hasAttribute('data-tauri-drag-region') && e.button === 0) {
if (
// element has the magic data attribute
e.target.hasAttribute(TAURI_DRAG_REGION_ATTR) &&
// and was left mouse button
e.button === 0 &&
// and was normal click to drag or double click to maximize
(e.detail === 1 || e.detail === 2)
) {

// macOS maximization happens on `mouseup`,
// so we save needed state and early return
if (osName === 'macos' && e.detail == 2) {
x = e.clientX
y = e.clientY
return
}

// prevents text cursor
e.preventDefault()

// fix #2549: double click on drag region edge causes content to maximize without window sizing change
// https://github.com/tauri-apps/tauri/issues/2549#issuecomment-1250036908
e.stopImmediatePropagation()

// start dragging if the element has a `tauri-drag-region` data attribute and maximize on double-clicking it
window.__TAURI_INVOKE__('tauri', {
__tauriModule: 'Window',
message: {
Expand All @@ -165,6 +189,34 @@
})
}
})
// on macOS we maximze on mouseup instead, to match the system behavior where maximization can be canceled
// if the mouse moves outside the data-tauri-drag-region
if (osName === "macos") {
document.addEventListener('mouseup', (e) => {
if (
// element has the magic data attribute
e.target.hasAttribute(TAURI_DRAG_REGION_ATTR) &&
// and was left mouse button
e.button === 0 &&
// and was double click
e.detail === 2 &&
// and the cursor hasn't moved from initial mousedown
e.clientX === x && e.clientY === y
) {
window.__TAURI_INVOKE__('tauri', {
__tauriModule: 'Window',
message: {
cmd: 'manage',
data: {
cmd: {
type: '__toggleMaximize'
}
}
}
})
}
})
}

let permissionSettable = false
let permissionValue = 'default'
Expand Down

0 comments on commit 8f8729d

Please sign in to comment.