In your sketch, the home page you see when accessing the ESP8266 server is based on the rawliteral HTML defined at the beginning of the sketch. When a browser asks for the home page or “/” root of the site, the ESP8266 server sends back this big long INDEX_HTML formatted string here…
// handle "/"
server.on("/", []() {
server.send_P(200, "text/html", INDEX_HTML);
});
server.begin();
This is so you can see and press the pretty buttons in the browser and send the right track number back to the sketch which actually hosts the home page and receives the text from the javascript and then plays the selected track.
You could easily just host any number of additional pages beyond just the home page like this…
server.on("/", []() { server.send_P(200, "text/html", INDEX_HTML); }); // Handle Home page
server.on("/T00", playTrack(“T0.mp3”)); // Handle /T00 page
server.on("/T01", playTrack(“T1.mp3”)); // Handle /T01 page
server.on("/T02", playTrack(“T2.mp3”)); // Handle /T02 page
server.on("/T03", playTrack(“T3.mp3”)); // Handle /T03 page
server.on("/T04", playTrack(“T4.mp3”)); // Handle /T04 page
…… etc….
server.begin();
So now basically going to //192.168.1.75/T01 from a browser will cause the sketch to call the playTrack function with the String parameter "T1.mp3". Then you could use the new playTrack function to do the work of playing tracks. You could add other page names and function calls to adjust volume, turn on/off lights, or doing anything else you want to program the sketch to do when you go to that page from a browser and the server.on call redirects it to the specified function call.
void playTrack(String trackName) {
// Send the browser a plain text confirmation page that says "Track Tx.mp3 Selected"
server.send_P(200, "text/plain", "Track " + trackName + “ Selected”);
// Play the track
startPlaying(trackName);
}
Excuse any typos, but I hope this helps with the concept of how the server is working and how to add sketch function to web page calls ...