Post by Requiem in New version of ink.js comments

Viewing post in New version of ink.js comments

Hi! I’m back here to ask about using the storylet system you have in your gist https://gist.github.com/JoshuaGrams/073e02468a5fe3addb8cdbfdc6f199d3 along with this VN template in a future project.

Where should I start to modify the main.js? Both templates modify the js in some ways and I’m not familiar enough with js to try frankensteining them together.

And if I want to show a variable on screen (especially to debug storylets), how would I do that?

Thank you in advance, and I hope I haven’t been too imposing (and no worry if this is too involved for you to answer).

JoshGrams170 days ago

Heh, I was just thinking I should take another look at squash and stretch - I couldn't find a goad way to change size based on an image's default aspect ratio rather than it's parent's aspect ratio or a fixed shape.

I haven't thought about that gist in... oh, probably about 4 years when I first wrote it, but on a quick look...

Yeah, I think it's just defining that `choose` function at the top and then using `choose(story.currentChoices, limit).forEach` instead of `story.currentChoices.forEach`

So you probably just need to copy in the `choose` function near the top of vn-runner.js and then putting lines 61 and 62 of the gist in the appropriate places (hrm, it's in two places in vn-runner, maybe lines 354 and 364? different for the alert box vs. regular choices. that could potentially be factored out, or just copy-pasted both places).

Or...hmm. Let me know if that's too involved and I'll shove it on a branch of the repository and send you a link.

I believe printing variables in ink is just putting curly brackets around the variable name.

Requiem170 days ago (1 edit)

Heh, I was just thinking I should take another look at squash and stretch - I couldn’t find a goad way to change size based on an image’s default aspect ratio rather than it’s parent’s aspect ratio or a fixed shape.

If you don’t mind explaining, what would the parent be? And by fixed shape, does this mean that the image can be transformed into arbitrary polygons, as long as it’s in the same aspect ratio? This is more a curiosity than anything (also thank you for taking a stab at this, even when it proves to be more complicated than I thought).

Or…hmm. Let me know if that’s too involved and I’ll shove it on a branch of the repository and send you a link.

I think I can do this now that you’ve told me where to look.

I believe printing variables in ink is just putting curly brackets around the variable name.

Oh, I mean to have it shown on the VN screen at all times, not in dialogues.

JoshGrams170 days ago

If you don’t mind explaining, what would the parent be?

Not polygon, just any rectangle. The parent element in this case would be the display area where the sprites show up: it's currently a 2:1 aspect ratio. So if I did the naive thing and just gave you width and height, then "10 10" would be 10% of the display width and 10% of the display height, so the image would get stretched to a 2:1 rectangle no matter what size it was initially. That would let you do squash and stretch, but to get an image to be not stretched, you'd have to do the math to convert backwards to the image's actual aspect ratio (like a square image would need to be 10 5). Which seems... inconvenient.

Oh, I mean to have it shown on the VN screen at all times, not in dialogues.

Oh, I see. You can get ink variables in the javascript with story.variablesState["variableName"] but you'd need a way to display it. You could console.log it in continueStory? Or you'd have to find a place to put it in the HTML, maybe add a div or span with an id and get the element with document.getElementById, and then set element.textContent = story.variablesState["variableName"]

Requiem170 days ago

I’ll try that, thank you! It has been informative so far.

itch.io

Viewing post in New version of ink.js comments