use bodyId, not speciesId, for pose transforms

This commit is contained in:
Matt Dunn-Rankin 2020-05-03 12:55:37 -07:00
parent a164235c0e
commit da0398b50b
5 changed files with 70 additions and 59 deletions

View file

@ -12,3 +12,4 @@ Tech/detail improvements:
* Use react-virtualized instead of our own scroller, but we need total count known, and we need another solution for the CSS transitions in the outfit case * Use react-virtualized instead of our own scroller, but we need total count known, and we need another solution for the CSS transitions in the outfit case
* Restore good download behavior: use crossOrigin for everything, and remove cache-buster in the URL we use for canvas * Restore good download behavior: use crossOrigin for everything, and remove cache-buster in the URL we use for canvas
* Undo the local linking we did for @chakra-ui/core, react, and react-dom on Matchu's machine 😅 * Undo the local linking we did for @chakra-ui/core, react, and react-dom on Matchu's machine 😅
* validPetPoses should declare its own dimensions, so that misaligned caches won't misalign the data

View file

@ -306,8 +306,7 @@ function PoseButton({ pose, onChange, inputRef }) {
width="50px" width="50px"
height="50px" height="50px"
transform={ transform={
transformsBySpeciesId[pose.speciesId] || transformsByBodyId[pose.bodyId] || transformsByBodyId.default
transformsBySpeciesId.default
} }
> >
<OutfitLayers visibleLayers={getVisibleLayers(pose, [])} /> <OutfitLayers visibleLayers={getVisibleLayers(pose, [])} />
@ -342,6 +341,7 @@ function usePoses(outfitState) {
petAppearances(speciesId: $speciesId, colorId: $colorId) { petAppearances(speciesId: $speciesId, colorId: $colorId) {
id id
petStateId petStateId
bodyId
genderPresentation genderPresentation
emotion emotion
approximateThumbnailUrl approximateThumbnailUrl
@ -360,7 +360,6 @@ function usePoses(outfitState) {
); );
return { return {
...appearance, ...appearance,
speciesId,
isAvailable: Boolean(appearance), isAvailable: Boolean(appearance),
isSelected: isSelected:
outfitState.emotion === e && outfitState.genderPresentation === gp, outfitState.emotion === e && outfitState.genderPresentation === gp,
@ -379,62 +378,62 @@ function usePoses(outfitState) {
return { loading, error, poses }; return { loading, error, poses };
} }
const transformsBySpeciesId = { const transformsByBodyId = {
"1": "translate(-5px, 10px) scale(2.8)", "93": "translate(-5px, 10px) scale(2.8)",
"2": "translate(-8px, 8px) scale(2.9)", "106": "translate(-8px, 8px) scale(2.9)",
"3": "translate(-1px, 17px) scale(3)", "47": "translate(-1px, 17px) scale(3)",
"4": "translate(-21px, 22px) scale(3.2)", "84": "translate(-21px, 22px) scale(3.2)",
"5": "translate(2px, 15px) scale(3.3)", "146": "translate(2px, 15px) scale(3.3)",
"6": "translate(-14px, 28px) scale(3.4)", "250": "translate(-14px, 28px) scale(3.4)",
"7": "translate(-4px, 8px) scale(2.9)", "212": "translate(-4px, 8px) scale(2.9)",
"8": "translate(-26px, 30px) scale(3.0)", "74": "translate(-26px, 30px) scale(3.0)",
"9": "translate(-4px, 8px) scale(3.1)", "94": "translate(-4px, 8px) scale(3.1)",
"10": "translate(-14px, 18px) scale(3.0)", "132": "translate(-14px, 18px) scale(3.0)",
"11": "translate(-7px, 24px) scale(2.9)", "56": "translate(-7px, 24px) scale(2.9)",
"12": "translate(-16px, 20px) scale(3.5)", "90": "translate(-16px, 20px) scale(3.5)",
"13": "translate(-11px, 18px) scale(3.0)", "136": "translate(-11px, 18px) scale(3.0)",
"14": "translate(-14px, 26px) scale(3.5)", "138": "translate(-14px, 26px) scale(3.5)",
"15": "translate(-13px, 24px) scale(3.1)", "166": "translate(-13px, 24px) scale(3.1)",
"16": "translate(-6px, 29px) scale(3.1)", "119": "translate(-6px, 29px) scale(3.1)",
"17": "translate(3px, 13px) scale(3.1)", "126": "translate(3px, 13px) scale(3.1)",
"18": "translate(2px, 27px) scale(3.4)", "67": "translate(2px, 27px) scale(3.4)",
"19": "translate(-7px, 16px) scale(3.1)", "163": "translate(-7px, 16px) scale(3.1)",
"20": "translate(-2px, 15px) scale(3.0)", "147": "translate(-2px, 15px) scale(3.0)",
"21": "translate(-2px, -17px) scale(3.0)", "80": "translate(-2px, -17px) scale(3.0)",
"22": "translate(-14px, 16px) scale(3.6)", "117": "translate(-14px, 16px) scale(3.6)",
"23": "translate(-16px, 16px) scale(3.2)", "201": "translate(-16px, 16px) scale(3.2)",
"24": "translate(-2px, 6px) scale(3.2)", "51": "translate(-2px, 6px) scale(3.2)",
"25": "translate(-3px, 6px) scale(3.7)", "208": "translate(-3px, 6px) scale(3.7)",
"26": "translate(-7px, 19px) scale(5.2)", "196": "translate(-7px, 19px) scale(5.2)",
"27": "translate(-16px, 20px) scale(3.5)", "143": "translate(-16px, 20px) scale(3.5)",
"28": "translate(-3px, 24px) scale(3.2)", "150": "translate(-3px, 24px) scale(3.2)",
"29": "translate(-9px, 15px) scale(3.4)", "175": "translate(-9px, 15px) scale(3.4)",
"30": "translate(3px, 57px) scale(4.4)", "173": "translate(3px, 57px) scale(4.4)",
"31": "translate(-28px, 35px) scale(3.8)", "199": "translate(-28px, 35px) scale(3.8)",
"32": "translate(-8px, 33px) scale(3.5)", "52": "translate(-8px, 33px) scale(3.5)",
"33": "translate(-8px, -6px) scale(3.2)", "109": "translate(-8px, -6px) scale(3.2)",
"34": "translate(-14px, 14px) scale(3.1)", "134": "translate(-14px, 14px) scale(3.1)",
"35": "translate(-12px, 0px) scale(3.4)", "95": "translate(-12px, 0px) scale(3.4)",
"36": "translate(6px, 23px) scale(3.3)", "96": "translate(6px, 23px) scale(3.3)",
"37": "translate(-20px, 25px) scale(3.6)", "154": "translate(-20px, 25px) scale(3.6)",
"38": "translate(-16px, 28px) scale(4.0)", "55": "translate(-16px, 28px) scale(4.0)",
"39": "translate(-8px, 11px) scale(3.0)", "76": "translate(-8px, 11px) scale(3.0)",
"40": "translate(2px, 12px) scale(3.5)", "156": "translate(2px, 12px) scale(3.5)",
"41": "translate(-3px, 18px) scale(3.0)", "78": "translate(-3px, 18px) scale(3.0)",
"42": "translate(-18px, 46px) scale(4.4)", "191": "translate(-18px, 46px) scale(4.4)",
"43": "translate(-6px, 22px) scale(3.2)", "187": "translate(-6px, 22px) scale(3.2)",
"44": "translate(-2px, 19px) scale(3.4)", "46": "translate(-2px, 19px) scale(3.4)",
"45": "translate(-11px, 32px) scale(3.3)", "178": "translate(-11px, 32px) scale(3.3)",
"46": "translate(-13px, 23px) scale(3.3)", "100": "translate(-13px, 23px) scale(3.3)",
"47": "translate(-14px, 4px) scale(3.1)", "130": "translate(-14px, 4px) scale(3.1)",
"48": "translate(-9px, 24px) scale(3.5)", "188": "translate(-9px, 24px) scale(3.5)",
"49": "translate(-14px, 25px) scale(3.4)", "257": "translate(-14px, 25px) scale(3.4)",
"50": "translate(-7px, 4px) scale(3.6)", "206": "translate(-7px, 4px) scale(3.6)",
"51": "translate(-13px, 16px) scale(3.2)", "101": "translate(-13px, 16px) scale(3.2)",
"52": "translate(-2px, 13px) scale(3.2)", "68": "translate(-2px, 13px) scale(3.2)",
"53": "translate(-6px, 4px) scale(3.1)", "182": "translate(-6px, 4px) scale(3.1)",
"54": "translate(-15px, 22px) scale(3.6)", "180": "translate(-15px, 22px) scale(3.6)",
"55": "translate(1px, 14px) scale(3.1)", "306": "translate(1px, 14px) scale(3.1)",
default: "scale(2.5)", default: "scale(2.5)",
}; };

View file

@ -49,6 +49,7 @@ const typeDefs = gql`
type PetAppearance { type PetAppearance {
id: ID! id: ID!
petStateId: ID! petStateId: ID!
bodyId: ID!
genderPresentation: GenderPresentation genderPresentation: GenderPresentation
emotion: Emotion emotion: Emotion
approximateThumbnailUrl: String! approximateThumbnailUrl: String!
@ -173,6 +174,7 @@ const resolvers = {
return `${speciesId}-${colorId}-${emotion}-${genderPresentation}`; return `${speciesId}-${colorId}-${emotion}-${genderPresentation}`;
}, },
petStateId: ({ petState }) => petState.id, petStateId: ({ petState }) => petState.id,
bodyId: ({ petType }) => petType.bodyId,
genderPresentation: ({ petState }) => genderPresentation: ({ petState }) =>
getGenderPresentation(petState.female), getGenderPresentation(petState.female),
emotion: ({ petState }) => getEmotion(petState.moodId), emotion: ({ petState }) => getEmotion(petState.moodId),

View file

@ -74,6 +74,7 @@ describe("PetAppearance", () => {
query { query {
petAppearances(speciesId: "54", colorId: "75") { petAppearances(speciesId: "54", colorId: "75") {
id id
bodyId
petStateId petStateId
genderPresentation genderPresentation
emotion emotion

View file

@ -56,6 +56,7 @@ Object {
"petAppearances": Array [ "petAppearances": Array [
Object { Object {
"approximateThumbnailUrl": "http://pets.neopets.com/cp/vghhzlgf/1/1.png", "approximateThumbnailUrl": "http://pets.neopets.com/cp/vghhzlgf/1/1.png",
"bodyId": "180",
"emotion": "HAPPY", "emotion": "HAPPY",
"genderPresentation": "FEMININE", "genderPresentation": "FEMININE",
"id": "54-75-HAPPY-FEMININE", "id": "54-75-HAPPY-FEMININE",
@ -107,6 +108,7 @@ Object {
}, },
Object { Object {
"approximateThumbnailUrl": "http://pets.neopets.com/cp/vghhzlgf/1/1.png", "approximateThumbnailUrl": "http://pets.neopets.com/cp/vghhzlgf/1/1.png",
"bodyId": "180",
"emotion": "HAPPY", "emotion": "HAPPY",
"genderPresentation": "MASCULINE", "genderPresentation": "MASCULINE",
"id": "54-75-HAPPY-MASCULINE", "id": "54-75-HAPPY-MASCULINE",
@ -158,6 +160,7 @@ Object {
}, },
Object { Object {
"approximateThumbnailUrl": "http://pets.neopets.com/cp/vghhzlgf/4/1.png", "approximateThumbnailUrl": "http://pets.neopets.com/cp/vghhzlgf/4/1.png",
"bodyId": "180",
"emotion": "SICK", "emotion": "SICK",
"genderPresentation": "FEMININE", "genderPresentation": "FEMININE",
"id": "54-75-SICK-FEMININE", "id": "54-75-SICK-FEMININE",
@ -209,6 +212,7 @@ Object {
}, },
Object { Object {
"approximateThumbnailUrl": "http://pets.neopets.com/cp/vghhzlgf/4/1.png", "approximateThumbnailUrl": "http://pets.neopets.com/cp/vghhzlgf/4/1.png",
"bodyId": "180",
"emotion": "SICK", "emotion": "SICK",
"genderPresentation": "MASCULINE", "genderPresentation": "MASCULINE",
"id": "54-75-SICK-MASCULINE", "id": "54-75-SICK-MASCULINE",
@ -260,6 +264,7 @@ Object {
}, },
Object { Object {
"approximateThumbnailUrl": "http://pets.neopets.com/cp/vghhzlgf/2/1.png", "approximateThumbnailUrl": "http://pets.neopets.com/cp/vghhzlgf/2/1.png",
"bodyId": "180",
"emotion": "SAD", "emotion": "SAD",
"genderPresentation": "FEMININE", "genderPresentation": "FEMININE",
"id": "54-75-SAD-FEMININE", "id": "54-75-SAD-FEMININE",
@ -311,6 +316,7 @@ Object {
}, },
Object { Object {
"approximateThumbnailUrl": "http://pets.neopets.com/cp/vghhzlgf/2/1.png", "approximateThumbnailUrl": "http://pets.neopets.com/cp/vghhzlgf/2/1.png",
"bodyId": "180",
"emotion": "SAD", "emotion": "SAD",
"genderPresentation": "MASCULINE", "genderPresentation": "MASCULINE",
"id": "54-75-SAD-MASCULINE", "id": "54-75-SAD-MASCULINE",
@ -362,6 +368,7 @@ Object {
}, },
Object { Object {
"approximateThumbnailUrl": "http://pets.neopets.com/cp/vghhzlgf/null/1.png", "approximateThumbnailUrl": "http://pets.neopets.com/cp/vghhzlgf/null/1.png",
"bodyId": "180",
"emotion": null, "emotion": null,
"genderPresentation": null, "genderPresentation": null,
"id": "54-75-null-null", "id": "54-75-null-null",
@ -420,6 +427,7 @@ Object {
}, },
Object { Object {
"approximateThumbnailUrl": "http://pets.neopets.com/cp/vghhzlgf/null/1.png", "approximateThumbnailUrl": "http://pets.neopets.com/cp/vghhzlgf/null/1.png",
"bodyId": "180",
"emotion": null, "emotion": null,
"genderPresentation": null, "genderPresentation": null,
"id": "54-75-null-null", "id": "54-75-null-null",