Readded loading spinner for map loading and fixed infinite token size when loading
This commit is contained in:
parent
9f21f895ba
commit
a77c4158ca
@ -10,6 +10,7 @@ import MapFog from "./MapFog";
|
|||||||
import TokenDataContext from "../../contexts/TokenDataContext";
|
import TokenDataContext from "../../contexts/TokenDataContext";
|
||||||
import TokenMenu from "../token/TokenMenu";
|
import TokenMenu from "../token/TokenMenu";
|
||||||
import TokenDragOverlay from "../token/TokenDragOverlay";
|
import TokenDragOverlay from "../token/TokenDragOverlay";
|
||||||
|
import LoadingOverlay from "../LoadingOverlay";
|
||||||
|
|
||||||
import { omit } from "../../helpers/shared";
|
import { omit } from "../../helpers/shared";
|
||||||
|
|
||||||
@ -35,7 +36,10 @@ function Map({
|
|||||||
|
|
||||||
const gridX = map && map.gridX;
|
const gridX = map && map.gridX;
|
||||||
const gridY = map && map.gridY;
|
const gridY = map && map.gridY;
|
||||||
const gridSizeNormalized = { x: 1 / gridX || 0, y: 1 / gridY || 0 };
|
const gridSizeNormalized = {
|
||||||
|
x: gridX ? 1 / gridX : 0,
|
||||||
|
y: gridY ? 1 / gridY : 0,
|
||||||
|
};
|
||||||
const tokenSizePercent = gridSizeNormalized.x;
|
const tokenSizePercent = gridSizeNormalized.x;
|
||||||
|
|
||||||
const [selectedToolId, setSelectedToolId] = useState("pan");
|
const [selectedToolId, setSelectedToolId] = useState("pan");
|
||||||
@ -271,6 +275,7 @@ function Map({
|
|||||||
{mapControls}
|
{mapControls}
|
||||||
{tokenMenu}
|
{tokenMenu}
|
||||||
{tokenDragOverlay}
|
{tokenDragOverlay}
|
||||||
|
{loading && <LoadingOverlay />}
|
||||||
</>
|
</>
|
||||||
}
|
}
|
||||||
selectedToolId={selectedToolId}
|
selectedToolId={selectedToolId}
|
||||||
|
@ -92,12 +92,7 @@ function MapToken({
|
|||||||
const imageRef = useRef();
|
const imageRef = useRef();
|
||||||
useEffect(() => {
|
useEffect(() => {
|
||||||
const image = imageRef.current;
|
const image = imageRef.current;
|
||||||
if (
|
if (image && tokenSourceStatus === "loaded") {
|
||||||
image &&
|
|
||||||
tokenSourceStatus === "loaded" &&
|
|
||||||
tokenWidth > 0 &&
|
|
||||||
tokenHeight > 0
|
|
||||||
) {
|
|
||||||
image.cache({
|
image.cache({
|
||||||
pixelRatio: debouncedStageScale * window.devicePixelRatio,
|
pixelRatio: debouncedStageScale * window.devicePixelRatio,
|
||||||
});
|
});
|
||||||
@ -107,7 +102,7 @@ function MapToken({
|
|||||||
}
|
}
|
||||||
}, [debouncedStageScale, tokenWidth, tokenHeight, tokenSourceStatus]);
|
}, [debouncedStageScale, tokenWidth, tokenHeight, tokenSourceStatus]);
|
||||||
|
|
||||||
if (!tokenWidth || !tokenHeight) {
|
if (!tokenWidth || !tokenHeight || tokenSourceStatus === "loading") {
|
||||||
return null;
|
return null;
|
||||||
}
|
}
|
||||||
|
|
||||||
|
Loading…
Reference in New Issue
Block a user