@label @replace

IFforClassroom
31 May 2022, 03:53

The fade effect when you replace labels is controlled by C:\Program Files (x86)\Squiffy\resources\app\node_modules\squiffy\ squiffy.template

        var $labels = squiffy.ui.output.find('.squiffy-label-' + label);
        $labels.fadeOut(1000, function() {
            $labels.html(squiffy.ui.processText(text));
            $labels.fadeIn(1000, function() {
                squiffy.story.save();

Wouldn't it be better if it were controlled by style.template ?

I want to change @replace in my local copy so that it appears to delete and retype the label character by character, as though somebody were doing it with a keyboard. There are probably other ways people would like to do this, as well. Having it controlled by style.template makes more sense. It's a visual style, after all.


mrangel
01 Jun 2022, 14:40

Check the file extensions.

style.template.css is a CSS file; squiffy.template.js is Javascript. Active functions are written in javascript, even if their purpose is stylistic.

(With CSS3, I think you could have the fade out/fade in thing as an animated property; but I don't think your typewriter mode would be so easy to implement)


IFforClassroom
02 Jun 2022, 08:06

Yeah, that makes better sense than what I was thinking. I have both a JavaScript and a CSS way to make text appear to type itself. But it requires a lot of extra, non-squiffy stuff to do each time. I prefer it to any other replacement method; it just seems to better create the illusion that you're interacting with an intelligence when you play a game. Fade out/in is just not as cool, subjectively speaking.