Skip to content

Commit

Permalink
Revert "Merge pull request ampproject#1909 from BrightcoveOS/amp-brig…
Browse files Browse the repository at this point in the history
…htcove-params"

This reverts commit 14ff6eb, reversing
changes made to db7e7cb.
  • Loading branch information
jridgewell committed Feb 11, 2016
1 parent b3c8fff commit e5ab3f5
Show file tree
Hide file tree
Showing 5 changed files with 21 additions and 69 deletions.
2 changes: 1 addition & 1 deletion ads/integration-guide.md
Original file line number Diff line number Diff line change
Expand Up @@ -51,7 +51,7 @@ A brightcove player can be invoked by the following:
<amp-brightcove
data-account="906043040001"
data-video-id="1401169490001"
data-player="180a5658-8be8-4f33-8eba-d562ab41b40c"
data-player-id="180a5658-8be8-4f33-8eba-d562ab41b40c"
layout="responsive" width="480" height="270">
</amp-brightcove>
```
Expand Down
2 changes: 1 addition & 1 deletion examples/brightcove.amp.html
Original file line number Diff line number Diff line change
Expand Up @@ -16,7 +16,7 @@ <h2>Brightcove Player</h2>
<amp-brightcove
data-account="906043040001"
data-video-id="1401169490001"
data-player="180a5658-8be8-4f33-8eba-d562ab41b40c"
data-player-id="180a5658-8be8-4f33-8eba-d562ab41b40c"
layout="responsive" width="480" height="270">
</amp-brightcove>

Expand Down
25 changes: 4 additions & 21 deletions extensions/amp-brightcove/0.1/amp-brightcove.js
Original file line number Diff line number Diff line change
Expand Up @@ -16,8 +16,7 @@

import {isLayoutSizeDefined} from '../../../src/layout';
import {loadPromise} from '../../../src/event-helper';
import {addParamsToUrl} from '../../../src/url';
import {dashToCamelCase} from '../../../src/string';


class AmpBrightcove extends AMP.BaseElement {

Expand All @@ -39,33 +38,17 @@ class AmpBrightcove extends AMP.BaseElement {
this.element.getAttribute('data-account'),
'The data-account attribute is required for <amp-brightcove> %s',
this.element);
const playerid = (this.element.getAttribute('data-player') ||
this.element.getAttribute('data-player-id') ||
'default');
const playerid = (this.element.getAttribute('data-player-id') || 'default');
const embed = (this.element.getAttribute('data-embed') || 'default');
const iframe = document.createElement('iframe');
let src = `https://players.brightcove.net/${encodeURIComponent(account)}/${encodeURIComponent(playerid)}_${encodeURIComponent(embed)}/index.html`;
const params = {};

let src = 'https://players.brightcove.net/' + encodeURIComponent(account) + '/' + encodeURIComponent(playerid) + '_' + encodeURIComponent(embed) + '/index.html';
if (this.element.getAttribute('data-playlist-id')) {
src += '?playlistId=';
src += this.encodeId_(this.element.getAttribute('data-playlist-id'));
} else if (this.element.getAttribute('data-video-id')) {
src += '?videoId=';
src += this.encodeId_(this.element.getAttribute('data-video-id'));
}

// Pass through data-param-* attributes as params for plugin use
for (let i = 0; i < this.element.attributes.length; i++) {
const attr = this.element.attributes[i];
const matches = attr.nodeName.match(/^data-param-(.+)/);
if (matches) {
const param = dashToCamelCase(matches[1]);
params[param] = attr.nodeValue;
}
}

