aboutsummaryrefslogtreecommitdiffstats
path: root/packages/meshbay-hub/src/meshbay_hub/static/music-player.js
diff options
context:
space:
mode:
Diffstat (limited to 'packages/meshbay-hub/src/meshbay_hub/static/music-player.js')
-rw-r--r--packages/meshbay-hub/src/meshbay_hub/static/music-player.js6
1 files changed, 5 insertions, 1 deletions
diff --git a/packages/meshbay-hub/src/meshbay_hub/static/music-player.js b/packages/meshbay-hub/src/meshbay_hub/static/music-player.js
index 2d3c002..a4a8c5c 100644
--- a/packages/meshbay-hub/src/meshbay_hub/static/music-player.js
+++ b/packages/meshbay-hub/src/meshbay_hub/static/music-player.js
@@ -3,6 +3,7 @@ import {
} from './vendor/htm-preact.js';
import { t } from './i18n.js';
import { Icon } from './icon.js';
+import { useStickyBand } from './sticky.js';
import { CHUNK_SIZE, pipelinedDownload } from './file-utils.js';
/**
@@ -179,6 +180,9 @@ function QueuePanel({ tracks, order, pos, onSelect, onClose }) {
}
function MusicPlayerBar({ getConnection, queue, onClose, userPrefs }) {
+ // Pinned to the bottom of the window, over the bottom of the sidebar; the
+ // sidebar subtracts this so its last entry is not underneath.
+ const barBand = useStickyBand('--music-bar-h');
const audioRef = useRef(null);
const blobCacheRef = useRef(new Map()); // file id -> { url, order: insertion index }
const blobInsertRef = useRef(0);
@@ -480,7 +484,7 @@ function MusicPlayerBar({ getConnection, queue, onClose, userPrefs }) {
: repeat === 'all' ? t('music.player_repeat_all') : t('music.player_repeat_one');
return html`
- <div class="music-player-bar">
+ <div class="music-player-bar" ref=${barBand}>
<audio ref=${audioRef}
onTimeUpdate=${(e) => setCurrentTime(e.target.currentTime)}
onDurationChange=${(e) => setDuration(e.target.duration)}