Esoteric Update #223 - Document Digression


We'll have an early update today, but my health is kicking my ass, and I feel tomorrow might be a struggle, especially if I don't get this done right now.

Anyway, have some lore:

Lore: The Petal Chamber

Now for the update proper. I felt pretty burned out on a few things (it's just stress and anxiety unrelated to the game development directly, but it does make it hard sometimes), so I turned to something else I've wanted to get done for a while - finishing the new styles of book covers to replace the old designs.

So first off, there's been a problem I've technologied myself into, due to my choice of HTML renderer, where I cannot access either the text value of background-clip in CSS, nor can I use the <foreignObject> tag in SVG. This makes rendering complex text difficult and impossible if I want to replicate some of the more nuanced details of the book rendering. So I had to find some way around it. And it actually came to me in a dream. Or, the inspiration for it, at least. The final solution involved more work; you can check my Twitter for a more extensive explanation with some of the code shown.

This is the final effect, and unfortunately, it's impossible to 100% replicate the gold texture on the text block there. But, of course, if someone had any kind of solution, I'd be happy to take a look.


Despite some issues with how it looks here, as a general solution to embedding arbitrary HTML in the document, it's a pretty good solution.

I also worked on a completely different book style - a paperback; the main goal was to replicate creasing properly on the book's side. So, yes, that's precisely how pedantic I can be about some things.


The cover here uses a random Wombo Dream image, it's not an actual game asset, and we have no plan to put a book with this title into the game. So it's all just for testing at this point, as is everything below.

There's one more thing I wanted to take care of while I was stuck in with SVG, and those were pattern backgrounds. I've attempted to get a handle on these for a while, but something about them never seemed to work. Ultimately I figured out the problem, and it was the necessity to put some redundancy in the code. That's also explained on my Twitter (link above) if you are curious. Once everything is set up correctly, we get this nice little tessellation in our document:


Additionally, all of this works with the draw command, which lets us, for example, draw a Bokeh background:


Of course, this wouldn't be a good idea to actually employ in-game, as it regenerates a different Bokeh each time. But we can do other things. For example, if we properly prepare a channel-mapped texture, we can colourize it for great effect. Here's an image with two channels mapped (red and green, obviously):


And here, we apply colours to the mapping:


I spent much time on this, primarily by pursuing some... dubious efforts here and there. But I'm ultimately pleased with the effects.

Oh, and b.t.w. I finished the collapsible blocks from last week. This is the final appearance of the UI:


Get Esoteric ♥ Esoterica

Comments

Log in with itch.io to leave a comment.

The red one looks nice! Hope you feel better soon though, make sure you’re taking care of yourself properly :3👍🏽