Howdy, Stranger!
It looks like you're new here. If you want to get involved, click one of these buttons!
Feature Proposals
I know this is a user help forum, but for this topic I want your help... in designing this forthcoming Harlowe feature.
Anyway, what I've been setting my eyes on for awhile is the ability to declare basic styling for the story without delving into CSS. The rudimentary, run-of-the-mill options - link colours, page colours, fonts, etc - should be accessible from the TwineScript side.
To that end, I've been pondering a global variable, possibly called
Like this:
Then, if you wanted to change or switch styles mid-story, you can just manipulate it like any other variable:
* The name. I'm not too fond of
* The stateful nature of the thing. In Twine 1, limited-extent styling was specified by tags, and thus each part of the story was clearly assigned a style in the story map. In this proposal, one merely needs to (set:) the style in the first passage of a particular story section - but at the cost of obscuring the exact style used in a particular passage (and, e.g. making "test from here" much more difficult).
Anyway, what I've been setting my eyes on for awhile is the ability to declare basic styling for the story without delving into CSS. The rudimentary, run-of-the-mill options - link colours, page colours, fonts, etc - should be accessible from the TwineScript side.
To that end, I've been pondering a global variable, possibly called
pagestyle, styles, or something, which holds a (datamap:) that controls how the page is styled. Changer commands (like (background:), (text-style:) etc.) can be set to these keys, and the engine will apply them to the page automatically.Like this:
(set: pagestyle to (datamap:
"links", (text-color: "purple") + (font: "Skia"),
"passages", (text-color: "black") + (background: "orange"),
"page", (background: "stars.png")
))Then, if you wanted to change or switch styles mid-story, you can just manipulate it like any other variable:
{(set: $darkCaveStyle to (datamap:
"links", (text-color: "yellow"),
"page", (background: "black")
))
if ($hasTorch)[
(set: pagestyle to $darkCaveStyle)
](else:)[
(set: pagestyle to $darkCaveStyle + (datamap: "page", (background: "brown"))) <!-- Same as $darkCaveStyle, but "page" uses a different style -->
]}* The name. I'm not too fond of
pagestyle, primarily because it's two words, and thus invokes the question of camelCase vs alllowercase. I want something that means "the styles that the page's elements have".* The stateful nature of the thing. In Twine 1, limited-extent styling was specified by tags, and thus each part of the story was clearly assigned a style in the story map. In this proposal, one merely needs to (set:) the style in the first passage of a particular story section - but at the cost of obscuring the exact style used in a particular passage (and, e.g. making "test from here" much more difficult).
Comments
(set: styling to <definition goes here>)
It would be lovely to do on the fly CSS (as I really need it at the moment and may have to resort to the image-hack) but the real question is how easy it is to do nice things from Twine 1 like this:
http://l.j-factor.com/twine/stylesheets/
I'm a bit dissatisfied with having
pagestylebe a bare keyword, similar to an operator. Bare keywords are already confused enough with strings. I wonder if I should make it a plain variable,$pagestyle, which the game automatically updates and is present without the author's intervention.The thing is, though, I don't like the idea of the $ sigil referring to variables the player does not directly control. So, I'm pondering adding another sigil, maybe #, that denotes variables the game controls.
But! That may be getting too confusing. The only other sigil, ?, at least refers to something distinct from variables. And what if someone wrote $pagestyle instead of #pagestyle? Even the ability to make a $pagestyle variable that's distinct from #pagestyle strikes fear in my kidneys.
Any thoughts, anyone?
Note that
(link-replace:)in that picture is actually the current(link:)macro's behaviour. Some say the top behaviour is more desirable for general-purpose use, and I'm becoming rapidly convinced of this, so I'm likely to make a breaking change to(link:)(thus, these will arrive in Harlowe 2.0.0, assuming I'm willing to follow SemVer numbering for this story format).Thoughts?
Maybe the @ character?
I've been using Twine 2 in a videogame design class for middle schoolers and have found it to be a great "before you know how to code, introduction to coding concepts" tool. However, changing backgrounds according to which passage you're currently in has been challenging without diving deep into more complex structures. To be able to change a background by simply setting (background: ) is an awesome idea. However, the real goal for me is for them to be able to do everything over the web, using all web images (even if they place the images in photobucket or something themselves) for their design. To that end, being able to do (background: <img src=" url here">) would be amazing. At the moment, however, it doesn't seem to be able to do that.
1) I second calling it "styling", and I also like the idea of indicating it with an @ prefix.
Would it be possible to add some way to reset the style back to the "default" - a.k.a. whatever it was at the beginning of the story, as determined by the stylesheet? That would make temporary/single passage changes much easier. Additionally, I feel this would be a useful feature for all such global generated variables, if you expand the type to cover other areas.
Maybe use "default" as a keyword macro for that? So you wind up with something like:
2) What exactly is "link-append" doing? That is, when you click the "Forsooth" link that it creates, how is the behavior of that new link defined? Does it append the hook text ad infinitum, as I assume "link-repeat" does?
Something like the below could simplify this and lead to a more accessible user experience:
(set: @styling.background-color to "black")
(set: @styling.font to "Skia")
headerandfootertags offer a new approach: instead of saying, say,(set: $Design's Passages to (background: "black"))to remotely, invisibly change the background in every passage, you can instead put this in theheader:(style: ?Passage, (background: "black")), and it will take effect in every passage by naturally, intuitively composing those two features (the header tag and the (style:) macro). If you want only certain passages to have a style, just use (display:).The only thing, though, is the ?Passage argument. I want there to be a way to select and style both specific hooks and general elements like links and the passage, and to use the same syntax for each (that is, ?HookRef syntax), but I also want the inevitable still-to-be-written array filtering macros to be usable here (for instance,
(style: (filter: item -> item's destination is "Ichorcave", ?Links), (color: "red")), so I guess I may have to re-work the hook reference semantics first, so that they are treated as array-like when given to an array-accepting macro - and that they have distinct items, "hooks", as a user-observable datatype.This could also then be styled in the CSS and/or setup in the header.
Does Harlowe 1.1. include the option of changing the @styling based on the current passage?
What is the syntax to follow within the "header" tagged passage to allow change of @styling based on the current passage?