Emphasizing the Last Turn

The Inky editor allows you to play and rewind the game as you edit your ink script.  Inky can export the game to the web, using a template consisting of the required HTML, CSS and Javascript.

Writing web-based interaction with Ink describes how the template interacts with the Ink script and covers customizing appearance using CSS.

As you play, the story scrolls up the screen.  Fairly early on, I found that I was having trouble separating text from the current turn (last choice) from previous turns.

This seemed like a good opportunity to experiment with altering the default template.

The standard paragraph style is:

p {

font-size: 13pt;

color: #888;

/* color: rgb(229, 29, 29); */

line-height: 1.7em;

font-weight: lighter;

}

I added a new class with a slightly larger font size and weight:

/* Tom */

.last_turn {

font-size: 14pt;

color: #000;

font-weight:bolder;

/* color: rgb(29, 29, 29); */

}

Then a little bit of code in the main.js file to add the emphasis when new paragraphs are created:

// Create paragraph element (initially hidden)

var paragraphElement = document.createElement('p');

//Tom

paragraphElement.classList.add("last_turn")

A function to remove it on the next turn:

function removeLastTurn(){

// Tom - clear last para from previous

var last_paras = document.getElementsByClassName("last_turn");

while(last_paras.length > 0) {

last_paras[0].classList.remove("last_turn")

}

}

That gets called each time the story continues:

// Main story processing function. Each time this is called it generates

// all the next content up as far as the next set of choices.

function continueStory(firstTime) {

// Tom

removeLastTurn();

The result is an affordance that helps the player to distinguish the results of their last choice:

But first you have to tell him your name. And you--and all these others--are the poor souls who died in a state of amnesia. You can't remember your names, and you can't get either to heaven or to hell until this old geezer, whose name is Charon, has checked you off his list. So, here's your first chance.

Charon hands you your Emigration Card, and there's the blank you've got to fill in.

PRINT YOUR NAME HERE _______X________

"Sorry," says Charon, handing you back your Emigration Card. "I've got no pick-up order for anyone by this name. Better luck next time." Charon picks up his oar, and swats away the other lost souls gathered about his boat. You join in their collective groan as Charon's ferryboat vanishes into the mists of the river Styx.

Another five years have gone by. Charon has returned in a mood of angry impatience. You fill out the Emigration Card.

John Cameron

Xavier Hollings