Skip to content

Commit

Permalink
amp-rdu round 1 documentation update for amp-3q-player (#27915)
Browse files Browse the repository at this point in the history
* amp-rdu round 1 documentation update for amp-3q-player-doc

* fake commit

* reverted fake commit

* fixed frontmatter
  • Loading branch information
CrystalOnScript committed Apr 30, 2020
1 parent 79b4634 commit 9d47384
Showing 1 changed file with 34 additions and 25 deletions.
59 changes: 34 additions & 25 deletions extensions/amp-3q-player/amp-3q-player.md
Expand Up @@ -24,9 +24,16 @@ limitations under the License.

# amp-3q-player

## Example
Enables AMP to embed videos from 3Q SDN into your websites.

With the `responsive` layout, the width and height in this should yield correct layouts for 16:9 aspect ratio videos:
## Usage

The `amp-3q-player` component embeds videos from 3Q SDN onto an AMP page. The
component includes a video interface, and you can customize the `width` and
`height` of the player. Specify a `responsive` layout to maintain a 16:9 video
aspect ratio.

### Example

```html
<amp-3q-player
Expand All @@ -39,29 +46,31 @@ With the `responsive` layout, the width and height in this should yield correct

## Attributes

<table>
<tr>
<td width="40%"><strong><strong>Examples</strong></td>
<td>The sdnPlayoutId from 3Q SDN.</td>
</tr>
<tr>
<td width="40%"><strong>autoplay (optional)</strong></td>
<td ><p>If this attribute is present, and the browser supports autoplay:</p>
<ul>
<li>the video is automatically muted before autoplay starts</li>
<li>when the video is scrolled out of view, the video is paused</li>
<li>when the video is scrolled into view, the video resumes playback</li>
<li>when the user taps the video, the video is unmuted</li>
<li>if the user has interacted with the video (e.g., mutes/unmutes, pauses/resumes, etc.), and the video is scrolled in or out of view, the state of the video remains as how the user left it. For example, if the user pauses the video, then scrolls the video out of view and returns to the video, the video is still paused.</li>
</ul>
<p>for example <code>setModelRotation(x=0.5, xMin=0, xMax=3.14)</code> will change <code>x</code> component of rotation to <code>1.57</code>.</p></td>
</tr>
<tr>
<td width="40%"><strong><strong>common attributes</strong></td>
<td>This element includes <a href="https://amp.dev/documentation/guides-and-tutorials/learn/common_attributes">common attributes</a> extended to AMP components.</td>
</tr>
</table>
### data-id

The `data-id` attribute specifies the appropriate `sdnPlayoutId` from 3Q SDN.

### autoplay (optional)

If the `autoplay` attribute is present, and the browser supports autoplay, the
following behaviors are enabled:

- The video automatically mutes before autoplay starts.
- When the user scrolls the video out of view, the video pauses.
- When the user scrolls the video into view, the video resumes.
- The video unmutes when the user taps it.

If the user interacts with the video and then scrolls it into or out of view,
the state of the video remains the same. For example, if the user pauses the
video, scrolls the video out of view and then scrolls back up to it, the video
remains paused.

### Common attributes

The `amp-3q-player` component includes the [common attributes](https://amp.dev/documentation/guides-and-tutorials/learn/common_attributes)
that are extended to all AMP components.

## Validation

See [amp-3q-player rules](https://github.com/ampproject/amphtml/blob/master/extensions/amp-3q-player/validator-amp-3q-player.protoascii) in the AMP validator specification.
See [amp-3q-player rules](https://github.com/ampproject/amphtml/blob/master/extensions/amp-3q-player/validator-amp-3q-player.protoascii)
in the AMP validator specification.

0 comments on commit 9d47384

Please sign in to comment.