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 (65.8k 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 (65.8k 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 (65.8k 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)!
Welcome to Twine Q&A, where you can ask questions and receive answers from other members of the community.

You can also find hints and information on Twine on the official wiki and the old forums archive.

See a spam question? Flag it instead of downvoting. A question flagged enough times will automatically be hidden while moderators review it.
...