This shows you the differences between two versions of the page.
Both sides previous revision Previous revision Next revision | Previous revision | ||
frequently_asked_questions [2014/09/24 02:10] ateyourlembas Finished ToC |
frequently_asked_questions [2017/10/09 20:39] (current) |
||
---|---|---|---|
Line 2: | Line 2: | ||
Here are some answers to commonly asked Twine questions. Thank you for checking to see if your question has already been answered. If it hasn't, please visit the [[http://twinery.org/forum/index.php/board,2.0.html|Twinery Help forum]]. | Here are some answers to commonly asked Twine questions. Thank you for checking to see if your question has already been answered. If it hasn't, please visit the [[http://twinery.org/forum/index.php/board,2.0.html|Twinery Help forum]]. | ||
+ | |||
+ | **[[#HELP!]]** | ||
+ | |||
+ | * [[#I opened my project and it was empty! How do I get it back?]] | ||
+ | |||
**[[#GENERAL QUESTIONS]]** | **[[#GENERAL QUESTIONS]]** | ||
* [[#How do I install some new CSS code / a new stylesheet?]] | * [[#How do I install some new CSS code / a new stylesheet?]] | ||
- | * [[#In CSS, what do the dots and hashtags mean?]] | + | * [[#In CSS, what do the dots and number signs mean?]] |
* [[#How do I install some new JavaScript code?]] | * [[#How do I install some new JavaScript code?]] | ||
* [[#How can I make my Twine playable offline? / How do I import jQuery?]] | * [[#How can I make my Twine playable offline? / How do I import jQuery?]] | ||
Line 14: | Line 19: | ||
* [[#How do I add hover text to some text in my passage?]] | * [[#How do I add hover text to some text in my passage?]] | ||
* [[#How do I disable the standard syntax so I can show ASCII art?]] | * [[#How do I disable the standard syntax so I can show ASCII art?]] | ||
+ | * [[#How can the reader change a variable without navigating away from a passage?]] | ||
+ | * [[#How do I install SugarCube?]] | ||
Line 44: | Line 51: | ||
* [[#How do I change the mouse cursor into an image?]] | * [[#How do I change the mouse cursor into an image?]] | ||
+ | |||
+ | **[[#SCRIPTING]]** | ||
+ | |||
+ | * [[#How do I get things in and out of a list variable?]] | ||
+ | |||
+ | |||
+ | |||
+ | =====HELP!===== | ||
+ | |||
+ | ====I opened my project and it was empty! How do I get it back?==== | ||
+ | |||
+ | Don't panic. This behavior has been observed in OSX Lion and may be due to Finder issues. Instead of double-clicking your Twine project in Finder to open it, open the Twine application, go to the menu File > Open Story... and open your file from there. If problems persist, please go to the [[http://twinery.org/forum/index.php/board,2.0.html|Twinery Help forum]]. | ||
Line 62: | Line 81: | ||
You can add as many **stylesheet** passages as you like, or you can keep all your CSS in one **stylesheet** passage--whichever is more convenient for you to use. | You can add as many **stylesheet** passages as you like, or you can keep all your CSS in one **stylesheet** passage--whichever is more convenient for you to use. | ||
- | ===In CSS, what do the dots and hashtags mean?=== | + | ===In CSS, what do the dots and number signs mean?=== |
A dot (.) indicates a class name. There can be many elements of the same class within an HTML page. For example, a class named "smurf" would look like this in the CSS: | A dot (.) indicates a class name. There can be many elements of the same class within an HTML page. For example, a class named "smurf" would look like this in the CSS: | ||
Line 73: | Line 92: | ||
<div class="smurf">Brainy</div> | <div class="smurf">Brainy</div> | ||
- | A hashtag (#) indicates an id. This means it's a unique name. There can be only one element with the given id in an HTML page. For example, an id named "highlander" would look like this in the CSS: | + | A number sign (#) indicates an id. This means it's a unique name. There can be only one element with the given id in an HTML page. For example, an id named "highlander" would look like this in the CSS: |
#highlander { color: red; } | #highlander { color: red; } | ||
Line 172: | Line 191: | ||
You can use the monospace [[syntax]] like so: | You can use the monospace [[syntax]] like so: | ||
{{{ <<(@__@)>> }}} | {{{ <<(@__@)>> }}} | ||
+ | |||
+ | ====How can the reader change a variable without navigating away from a passage?==== | ||
+ | |||
+ | You may want to look into the [[http://www.motoslave.net/sugarcube/docs/#macros-button|SugarCube story format]] extension. It provides **[[http://www.motoslave.net/sugarcube/docs/#macros-click|click]]** and **[[http://www.motoslave.net/sugarcube/docs/#macros-button|button]]** macros that can be used like so: | ||
+ | |||
+ | <<click "Lose money">><<set $money -= 1>><</click>> | ||
+ | <<button "Make money">><<set $money += 1>><</button>> | ||
+ | |||
+ | ====How do I install SugarCube?==== | ||
+ | |||
+ | Download the [[http://www.motoslave.net/sugarcube/|latest SugarCube zip]]. | ||
+ | |||
+ | Unzip the download. It should unzip into a directory named "sugarcube." | ||
+ | |||
+ | Copy the whole "sugarcube" directory into your Twine application into the "targets" folder. On OSX, this is usually under /Applications/Twine/Contents/Resources. (To browse to the contents of the Twine application in Finder, right-click on the Twine application icon and choose "Show Contents.") | ||
+ | |||
+ | Restart Twine, and under the menu **Story > Story Format** you'll now see the option "Sugarcube." | ||
+ | |||
Line 191: | Line 228: | ||
.passage { max-width:50%; } | .passage { max-width:50%; } | ||
- | You can also use whole numbers (e.g. 300 will make the text container 300 pixels wide.) | + | You can also use whole numbers (e.g. 300px will make the text container 300 pixels wide.) |
Line 252: | Line 289: | ||
This CSS sample makes the passage titles invisible: | This CSS sample makes the passage titles invisible: | ||
- | .passage .title { display: none } | + | .passage .title { display: none; } |
| | ||
====How do I remove all Jonah passage titles but the current one?==== | ====How do I remove all Jonah passage titles but the current one?==== | ||
Line 258: | Line 295: | ||
This CSS sample makes all passage titles invisible except for the current one: | This CSS sample makes all passage titles invisible except for the current one: | ||
- | .passage:not(:last-child) .title { display: none } | + | .passage:not(:last-child) .title { display: none; } |
| | ||
Line 288: | Line 325: | ||
You can have any number of comma-separated strings in the parentheses. | You can have any number of comma-separated strings in the parentheses. | ||
- | =====How do I change the page title?===== | + | ====How do I change the page title?==== |
Twine code: | Twine code: | ||
Line 305: | Line 342: | ||
- | =====How do I change the mouse cursor into an image?===== | + | ====How do I change the mouse cursor into an image?==== |
This CSS sample will use an imported image "happyLittleTree" and give it a hot spot 20 pixels wide and 10 pixels tall, measured from the image's top left corner: | This CSS sample will use an imported image "happyLittleTree" and give it a hot spot 20 pixels wide and 10 pixels tall, measured from the image's top left corner: | ||
Line 316: | Line 353: | ||
//Note:// The maximum permitted image size for a cursor is 128x128 pixels. Animated GIFs are not permitted, as IE doesn't support this. | //Note:// The maximum permitted image size for a cursor is 128x128 pixels. Animated GIFs are not permitted, as IE doesn't support this. | ||
+ | |||
+ | |||
+ | |||
+ | =====SCRIPTING===== | ||
+ | |||
+ | ====How do I get things in and out of a list variable?==== | ||
+ | |||
+ | Twine arrays are handled like standard Javascript arrays--which themselves a little strange IMO. Here's how to add something to a list (within a Twine passage): | ||
+ | |||
+ | <<set $currentLoops = [] >> | ||
+ | <<set $march = "march.mp3">> | ||
+ | |||
+ | Add a parade... | ||
+ | |||
+ | <<set $currentLoops.push($march)>> | ||
+ | |||
+ | Now remove it... | ||
+ | |||
+ | <<set $currentLoops.splice($currentLoops.indexOf($march),1)>> | ||
Hope this helps, and happy Twining! | Hope this helps, and happy Twining! |