Skip to content
New issue

Have a question about this project? Sign up for a free GitHub account to open an issue and contact its maintainers and the community.

Sign up for GitHub

By clicking “Sign up for GitHub”, you agree to our terms of service and privacy statement. We’ll occasionally send you account related emails.

Already on GitHub? Sign in to your account

Jump to bottom

🥡 Marketplace: Product::Photos #1428

Closed
4 of 6 tasks
Tracked by #1324
zspencer opened this issue May 3, 2023 · 2 comments
Closed
4 of 6 tasks
Tracked by #1324

🥡 Marketplace: Product::Photos #1428

zspencer opened this issue May 3, 2023 · 2 comments
Labels
✨ feature Reduces Client's Burden or Grants them Benefits 🥔 Satisfices It's good enough to use, but not particularly great

Comments

@zspencer
Copy link
Member

zspencer commented May 3, 2023 •
edited
Loading

Prerequisites

Use Cases

  • Seller uploads Product::Photo
    • Seller is informed of the aspect ratio and resolution of a good Product::Photo.
  • Shopper sees Product::Photo

Refactor

Bugs

  • 🐞 Product::Photo moves content on the page as the image loads
@zspencer zspencer mentioned this issue May 3, 2023
Closed
16 tasks
@zspencer zspencer changed the title Product::Photos Marketplace: Product::Photos May 3, 2023
This was referenced May 3, 2023
Closed
Closed
@zspencer zspencer changed the title Marketplace: Product::Photos 🌱 Marketplace: Product::Photos May 4, 2023
@zspencer zspencer changed the title 🌱 Marketplace: Product::Photos 🌱✨ Marketplace: Product::Photos May 4, 2023
@zspencer zspencer added this to the 1.0 - Andromeda milestone May 4, 2023
@anaulin anaulin mentioned this issue May 5, 2023
Merged
4 tasks
zspencer added a commit that referenced this issue May 6, 2023
@zspencer
✨ Marketplace: Show Product::Photo in Cart
7bac303 
- #1428
- #1326

A quick insertion of the photos into the cart view. We probably should
do a broader redesign pass on the `Cart` UI 🔜 but this seems decent
enough?
@zspencer zspencer mentioned this issue May 6, 2023
Merged
zspencer added a commit that referenced this issue May 6, 2023
@zspencer
✨ Marketplace: Show Product::Photo in Cart
92671e0 
- #1428
- #1326

A quick insertion of the photos into the cart view. We probably should
do a broader redesign pass on the `Cart` UI 🔜 but this seems decent
enough?
zspencer added a commit that referenced this issue May 6, 2023
@zspencer
🥔✨ Marketplace: Product::Photo is shown on Product form
593ceec 
- #1428

Nothin' toooo fancy here.
@zspencer zspencer mentioned this issue May 6, 2023
Merged
zspencer added a commit that referenced this issue May 6, 2023
@zspencer
🥗 Marketplace: Test Products#create with Product::Photo
2d0e187 
- #1428

