// Use the storyContent to create an Ink story | |
var story = new inkjs.Story(storyContent); | |
// Save a reference to the storyContainer where text will be added | |
var storyContainer = document.getElementById("story"); | |
function continueStory() { | |
// Check if there is more content in the story | |
if(story.canContinue) { | |
// Get ink to generate the next paragraph | |
var paragraphText = story.Continue(); | |
// Find the position where the colon start | |
var dialogueTag = paragraphText.indexOf(':'); | |
// Get the string from the beginning to the position of colon | |
var speaker = paragraphText.substring(0, dialogueTag); | |
// Create paragraph element | |
var paragraphElement = document.createElement('p'); | |
// Check if speaker is an empty string | |
if(speaker.length > 0) { | |
// Add a CSS class matching the speaker | |
paragraphElement.classList.add(speaker); | |
} | |
// Add the text to the P-element | |
paragraphElement.innerHTML = paragraphText; | |
// Append the P-element to the storyContainer | |
storyContainer.appendChild(paragraphElement); | |
} | |
} | |
// Call continueStory() to start | |
continueStory(); | |
// Listen for the "click" event and show text | |
window.addEventListener("click", continueStory); |
Sign up for free
to join this conversation on GitHub.
Already have an account?
Sign in to comment