0

I have a problem with a tracklist created from a folder like that:

let tracks = [];
let art_str = [];
let name_str = [];

const traxFolder = './Resto';
const fst = require('fs');

fst.readdirSync(traxFolder).forEach(track => {
    tracks.push(track); 
    name_str.push(track.substring(track.indexOf("-") + 1 ,track.indexOf(".")));
    art_str.push(track.substring(0, track.indexOf("-")));
});

function shuffleArray(array) {
    for (let i = array.length - 1; i > 0; i--) {
    let j = Math.floor(Math.random() * (i + 1));
    let temp = array[i];
    array[i] = array[j];
    array[j] = temp;
    }
 }

let track_list = tracks.map ((sng,i) => ({path : `${traxFolder}/${sng}` , 
            name:name_str[i], 
            artist: art_str[i],
            image: "https://images.pexels.com/photos/1717969/pexels-photo-1717969.jpeg?
            auto=compress&cs=tinysrgb&dpr=3&h=250&w=250"}));

//shuffleArray(track_list);   
console.log(track_list);

the above code creates an array track_list and i can see all the objects are ok in the console! when i use this function:

let track_index = 0;
let isPlaying = false;
let updateTimer;

let curr_track = document.createElement('audio');

function loadTrack(list_index) {
clearInterval(updateTimer);
resetValues();
curr_track.src = track_list[list_index].path;
curr_track.load();
}

loadTrack(track_index);

it doesnt load the track of index zero or any track_index i try 1,2,3 etc. while the same exact code workd perfect if the array track_list comes in this form:

let track_list = [
{
    name: "Clear As Water",
    artist: "Una Mas Trio",
    image: "https://images.pexels.com/photos/2264753/pexels-photo-2264753etcetc 
    path:  "resto/Una Mas Trio - Clear As Water (Hidden Jazz Quartet Remix).mp3"
},
{
    name: "Mango Woman",
    artist: "Mo Horizons",
    image: "https://images.pexels.com/photos/3100835/pexels-photo-etcetc
    path: "musiclists/Mo Horizons - Mango Woman.mp3"
},
{
    name: "Invitation To Dance (Vincemo Hang Sessions Mix)",
    artist: "Monotone",
    image: "https://images.pexels.com/photos/1717969/pexels-etc etc
    path: "musiclists/Monotone-Invitation To Dance (Vincemo Hang Sessions Mix).mp3",
},
];

Can anyone tell me why the first array does not seem to load any track while the second does when the only difference IN THE CODE is the way the array track_list is created , WHILE THE OBJECT PROPERTIES ARE IDENTICAL?

Thanks and Regards to everyone

5
  • what does your resetValues() function does? Commented Mar 8, 2024 at 16:21
  • function resetValues() { curr_time.textContent = "00:00"; total_duration.textContent = "00:00"; seek_slider.value = 0; } Commented Mar 8, 2024 at 19:37
  • Still though the array that all objects are set manually works and the one that reads the folder doesn't!the rest of the code is the same..i don't have too much understanding in the underlying mechanics..i am just learning now..also both arrays have exact same print in the console with the same properties name,artist,path and image. Commented Mar 8, 2024 at 19:40
  • I would highly recommend lowercasing and substituting spaces for _ in your audio files to avoid potential path problems Commented Mar 10, 2024 at 16:14
  • This gets even weirder..i took your advice and i copy the array that the function prints from the console window in vs code from another java script file and it loads the tracks fine as an array of objects..that guarranted the path etc..if then i replaced again the code with the for each function that creates the array and it doesn't!!!so the array as objects from the function works..the function that generates the array does not! Commented Mar 10, 2024 at 20:05

0

Your Answer

By clicking “Post Your Answer”, you agree to our terms of service and acknowledge you have read our privacy policy.

Start asking to get answers

Find the answer to your question by asking.

Ask question

Explore related questions

See similar questions with these tags.