Howdy, Stranger!
It looks like you're new here. If you want to get involved, click one of these buttons!
Twine (Protagonist) works in Chrome but not in Editor
Hi, I'm using the Protagonist story format (here), which is a bit similar to Snowman (I think), and the desktop app (2.0.8), on Windows 8.1
I'm trying to implement a character start screen, so I have a passage that lets you choose some options (using a cyclinglink implementation that I coded, and a "contenteditable" textbox), which works fine, but on the next passage, when I try to access the Player variables I just set, in Chrome (after I've published to file), it works absolutely fine, however in the app, when I press Play, the first screen works fine, but when I click the link to the next screen, if I'm trying to access a Player variable, the link does nothing (if I delete the bit accessing the variable, it works fine)
My Story Javascript
My Init Passage
My Start Passage (the one that doesn't work)
I can't see why it won't work, but having to export to Chrome every time just to test it is quite annoying.
I'm trying to implement a character start screen, so I have a passage that lets you choose some options (using a cyclinglink implementation that I coded, and a "contenteditable" textbox), which works fine, but on the next passage, when I try to access the Player variables I just set, in Chrome (after I've published to file), it works absolutely fine, however in the app, when I press Play, the first screen works fine, but when I click the link to the next screen, if I'm trying to access a Player variable, the link does nothing (if I delete the bit accessing the variable, it works fine)
My Story Javascript
window.Player =
{
Name: "",
HairStyle: "",
HairColour: ""
};
window.nextCyclingLink = function nextCyclingLink(thisLink, i)
{
var cyclingLinkObject = JSON.parse(thisLink.dataset.cyclinglink);
var optionsArray = cyclingLinkObject.options;
var current = thisLink.innerHTML;
var currentIndex = optionsArray.indexOf(current);
if (currentIndex >= (optionsArray.length - 1) || currentIndex == -1)
{
currentIndex = 0;
}
else
{
currentIndex++;
}
thisLink.innerHTML = optionsArray[currentIndex];
eval(cyclingLinkObject.variable + " = " + "'" + optionsArray[currentIndex] + "'");
};
window.editableVariable = function editableVariable(thisEditable)
{
if (thisEditable.getAttribute("data-variable") != "undefined")
{
eval(thisEditable.dataset.variable + " = " + "'" + thisEditable.innerHTML + "'");
}
};
_$(function()
{
var cyclingLinks = document.querySelectorAll("[data-cyclinglink]");
for(var i = 0; i < cyclingLinks.length; i++)
{
cyclingLinks[i].href = "javascript:;";
nextCyclingLink(cyclingLinks[i]);
cyclingLinks[i].addEventListener("click", function()
{
nextCyclingLink(this);
}, false);
}
var editable = document.querySelectorAll("[contenteditable='true']");
for (var i = 0; i < editable.length; i++)
{
editableVariable(editable[i]);
editable[i].addEventListener("blur", function()
{
editableVariable(this);
}, false);
}
});
My Init Passage
There is a gentle breeze, it makes the curtains flutter.
You gaze into the shard of crystal in front of you.
Your
<a id="player_hair_style"
data-cyclinglink='{ "variable": "Player.HairStyle",
"options": [
"long, wavy mane",
"short, spiky do",
"slick, smooth bob"
]}'/>
(<a id="player_hair_colour"
data-cyclinglink='{ "variable": "Player.HairColour",
"options": [
"pure white, like the snow on the mountains",
"turquoise, the same colour as the expansive sea",
"dusky green, like the forest moss",
"bright red, like the dying embers of the fire"
]}'/>)
obscures the reflection of your face.
Your name is <span id="player_name" data-variable="Player.Name" contenteditable="true">jemonn</span>
[[Confirm|Start]]
My Start Passage (the one that doesn't work)
blah blah blah <%= Player.HairStyle %>
I can't see why it won't work, but having to export to Chrome every time just to test it is quite annoying.
Comments
Just looking at the code I notice a few things.
In your Story JavaScript, the following: Should probably be this: After that change, it all worked in Snowman for me, so I assume it'll work in Protagonist (unless you're using a broken version).
This isn't the cause of your issues, however, anchors are not void elements. The following is incorrect: You should be doing this: Even if they're going to be programmatically updated by your code, and even if the browser accepts them that way, you should construct them properly.
Why aren't you using the the Test and/or Play buttons (bottom right of the story editor)?
Ah thanks, I didn't realies that you couldn't do that! As you said, it didn't fix anything, but better to try and do things right.
The problem I'm having is that the built-in test/play screen (on the desktop app) don't work with my code, however when I manually open the compiled .html file in Chrome, my code works fine.
I just changed to Snowman and it worked fine straight away, so whatever issue I'm having, it's related to Protagonist.
I used Play just now to test in Snowman in the exact same version of Twine 2 you say you're using (2.0.8 executable version). /shrug
I think all your issue may stem from a busted version of Protagonist.
Yeah, now I've switched to Snowman I can use Play again.