User Tools

Site Tools


script

This is an old revision of the document!


Scripts

Just as you can tag a passage stylesheet to have its contents treated as CSS style rules, you can use the script tag to include custom Javascript in your story. All passages with this tag are executed when the page loads, which you can use as an opportunity to do two things:

  • Install custom macros made in Javascript by other Twine users.
  • Modify how your story will work. To do this properly requires careful inspection of the Twine engine.

The execution order of passages tagged script is based on the alphabetical order of the script passages' names.

Requesting jQuery

You may wish to use jQuery in your scripts to manipulate the page's structure. But, you want other people to be able to use your script without having to set the StorySettings jQuery value themselves. There is another way to request jQuery: simply put the case-insensitive words “requires jQuery” in a comment or a string inside your code:

//requires jquery

You can also request the Modernizr library with the words “requires Modernizr”.

prerender and postrender

Two objects exist in the Twine engine that are designed for custom script writers: prerender and postrender. If you add a function property to these objects, that function property will be run every time the player changes passages.

A postrender function looks like this:

postrender.hello = function(a) {
    a.className += "hello";
    console.log(this.title); 
}

When postrender.hello is called, this is the Passage object which is currently being rendered, and the first argument a is the <div class=“body content”> element into which the passage's code has been rendered. You can thus transform or modify the div's contents in interesting ways.

postrender is called just after the passage's code is renered into the div. prerender is called just before then.

Passage objects

Passage objects have the following structure (plus some other less useful properties):

title: the string name of the passage.
tags: an array of strings representing the passage's tags.
text: the raw code of the passage.
processText(): the code of the passage with some substitutions made - the “nobr” tag, if present, removes line breaks, and imported image syntax has the image's base64 data inserted.

Collisions

If you use a lot of scripts from many people, note that as of 1.4.1, naming collisions in the macros, postrender and prerender objects (such as, adding macros which have the same name) are not alerted to the author. Take care that each addition to these objects has a unique name.

script.1389776677.txt.gz · Last modified: 2017/10/09 20:37 (external edit)