Commit graph

155 commits

Author SHA1 Message Date
1c8eba4698 Support tools can set appearance glitched state!
this is also very good! :3
2020-08-31 00:48:54 -07:00
1ef05adce4 Support can label pet poses!
it's good shit, y'all
2020-08-31 00:32:17 -07:00
45ab35216f Add arrow buttons to PosePickerSupport
Easier to move between appearances quickly! I'm adding this in anticipation of a use case of rapidly labeling Unknown appearances—I want it to be easy to label one and go to the next!
2020-08-30 23:27:43 -07:00
5ce5356825 migrate to new useSupport hook
Just smoothing out the API for cases where you want to know `isSupportUser`, but not the secret!
2020-08-29 14:54:02 -07:00
4e923746ce Show empty PosePicker for Support users
For most users, I want to hide the pose picker if there's not actually anything to pick from.

But I want Support users to be able to open it and use Support mode, to inspect and label Unknown poses!

In this change, I add new UI to show a question mark pose picker button, and a note explaining the empty picker; but only show them for Support users.

I also made a new `useSupport` hook, to replace `useSupportSecret`, now that I have a use case for "is support user?" that doesn't require the secret. Will migrate the rest!
2020-08-29 14:49:37 -07:00
d41f80518a fix bug to resize PosePicker when it changes
Previously, toggling between the two PosePicker modes could dramatically disrupt the layout, because Popover didn't know to re-measure itself.

In this change, we add a hacky workaround to simulate a window resize event in moments when we know the content is changing. (The realistic ideal solution would still have these manual triggers, but would use an official API in Chakra to notify the Popper instance directly.)
2020-08-29 14:19:43 -07:00
05e5c5ad3e add petAppearanceById client caching
If we already got this PetAppearance, now `petAppearanceById` knows how to serve it from the client cache instead making a network request!
2020-08-29 13:23:41 -07:00
1e30e7c8b0 add Support mode to PosePicker
Still just read-only stuff, but now you can look at all the different poses we have for a species/color!

Soon I'll make the pose/glitched stuff editable :3

Some sizable refactors here to add the ability to specify appearance ID as well as pose… most of the app still doesn't use it, it's mostly just lil extra logic to make it win if it's available!

