Health Bar, Image Changing, And Backgrounds

Is it possible to do a *percent health where the stat buttons are? I think it would be better personally.
Also, is it possible to changes the pictures for *percent?
And last, how do you make a background?
Any help on these matters are appreicaited.


I’m guessing no one has an answer.

It sounds like the things you want to do are outside of the scope of ChoiceScript, though I admit I don’t understand what you want regarding “a *percent health where the stat buttons are.” Do you mean that you don’t want a “Show Stats” button, but would rather have a permanent display of a health bar? If that’s what you want, you’ll have to edit the index.html file to display what you want using HTML and possibly CSS, and then write some JavaScript to update it when it changes. To call your custom JavaScript code, you’d use the *script command in ChoiceScript. If you write custom HTML/CSS/JavaScript, you can make the health bar look any way you want, within your ability to write the required code.

If you do something custom like that, don’t expect it to work for a native Kindle app. I don’t know about the other mobile devices.

There is a simple way to get a background image for your ChoiceScript game on the web; again, this won’t work for a native app on the Kindle, and I don’t know about other mobile devices. For a web-based ChoiceScript game, you can use CSS in your index.html file for this. In the head of the index.html file, to get a background image for the entire page, try something like this:

<style type="text/css">body {background-image: url(<em>URL-of-your-image-file</em>);}</style>

By the 1st and 2nd I mean having a *percent Health under the show stats button, I was thinking:


But instead of a button have a percentage.
And I’d like to change the image for the bars (*percent), If I must, I could attempt to script it, but it would be hell. So I want to know if there is an easier way.

Impossible without at least a refresh script since Choicescript uses scenes, it never reloads the page, you’d have to “refresh” or “reload” your health value every time you take damage etc. But yeah, it’s entirely plausible… Couldn’t give you the code off the top of my head though ><’

@Daisuke, I don’t believe there is an easier way. What you want to do is going to require scripting.

If you go look at my “proof of concept” game, Castle of Chaos, at, you’ll see that the game does not have a stats button, but has a permanent display of stats on the screen. I keep them updated by calling a JS script every time any of them change, just as @CJW described.

My JS script updates numeric values residing inside span tags, but you could do something that updates images instead. Basically, you’d just use JS to change the lengths of two end-to-end images, I would think, to get them to display as one percentage bar. If you use jQuery, changing the sizes of images is pretty straightforward, but you could manipulate the CSS style values without jQuery if you wanted. I like using jQuery for that sort of thing because it deals with cross-browser issues if there are any.

If you have two rectangular images next to each other, and the sum of their lengths is 100, then you can set the length of the first one to your percentage value and the length of the second one to (100 - percentage value), and it will appear to be a single percentage bar, if you set them up to stay adjacent to each other, end-to-end. You’ll have to edit your index.html file to include the images, give them both ids so you can get at them from the JS code, and then call your update script every time the percentage value changes.

I hope that makes some sense to you, and that I actually understand what you’re asking for.

There is an easier way, although I’m not so sure about how clean it will look. If at the start of every new page (after every *page_break or #choice) you can insert a *percent health. *stat_chart works fine in game (at least it did last time I checked). The down side is a few more lines for each *page_break or #choice, but at least you won’t need any JS coding for that.

Thanks for your help.