Scrolling chatlog running alongside game

Twine Version: Twine 2.5.1.0
Story Format: Sugarcube 2.36.1

I’ve been very out of the loop on creating IF with Twine, and slowly getting back into things, and I’m piecing together a new point-and-click style puzzle/adventure game. The actual game system is functioning pretty well, the trouble’s come with the secondary gimmick of the game I want to implement - namely, a chatlog-style conversation between two people that’s continually running as the player navigates through the game that comments on what’s being done as it’s happening.

I had originally set up a sidebar UI with the hopes that I’d be able to use triggered events to make various chunks of the conversation load into it as the player encountered things in the main game. But every time the player navigates to a new passage, the sidebar gets reloaded. And unfortunately, I’m not a very good coder, so this is where my creativity on that front has run out.

Any help or ideas on how to make this work would be very appreciated! Thank you.

Prototype layout below, in the hopes that it’ll explain my intentions a liiiitle better than my rambling so far:

1 Like

If you are using code something like that found in this old post to implement your own “right side-bar” then the code segment in the 1st example that calls the setPageElement() function…

/* Automatically show the contents of the StoryRightSidebar passage in the right-ui-bar-body element. */
postrender["Display Right Sidebar Contents"] = function (content, taskName) {
	setPageElement('right-ui-bar-body', 'StoryRightSidebar');
};

…is what is causing the contents of the StoryRightSidebar Passage to be injected into the newly added <div id="right-ui-bar-body"> HTML element.

And it is the fact that that setPageElement() function call is contained within the body of a postrender Navigation Events task that causes that “area” to be refreshed each time a Passage Transition occurs. So if you don’t want that “area” to be refreshed after each Passage Transition then don’t call the setPageElement() function within such a task or event.

Now that that “area” doesn’t automatically refresh you will need to use macros like <<append>> and <<replace>> to update the content of it.

<<link "do something">>
	<<append "#right-ui-bar-body">>Something was done<</append>>
<</link>>
1 Like

This worked splendidly, thank you very much. Is there any way to make the contents of that sidebar either scroll up automatically (so the most recent messages are visible at the bottom without the user needing to scroll manually), or to delete older messages so scrolling isn’t necessary? I’ve done some combing of the forums but haven’t noticed anything that might help.