Intent to implement: Player embed by nexxPLAY

[neko-fire]

The goal is to implement a simple media player element to allow embedding of media formats such as video and audio from nexxPLAY.

it would look like this:

    <amp-nexxtv-player
        data-videoid="872E97169LE9JLU"
        data-client="484"
        data-streamtype="video"
        data-autoplay="0"
        data-delay="20"
        data-mode="static"
    ></amp-nexxtv-player>

You can read more detailed information about nexxPLAY on our website http://www.nexx.tv/

fork
https://github.com/nexxtv/amphtml/tree/nexxtv-player

branch: nexxtv-player

[aghassemi]

@neko-fire Great! Looking forward to seeing the PR for this.

Couple of questions and notes:
1- What other values are supported by data-streamtype and data-mode?
2- Do you have a postMesssage API for the player than can be used to implement the video-interface?

The video-interface is a common API that AMP expects all video players to implement (not all do at the moment however). This allows AMP to treat all video players the same and to use it to provide common UX across players such as autoplay, dockable videos, managing playback across players, etc... The interface is fairly straighforward: common methods and events such as play, pause, muted, etc..

Therefore I recommend:
1- amp-nexxtv-player to implement the video-interface. Please look at amp-youtube.js for a reference implementation which uses postMessage to do the communication between the AMP component and the iframed video player to implement the interface. amp-ooyala-player is another player that also implements the interface.
2- Do not expose data-autoplay, AMP will manage autoplay for you (exposed as just autoplay attribute) if you implement the video-interface. This will ensure consistent autoplay UX across video players. (Here is demo of how AMP handles autoplay)
3- Is data-delay attribute for autoplay? If so, AMP-managed autoplay does not have that feature. Please find a GitHub feature request so we can add that for all video players that support autoplay.

[aghassemi]

/cc @rudygalfi @ericlindley-g

[neko-fire]

Hi @aghassemi,

Thank you for your feedback! Here are the answers to your questions:

1. These streamtypes are possible fordata-streamtype
   -> video, audio, playlists, playlist-masked (playlist without possibility to skip or choose video), live, album (audio playlist)
2. The parameter data-mode can have mode static or api. Static mode has lesser player functions, is faster and works without using our API.
3. The autoplay attribute is removed
4. data-delay is the starting point of a media (e.g. start video on 1:30min). I'll rename it.

I've seen the Video Interface, but currently we do not support postMessage API in our player.
I'll list all information in the readme of the extension.

[aghassemi]

Thanks for the responses @neko-fire.

1. Sounds good.
2. Considering page authors can not write custom JavaScript in AMP, is there any reason to ever use data-mode=api? If not, I suggest not exposing this attribute and making static an unchangable default.
3. Sounds good.
4. How about data-seek-to=<second> ?
5. Regarding video-interface. We like to push for amp-nexxtv-player to implement this interface. Would you please consider also pushing for this internally? My apologies for pushing for this, but I believe at the end of the day all parties will benefit from it. Users will have a better video experience as they increasingly expect autoplaying videos with good and uniform UX on mobile and features like picture-in-picture that AMP will provide for free using the API. Publisher will benefit from the extra features amp-nexxtv-player will provide them to satisfy their users and hopefully nexxtv will see increased adoption/watch-time based on important differentiators like mobile autoplay of videos and picture-in-picture support.

[neko-fire]

Hi @aghassemi

Thanks for your feedback!

2. Unfortunately we can't. Clients can choose between modes, which refer to different monetizing models for us and our client. It's very important for us.
3. From our side, postMessage API for our player is still in development. We just decided to implement it alongside with AMP.

There is an additional attribute called data-origin. The embed url for media can vary by client. I hope thats alright.

[aghassemi]

@neko-fire Sounds good. Thanks so much for your commitment to do the postMessage API! Please proceed with a PR, looking forward to it.

[neko-fire]

Hi @aghassemi ,

is there a way to test sending postMessages from AMP -> Player? I could'nt find any ressource or guide line of how to test it properly.
You can also have a look at the first draft here https://github.com/nexxtv/amphtml/blob/nexxtv-player/extensions/amp-nexxtv-player/0.1/amp-nexxtv-player.js

[aghassemi]

@neko-fire We have an integration test suite for the players that implement the video-interface. Just adding your player to that suite will test your code end-to-end, making sure postMessages go through and events propagate back, etc..

I recommend manually testing your implementation first with the autoplay attribute and fixing the bugs then you can easily add it to the integration test suite by adding a few lines to video-players.html and test-video-players.js

for the draft https://github.com/nexxtv/amphtml/blob/nexxtv-player/extensions/amp-nexxtv-player/0.1/amp-nexxtv-player.js implementation of the methods looks good, but not the events. You need to
1- Trigger VideoEvents.LOAD when the playerReadyPromise_ resolves.
2- Have the iframe send postMessages back to the component when events such as pause, play, mute, unmute happen in the player and dispatch them on the component (e.g. If user taps the Play action in your player, your component needs to dispatch the VideoEvents.PLAY event )

[neko-fire]

@aghassemi Thanks a lot!