refactor: streamline media button event handling and remove inline commands

This commit is contained in:
mr. M
2025-04-02 23:11:04 +02:00
parent abedfedac6
commit 9762d74256
3 changed files with 53 additions and 18 deletions

View File

@@ -13,38 +13,29 @@
</vbox>
<hbox id="zen-media-buttons-hbox">
<toolbarbutton id="zen-media-pip-button"
class="toolbarbutton-1"
oncommand="gZenMediaController.onMediaPip();" />
class="toolbarbutton-1" />
<toolbarbutton id="zen-media-close-button"
class="toolbarbutton-1"
oncommand="gZenMediaController.onControllerClose();" />
class="toolbarbutton-1" />
</hbox>
</hbox>
<hbox id="zen-media-progress-hbox" class="show-on-hover">
<label id="zen-media-current-time">0:00</label>
<html:input type="range" id="zen-media-progress-bar"
value="0" min="0" max="100" step="0.1"
oninput="gZenMediaController.onMediaSeekDrag(event);"
onchange="gZenMediaController.onMediaSeekComplete(event);"/>
value="0" min="0" max="100" step="0.1"/>
<label id="zen-media-duration">0:00</label>
</hbox>
</vbox>
<hbox id="zen-media-controls-hbox">
<toolbarbutton id="zen-media-focus-button"
class="toolbarbutton-1"
oncommand="gZenMediaController.onMediaFocus();" />
class="toolbarbutton-1" />
<toolbarbutton id="zen-media-previoustrack-button"
class="toolbarbutton-1"
oncommand="gZenMediaController.onMediaPlayPrev();" />
class="toolbarbutton-1" />
<toolbarbutton id="zen-media-playpause-button"
class="toolbarbutton-1"
oncommand="gZenMediaController.onMediaToggle();" />
class="toolbarbutton-1" />
<toolbarbutton id="zen-media-nexttrack-button"
class="toolbarbutton-1"
oncommand="gZenMediaController.onMediaPlayNext();" />
class="toolbarbutton-1" />
<toolbarbutton id="zen-media-mute-button"
class="toolbarbutton-1"
oncommand="gZenMediaController.onMediaMute();" />
class="toolbarbutton-1" />
</hbox>
</vbox>
</toolbaritem>

View File

@@ -39,6 +39,41 @@ class ZenMediaController {
this.onDeactivated = this._onDeactivated.bind(this);
this.onPipModeChange = this._onPictureInPictureModeChange.bind(this);
this.#initEventListeners();
}
#initEventListeners() {
this.mediaControlBar.addEventListener('command', (event) => {
const button = event.target.closest('toolbarbutton');
if (!button) return;
switch (button.id) {
case 'zen-media-pip-button':
this.onMediaPip();
break;
case 'zen-media-close-button':
this.onControllerClose();
break;
case 'zen-media-focus-button':
this.onMediaFocus();
break;
case 'zen-media-mute-button':
this.onMediaMute();
break;
case 'zen-media-previoustrack-button':
this.onMediaPlayPrev();
break;
case 'zen-media-nexttrack-button':
this.onMediaPlayNext();
break;
case 'zen-media-playpause-button':
this.onMediaToggle();
break;
}
});
this.mediaProgressBar.addEventListener('input', this.onMediaSeekDrag.bind(this));
this.mediaProgressBar.addEventListener('change', this.onMediaSeekComplete.bind(this));
window.addEventListener('TabSelect', (event) => {
const linkedBrowser = event.target.linkedBrowser;
this.switchController();

View File

@@ -1,5 +1,5 @@
diff --git a/browser/components/tabbrowser/content/tabs.js b/browser/components/tabbrowser/content/tabs.js
index 0fbdbf3aefc467880e6b0bae2615cb145735cb0f..99a84a1cae6c18f3a80b7490dfc61712b38f6909 100644
index 0fbdbf3aefc467880e6b0bae2615cb145735cb0f..0d3919b288afefb05e3ec54ddfa90f001dd4c3b1 100644
--- a/browser/components/tabbrowser/content/tabs.js
+++ b/browser/components/tabbrowser/content/tabs.js
@@ -93,7 +93,7 @@
@@ -413,6 +413,15 @@ index 0fbdbf3aefc467880e6b0bae2615cb145735cb0f..99a84a1cae6c18f3a80b7490dfc61712
if (this.#rtlMode) {
tabs.reverse();
@@ -2314,7 +2350,7 @@
let size = this.verticalMode ? "height" : "width";
let translateAxis = this.verticalMode ? "translateY" : "translateX";
let scrollDirection = this.verticalMode ? "scrollTop" : "scrollLeft";
- let { width: tabWidth, height: tabHeight } = bounds(draggedTab);
+ let { width: tabWidth, height: tabHeight } = bounds(draggedTab.group?.hasAttribute("split-view-group") ? draggedTab.group : draggedTab);
let translateX = event.screenX - dragData.screenX;
let translateY = event.screenY - dragData.screenY;
@@ -2328,6 +2364,12 @@
let lastTab = tabs.at(-1);
let lastMovingTab = movingTabs.at(-1);