Audio tracks overlapping in Harlowe

Hi all! Could really use a hand. I’m bashing my head against a brick wall with a javascript problem on Harlowe.

There are four pages to the story/game. The first page plays one track, and the following page plays another, which then continues without interruption as the player moves back and forth through the story. The code works, as in the different music tracks play on page 1 and 2-4, but obviously the first track isn’t stopping - so it just overlaps the second track and I end up with blended loops!

This is the code I have used on both pages

var audio = document.createElement('audio');
    audio.src = 'https://www.linktomusicfile.com';
    audio.loop = true;
    audio.play();

I’m sure there’s probably a simple solution to make sure that the first track plays only the first page (and overrides the second track, should the user decide to restart or skip all the way back), but damned if i can find it.

thanks so much to anyone who can help! Ideally I’d like to solve this in JS rather than learning a whole new system (I’ve seen Harlowe Audio Lib recommended to a few folks on my endless trawls through google trying to solve this) but if thats what I gotta do I’ll do it!

Have you tried to use pause()? I’m not an expert on javascript, but you haven’t included any code to stop the track from looping, so audio.pause(); should do it.

(I also think HAL is great and recommend that, if you ever change your mind on it.)

Thanks so much for your reply! I do want the tracks to loop, just for the first page audio to stop when the first page is left. but I’m gonna try audio.pause() and see what happens.

I think I’m just gonna bite the bullet and scrape it all together with HAL if no luck. I should be learning it for future projects anyway! Thank you :slight_smile:

Maybe a header tagged passage that says if(audio) audio.pause(); so every time you go to a new page it will try to stop the audio? (I haven’t actually tried that but it seems sort of plausible)