Gruescript - Changing the colours mid-game

Hello!

I’m writing a science fiction game for my nephews which I hope will be finished before they’re too old for it! In the game you can travel between five different planets via a teleport system. I’d like to be able to change the background colour for each planet, so that it’s obvious at a glance which one you’re on.

Gruescript allows you to set the game colour hexcodes in the game block, but as far as I can see it doesn’t allow you to change them mid-game. I had a look at the code for Pseudavid’s wonderful Tricks of Light in the Forest, which has background images that fade in and out, and it’s all done with very clever JavaScript that I don’t understand. This makes me think that to do what I want might be tricky. Would anyone be able to help?

3 Likes

I hadn’t seen this! As far as I know, since colour definitions are only allowed in the game block, they are fixed for the entire game.

I can explain my solution in any detail you need. I’m not a developer, and my JS is actually very very bad, and the solution is clunky and inelegant as hell! But it worked. There are a few pieces:

  • In the Gruescript code:
    • Gruescript rules that check tags in rooms and run js functions accordingly. Careful about that, I think there’s some bug in the js command in Gruescript.
  • In the final HTML code of the game:
    • Additional HTML divs that contain the background, one for each different background.
    • CSS for those divs. 100vh and vw, fixed, negative z-index, the colour gradient background, and animation.
    • The JS functions called from Gruescript. They add and remove an “enabled” class to the divs. The enabled div has 100 opacity, the others have 0.

And that’s it. Then there’s the map and the pics and the functions that displayed them, and now that was a proper nightmare (with bugs that I can’t kill because I can’t discover when they happen), but the background is simpler.

I don’t think there’s any way of doing this without hacking the HTML and JS of the generated file. If you want I can point you the relevant parts of my code, it’s really not that much.

2 Likes

Thanks for sharing these details @pseudavid! @nilsf has also helped me with some simple code for changing the main background colour. I’m probably going to leave it at that for now and make some decisions about the appearance of the game when I get closer to finishing it.

1 Like