Adding javascript music player

Hi,
I am trying to create a music player, I am using javascript.
So I have 3 files: .html, .css, .js copied from here: Create Custom Music Player in JavaScript

When I preview the index.html via Brackets, the files works and I can see the music player:


Obviously the images and music are broke.

I have added the .js code to an event but nothing happens:

  1. How do I get the js music player to display in GD, I presume its not displaying as its the .index file that creates and glues all the other files together and I only have the .js code?
  2. How do I get the js music player to display in GD where I want it to, create it in a box or use css?

Any help would be amazing.
If there is an easier way, that would be great!
Thanks guys.

I created a text box and assigned the code to it:
image

The problem is that HTML and CSS are not supported.

I am pretty sure this cannot be done.
:cry:

What you’re asking for is possible, but the “how to” questions you provided can really only be answered with:

“You must fundamentally understand Javascript programming AND understand the javascript code you are trying to use”.

Outside of those two items, there isn’t really any other way for you to proceed, and others on the forums aren’t really going to be able to supplement the above requirements.

You need both because you must understand the underlying code of the music player enough to be able to modify it/call its actions, as you’re going to need a way to pass information to/from the GDevelop API and events in order to be able to utilize it at all.

It is definitely possible, but it is not going to be copy-and-paste in any form whatsoever.

Thanks Silver-Streak,
“you must understand the underlying code of the music player enough to be able to modify it/call its actions” - I can do that, I know HTML & CSS pretty well.

What I don’t know is what GD supports.
I tried HTML, it does not work.
What I don’t know is how the JavaScript would pull the classes/functions/design from the HTML and CSS files in the main save folder in GD? (index.html & style.css files, the .js file is now in an Event in GD)

This is simple code but its GD that cannot connect the files:
https://www.gitto.tech/posts/create-simple-music-player-app-using-html-css-and-javascript/

Am I wrong?
Thanks again.

I apologize, but that doesn’t match with what I stated. HTML and CSS have nothing to do with Javascript. You can use Javascript in HTML5, but they are wholly unrelated. (Basically, while a car can transport people in it (i.e. HTML5 containing Javascript), knowing how to repair a car (writing/building HTML5) has nothing to do with doing a heart transplant on a person (writing Javascript))

GDevelop supports 2 things. The Event System (Primary/first class logic language), and Javascript (used in Javascript events and used to build a good majority of the engine itself).

As I mentioned above, you need to understand the Javascript side of the code you’re trying to use enough to understand how to connect it to GDevelop’s API. The HTML and CSS are wholly irrelevant as they’re just being used for visuals, and you’d be using GDevelop to set up the visuals (objects/placement/etc), not the HTML/CSS.

So you need to take the javascript portion of that code, understand it enough to know when it is calling from HTML or otherwise, and use that to have it call from GDevelop conditions, actions, or objects.

Edit: You can read more about Javascript events here: JavaScript Code events [GDevelop wiki]

And you can read the GDevelop Javascript API docs here: GDevelop JavaScript game engine

Got it, thanks for explaining, it just clicked:

The HTML and CSS are wholly irrelevant as they’re just being used for visuals, and you’d be using GDevelop to set up the visuals (objects/placement/etc), not the HTML/CSS.

So you need to take the javascript portion of that code, understand it enough to know when it is calling from HTML or otherwise, and use that to have it call from GDevelop conditions, actions, or objects.

Leave it to me, I’ll be back.
Ta.

Glad to hear it, good luck!

(Also I wanted to drive you away from thinking about the HTML5 because a ton of code snippets out there use C# instead of JS)