add ui for creating playlists

This commit is contained in:
ed 2025-04-26 00:19:41 +00:00
parent 897f9d328d
commit ad200f2b97
3 changed files with 83 additions and 2 deletions

View file

@ -1044,6 +1044,7 @@ open the `[🎺]` media-player-settings tab to configure it,
* `[full]` does a full preload by downloading the entire next file; good for unreliable connections, bad for slow connections
* `[~s]` toggles the seekbar waveform display
* `[/np]` enables buttons to copy the now-playing info as an irc message
* `[📻]` enables buttons to create an m3u playlist with the selected songs
* `[os-ctl]` makes it possible to control audio playback from the lockscreen of your device (enables [mediasession](https://developer.mozilla.org/en-US/docs/Web/API/MediaSession))
* `[seek]` allows seeking with lockscreen controls (buggy on some devices)
* `[art]` shows album art on the lockscreen

View file

@ -1151,10 +1151,10 @@ html.y #widget.open {
background: #fff;
background: var(--bg-u3);
}
#wfs, #wfm, #wzip, #wnp {
#wfs, #wfm, #wzip, #wnp, #wm3u {
display: none;
}
#wfs, #wzip, #wnp {
#wfs, #wzip, #wnp, #wm3u {
margin-right: .2em;
padding-right: .2em;
border: 1px solid var(--bg-u5);
@ -1175,6 +1175,7 @@ html.y #widget.open {
line-height: 1em;
}
#wtoggle.sel #wzip,
#wtoggle.m3u #wm3u,
#wtoggle.np #wnp {
display: inline-block;
}
@ -1183,6 +1184,7 @@ html.y #widget.open {
}
#wfm a,
#wnp a,
#wm3u a,
#wzip a {
font-size: .5em;
padding: 0 .3em;
@ -1190,6 +1192,10 @@ html.y #widget.open {
position: relative;
display: inline-block;
}
#wm3u a {
margin: -.2em .1em;
font-size: .45em;
}
#wfs {
font-size: .36em;
text-align: right;
@ -1198,6 +1204,7 @@ html.y #widget.open {
border-width: 0 .25em 0 0;
}
#wfm span,
#wm3u span,
#wnp span {
font-size: .6em;
display: block;
@ -1205,6 +1212,10 @@ html.y #widget.open {
#wnp span {
font-size: .7em;
}
#wm3u span {
font-size: .77em;
padding-top: .2em;
}
#wfm a:not(.en) {
opacity: .3;
color: var(--fm-off);

View file

