Harlowe - alter the target link of the back button.

Focksbot

Suppose I wanted to make the back button start to 'misbehave' in a game and take the user to a different page than the last - how can I alter its target?

I know I can tag the passage and then use the css to give passages with that tag different attributes, but the sidebar would need to be edited outside of the stylesheet.

Focksbot

Right, I realise now that it's not a 'back' button at all, but an 'undo' button. I expect getting into the sidebar for a particular passage and monkeying around with it is very high level stuff?

Rafael256

You should always say which version of Twine you are using and what story format.
I use SugarCube 1 and have no clue what you mean by 'back button' other than using <<back>> or <<return>> macro, in which case there is no difficulty in creating what you want.
For SugarCube 1 I would use it like this, for example.

<<if $check1 == 1>>
<<click "Return">><<goto previous()>><</click>>
<<else>>
[[Return->desiredpagetitle]]
<</if>>

I didn't get to random rolls, but there definitely is a function to roll a random. So you could make it, for example, a 5% chance to go to a different page.

Cheers

Focksbot

Hi Rafael256 - it says Harlowe in the subject line and I thought I was posting into the 2.0 forum! :-)

In Twine 2, it looks like the back button in the sidebar actually runs an 'undo' script, returning you to the previous passage and undoing whatever your last action was.

I've now worked out a way to do what I wanted but with a frustrating side effect. I've created a tag for the passage where I want the 'back' button to go to another passage. I've then set it up so that for passages tagged with this, there is no sidebar displayed, but a separate div imitating the look of the sidebar is displayed instead.

I put the contents of that div into the header passage. So my header passage has:

{
<div class="bookcounter">
(link: "↶")[(put: 1 into $bookcount)(goto: (history:)'s last)]
</div>

(print: "<script>$('html').removeClass(\)</script>")
(if: (passage:)'s tags's length > 0)[
(print: "<script>$('html').addClass('" + (passage:)'s tags.join(' ') + "'\)</script>")
}

And my css has this:

.bookcounter {
visibility: hidden;
height: 0px;
width: 0px;
overflow: hidden;
}

html.bookpassage .bookcounter
{
visibility: visible;
height: auto;
width: auto;
overflow: visible;
left: -3em;
width: 3em;
position: absolute;
text-align: center;
display: block;
margin: 0.5em 0;
opacity: 0.1;
font-size: 2.75em;
}

Unfortunately, this seems to have massively slowed the load times on all the passages and removed the transitioning effect I was using.

Rafael256

I apologize if there truly was Harlowe in the subject. I responded as if it wasn't.
Blindness in plain sight, eh.

greyelf

note: Because the forum software eats attachments that are attached to a comment that gets accepted as an Answer the actual attachments related to this comment will be attached to a second comment.

The related attached Twine Archive file contains a Harlowe Story Project named Alt Undo Button which does what you asked, it is based on your example with a couple of changes:

1. I split the code that does the Tag based styling and the code that represents the Alt Undo link into two different header tagged passages named Tag Styling and Alt Undo respectively. It made it easier to do the CSS.

2. I changed your .bookcounter div element to a tw-icon element.

3. My CSS is based on the default CSS of the tw-sidebar and tw-icon elements.

4. I included hover based enhancements.

greyelf

The Twine Archive file attachment containing the Harlowe Story Project named Alt Undo Button.

warning: DO NOT accept this comment as an Answer or the attachment will be eaten by a Grue!.

Focksbot

Thanks very much, greyelf!! :-D