mirror of
https://github.com/zen-browser/desktop.git
synced 2025-10-06 09:56:36 +00:00
enhance media controls: improve animations and adjust layout properties
This commit is contained in:
@@ -31,14 +31,41 @@ class ZenMediaController {
|
||||
window.addEventListener('TabSelect', (event) => {
|
||||
if (this._currentBrowser) {
|
||||
if (event.target.linkedBrowser.browserId === this._currentBrowser.browserId) {
|
||||
this.mediaControlBar.setAttribute('hidden', 'true');
|
||||
gZenUIManager.motion
|
||||
.animate(this.mediaControlBar, {
|
||||
opacity: [1, 0],
|
||||
y: [0, 10],
|
||||
})
|
||||
.then(() => {
|
||||
this.mediaControlBar.setAttribute('hidden', 'true');
|
||||
});
|
||||
} else {
|
||||
this.mediaControlBar.removeAttribute('hidden');
|
||||
window.requestAnimationFrame(() => {
|
||||
this.mediaControlBar.style.height =
|
||||
this.mediaControlBar.querySelector('toolbaritem').getBoundingClientRect().height + 'px';
|
||||
gZenUIManager.motion.animate(
|
||||
this.mediaControlBar,
|
||||
{
|
||||
opacity: [0, 1],
|
||||
y: [10, 0],
|
||||
},
|
||||
{}
|
||||
);
|
||||
});
|
||||
}
|
||||
|
||||
gZenUIManager.updateTabsToolbar();
|
||||
}
|
||||
});
|
||||
|
||||
window.addEventListener('TabClose', (event) => {
|
||||
if (this._currentBrowser) {
|
||||
if (event.target.linkedBrowser.browserId === this._currentBrowser.browserId) {
|
||||
this.deinitMediaController(this._currentMediaController);
|
||||
}
|
||||
}
|
||||
});
|
||||
}
|
||||
|
||||
/**
|
||||
|
Reference in New Issue
Block a user