OpenNeo/impress-2020
OpenNeo/impress-2020
1
0
Fork 0
Code Pull requests Activity

Extract out layerUsesHTML5 function

Browse source
This commit is contained in:
Emi Matchu 2021-02-10 13:49:37 -08:00
parent 10e47115bd
commit bbb752fa65
3 changed files with 10 additions and 9 deletions
Show stats Download patch file Download diff file Expand all files Collapse all files

6
src/app/ItemPage.js
View file

@ -38,7 +38,7 @@ import { Link, useParams } from "react-router-dom";
import ItemPageLayout, { SubtleSkeleton } from "./ItemPageLayout";
import { Delay, logAndCapture, usePageTitle } from "./util";
import HTML5Badge from "./components/HTML5Badge";
import HTML5Badge, { layerUsesHTML5 } from "./components/HTML5Badge";
import {
itemAppearanceFragment,
petAppearanceFragment,
@ -672,9 +672,7 @@ function ItemPageOutfitPreview({ itemId }) {
const itemAppearance = appearance?.itemAppearances?.[0];
const itemLayers = itemAppearance?.layers || [];
const isCompatible = itemLayers.length > 0;
const usesHTML5 = itemLayers.every(
(l) => l.svgUrl || l.canvasMovieLibraryUrl
);
const usesHTML5 = itemLayers.every(layerUsesHTML5);
const borderColor = useColorModeValue("green.700", "green.400");
const errorColor = useColorModeValue("red.600", "red.400");

9
src/app/WardrobePage/OutfitControls.js
View file

@ -24,12 +24,12 @@ import { MdPause, MdPlayArrow } from "react-icons/md";
import { Link } from "react-router-dom";
import { getBestImageUrlForLayer } from "../components/OutfitPreview";
import HTML5Badge, { layerUsesHTML5 } from "../components/HTML5Badge";
import PosePicker from "./PosePicker";
import SpeciesColorPicker from "../components/SpeciesColorPicker";
import { loadImage, useLocalStorage } from "../util";
import useCurrentUser from "../components/useCurrentUser";
import useOutfitAppearance from "../components/useOutfitAppearance";
import HTML5Badge from "../components/HTML5Badge";
/**
* OutfitControls is the set of controls layered over the outfit preview, to
@ -89,11 +89,10 @@ function OutfitControls({
};
const itemLayers = appearance.itemAppearances.map((a) => a.layers).flat();
const usesHTML5 = itemLayers.every(
(l) => l.svgUrl || l.canvasMovieLibraryUrl
);
const usesHTML5 = itemLayers.every(layerUsesHTML5);
const itemsNotUsingHTML5 = appearance.items.filter((item) =>
item.appearance.layers.some((l) => !l.svgUrl && !l.canvasMovieLibraryUrl)
item.appearance.layers.some((l) => !layerUsesHTML5(l))
);
itemsNotUsingHTML5.sort((a, b) => a.name.localeCompare(b.name));

4
src/app/components/HTML5Badge.js
View file

@ -128,4 +128,8 @@ function HTML5BadgeLayout({ children, tooltipLabel, ...props }) {
);
}
export function layerUsesHTML5(layer) {
return layer.svgUrl || layer.canvasMovieLibraryUrl;
}
export default HTML5Badge;