This is an old revision of the document!
>symbols in their titles.
HTML tag. *@@.robot;This is a robot-class span@@
is equivalent toThis is a robot-class span
. * You can also use it alongside style attributes:@@.robot;text-decoration:underline;This is a robot-class span with an underline@@
* One bothersome fact about Twine up to now is that there's no real “bridge” between the basic Twine link's functionality and raw HTML. There was no convenient way to make a raw <a> link trigger a passage change. So, I've added a “data-passage” HTML attribute that you can put on HTML <a>, <img>, <map> and <area> tags. *<a data-passage=“Distant woods”>Some text</a>
is equivalent to[[Some text|Distant woods]]
, but allows you to add extra HTML attributes to the link, like “style”. *<img data-passage=“Trees”>
is equivalent to[img[Trees]]
- thus, you can now refer to imported images in HTML. (If you wish to make an image that links to a passage, put the <img> inside an <a> element.) *<area data-passage=“Trapdoor” coords=”…“>
is how you can make an image map area link to a passage. * You can also attach data-passage to any other kind of tag to make it serve as a link, too:This looks like ordinary text
. * To simulate setter-links, you can also add a “data-setter” property, too.Collect teeth
. Note that it does nothing without a data-passage attribute as well. * It should now be possible to supply variables to the image syntax, as an image passage name or URL - for instance, [img[$pictureName]]. * Removed the quote-by-line syntax, on the basis that a good number of people don't really want indenting that often, and would rather have greater-than signs as bullet points. The rest can rely on the indented block syntax (<<<
) or HTML <blockquote> tags. ===Generated HTML=== * Passage links no longer have ID attributes that reveal the name of the passage they go to, allowing anyone to “cheat” by right clicking them and selecting “Inspect Element”. This has been the case for every previous version of Twine, but not anymore! * Jonah: rewind links now have the class “toolbar-rewind” instead of “toolbar-rewind to here”. ===Default CSS=== * Mobile Sugarcane layout: I've added a somewhat rudimentary media query to Sugarcane that converts the sidebar to a vertical header, using a minimum of alterations, when viewed on a 640px-width display. Hopefully this won't break custom CSS too much. * Having added the above, Sugarcane's sidebar now hasposition: fixed
again. * Jonah: added bottom padding to#passages
, so that the present passage isn't always uncomfortably flush with the bottom of the window. * Tweaked some of Responsive's CSS to, for instance, make links in StoryAuthor or StorySubtitle correctly coloured. ===Stylesheets=== * CSS@import
may now accept a single array as a sole argument, and will pick a value from within that array. This allows you to <<set>> a bunch of either() arguments in an array variable, and call either() with it in many places:«set $a to [“Red”,”Blue“,”Green“]» «print either($a) + ” and “ + either($a)»
may now accept a string of space-delimited tags, as an alternative to several strings or an array. * Addedrandom()
, a function seen in Twine 2 and SugarCube. Given two numbers (such asrandom(3,12)
) it returns a random integer between them, inclusive. While I generally recommend continuing to useeither()
for choosing between a small set of numbers, I recommendrandom()
for long ranges, as an alternative to the cumbersomeMath.random()
. * Added arot13()
function that returns the given string in ROT13 encoding. * Added abookmark()'' function, which provides the bookmark hash for the current passage, the same as that used by the built-in “bookmark” links. ===Internals/Scripts=== * Fixed a bug where Jonah would crash when restarting a story. * To save a little startup time, image passages are no longer obfuscated if the “obfuscate” option is set. * Changed all the element onclick references to addEventListener()/attachEvent() calls.