✨ [Prototype] Add video trailer support to amp img component

[setdream]

Hello, this is an attempt(prototype) to add support to play trailers when touchstart event happens on the amp-img component. Trailers are usually short videos that could represent a full video and you can much faster check if a full video is suitable for you. For example, you could see such behavior on youtube, when you hover over any videos in the videos list it starts to play.

If this implementation doesn't suitable please give instructions it will be very helpful. Thank you. /cc @erwinmombay /cc @jridgewell

[amp-owners-bot[bot]]

Hey @ampproject/wg-caching! These files were changed:

extensions/amp-video/validator-amp-video.protoascii

[setdream]

Should this have an AMP design review? Have we considered the tradeoffs of implementing this functionality as a primitive in AMP (as suggested here) vs. having document authors create this experience using existing primitives?

It feels like this could be achieved with either amp-script or the actions system with bind, then not require any changes to the AMP library.

@newmuis Thank you for your review! I think amp-script has some effect on Web Vitals and User Experience and in my case, I should wait to load and execute the script(at least wait request to amp-script component) And probably most important that amp-script have a lot of restrictions, and sometimes your code is a collection of tricks This is just a minimal example(prototype), I want to add at least support hover event for desktop browsers, setTimeot for waiting to play trailer, and some options(time to wait before play trailer) Another huge problem that comes up in the future is if you initially add an amp-video component it makes a request to load the first part of the media file, but it could be expensive for mobile users(especially if you have a list of links, that consist of amp-image and amp-video as trailer inside), that's why I think amp-video component should be created on the fly, maybe when you touchstart or hover, but amp-script restrict to create amp-video component on the fly

About amp-bind, one of a problem that I see... I think there is a touchend event, not touchstart(on=tap)

Another approach is to create the amp-trailer component which should have inside an amp-img, that could be more flexible

[newmuis]

If we're going to make changes to the AMP codebase to accommodate this, it should certainly go through a design review.

I would wonder whether the right way to accomplish this would be to have a single amp-video with a poster or placeholder, but modify amp-video to be able to toggle the placeholder based on mouse events.

[erwinmombay]

i do think this is an interesting feature. i think i would prefer the amp-bind approach first if that is at all feasible there, if its just a matter of adding new events for amp-bind then that composition i think is more desirable than a new mechanism on amp-img.

[stale[bot]]

This issue has been automatically marked as stale because it has not had recent activity. It will be closed in 7 days if no further activity occurs. Thank you for your contributions.