@@ -9,6 +9,7 @@ import { archiveSong, createPlaylist, favoriteSong, getApiToken, getDownloadProc
9
9
import { spawnSongNode } from './song' ;
10
10
import { modal_askPassword , modal_showNotification } from './modal' ;
11
11
import { doesUseRawAudio , isMinimalistMode } from './settings' ;
12
+ import { spawnPlaylistNode } from './playlist' ;
12
13
13
14
let json ;
14
15
let metadataJson ;
@@ -168,7 +169,7 @@ function playSingleSong(index) {
168
169
}
169
170
170
171
// Sanitize a name so the user can't inject HTML with the title
171
- function sanitize ( text ) {
172
+ export function sanitize ( text ) {
172
173
if ( text === null ) return "" ;
173
174
return text
174
175
. replaceAll ( '<' , '<' )
@@ -181,76 +182,27 @@ function sanitize(text) {
181
182
182
183
// #region On page load
183
184
184
- function getAlbumImage ( elem ) {
185
+ export function getAlbumImage ( elem ) {
185
186
if ( elem . album === null || elem . album === undefined || ! ( elem . album in json . albums ) || json . albums [ elem . album ] . path === null ) {
186
187
return "/img/CD.png" ;
187
188
}
188
189
return "/data/icon/" + json . albums [ elem . album ] . path ;
189
190
}
190
191
191
- function getPlaylistHtml ( id , name ) {
192
- let mostPresents = { } ;
193
- let count = 0 ;
194
- for ( let elem of json . musics ) {
195
- if ( ! elem . playlists . includes ( id ) && id !== "all" ) { // We filter by playlist (except if current playlist is "all")
196
- continue ;
197
- }
198
- count ++ ;
199
- if ( elem . album === null ) { // TODO: Should also check playlist path
200
- continue ;
201
- }
202
- let img = getAlbumImage ( elem ) ;
203
- if ( mostPresents [ img ] === undefined ) {
204
- mostPresents [ img ] = 1 ;
205
- } else {
206
- mostPresents [ img ] ++ ;
207
- }
208
- }
209
- let imgs = Object . keys ( mostPresents ) . map ( function ( key ) {
210
- return [ key , mostPresents [ key ] ] ;
211
- } ) . sort ( function ( a , b ) {
212
- return b [ 1 ] - a [ 1 ] ;
213
- } ) . slice ( 0 , 4 ) ;
214
-
215
- let htmlImgs = "" ;
216
- if ( imgs . length === 0 ) {
217
- htmlImgs = `<img class="image" src="/img/CD.png"/ draggable="false">` ;
218
- } else {
219
- for ( let img of imgs ) {
220
- htmlImgs += `<img class="image" src="${ img [ 0 ] } "/ draggable="false">` ;
221
- }
222
- }
223
-
224
- return `
225
- <div class="song card" onclick="window.location=window.location.origin + window.location.pathname + '?playlist=${ id } ';">
226
- <div class="is-flex is-flex-wrap-wrap is-gap-0 playlist-img-container card-image">
227
- ${ htmlImgs }
228
- </div>
229
- <div class="card-content has-text-centered">
230
- <p>
231
- ${ sanitize ( name ) } <br/>
232
- ${ count } songs
233
- </p>
234
- </div>
235
- </div>
236
- ` ;
237
- }
238
-
239
192
function displayPlaylists ( playlists , id , filter ) {
240
- let html = "" ;
241
193
if ( metadataJson . showAllPlaylist && json . musics . length > 0 ) {
242
- html += getPlaylistHtml ( "all" , "All" ) ;
194
+ spawnPlaylistNode ( "all" , "All" , json , id ) ;
243
195
}
244
196
for ( let elem in playlists ) {
245
197
const p = playlists [ elem ] ;
246
198
if ( filter === "" || sanitize ( p . name ) . toLowerCase ( ) . includes ( filter ) ) {
247
- html += getPlaylistHtml ( elem , p . name ) ;
199
+ spawnPlaylistNode ( elem , p . name , json , id ) ;
248
200
}
249
201
}
250
202
if ( ! metadataJson . showAllPlaylist && json . musics . some ( x => x . playlists . length === 0 ) && ( filter === "" || sanitize ( "Unnamed" ) . toLowerCase ( ) . includes ( filter ) ) ) {
251
- html += getPlaylistHtml ( "default" , "Unnamed" ) ;
203
+ spawnPlaylistNode ( "default" , "Unnamed" , json , id ) ;
252
204
}
253
- html += `
205
+ document . getElementById ( id ) . innerHTML += `
254
206
<div id="new-playlist" class="song card requires-admin ${ isLoggedIn ( ) ? "" : "is-hidden" } ">
255
207
<div class="card-content has-text-centered">
256
208
<div class="is-flex is-flex-wrap-wrap is-gap-0 playlist-img-container card-image"></div>
@@ -260,7 +212,6 @@ function displayPlaylists(playlists, id, filter) {
260
212
</div>
261
213
</div>
262
214
` ;
263
- document . getElementById ( id ) . innerHTML = html ;
264
215
265
216
document . getElementById ( "new-playlist" ) . addEventListener ( "click" , createNewPlaylist ) ;
266
217
}
0 commit comments