Eon Comments - Answer Overflow

async rerender(options) {
  if(this.element) {
    const currentState = app.cloneNode(true);
    currentState.style.visibility = "visible";

    const images = Array.from(currentState.querySelectorAll("img"));
    await Promise.all(images.map(img => img.decode()));

    this.element.parentNode?.appendChild(currentState);
    this.oldState = currentState;
  }
  return this.render(options);
}

async rerender(options) {
  if(this.element) {
    const currentState = app.cloneNode(true);
    currentState.style.visibility = "visible";

    const images = Array.from(currentState.querySelectorAll("img"));
    await Promise.all(images.map(img => img.decode()));

    this.element.parentNode?.appendChild(currentState);
    this.oldState = currentState;
  }
  return this.render(options);
}

170 replies

LOELeague of Extraordinary FoundryVTT Developers

•Created by Eon on 4/15/2025 in #development

@Eunomiac Sooo I finally got around to

so it feels like it's blinking but in actuality only the images are

170 replies

LOELeague of Extraordinary FoundryVTT Developers

•Created by Eon on 4/15/2025 in #development

@Eunomiac Sooo I finally got around to

I think this may have to do with the fact that images are refreshing

170 replies

LOELeague of Extraordinary FoundryVTT Developers

•Created by Eon on 4/15/2025 in #development

@Eunomiac Sooo I finally got around to

rerender(options) {
  if(this.element) {
    const currentState = app.cloneNode(true);
    currentState.style.visibility = "visible";
    this.element.parentNode?.appendChild(currentState);
    this.oldState = currentState;
  }
  return this.render(options);
}

async _onRender(context, options) {
  await super._onRender(context, options);
  this.fadeOldState();
}

fadeOldState() {
  if (!this.element || !this.oldState) return

  const tl = gsap.timeline();
  tl.fromTo(
    this.element,
    {
      autoAlpha: 0,
    },
    {
      autoAlpha: 1,
      duration: 0.5
    }
  );
  tl.fromTo(
    this.oldState,
    {
      autoAlpha: 1
    },
    {
      duration: 0.5,
      autoAlpha: 0,
      onComplete: () => {
        this.oldState?.remove();
        this.oldState = null;
      }
    },
    "<"
  )
}

rerender(options) {
  if(this.element) {
    const currentState = app.cloneNode(true);
    currentState.style.visibility = "visible";
    this.element.parentNode?.appendChild(currentState);
    this.oldState = currentState;
  }
  return this.render(options);
}

async _onRender(context, options) {
  await super._onRender(context, options);
  this.fadeOldState();
}

fadeOldState() {
  if (!this.element || !this.oldState) return

  const tl = gsap.timeline();
  tl.fromTo(
    this.element,
    {
      autoAlpha: 0,
    },
    {
      autoAlpha: 1,
      duration: 0.5
    }
  );
  tl.fromTo(
    this.oldState,
    {
      autoAlpha: 1
    },
    {
      duration: 0.5,
      autoAlpha: 0,
      onComplete: () => {
        this.oldState?.remove();
        this.oldState = null;
      }
    },
    "<"
  )
}

#parent {
  position: relative;
}

#child {
  position: absolute;
  visibility: hidden;
}

#parent {
  position: relative;
}

#child {
  position: absolute;
  visibility: hidden;
}

170 replies

LOELeague of Extraordinary FoundryVTT Developers

•Created by Eon on 4/15/2025 in #development

@Eunomiac Sooo I finally got around to

I don't understand why the flicker is back gah.

170 replies

LOELeague of Extraordinary FoundryVTT Developers

•Created by Eon on 4/15/2025 in #development

@Eunomiac Sooo I finally got around to

oh no how did the stutter return now aaaagh.

170 replies

LOELeague of Extraordinary FoundryVTT Developers

•Created by Eon on 4/15/2025 in #development

@Eunomiac Sooo I finally got around to

170 replies

LOELeague of Extraordinary FoundryVTT Developers

•Created by Eon on 4/15/2025 in #development

@Eunomiac Sooo I finally got around to

hmmm interestingly enough, setting position relative on the parent and position absolute just works. Like the element doesn't move and just stays exactly where I want it to, never had that be the case before lol. But if I do that (and then also don't set any top/left/width/height on the clone) they indeed become identical

170 replies

LOELeague of Extraordinary FoundryVTT Developers

•Created by Eon on 4/15/2025 in #development

@Eunomiac Sooo I finally got around to