@ -144,6 +144,8 @@ var Ls = {
"wt_seldl": "download selection as separate files$NHotkey: Y",
"wt_npirc": "copy irc-formatted track info",
"wt_nptxt": "copy plaintext track info",
"wt_m3ua": "add to m3u playlist (click <code>📻copy</code> later)",
"wt_m3uc": "copy m3u playlist to clipboard",
"wt_grid": "toggle grid / list view$NHotkey: G",
"wt_prev": "previous track$NHotkey: J",
"wt_play": "play / pause$NHotkey: P",
@ -280,6 +282,7 @@ var Ls = {
"mt_fau": "on phones, prevent music from stopping if the next song doesn't preload fast enough (can make tags display glitchy)\">☕️",
"mt_waves": "waveform seekbar:$Nshow audio amplitude in the scrubber\">~s",
"mt_npclip": "show buttons for clipboarding the currently playing song\">/np",
"mt_m3u_c": "show buttons for clipboarding the$Nselected songs as m3u8 playlist entries\">📻",
"mt_octl": "os integration (media hotkeys / osd)\">os-ctl",
"mt_oseek": "allow seeking through os integration$N$Nnote: on some devices (iPhones),$Nthis replaces the next-song button\">seek",
"mt_oscv": "show album cover in osd\">art",
@ -436,6 +439,10 @@ var Ls = {
"tvt_sel": "select file &nbsp; ( for cut / copy / delete / ... )$NHotkey: S\">sel",
"tvt_edit": "open file in text editor$NHotkey: E\">✏️ edit",
"m3u_add1": "song added to m3u playlist",
"m3u_addn": "{0} songs added to m3u playlist",
"m3u_clip": "m3u playlist now copied to clipboard\n\nyou should create a new textfile named something.m3u and paste the playlist in that document; this will make it playable",
"gt_vau": "don't show videos, just play the audio\">🎧",
"gt_msel": "enable file selection; ctrl-click a file to override$N$N&lt;em&gt;when active: doubleclick a file / folder to open it&lt;/em&gt;$N$NHotkey: S\">multiselect",
"gt_crop": "center-crop thumbnails\">crop",
@ -751,6 +758,8 @@ var Ls = {
"wt_seldl": "last ned de valgte filene$NSnarvei: Y",
"wt_npirc": "kopiér sang-info (irc-formatert)",
"wt_nptxt": "kopiér sang-info",
"wt_m3ua": "legg til sang i m3u-spilleliste$N(husk å klikke på <code>📻copy</code> senere)",
"wt_m3uc": "kopiér m3u-spillelisten til utklippstavlen",
"wt_grid": "bytt mellom ikoner og listevisning$NSnarvei: G",
"wt_prev": "forrige sang$NSnarvei: J",
"wt_play": "play / pause$NSnarvei: P",
@ -887,6 +896,7 @@ var Ls = {
"mt_fau": "for telefoner: forhindre at avspilling stopper hvis nettet er for tregt til å laste neste sang i tide. Hvis påskrudd, kan forårsake at sang-info ikke vises korrekt i OS'et\">☕️",
"mt_waves": "waveform seekbar:$Nvis volumkurve i avspillingsfeltet\">~s",
"mt_npclip": "vis knapper for å kopiere info om sangen du hører på\">/np",
"mt_m3u_c": "vis knapper for å kopiere de valgte$Nsangene som innslag i en m3u8 spilleliste\">📻",
"mt_octl": "integrering med operativsystemet (fjernkontroll, info-skjerm)\">os-ctl",
"mt_oseek": "tillat spoling med fjernkontroll$N$Nmerk: på noen enheter (iPhones) så vil$Ndette erstatte knappen for neste sang\">spoling",
"mt_oscv": "vis album-cover på infoskjermen\">bilde",
@ -1043,6 +1053,10 @@ var Ls = {
"tvt_sel": "markér filen &nbsp; ( for utklipp / sletting / ... )$NSnarvei: S\">merk",
"tvt_edit": "redigér filen$NSnarvei: E\">✏️ endre",
"m3u_add1": "sangen ble lagt til i m3u-spillelisten",
"m3u_addn": "{0} sanger ble lagt til i m3u-spillelisten",
"m3u_clip": "m3u-spillelisten ble kopiert til utklippstavlen\n\nneste steg er å opprette et tekstdokument med filnavn som slutter på <code>.m3u</code> og lime inn spillelisten der",
"gt_vau": "ikke vis videofiler, bare spill lyden\">🎧",
"gt_msel": "markér filer istedenfor å åpne dem; ctrl-klikk filer for å overstyre$N$N&lt;em&gt;når aktiv: dobbelklikk en fil / mappe for å åpne&lt;/em&gt;$N$NSnarvei: S\">markering",
"gt_crop": "beskjær ikonene så de passer bedre\">✂",
@ -1893,6 +1907,9 @@ ebi('widget').innerHTML = (
'</span><span id="wnp"><a' +
' href="#" id="npirc" tt="' + L.wt_npirc + '">📋<span>irc</span></a><a' +
' href="#" id="nptxt" tt="' + L.wt_nptxt + '">📋<span>txt</span></a>' +
'</span><span id="wm3u"><a' +
' href="#" id="m3ua" tt="' + L.wt_m3ua + '">📻<span>add</span></a><a' +
' href="#" id="m3uc" tt="' + L.wt_m3uc + '">📻<span>copy</span></a>' +
'</span><a' +
' href="#" id="wtgrid" tt="' + L.wt_grid + '">田</a><a' +
' href="#" id="wtico">♫</a>' +
@ -2308,6 +2325,7 @@ var mpl = (function () {
'<a href="#" class="tgl btn" id="au_fau" tt="' + L.mt_fau + '</a>' +
'<a href="#" class="tgl btn" id="au_waves" tt="' + L.mt_waves + '</a>' +
'<a href="#" class="tgl btn" id="au_npclip" tt="' + L.mt_npclip + '</a>' +
'<a href="#" class="tgl btn" id="au_m3u_c" tt="' + L.mt_m3u_c + '</a>' +
'<a href="#" class="tgl btn" id="au_os_ctl" tt="' + L.mt_octl + '</a>' +
'<a href="#" class="tgl btn" id="au_os_seek" tt="' + L.mt_oseek + '</a>' +
'<a href="#" class="tgl btn" id="au_osd_cv" tt="' + L.mt_oscv + '</a>' +
@ -2350,6 +2368,7 @@ var mpl = (function () {
"pb_mode": (sread('pb_mode', ['loop', 'next']) || 'next').split('-')[0],
"os_ctl": bcfg_get('au_os_ctl', have_mctl) && have_mctl,
'traversals': 0,
'm3ut': '#EXTM3U\n',
};
bcfg_bind(r, 'loop', 'au_loop', false, function (v) {
if (mp.au)
@ -2379,6 +2398,9 @@ var mpl = (function () {
bcfg_bind(r, 'clip', 'au_npclip', false, function (v) {
clmod(ebi('wtoggle'), 'np', v && mp.au);
});
bcfg_bind(r, 'm3uen', 'au_m3u_c', false, function (v) {
clmod(ebi('wtoggle'), 'm3u', v && (mp.au || msel.getsel().length));
});
bcfg_bind(r, 'follow', 'au_follow', false, setaufollow);
bcfg_bind(r, 'ac_flac', 'ac_flac', true);
bcfg_bind(r, 'ac_aac', 'ac_aac', false);
@ -2888,6 +2910,8 @@ var widget = (function () {
wtico = ebi('wtico'),
nptxt = ebi('nptxt'),
npirc = ebi('npirc'),
m3ua = ebi('m3ua'),
m3uc = ebi('m3uc'),
touchmode = false,
was_paused = true;
@ -2946,6 +2970,49 @@ var widget = (function () {
toast.ok(1, L.clipped, null, 'top');
});
};
m3ua.onclick = function (e) {
ev(e);
var el,
files = [],
sel = msel.getsel();
for (var a = 0; a < sel.length; a++) {
el = ebi(sel[a].id).closest('tr');
if (clgot(el, 'au'))
files.push(el);
}
el = QS('#files tr.play');
if (!sel.length && el)
files.push(el);
for (var a = 0; a < files.length; a++) {
var md = ft2dict(files[a])[0],
dur = md['.dur'] || '1',
tag = '';
if (md.artist && md.title)
tag = md.artist + ' - ' + md.title;
else if (md.artist)
tag = md.artist + ' - ' + md.file;
else if (md.title)
tag = md.title;
if (dur.indexOf(':') > 0) {
dur = dur.split(':');
dur = 60 * parseInt(dur[0]) + parseInt(dur[1]);
}
else dur = parseInt(dur);
mpl.m3ut += '#EXTINF:' + dur + ',' + tag + '\n' + uricom_dec(get_evpath()) + md.file + '\n';
}
toast.ok(2, files.length == 1 ? L.m3u_add1 : L.m3u_addn.format(files.length), null, 'top');
};
m3uc.onclick = function (e) {
ev(e);
cliptxt(mpl.m3ut, function () {
toast.ok(15, L.m3u_clip, null, 'top');
});
};
r.set(sread('au_open') == 1);
setTimeout(function () {
clmod(widget, 'anim', 1);
@ -4129,6 +4196,7 @@ function play(tid, is_ev, seek) {
clmod(ebi(oid), 'act', 1);
clmod(ebi(oid).closest('tr'), 'play', 1);
clmod(ebi('wtoggle'), 'np', mpl.clip);
clmod(ebi('wtoggle'), 'm3u', mpl.m3uen);
if (thegrid)
thegrid.loadsel();
@ -4749,6 +4817,7 @@ var fileman = (function () {
clmod(bshr, 'hide', hshr);
clmod(ebi('wfm'), 'act', QS('#wfm a.en:not(.hide)'));
clmod(ebi('wtoggle'), 'm3u', mpl.m3uen && (nsel || (mp && mp.au)));
var wfs = ebi('wfs'), h = '';
try {