0 votes
by (2.2k points)

Hi,

I'm trying to add background music, like so (in StoryInit passage):

<<cacheaudio "town" "./town.ogg" "./town.mp3">>

<<waitforaudio>>

<<audio "town" volume 0 fadeoverto 30 1 loop>>

(You can try it on k12th.itch.io/test-music)

This works when I just open exported HTML locally, but when I upload *.zip to itch.io, there's no sound in Chrome. To make it worse, when make mp3 preferred format like this: <<cacheaudio "town" "./town.mp3" "./town.ogg">> it kinda works, but only after page refresh.

I tried different files. I can see that browser downloads .ogg file in Network tab in Development Tools. Firefox and even Edge both handle it fine.

Thanks in advance for any ideas.

1 Answer

+1 vote
by (68.6k points)
selected by
 
Best answer

As a general rule, I do not recommend issuing playback actions within the StoryInit special passage—though, I cannot say if that's causing issues here.  You could try moving the <<audio>> invocation to your starting passage to see if that makes a difference.

As another thing you could try—just to get another data point, I'm not suggesting this as a solution—add a <<button>> to your starting passage which manually executes the same audio actions to see if that also fails to initiate playback in Chrome.  For example:

<<button "Manually Play?">>
	<<audio "town" volume 0 fadeoverto 30 1 loop>>
<</button>>

 

by (2.2k points)

Moving <<audio>> to starting passage didn't help, but manual start works (you can check it put on the same url). I guess as a desperate solution I can create starting screen with big "Play game" button...

by (68.6k points)

After a bit of testing, it seems like there's some caching oddity between Itch.io and Chrome.  Delaying the start of playback for a bit seems to be a usable workaround for the time being.

Remove your initial <<audio "town" …>> invocation and try something like the following JavaScript instead: (goes in Story JavaScript)

predisplay['itch-chrome-initial-audio-workaround'] = function (taskName) {
	delete predisplay[taskName]; // single-use task
	setTimeout(function () {
		$.wiki('<<audio "town" loop volume 0 fadeoverto 30 1>>');
	}, 500);
};

 

by (2.2k points)

Nice idea. Unfortunately, it didn't work. I tried increasing timeout to 3 seconds with same result.

I noticed that file is served with application/ogg MIME (instead of more specific audio/ogg). What do think, could it be the problem?

by (2.2k points)
Ok, this is definitely itch.io problem, because there's no such problem on standalone server: http://kitmanov.name/test-music/
by (68.6k points)

Nice idea. Unfortunately, it didn't work. I tried increasing timeout to 3 seconds with same result.

Strange.  I uploaded a test project to Itch myself, with the exact audio files you're using, and it worked fine in Chrome.

 

I noticed that file is served with application/ogg MIME (instead of more specific audio/ogg). What do think, could it be the problem?

I doubt it.  The type will be set by SugarCube specifically to audio/ogg to avoid issues with the served type info.

by (2.2k points)
I'm starting to think that problem is with my connection speed...

Anyhow, thanks a lot for pointers (and for entire SugarCube)!
...