(The rationale for making it an override, rather than always tracking appearance ID, is that it gets really inconvenient in practice to //wait// on looking up the appearance ID in order to start loading various queries. Species/color/pose is a more intuitive key, and works better and faster when the canonical appearance is what you want!)
2020-08-28 22:58:59 -07:00
7954c11c74 update support to use petStateId -> id 2020-08-28 21:06:33 -07:00
10a6eff299 WIP pose picker support 2020-08-28 21:06:33 -07:00
5334801aba add zone restrict hack tools
similar to the layer zoning tools I just rolled out!

not thrilled about the outfit state hacks here bc of how we cache restrict on the appearance rather than the item, but oh well! this escape hatch is pretty easy and solid, and it's a cleanup for another day

Also did a code split here, now that this file is getting larger, to only load this for support users. I don't actually care about restricting console stuff to support users (I'd honestly rather not), but saving the bytes is worth it I think, since support mode is pretty easy to enter when we need to
2020-08-28 00:12:41 -07:00
17fa9d06b9 add id to ItemAppearance (+ refactor)
This is in support of a caching issue in a hack tool coming next! Without this, the change to ItemAppearance restricted zones would make other ItemAppearance fields go missing (bc our hack tool didn't also specify them), so the query would re-execute over the network to find the missing fields we overwrote with nothingness—which would undo the local hack change.
2020-08-28 00:10:00 -07:00
a58db2dcd1 add restricted zones to item support UI
Honestly kinda embarrased I forgot this!
2020-08-27 23:09:53 -07:00
4a6a48ccd1 fix typos in item/layer support tools
Oops, I goofed up a fix to "Item ID" and "DTI ID" one time, and was labeling layer IDs as item IDs! Fixed!
2020-08-27 22:33:32 -07:00
136df9d2a2 add DTIHackLayerZone fn to console
A dev tool to preview what an item would look like in a different zone!

To use, open the browser console, and type `DTIHackLayerZone(layerId, zoneIdOrName)`, but replace `layerId` with the layer's DTI ID, and `zoneIdOrName` with either the zone ID or its name in quotes.
2020-08-27 22:32:28 -07:00
b3aa82cc66 enable Apollo dev tools in production
I'm doing this to see if I can give Chips a cute way to hack into local data :p
2020-08-27 21:44:54 -07:00
59ffc86481 update PetAppearance id to match petStateId
Previously, we were using a custom-y `id` field to help Apollo cross-reference `petAppearance` queries with the results from bulk `petAppearances` queries. Now, instead, we deprecate `petStateId`, and start using `id` to have the same stable value!

This is in anticipation of pet appearance support tools: a stable ID will make it easier to edit them, esp changing their pose (which would otherwise have changed the ID!)
2020-08-27 21:32:22 -07:00
bf21716db0 simplify PetAppearance client-side caching
Previously, we would load all `petAppearances` in `PosePicker`, and use cache keys to instantly find it again as a single `petAppearance` in `OutfitPreview` after switching poses.

In this change, we instead have `PosePicker` explicitly load all 6 poses as separate `petAppearance` queries. This simplifies cache sharing between the two components' queries: Apollo can do it automatically, because they were queried the same way in the first place.

I'm doing this in preparation for changing the `id` field of `PetAppearance`, to become `petStateId`. This will help me build pet appearance support tools, by giving the appearances stable identifiers that won't be affected by editing which pose an appearance is!
2020-08-27 21:26:24 -07:00
3f2b4df8f3 remove stray unused outfitState prop
right, we get this value from context now; that's why this STOPSHIP was here but not actually breaking anything!
2020-08-20 21:46:32 -07:00
6821c2b734 Support tool: Remove layer from item
Heck yeah, let's clean these fuckers up!
2020-08-20 21:40:05 -07:00
c94e94538e remove stray console.log 2020-08-19 19:12:56 -07:00
700073df8a fix bug where image load errors would keep loading
Dice reported this, thank you!

My mistake here was that `loadImage` _does_ reject when the image fails to load… but it ends up throwing `undefined`, since I forgot to pass the error along from `onerror` to `reject`!

So we would cancel stuff, but then store `undefined` as our error in state, which our component interprets as no-error.

I tested this by using Firefox DevTools request blocking!
2020-08-19 19:11:49 -07:00
f8e625afd2 hide invalid colors in wardrobe page dropdown
On the homepage, I want to keep the ability to enter invalid species/color pairs, so that you can say "Alien, Aisha" instead of having to pick the Aisha first.

But on the wardrobe page, we were rejecting invalid state changes anyway, so I decided to remove invalid color options from the list. And I added an ability to still switch to any species, and potentially resetting to a basic color automatically to match.
2020-08-19 19:05:44 -07:00
81065fda6a fix bug where search error states are hidden
Oops, our loading state logic was eating the error case! I'm not sure exactly where the gap was happening, but I've rewritten the states to be a bit more foolproof, since that first condition was confusing I think.
2020-08-19 18:11:40 -07:00
f6c228b17e lol fix cached zone names
Ahaha I fucked up a bit! I was indexing into the array of cached zones, instead of looking up by ID. This meant that all zone names were wrong, and some search results weren't loading bc there was no zone data!

I made a fix here, and also added some fallback values, so that if there's an issue in the future we can at least fall back more gracefully than the infinite-spinner case we had here.
2020-08-19 18:01:20 -07:00
47d22ad25c Build cached zones, stop querying on server
In this change, we cache the zones table as part of the JS build process. This keeps the database as our source of truth, while aggressively caching the data at deploy time.

See the new README for some rationale!

I tested this by pulling up dev Honeycomb, and observing that we no longer run db queries to `zones` in the new traces for the wardrobe page. (It's a good thing we did it this way, because I noticed some code in the server that was still loading the zone anyway, and fixed it here!)
2020-08-19 17:50:05 -07:00
362093dfa2 rename item "DTI ID" to "Item ID"
I realized that DTI ID is a bit misleading in this case, where the ID is both ours and Neopets's, if I recall!
2020-08-14 22:11:04 -07:00
aa6ce12bbe add Neopets ID to layer support modal 2020-08-14 22:09:52 -07:00
b23f64ad53 show DTI ID in item support drawer
helps make looking stuff up easier!
2020-08-14 22:01:04 -07:00
a2f5dcd498 use real query for item support pet compatibility rule
mutation isn't hooked up yet though! it exists but the sever doesn't recognize it
2020-08-14 21:52:02 -07:00
3e012ec2c0 Draft UI for pet compatibility rule fields
not wired up to a mutation yet, but it looks pretty!
2020-08-14 21:05:28 -07:00
7a58546700 bug fix for light/dark mode toggle
this will keep it always in the corner of the screen, instead of weirdness when the container is not very tall
2020-08-14 18:21:40 -07:00
500068b41b improve a11y for dark/light mode button
add an aria-label, and move it to a better tab position at the end of the page, to match the visual placement
2020-08-12 10:59:27 -07:00
2aa4d2b2c0 add "more colorful" swf conflict mode
An even better resolution mode for "Dyeworks Pink: Peaceful Tree Garland", which doesn't leave any big chunks or holes, and instead takes all the leaves and gives them chunky outlines 😅
2020-08-12 10:53:35 -07:00
927e26385c make light/dark mode transition smoother 2020-08-12 01:46:27 -07:00
0f97693500 add conflict resolution mode for SWF screenshots
The "Dyeworks Pink: Peaceful Tree Garland" was a tricky case, with animated falling leaves…

we decided that having transparency in the main pet area, and some incorrect transparent holes in the trees, was a better conflict resolution for this one

Probably would be good to manually upload a Totally Good version, but like, this flag is probably good to have
2020-08-12 01:32:25 -07:00
71e1112b63 fix bad dark mode color in item support drawer 2020-08-12 00:43:26 -07:00
086cf8b335 dark mode first draft!
Hey wow this was not so hard, just set some global styles, removed some hardcoded colors, and walked through the remaining hardcoded colors to pick a dark mode variant :) neat!!
2020-08-12 00:37:31 -07:00
12bd9f6b17 fix PosePicker style bug
oops another thing I missed in the refactor! I wasn't providing the selected pose to the hook, so it wasn't styling any of the poses as selected. Now it does again!
2020-08-12 00:35:11 -07:00
ca92af0cf3 fix bug in pose picker a11y labels
Oops, I removed some fields from the pose object, so the aria-label for the options were coming out as "undefined and undefined"!

Now they come out correct!
2020-08-12 00:32:10 -07:00
edce0a9a76 add 1px of padding around Flash preview area
I tried to get the alignment juuust right in Chrome and Firefox, but Dice's computer was still including a 1px sliver of border.

In this change, I'm adding 1px of extra padding between the border and the Flash area. I figure that, if the screenshots are incorrectly aligned by 1px, that's no big deal and I'm okay accepting that slightly-incorrect upload rather than having folks not be able to use the tool!
2020-08-11 22:52:40 -07:00
07f182a78e minor SWF uploader fixes
fixed some warnings, and added window resize as an event trigger for updating the red/green border color
2020-08-11 22:46:14 -07:00
b520d1095c show new PNG in the app ~immediately
I had a hard time getting this to work the ideal way, but this way is Good Enough! a few seconds delay, oh well
2020-08-05 14:00:53 -07:00
1a9b495558 add detection for whether the entire SWF is visible 2020-08-05 13:25:20 -07:00
10be4c4ea1 use asset proxy for SWF upload tool
Oops, I forgot that in prod the HTTPS wouldn't be happy about loading SWFs over HTTP! Use the asset proxy instead.
2020-08-05 13:08:18 -07:00
d283884781 show % match, not warnings, in SWF upload tool
I think this will be much clearer about whether the warnings are a good or bad amount!
2020-08-05 13:05:17 -07:00
cc61d33d58 oops, fix bad comment to work around compiler bug
This happened in an earlier change too, I forget where, but there's some compiler bug that causes comments placed in this kind of spot to yield this error in production, but not in dev:
https://reactjs.org/docs/error-decoder.html/?invariant=152&args

Oh well, moved the comment!
2020-08-05 01:23:26 -07:00
90b4fc8da4 click to toggle outfit controls on mobile
On mobile, it was pretty annoying that you had to show the controls by tapping the preview area to simulate a hover—because it could also click the underlying elements, and do bad stuff!

Here, I add a click capture to prevent the clicks from going down if the controls aren't visible. And I add a toggle, so that you can dismiss the controls, like how YouTube feels :)
2020-08-05 01:06:05 -07:00
1efc1c0d42 fix item remove button in item search
Huh, weird how we seem to need preventDefault for buttons, but stopPropagation for links? idk, in any case, the Remove button was doing that thing where it clicks Remove but also bubbles up to the container and clicks it too :p
2020-08-05 00:33:14 -07:00
8c653ce879 memoize Item, clicks on mobile are fast now!
This was a surprisingly big win! Item is heavier than it looks, because it has like 6 Chakra components, which aren't expensive but aren't _cheap_ in a re-rendered list that needs to be fast, you know?

And it's even more important on search, where there's a lot of items on the page. (we should virtualize it too but that's a thing for another day)
2020-08-05 00:25:25 -07:00