Skip to content

Conversation

@sparhami
Copy link

@sparhami sparhami commented Sep 6, 2019

Implements amp-stream-gallery, which is a carousel for showing multiple items at once. This is useful for things like related products and articles.

This differs from amp-base-carousel in the following ways:

  1. Provides an API for specifying the min/max width per item. This determines how many items are visible at once based on the constraints and changes with the screen size.
  2. Provides an API to configure the min/max visible slides at one time.
  3. Allows configuration of inset/outset arrows.
  4. Has different default styling for inset/outset arrows from amp-base-carousel.
  5. Does not snap on slides by default.
  6. Does not support automatic advancing of slides.

Fixes:

  • Fix check for overlapping slide sometimes missing one slide (fix < to
    <=).
  • Pause layout internal to carousel implementation, rather than just
    pausing auto advance.

For #20595

- Fix check for overlapping slide sometimes missing one slide (fix < to
<=).
- Pause layout internal to carousel implementation, rather than just
pausing autoadvance.
Sepand Parhami added 5 commits September 6, 2019 16:17
- Fix bug with max-item-width
- Fix inset custom arrows width collapsing to zero
- Fix bug where a scroll event inside carousel could be ignored if a
previous programmatic scroll of 0px was attempted.
- Rework the workaround for flickering slides on iOS to toggle the change
  queuing on scroll, which is more robust to when the intersection observer
  may fire.
@jridgewell jridgewell removed their request for review September 30, 2019 21:25
@sparhami sparhami requested a review from alanorozco September 30, 2019 23:04
@sparhami sparhami changed the title ✨[WIP] Implement amp-stream-gallery. ✨Implement amp-stream-gallery. Sep 30, 2019
@sparhami sparhami removed the request for review from aghassemi September 30, 2019 23:05
@sparhami sparhami marked this pull request as ready for review September 30, 2019 23:06

// No scroll will happen, ,ake sure the `ignoreNextScroll_` flag is not
// set.
if (scrollPos == pos) {
Copy link
Contributor

Choose a reason for hiding this comment

The reason will be displayed to describe this comment to others. Learn more.

It was my understanding that === is generally preferred over ==, but I'm not certain if that's an intentionally rejected practice in this repo for performance or other reasons.

Copy link
Author

Choose a reason for hiding this comment

The reason will be displayed to describe this comment to others. Learn more.

=== is better for performance, but I think the mixture comes from the fact that the Google JS style guide used to prefer == over === (except when you need to distinguish between null and undefined). It is now flipped, to prefer ===. I'll update the checks here to reflext that.

Most of the open source ecosystem prefers ===, only using == when necessary.

Copy link
Contributor

Choose a reason for hiding this comment

The reason will be displayed to describe this comment to others. Learn more.

SGTM

Sepand Parhami added 2 commits October 1, 2019 13:01
- Change equality checks to use `===`
- Fix typo
Copy link
Member

@danielrozenberg danielrozenberg left a comment

Choose a reason for hiding this comment

The reason will be displayed to describe this comment to others. Learn more.

Approval for dep-check-config.js

- Refactor amp-base-carousel to more closely match amp-stream-gallery's
code patterns.
- Track the current offset in the slide as a percentage rather than a
pixel offset, which will restore scroll position more accurately when
resizing.
- Use intersection observer for visibility tracking of child slides for
amp-base-carousel.
- Fix a couple of edge cases (`<=` vs `<`).
@sparhami sparhami requested review from wassgha and removed request for aghassemi and alanorozco December 17, 2019 18:47
Copy link
Contributor

@wassgha wassgha left a comment

Choose a reason for hiding this comment

The reason will be displayed to describe this comment to others. Learn more.

LGTM, will send follow up PRs

@alanorozco
Copy link
Member

This cannot be updated without CLA issues, so I'll close in favor of #26710

@alanorozco alanorozco closed this Feb 10, 2020
Sign up for free to join this conversation on GitHub. Already have an account? Sign in to comment

Labels

Projects

None yet

Development

Successfully merging this pull request may close these issues.

6 participants