Summary: One can point to spesific image in a Mock set using {Mxx|yy} syntax
Test Plan: {F35373}
Reviewers: chad, epriestley
Reviewed By: epriestley
CC: aran, Korvin, AnhNhan
Maniphest Tasks: T2710
Differential Revision: https://secure.phabricator.com/D5322
Summary:
Ref 2700. No sexy animation yet, but allows you to swipe left and right to switch photos. Generally feels pretty good to me.
Also fixes a left/right but and a bug where taps could be interpreted as gestures and simplifies some touch code.
derpdog
Test Plan:
Swiped left and right in Pholio.
{F35239}
Reviewers: chad
Reviewed By: chad
CC: aran
Differential Revision: https://secure.phabricator.com/D5309
Summary: Pholio mocks are now embed in a fancy way
Test Plan: {F34804}
Reviewers: epriestley
Reviewed By: epriestley
CC: chad, aran, Korvin, AnhNhan
Maniphest Tasks: T2626
Differential Revision: https://secure.phabricator.com/D5249
Summary:
Ref T2644. This isn't perfect, but makes Pholio more-or-less usable on mobile. In particular:
- Inline comments drop below the image.
- Clicking the image lightboxes a full size version so you can scroll around it and inspect details.
- Clicking it again dismisses it.
Things that aren't good:
- Can't add inline comments. This seems complicated and not critical.
- Can't easily figure out which inline comments go where since there's no hover. Maybe let you tap them? Not sure if we really need this.
- Thumbs are between image and image data. I'm planning to get rid of the thumbs and do swipe left/right instead.
- It would be nice to scroll the lightbox to center on the part of the image you tapped. I just thought of this, though.
Test Plan:
{F34640}
{F34641}
{F34642}
Reviewers: chad
Reviewed By: chad
CC: aran
Maniphest Tasks: T2644
Differential Revision: https://secure.phabricator.com/D5232
Summary: I broke the code which shows which thumb is currently selected when I made the URLs fancy, by changing the container from `div` to `a`.
Test Plan: Verified current thumb is now highlighted.
Reviewers: chad
Reviewed By: chad
CC: aran
Differential Revision: https://secure.phabricator.com/D5231
Summary:
Some recent CSS change tweaked these out a bit. They were also sort of weird looking after fixing the double-draw thing:
- Make them work properly;
- make the implementation a bit simpler;
- make them clearer visually.
Also fix a bug where "border" and "fill" were accidentally reversed.
Test Plan:
{F34625}
(The highlight on the reticle is a little hard to pick out in the screenshot, but very obvious in practice.)
Reviewers: chad
Reviewed By: chad
CC: aran
Differential Revision: https://secure.phabricator.com/D5228
Summary: Fixes T2646. Title and description are placeholders. Styles on this are a bit rough.
Test Plan: {F34623}
Reviewers: chad
Reviewed By: chad
CC: aran
Maniphest Tasks: T2646
Differential Revision: https://secure.phabricator.com/D5226
Summary:
Fixes T2643. Show a loading state (currently just making the image transparent, but we could do something fancier) when an image is loading.
Fixes T2648. Cleans up the double draws we were previously doing.
Makes thumbnails react to mousedown in addition to click so they feel a little snappier. Make them stop reacting to control click, command click, etc.
Test Plan: Used `setTimeout()` to simulate a 1s image load delay, switched between images.
Reviewers: chad
Reviewed By: chad
CC: aran
Maniphest Tasks: T2643, T2648
Differential Revision: https://secure.phabricator.com/D5219
Summary: Fixes T2638; mark draft inlines in Pholio in a way similar to Differential.
Test Plan: {F34553}
Reviewers: chad
Reviewed By: chad
CC: aran
Maniphest Tasks: T2638
Differential Revision: https://secure.phabricator.com/D5217
Summary: Less janky sidebar, new 'photoshop-like' texture for image background.
Test Plan: Tested mocks with and without side comments, hover over marked squares. Tested small and large images.
Reviewers: epriestley
Reviewed By: epriestley
CC: aran, Korvin
Differential Revision: https://secure.phabricator.com/D5216
Summary: Tightened up spaces, made inline area more 'inset', tweaked colors to match timeline view.
Test Plan: Tested mocks with and without inline comments.
Reviewers: epriestley
Reviewed By: epriestley
CC: aran, Korvin
Differential Revision: https://secure.phabricator.com/D5188
Summary: Uses a dark description area and white text for pholio mocks. Also touches up the borders a little bit.
Test Plan: review pholio, files, and macros for visual changes intended or not.
Reviewers: epriestley
Reviewed By: epriestley
CC: aran, Korvin
Differential Revision: https://secure.phabricator.com/D5143
Summary:
Highlight thumb for image user is currently viewing.
Highlight selection when user mouseovers it's inline(on side).
Test Plan: {F33990}
Reviewers: epriestley
Reviewed By: epriestley
CC: aran, Korvin
Maniphest Tasks: T2446
Differential Revision: https://secure.phabricator.com/D5134
Summary:
Currently, if an image is too wide for the viewport, we freak out. Instead, scale it down.
This means we must also scale down all the rectangles on it, which is why this is tricky. However, all the draw/load separation has made it reasonably straightforward.
We'll possibly need to add some kind of "view full size" thing. I'm planning to add an element which shows "85%" or whatever if it's currently scaled.
Test Plan:
Before:
{F33607}
After:
{F33608}
Reviewers: chad, ljalonen
Reviewed By: chad
CC: aran
Differential Revision: https://secure.phabricator.com/D5088
Summary:
- Always show the column so there's no jumping around when comments are added.
- Set width to 320px so we can mobile it (not 100% sure how this will work yet).
- When there are too many comments, scroll them internally.
Test Plan: {F33552}
Reviewers: ljalonen, chad
Reviewed By: chad
CC: aran
Differential Revision: https://secure.phabricator.com/D5071
Summary:
- Use "preview" instead of "thumb" so we don't get a white background.
- Give this element a darker gutter to separate it a little bit visually.
- Put every thumb on a square hit target.
- Add some color/border/hover stuff.
- Ship down image dimensions.
- Reduce thumb size to 140 so we can fit 2-up on mobile when we get there.
Test Plan:
Before:
{F33545}
After:
{F33546}
Reviewers: chad, ljalonen
Reviewed By: ljalonen
CC: aran
Differential Revision: https://secure.phabricator.com/D5070
Summary: Show editor when user clicks edit button for inline comment.
Test Plan: Verified that editor is shown.
Reviewers: epriestley
CC: aran, Korvin
Maniphest Tasks: T2446
Differential Revision: https://secure.phabricator.com/D5030
Summary:
Show drafts for users that made them.
Show inline comments beside image, highlights them when user mouseovers selection.
Allow users that can view mock to add inline comment instead of only allowing users that can edit mock to add inline comment.
Test Plan:
Verified that inline comments are shown beside image. Verified that only drafts for current user are shown. Verified that inline comment is
highlithed when user mouseovers their selection.
Reviewers: epriestley
CC: aran, Korvin
Maniphest Tasks: T2446
Differential Revision: https://secure.phabricator.com/D4929
Summary:
The selection reticle in Pholio is functional but not very pretty right now. Make it look a little nicer.
- Using `box-sizing: border-box;` allows us to get rid of the `x - 1` and `y - 2` stuff.
- I draw the reticle with two elements: one mostly-transparent which creates a fill, and one fully opaque to create a strong dashed border.
Test Plan: {F31803}
Reviewers: ljalonen, chad
Reviewed By: chad
CC: aran, kchr
Differential Revision: https://secure.phabricator.com/D4836
Summary: Applied fixes for issues mentioned in D4737#1&2
Test Plan: Verified that scripts seem to work as intended.
Reviewers: epriestley
CC: aran, Korvin
Maniphest Tasks: T2446
Differential Revision: https://secure.phabricator.com/D4782
Summary: Pointer to show on pholio thumbnails
Test Plan: Pointer is shown
Reviewers: epriestley
Reviewed By: epriestley
CC: aran, Korvin
Differential Revision: https://secure.phabricator.com/D4720
Summary: Mock page now shows all images. Switching between images is done by clicking thumbnails.
Test Plan: Verified that all images are shown. Verified that by clicking thumbnail the image clicked will show.
Reviewers: epriestley
Reviewed By: epriestley
CC: aran, Korvin, AnhNhan
Maniphest Tasks: T2427
Differential Revision: https://secure.phabricator.com/D4698
Summary:
Pholio tile to show up on home page
First image is shown at mock page.
Test Plan: Pholio app shows up on home page. First image is shown at mock page.
Reviewers: epriestley
CC: aran, Korvin
Maniphest Tasks: T2356
Differential Revision: https://secure.phabricator.com/D4553
