forked from profectus/Profectus
Fixed fonts causing shifts in Node positions on firefox
This commit is contained in:
parent
3042d5ebb6
commit
ad613d06d4
3 changed files with 14 additions and 6 deletions
|
@ -12,6 +12,7 @@ import {
|
|||
} from "game/layers";
|
||||
import type { FeatureNode } from "game/layers";
|
||||
import { nextTick, onMounted, provide, ref } from "vue";
|
||||
import { globalBus } from "game/events";
|
||||
|
||||
const emit = defineEmits<{
|
||||
(e: "updateNodes", nodes: Record<string, FeatureNode | undefined>): void;
|
||||
|
@ -31,7 +32,7 @@ onMounted(() => {
|
|||
let isDirty = true;
|
||||
let boundingRect = ref(resizeListener.value?.getBoundingClientRect());
|
||||
function updateBounds() {
|
||||
if (resizeListener.value != null && isDirty) {
|
||||
if (isDirty) {
|
||||
isDirty = false;
|
||||
nextTick(() => {
|
||||
boundingRect.value = resizeListener.value?.getBoundingClientRect();
|
||||
|
@ -43,7 +44,7 @@ function updateBounds() {
|
|||
});
|
||||
}
|
||||
}
|
||||
document.fonts.ready.then(updateBounds);
|
||||
globalBus.on("fontsLoaded", updateBounds);
|
||||
|
||||
const observerOptions = {
|
||||
attributes: false,
|
||||
|
|
|
@ -10,6 +10,7 @@
|
|||
<script lang="tsx">
|
||||
import { Application } from "@pixi/app";
|
||||
import type { StyleValue } from "features/feature";
|
||||
import { globalBus } from "game/events";
|
||||
import "lib/pixi";
|
||||
import { processedPropType } from "util/vue";
|
||||
import type { PropType } from "vue";
|
||||
|
@ -63,15 +64,14 @@ export default defineComponent({
|
|||
if (isDirty) {
|
||||
isDirty = false;
|
||||
nextTick(() => {
|
||||
if (resizeListener.value != null && props.onContainerResized) {
|
||||
props.onContainerResized(resizeListener.value.getBoundingClientRect());
|
||||
app.value?.resize();
|
||||
if (resizeListener.value != null) {
|
||||
props.onContainerResized?.(resizeListener.value.getBoundingClientRect());
|
||||
}
|
||||
isDirty = true;
|
||||
});
|
||||
}
|
||||
}
|
||||
document.fonts.ready.then(updateBounds);
|
||||
globalBus.on("fontsLoaded", updateBounds);
|
||||
|
||||
return {
|
||||
unref,
|
||||
|
|
|
@ -50,6 +50,11 @@ export interface GlobalEvents {
|
|||
* Happens when the page is opened and upon switching saves in the saves manager.
|
||||
*/
|
||||
onLoad: VoidFunction;
|
||||
/**
|
||||
* Using document.fonts.ready returns too early on firefox, so we use document.fonts.onloadingdone instead, which doesn't accept multiple listeners.
|
||||
* This event fires when that callback is called.
|
||||
*/
|
||||
fontsLoaded: VoidFunction;
|
||||
}
|
||||
|
||||
/** A global event bus for hooking into {@link GlobalEvents}. */
|
||||
|
@ -152,3 +157,5 @@ export async function startGameLoop() {
|
|||
intervalID = setInterval(update, 50);
|
||||
}
|
||||
}
|
||||
|
||||
document.fonts.onloadingdone = () => globalBus.emit("fontsLoaded");
|
||||
|
|
Loading…
Reference in a new issue