Quick spec on create, probably should add one for `update` soon too
@zspencer zspencer mentioned this issue May 6, 2023
Merged
zspencer pushed a commit that referenced this issue May 6, 2023
@anaulin
🌸✨ Marketplace: Seller may add Photo to Product (#1441)
229034e 
- #1428
- #1430

Add basic support for Product photo upload, with space id in Active Storage filename.
zspencer added a commit that referenced this issue May 6, 2023
@zspencer
✨ Marketplace: Show Product::Photo in Cart
3497f69 
- #1428
- #1326

A quick insertion of the photos into the cart view. We probably should
do a broader redesign pass on the `Cart` UI 🔜 but this seems decent
enough?
zspencer added a commit that referenced this issue May 6, 2023
@zspencer
✨ Marketplace: Show Product::Photo in Cart
21f44cd 
- #1428
- #1326

A quick insertion of the photos into the cart view. We probably should
do a broader redesign pass on the `Cart` UI 🔜 but this seems decent
enough?
zspencer added a commit that referenced this issue May 6, 2023
@zspencer
🥔✨ Marketplace: Show Product::Photo on Product form (#1444)
3e66c05 
- #1428

Nothin' toooo fancy here.
zspencer added a commit that referenced this issue May 6, 2023
@zspencer
🥗 Marketplace: Test Products#create with Product::Photo
42bcffb 
- #1428

Quick spec on create, probably should add one for `update` soon too
zspencer added a commit that referenced this issue May 6, 2023
@zspencer
✨ Marketplace: Show Product::Photo in Cart
7606300 
- #1428
- #1326

A quick insertion of the photos into the cart view. We probably should
do a broader redesign pass on the `Cart` UI 🔜 but this seems decent
enough?
zspencer added a commit that referenced this issue May 6, 2023
@zspencer
🥗 Marketplace: Test Products#create with Product::Photo (#1445)
4c29127 
- #1428

Quick spec on create, probably should add one for `update` soon too
zspencer added a commit that referenced this issue May 6, 2023
@zspencer
✨ Marketplace: Show Product::Photo in Cart
90193ef 
- #1428
- #1326

A quick insertion of the photos into the cart view. We probably should
do a broader redesign pass on the `Cart` UI 🔜 but this seems decent
enough?
zspencer added a commit that referenced this issue May 6, 2023
@zspencer
🥔✨ Marketplace: Show Product::Photo in Cart (#1443)
7bed0fb 
✨ `Marketplace`: Show `Product::Photo` in `Cart`

- #1428
- #1326

A quick insertion of the photos into the cart view. We probably should
do a broader redesign pass on the `Cart` UI 🔜 but this seems decent
enough?
@anaulin anaulin mentioned this issue May 11, 2023
Merged
@zspencer zspencer changed the title 🌱✨ Marketplace: Product::Photos ✨ Marketplace: Product::Photos May 18, 2023
zspencer added a commit that referenced this issue May 23, 2023
@zspencer
Marketplace: Install libvips for testing Product::Photos
034b712 
- #1430
- #1428

- Pulled from https://github.com/libvips/ruby-vips/blob/master/.github/workflows/test.yml

I'm not particularly pleased with this, but I didn't find a github
action; and I'm not entirely sure why the test passes locally but not on
CI.
zspencer added a commit that referenced this issue May 23, 2023
@zspencer
Marketplace: Install libvips for testing Product::Photos
5e042c1 
- #1430
- #1428

- Pulled from https://github.com/libvips/ruby-vips/blob/master/.github/workflows/test.yml

I'm not particularly pleased with this, but I didn't find a github
action; and I'm not entirely sure why the test passes locally but not on
CI.
@zspencer zspencer mentioned this issue May 23, 2023
Merged
zspencer added a commit that referenced this issue May 24, 2023
@zspencer
Marketplace: Install libvips for testing Product::Photos
7e6667b 
- #1430
- #1428

- Pulled from https://github.com/libvips/ruby-vips/blob/master/.github/workflows/test.yml

I'm not particularly pleased with this, but I didn't find a github
action; and I'm not entirely sure why the test passes locally but not on
CI.
zspencer added a commit that referenced this issue May 24, 2023
@zspencer
Marketplace: Install libvips for testing Product::Photos
5c9dbbf 
- #1430
- #1428

- Pulled from https://github.com/libvips/ruby-vips/blob/master/.github/workflows/test.yml

I'm not particularly pleased with this, but I didn't find a github
action; and I'm not entirely sure why the test passes locally but not on
CI.
zspencer added a commit that referenced this issue May 25, 2023
@zspencer
Marketplace: Assert the CartProduct shows the Product::Photo (#…
1351a30 
…1494)

* `Marketplace`: Install `libvips` for testing `Product::Photo`s

- #1430
- #1428

- Pulled from https://github.com/libvips/ruby-vips/blob/master/.github/workflows/test.yml
@zspencer
Copy link
Member Author

One thing I noticed in testing is that when the photo loads in it does not have a set size; so the page will shuffle around a little bit.

zspencer added a commit that referenced this issue May 28, 2023
@zspencer
🌸 Marketplace: Product::Photos don't jump the page around
c0a78f7 
- #1326
- #1428

Depending on device bandwidth, even 150x150 `Product::Photo`s can
take a quarter to a half second to load.

When the photo does not have a set height; this results in the page
re-flowing as the photo loads in.

To Test:

- Add several `Products` with a `Product::Photo` to a `Marketplace`
- Throttle your network connection to 2g (Firefox DevTools can do this)
- Visit the `Marketplace`
  - Before: `Product`s would "bump" down the page as the photos load.
  - After: `Product`s stay in the same dang place, even as the photos load

Reference:
- https://css-tricks.com/preventing-content-reflow-from-lazy-loaded-images/
  (Note: While this talks about lazy-loaded images, the principal of
   "set the height and width of the image!" still applies)
@zspencer zspencer mentioned this issue May 28, 2023
Merged
@zspencer zspencer changed the title ✨ Marketplace: Product::Photos 🥔✨ Marketplace: Product::Photos May 28, 2023
@zspencer zspencer added ✨ feature Reduces Client's Burden or Grants them Benefits 🥔 Satisfices It's good enough to use, but not particularly great 🐞 bug Something isn't working labels May 28, 2023
zspencer added a commit that referenced this issue Jun 1, 2023
@zspencer
🌸 Marketplace: Product::Photos don't jump the page around
cdcd411 
- #1326
- #1428

Depending on device bandwidth, even 150x150 `Product::Photo`s can
take a quarter to a half second to load.

When the photo does not have a set height; this results in the page
re-flowing as the photo loads in.

To Test:

- Add several `Products` with a `Product::Photo` to a `Marketplace`
- Throttle your network connection to 2g (Firefox DevTools can do this)
- Visit the `Marketplace`
  - Before: `Product`s would "bump" down the page as the photos load.
  - After: `Product`s stay in the same dang place, even as the photos load

Reference:
- https://css-tricks.com/preventing-content-reflow-from-lazy-loaded-images/
  (Note: While this talks about lazy-loaded images, the principal of
   "set the height and width of the image!" still applies)
zspencer added a commit that referenced this issue Jun 1, 2023
@zspencer
🌸 Marketplace: Product::Photos don't reflow the page (#1517)
b64bf61 
- #1326
- #1428

Depending on device bandwidth, even 150x150 `Product::Photo`s can
take a quarter to a half second to load.

When the photo does not have a set height; this results in the page
re-flowing as the photo loads in.

To Test:

- Add several `Products` with a `Product::Photo` to a `Marketplace`
- Throttle your network connection to 2g (Firefox DevTools can do this)
- Visit the `Marketplace`
  - Before: `Product`s would "bump" down the page as the photos load.
  - After: `Product`s stay in the same dang place, even as the photos load

Reference:
- https://css-tricks.com/preventing-content-reflow-from-lazy-loaded-images/
  (Note: While this talks about lazy-loaded images, the principal of
   "set the height and width of the image!" still applies)
@zspencer zspencer removed the 🐞 bug Something isn't working label Jul 13, 2023
@zspencer zspencer removed this from the 1.0 - Andromeda milestone Jul 13, 2023
@zspencer zspencer mentioned this issue Jan 13, 2024
Merged
This was referenced Jan 21, 2024
Merged
Open
zspencer added a commit that referenced this issue Jan 25, 2024
@zspencer
🌸 Marketplace: Product#hero_image is always 16:9
79c1f51 
-  #1428

Apparently `resize_to_limit` can result in odd aspect ratios.

This ensures they are always the aspect ratio we want them to be.
This was referenced Jan 25, 2024
Merged
Closed
zspencer added a commit that referenced this issue Jan 29, 2024
@zspencer
🌸 Marketplace: Product#hero_image is always 16:9
197459f 
-  #1428

Apparently `resize_to_limit` can result in odd aspect ratios.

This ensures they are always the aspect ratio we want them to be.
@zspencer zspencer changed the title 🥔✨ Marketplace: Product::Photos 🥡 Marketplace: Product::Photos Feb 17, 2024
@rosschapman
Copy link
Contributor

🧹 Relegated to cold storage

Sign up for free to join this conversation on GitHub. Already have an account? Sign in to comment
Assignees
No one assigned
Labels
✨ feature Reduces Client's Burden or Grants them Benefits 🥔 Satisfices It's good enough to use, but not particularly great
Projects
None yet
Milestone
No milestone
Development

No branches or pull requests
2 participants
@rosschapman @zspencer