Help Setting Up Flat-Black Player

I downloaded AmplitudeJS Flat-Black player from -

But I cannot get it working on my webpage -
https://dstall.com/mad-men/1/culture/teuto/

The play button does not load, and the playlist loads 11 tracks with no titles, that display various lengths of play, even though I’ve deleted all the default tracks in functions.js except 3, which I’ve replaced with my own tracks.

I’ve copied the Flat-Black img, css, js, and resources folders to my page folder (teuto).
I’ve also copied (from the Flat-Black index.html) all header links and scripts to the header of my teuto.html page, as well as the “flat-black-player-container” div to the “music” div on my page.
The “music” div has a background image of an ipod.
My audio tracks are located in an mp3 folder in the same root folder (teuto).

Would greatly appreciate any help in gettng the AmplitudeJS music player working on my webpage.

Just from a quick glance, looks like you have a lot going on there. In the console it looks like you have a syntax error and it may also be affecting how AmplitudeJS is being initialized.

I would suggest fixing those errors first. Also start in small pieces. Get your player working first, then add other elements to the page.

The full documentation is here: Overview - AmplitudeJS Documentation

I don’t see all those errors in Mac Chrome developer tools.
I only see same 2 errors that I see when I upload the unzipped flat-black folder to my server.
See - AmplitudeJS Testing
Those errors seem to be inherant to the flat-black download:
“Failed to load resource: the server responded with a status of 404 (Not Found)”
“Uncaught ReferenceError: Amplitude is not defined at functions.js:39”
The 3rd error doesn’t reference my webpage html, just my domain.
What does that mean? - "Uncaught SyntaxError: missing ) after argument list dstall.com/:60
Is that line 60? Where? What page?

Hi @ds_tx,

The biggest issue is that your link to the Amplitude library returns a 404 (https://dstall.com/mad-men/1/dist/amplitude.js). This won’t allow AmplitudeJS to initialize and load all of its methods. You can swap the code with the code from the CDN if that helps: amplitudejs CDN by jsDelivr - A CDN for npm and GitHub.

With copying the example player from the repo, the directory structure might not match yours exactly. I think that’s what’s causing most of the issues.

Let me know if that helps!