src = addParamsToUrl(src, params);
iframe.setAttribute('frameborder', '0');
iframe.setAttribute('allowfullscreen', 'true');
iframe.src = src;
Expand All @@ -83,7 +66,7 @@ class AmpBrightcove extends AMP.BaseElement {
/* id is either a Brightcove-assigned id, or a customer-generated reference id.
reference ids are prefixed 'ref:' and the colon must be preserved unencoded */
if (id.substring(0,4) === 'ref:') {
return `ref:${encodeURIComponent(id.substring(4))}`;
return 'ref:' + encodeURIComponent(id.substring(4));
} else {
return encodeURIComponent(id);
}
Expand Down
34 changes: 8 additions & 26 deletions extensions/amp-brightcove/0.1/test/test-amp-brightcove.js
Original file line number Diff line number Diff line change
Expand Up @@ -17,20 +17,20 @@
import {createIframePromise} from '../../../../testing/iframe';
require('../amp-brightcove');
import {adopt} from '../../../../src/runtime';
import {parseUrl} from '../../../../src/url';

adopt(window);

describe('amp-brightcove', () => {

function getBrightcove(attributes, opt_responsive) {
function getBrightcove(accountId, videoId, opt_responsive) {
return createIframePromise().then(iframe => {
const bc = iframe.doc.createElement('amp-brightcove');
for (const key in attributes) {
bc.setAttribute(key, attributes[key]);
}
bc.setAttribute('data-account', accountId);
bc.setAttribute('width', '111');
bc.setAttribute('height', '222');
if (videoId) {
bc.setAttribute('data-video-id', videoId);
}
if (opt_responsive) {
bc.setAttribute('layout', 'responsive');
}
Expand All @@ -41,10 +41,7 @@ describe('amp-brightcove', () => {
}

it('renders', () => {
return getBrightcove({
'data-account': '906043040001',
'data-video-id': 'ref:ampdemo'
}).then(bc => {
return getBrightcove('906043040001','ref:ampdemo').then(bc => {
const iframe = bc.querySelector('iframe');
expect(iframe).to.not.be.null;
expect(iframe.tagName).to.equal('IFRAME');
Expand All @@ -56,30 +53,15 @@ describe('amp-brightcove', () => {
});

it('renders responsively', () => {
return getBrightcove({
'data-account': '906043040001',
'data-video-id': 'ref:ampdemo'
}, true).then(bc => {
return getBrightcove('906043040001', 'ref:ampdemo', true).then(bc => {
const iframe = bc.querySelector('iframe');
expect(iframe).to.not.be.null;
expect(iframe.className).to.match(/-amp-fill-content/);
});
});

it('requires data-account', () => {
return getBrightcove({}).should.eventually.be.rejectedWith(
return getBrightcove('').should.eventually.be.rejectedWith(
/The data-account attribute is required for/);
});

it('should pass data-param-* attributes to the iframe src', () => {
return getBrightcove({
'data-account': '906043040001',
'data-video-id': 'ref:ampdemo',
'data-param-my-param': 'hello world'
}).then(bc => {
const iframe = bc.querySelector('iframe');
const params = parseUrl(iframe.src).search.split('&');
expect(params).to.contain('myParam=hello%20world');
});
});
});
27 changes: 7 additions & 20 deletions extensions/amp-brightcove/amp-brightcove.md
Original file line number Diff line number Diff line change
Expand Up @@ -16,13 +16,13 @@ limitations under the License.

### <a name="amp-brightcove"></a> `amp-brightcove`

An `amp-brightcove` component displays the Brightcove Player as used in Brightcove's [Video Cloud](https://www.brightcove.com/en/online-video-platform) or [Perform](https://www.brightcove.com/en/perform) products.
An `amp-brightcove` component displays a Brightcove [Video Cloud](https://www.brightcove.com/en/online-video-platform) or [Perform](https://www.brightcove.com/en/perform) player.

Example:
```html
<amp-brightcove
data-account="12345"
data-player="default"
data-player-id="default"
data-embed="default"
data-video-id="1234"
layout="responsive"
Expand All @@ -36,13 +36,11 @@ The width and height will determine the aspect ratio of the player embed in resp

**data-account**

The Brightcove Video Cloud or Perform account id.
The Brightcove Video Cloud or Perform account id

**data-player** or **data-player-id**
**data-player-id**

The Brightcove player id. This is a GUID, shortid or "default". The default value is "default".

`data-player` is preferred. `data-player-id` is also supported for backwards-compatibility.
The Brightcove player id. This is a GUID or "default". The default value is "default".

**data-embed**

Expand All @@ -51,23 +49,12 @@ The Brightcove player id. This is a GUID or "default". The default value and mos
**data-video-id**

The Video Cloud video id. Most Video Cloud players will need this.

This is not used for Perform players by default; use it if you have added a plugin that expects a `videoId` param in the query string.
This is not used for Perform players.

**data-playlist-id**

The Video Cloud playlist id. For AMP HTML uses a video id will normally be used instead. If both a playlist and a video are specified, the playlist takes precedence.

This is not used for Perform players by default; use it if you have added a plugin that expects a `playlistId` param in the query string.

**data-param-***

All `data-param-*` attributes will be added as query parameter to the player iframe src. This may be used to pass custom values through to player plugins, such as ad parameters or video ids for Perform players.

Keys and values will be URI encoded. Keys will be camel cased.

- `data-param-language="de"` becomes `&language=de`
- `data-param-custom-ad-data="key:value;key2:value2"` becomes `&customAdData=key%3Avalue%3Bkey2%3Avalue2`
This is not used for Perform players.

#### Player configuration

Expand Down

0 comments on commit e5ab3f5

Please sign in to comment.