Howdy, Stranger!

It looks like you're new here. If you want to get involved, click one of these buttons!

How to pass Twine Story Variables to a Javascript Function?

I am using Sugarcube 2.6.2 in Twine 2.

So I figured it's about time I tackled that elephant in my IDE.
I've been researching into Javascript syntax recently because I want to figure out how to add a javascript function to my story, but now my issue lies in the interaction between twine and javascript.
I don't have any experience with combining code of different languages, so I'm a bit lost and most posts I've looked at relating to it are coming up greek to me.

So, my questions are thusly:
1) For example's sake, let's say I want to add a function that does something like the following pseudocode:
function foo($myStoryVariableObject) {
    if $myStoryVariableObject.name == "Jeremy" {
        print("The evil wizard transforms Jeremy into a chicken!")
        $myStoryVariableObject.status = "polymorphed"
    }
    else
    {
        print("Candy uses one of her spell slots to counter the wizard's spell!")
        $myStoryVariableObject.spellSlots = $myStoryVariableObject.spellSlots - 1
    }
}
How would I code this? More specifically, how do I send a story variable to javascript and access it within javascript? Are there any interactions/bugs/differences between Story objects and javascript objects that I should be aware of?

2) How do I call a javascript function in Twine 2? Again, for example's sake, let's say I call the above function, "foo", in this passage below:
The evil wizard waves his hands and chants arcane words! Your prepare to roll out of the way, but he aims at your companion! 
<<foo($companion)>>
What would be the correct way of calling the function?

Comments

  • edited June 2016
    If you want a Javascript function to activate at a specific point you just put the whole function between

    <<script>>

    <</script>>

    tags within the text passage at the relevant point in the story. You can wrap this script macro within a <<silently>> <</silently>> macro if you don't want it making white space.

    As to the first question, if you haven't already, you might find the sugarcube macro API useful: http://www.motoslave.net/sugarcube/2/docs/api-macro.html

    It appears to me like you're essentially trying to create a custom macro. If you do create a custom macro using the API, then you wouldn't need to use <<script>> tags, just call it like a normal macro ie <<foo>>.


    Though tbh, if all you want to do is your example code, you can do it already using just the SugarCube widgets passage. Just combine <<print>>, <<if>> and <<set>> macros into a single widget, call it <<widget "foo">> and call it in the passage by writing <<foo>>. Unless there's a particular burning need to use JavaScript, I recommend doing all you can with widgets first.
  • The example code was just something to work from - my actual function is considerably longer and more complex.
    Using a strict function as opposed to designating an entire passage solely to processing information and then dropping a goto previous is just neater and takes less space, but now you've got me interested - How do I use these widgets? This is the first I've heard of them.
  • edited June 2016
    Widgets are explained here: http://www.motoslave.net/sugarcube/2/docs/macros.html#macros-widget

    In general, you create a passage called "Widgets" and give it the tag "widget", then you wrap collections of macros in <<widget "widgetname">> <</widget>> tags in this passage. Then in story, you would write <<widgetname>> to perform the macros in that widget.

    You can use as many widgets in the story as you want. The Widgets passage is just a holding section for them that SugarCube reads to determine what additional macros to add at startup. Sortof like a create your own macro area but without the hassle of JavaScript.


    EDIT: I should say it's not the passage name itself that's important but the tag "widget". Any passage tagged like that functions like the native javascript and css passages that are just there to put code in.

Sign In or Register to comment.