HTML Problem with Twee and Javascript

[Satyric]

Hi, I'm making a game using Twee2 and Sugarcube and whenever I change the story's Javascript and rebuild, the changes do not affect existing saves, only new saves.
I have the Javascript code in a file called javascript.tw2 which I have included in the StoryIncludes passage.
Any help would be much appreciated.

 

[guest1492]

Are you sure it's StoryIncludes and not StoryInit? StoryInit is a passage that is run when your game (aka the html file) is loaded, not when a save is loaded. In other words, it is only run when you start a new game. StoryIncludes is not one of the special passages which would mean it's a custom passage that you wrote and so when it's run depends on how you linked to it.

This is one of my posts where I discussed updating old saves:

Actually, StoryInit only runs on start-up, not when saved games are loaded.* For example, maybe you have a variable $day that you set to 1 in StoryInit. If a player loads a save from day 15, the variable $day does not suddenly get set back to 1.

In Twine, you do not have to declare variables before you use them (though it will throw an error if you try to access information stored by a non-existent variable). Therefore it's not necessary to find somewhere to initialize them before you use them. However, if you want to keep old saves up to date then you should look into

You must be registered to see the links

.

Here's an example of what you can do:

Spoiler

You don't have permission to view the spoiler content. Log in or register now.

* I realize that the

You must be registered to see the links

seems to say differently, but it's either wrong or worded incredibly badly. Yes, the StoryInit passage is run every time the browser loads the html file (so when you first open the file or when you somehow refresh the browser). However, loading saves does not refresh the browser, which means it does not reload the html file. Here's a slight modification of the sample code in the documentation:

Spoiler

You don't have permission to view the spoiler content. Log in or register now.

Yes, the value for setup.y is set when you load up the game and it's still there when you load a save because it's stored separately from the regular variables. However, if StoryInit really did run whenever a save is loaded, then setup.y would change every time you load a save but that is not the case. Also, data stored in the setup object does not persist between sessions unless you

You must be registered to see the links

them.

 

[Satyric]

Are you sure it's StoryIncludes and not StoryInit? StoryInit is a passage that is run when your game (aka the html file) is loaded, not when a save is loaded. In other words, it is only run when you start a new game. StoryIncludes is not one of the special passages which would mean it's a custom passage that you wrote and so when it's run depends on how you linked to it.

This is one of my posts where I discussed updating old saves:

StoryIncludes is a special passage for Twee that lets you split your code into multiple files. From the

You must be registered to see the links

:

Insert a ::StoryIncludes passage into your file and list within it the names of the files to include. Each will be appended to the end of your story before compilation.

Mine is:

::StoryIncludes
stylesheet.tw2
javascript.tw2
numberpool.tw2

P.S: I've noticed that any updates to CSS apply correctly to old saves, the problem seems to be only with Javascript.

 

[guest1492]

StoryIncludes is a special passage for Twee that lets you split your code into multiple files. From the

You must be registered to see the links

:

I see... I thought you were using

You must be registered to see the links

. I'm not sure if it'll be an issue because Twee2 looks like it hasn't been updated in 3+ years; meanwhile the major Twine story formats (Harlowe, SugarCube, ChapBook) have been continually updated with their latest releases this year and Snowman updated less than 2 years ago.

At any rate, the problem is probably your javascript (or your understanding of how it should work) and not the twee code. CSS just tells your browser how to render stuff so the state of the game/save has no bearing on it.

 

[Satyric]

At any rate, the problem is probably your javascript (or your understanding of how it should work) and not the twee code. CSS just tells your browser how to render stuff so the state of the game/save has no bearing on it.

I also think it might have something to do with the actual Javascript, I'm using JS for most of the logic in my game since I prefer working with it. To give an example, I'm trying to pass some JS variables around like so:

state.active.variables['EyeColors'] = EyeColors;

However, if I update the EyeColors variable in JS, the changes don't apply to any previous saves, presumably since state.active is different.

 

[guest1492]

I'm going to assume that you're using the SugarCube format. (I don't think you can use javascript to access story variables in Harlowe, Chapbook uses engine.state, and Snowman uses window.story.state.)

Javascript is case-sensitive so you need to capitalize State and also active is not necessary:

State.variables['EyeColors'] = EyeColors;

I assume that EyeColors to the right of the equal sign is a custom javascript object that you have previously defined.

Like with any other webpage, the browser only runs through the script once when the html file is loaded. In other words, the situation here is just like what I wrote in my first post regarding StoryInit. Your browser does not refresh or reload the html file when a save is loaded.

Therefore, unless the line of javascript is embedded in a function that's run when you load a save, it only runs when you launch the game. The solution is exactly the same as in my first post; to update the variables you should look into using Config.saves.onLoad and apply version control to your game.

An alternative is to define your custom EyeColors object inside something like setup:

setup.EyeColors = ['blue', 'green', 'brown'];

Then in your passages, instead of using $EyeColors you would use setup.EyeColors.

 

[Satyric]

An alternative is to define your custom EyeColors object inside something like setup:

setup.EyeColors = ['blue', 'green', 'brown'];

Then in your passages, instead of using $EyeColors you would use setup.EyeColors.

Thank you for the reply, I can confirm that this worked and I think this might be the most adequate solution since the EyeColors object won't change throughout the game (possibly only in game updates if I decide to add more colors), so it would be better to keep it separate from the game state.