Howdy, Stranger!

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

Need help with Snowman 1.1

Hi,

I am trying create variables and objects that I can access in all passages. This is an example of what I am trying to do. In a passage the player character is talking to an NPC. He has three options. All options are links to another passage. I have added empty links so I could add code that can run when the link is clicked.

<a href="#" onclick="window.myChoice.setNum(1)">passage A</a>
<a href="#" onclick="window.myChoice.setNum(2)">passage B</a>
<a href="#" onclick="window.myChoice.setNum(3)">passage C</a>

In Edit Story JavaScript I have created the "myChoice" object to have a method that could be called when an option is clicked. The method is supposed to set the property myChoice.num to a number depending on what is clicked. I have added my objects "myChoice" and "reply" to the window object because I read (here) that it is the best way to access an object in any passage.

window.myChoice = {
window.myChoice.num: "",
setNum: function(n){
window.myChoice.num = n;
}
};

I have created the reply object so I could call it in any passage and it can write text depending on what option was clicked on the previous passage.

window.reply = {
setReplyTo: function() {
switch(window.myChoice.num) {
case 1: window.reply.text = "Blah blah blah.";
break;
case 2: window.reply.text = "Yada yada yada.";
break;
case 3: window.reply.text = "yak yak yak";
break;
}
}
};

I was told I had to us <%= %> in passages to call functions. This is what I have in my passages to call they "reply" object.

<%= reply.text %>

Sorry, I know this is a mess but I'm new to javascript and I'm trying to get this to work from watching a youtube video and what I read in these forums lol.

Comments

  • edited October 2015
    Snowman passes a special collection named s to each passage being displayed, which can be used by an Author to store their own variables. One reason to use the special collection is that it will be persisted within a game save.

    This means that you don't have to create your variables against the global window object.

    The following example consists of two passages named Start and End, it shows how to assign a value to a variables named playerName in one passage and how to retrieve the value in another passage.

    a. Start
    Setting a variable named playerName to Bob.
    <% s.playerName = "Bob" %>
    
    [[Next Passage->End]]
    
    b. End
    Checking the value of the playerName variable.
    
    Player Name: <%= s.playerName %>
    

    Snowman uses <% ..... %> markup to do things like assignments, statements and function calls.
    And it uses <%= ..... %> markup to insert content into the passage being displayed.
  • edited October 2015
    Thanks for the answer. I tried it and had trouble at first but I was finally able to get it to work by starting a new test game and just coping your code. However I discovered that it sets the variable automatically without me having to doing anything. For example this is what I had in my first passage.

    Start
    Set the variable.

    <a href="#" onclick="<% s.reply = 'Im fine thanks for asking.' %>">With java span->End</a>

    Without java span->End

    End
    Result

    <%= s.reply %>

    I wanted to test whether clicking on the link would set the variable or not but no matter what link I click on the variable is set to "Im fine..." I then tried setting up two links to see if I could pick the variable that was set.

    Set the variable.

    <a href="#" onclick="<% s.reply = 'Im fine thanks for asking.' %>">first reply->End</a>

    <a href="#" onclick="<% s.reply = 'Miserable, my day has sucked.' %>">second reply->End</a>

    No matter what link I click on the variable is set to "Miserable..." I want the variable to be set depending on what is clicked. That way replys to questions or comments change depending on what the player chooses. I also want stats change, work out and the character's strength goes up, etc.

    Is there a way to set a variable only if something is clicked? I know how to do it in harlow so I can go back to that I suppose if not. I also know how to do it in javascript outside of Twine, that's why I am trying to use those empty links. But they don't seem to work in snowman...
  • I will work on a solution later but a couple of quick comments.

    1. A markup link generates it's own a element.
    eg. Link Text->Target Passage Name

    2. You cant embed one a element inside another.

    So your link code is invalid and result in the generation of two a element. The first a element will contain the onclick handler but it will not be clickable, and the second a element will be clickable but will have no onclick handler.
    Snowman code:
    <a href="#" onclick="<% s.reply = 'Im fine thanks for asking.' %>">[[With java span->End]]</a>
    
    Generated HTML: (I added indents and line-breaks)
    <p>
    	<a href="#" onclick=""></a>
    	<a href="javascript:void(0)" data-passage="End">With java span</a>
    </p>
    
  • If I understand your request correctly you are trying to create a markup link that works similar to SugarCube's Link w/ Text & Setter.
    eg. Target Passage Name][$var = "value"

    Unfortunately Snowman does not natively support advanced markup link types like that one, only the standard common ones like the following:
    [[Link Text|Target Passage Name]]
    [[Link Text->Target Passage Name]]
    [[Target Passage Name<-Link Text]]
    

    There is a way to get around this but it does require a little knowledge on how Snowman works internally. When it's processing code encounters a markup link it converts it into an a element like so:
    [[Next Passage|End]]
    becomes:
    <a href="javascript:void(0)" data-passage="End">Next Passage</a>
    
    ... and if you manually insert a similar formatted a element into your passage it will also work as a passage link, like the following:
    <a href="javascript:void(0)" data-passage="End">Different Link, same Target Passage</a>
    
    I explained earlier that Snowman passes a special collection named s to the passage being displayed, that collection can also be accessed from Javascript except you need to use it's full name which is story.state

    Using the above information combined with a little knowledge of Javascript it is possible to create your own Setter Links like the following, which changes the value of the playerName variable to 'Jane' if the Option 2 link is clicked:
    Setting a variable named playerName to John.
    <% s.playerName = "John" %>
    
    [[Option 1->End]]
    
    <a href="javascript:void(0)" data-passage="End" onclick="story.state.playerName = 'Jane';">Option 2</a>
    
  • Here's a possibly clearer way to do it:
    [[Option 1->End]]
    [[Option 2->End]]
    [[Option 3->End]]
    
    <%
    $(function()
    {
        this.one('click', 'a', function()
        {
        	switch ($(this).text())
            {
                case 'Option 1':
                story.state.chosen = 1;
                break;
                
                case 'Option 2':
                story.state.chosen = 2;
                break;
                
                case 'Option 3':
                story.state.chosen = 3;
            };
        });
    });
    %>
    


  • Thank you both. I tried the a elements as you suggested greyelf and it worked :) Sorry I didn't answer earlier I couldn't get on yesterday.

    kelmbot your suggestion also worked for me thanks. That is a much easier way of using a switch than what I was trying to do.
Sign In or Register to comment.