Skip to content
New issue

Have a question about this project? Sign up for a free GitHub account to open an issue and contact its maintainers and the community.

Sign up for GitHub

By clicking “Sign up for GitHub”, you agree to our terms of service and privacy statement. We’ll occasionally send you account related emails.

Already on GitHub? Sign in to your account

Jump to bottom

refactor: Update autoplay sample and how we report adsWillAutoplay an… #562

Merged
merged 9 commits into from
Mar 28, 2018
Merged

refactor: Update autoplay sample and how we report adsWillAutoplay an… #562

Show file tree
Hide file tree
Changes from all commits
Commits
Show all changes
9 commits
Select commit Hold shift + click to select a range
a1e1315
refactor: Update autoplay sample and how we report adsWillAutoplay an…
shawnbuso Mar 14, 2018
3e104fd
Update README to indicate that setAdWillPlayMuted is deprecated.
shawnbuso Mar 14, 2018
9e3efcd
Use getPlayerOptions() instead of vjsPlayer.options_ in controller ge…
shawnbuso Mar 14, 2018
7f06857
Add can-autoplay to release script for gh-pages.
shawnbuso Mar 14, 2018
9e1eca4
Move can-autoplay from devDependencies to dependencies. I feel like i…
shawnbuso Mar 15, 2018
c4ffd64
Fix lint errors.
shawnbuso Mar 15, 2018
cbcc314
Move accidental extra file.
shawnbuso Mar 23, 2018
66aca23
Merge master into autoplay.
shawnbuso Mar 27, 2018
af9bc2a
Fix example - check unmuted support first, then muted.
shawnbuso Mar 28, 2018
File filter

Filter by extension

Filter by extension
Conversations
Failed to load comments.
Jump to
Jump to file
Failed to load files.
Diff view
Diff view
3 changes: 3 additions & 0 deletions .eslintrc.js
View file
Open in desktop
Original file line number Diff line number Diff line change
Expand Up @@ -10,6 +10,9 @@ module.exports = {
'rules': {
'jsdoc/check-types': 'error',
'space-infix-ops': 'error',
'no-console': ['error', {
'allow': ['warn', 'error']
}],
},
'plugins': [
'jsdoc',
Expand Down
2 changes: 1 addition & 1 deletion README.md
View file
Open in desktop
Original file line number Diff line number Diff line change
Expand Up @@ -91,7 +91,7 @@ the previous snippet. A summary of all settings follows:
| adLabel | string | Replaces the "Advertisement" text in the ad label. Added for multilingual UI support. |
| adsRenderingSettings | object | JSON object with ads rendering settings as defined in the IMA SDK,Docs(1). |
| autoPlayAdBreaks | boolean | Whether or not to automatically play VMAP or ad rules ad breaks. Defaults,to true. |
| adWillPlayMuted | boolean | Notifies the SDK whether the player intends to start ad while muted. Changing this setting will have no impact on ad playback. Defaults,to false. |
| **deprecated** adWillPlayMuted | boolean | Notifies the SDK whether the player intends to start ad while muted. Changing this setting will have no impact on ad playback. Defaults,to false. |
Copy link

Choose a reason for hiding this comment

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

Not seeing this as being deprecated. Where do you see this as deprecated? https://developers.google.com/interactive-media-ads/docs/sdks/html5/v3/apis#ima.AdsRequest.setAdWillPlayMuted

Copy link
Contributor Author

@shawnbuso shawnbuso May 17, 2018 •
edited

Choose a reason for hiding this comment

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

This isn't deprecated by IMA, we're just deprecating the setting in the plugin because we added logic to detect it automatically. We don't need folks who implement the plugin to tell us if their ad will play muted or not - we can just check if it will within the plugin.

Copy link

Choose a reason for hiding this comment

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

That makes sense. FYI, the auto-detect wasn't working with our implementation, we got a message from Google saying that we weren't setting this when we should be.

| contribAdsSettings | object | Additional settings to be passed to the contrib-ads plugin(2), used by,this IMA plugin. |
| debug | boolean | True to load the debug version of the plugin, false to load the non-debug version.,Defaults to false. |
| disableFlashAds | boolean | True to disable Flash ads - Flash ads will be considered an unsupported ad type. Defaults to false. |
Expand Down
78 changes: 58 additions & 20 deletions examples/autoplay/ads.js
View file
Open in desktop
Original file line number Diff line number Diff line change
Expand Up @@ -14,24 +14,62 @@
* limitations under the License.
*/

var player = videojs('content_video');

var options = {
id: 'content_video',
adTagUrl: 'http://pubads.g.doubleclick.net/gampad/ads?sz=640x480&' +
'iu=/124319096/external/ad_rule_samples&ciu_szs=300x250&ad_rule=1&' +
'impl=s&gdfp_req=1&env=vp&output=xml_vmap1&unviewed_position_start=1&' +
'cust_params=sample_ar%3Dpremidpostpod%26deployment%3Dgmf-js&cmsid=496&' +
'vid=short_onecue&correlator='
};

player.ima(options);

// Remove controls from the player on iPad to stop native controls from stealing
// our click
var contentPlayer = document.getElementById('content_video_html5_api');
if ((navigator.userAgent.match(/iPad/i) ||
navigator.userAgent.match(/Android/i)) &&
contentPlayer.hasAttribute('controls')) {
contentPlayer.removeAttribute('controls');


var autoplayAllowed = false;
var autoplayRequiresMute = false;

function checkUnmutedAutoplaySupport() {
canAutoplay
.video({timeout: 100, muted: false})
.then(({result, error}) => {
if(result === false) {
// Unmuted autoplay is not allowed.
checkMutedAutoplaySupport();
} else {
// Unmuted autoplay is allowed.
autoplayAllowed = true;
autoplayRequiresMute = false;
initPlayer();
}
})
}

function checkMutedAutoplaySupport() {
canAutoplay
.video({timeout: 100, muted: true})
.then(({result, error}) => {
if(result === false) {
// Muted autoplay is not allowed.
autoplayAllowed = false;
autoplayRequiresMute = false;
} else {
// Muted autoplay is allowed.
autoplayAllowed = true;
autoplayRequiresMute = true;
}
initPlayer();
})
}

function initPlayer() {
var vjsOptions = {
autoplay: autoplayAllowed,
muted: autoplayRequiresMute,
debug: true
}
var player = videojs('content_video', vjsOptions);

var imaOptions = {
id: 'content_video',
adTagUrl: 'http://pubads.g.doubleclick.net/gampad/ads?sz=640x480&' +
'iu=/124319096/external/ad_rule_samples&ciu_szs=300x250&ad_rule=1&' +
'impl=s&gdfp_req=1&env=vp&output=xml_vmap1&unviewed_position_start=1&' +
'cust_params=sample_ar%3Dpremidpostpod%26deployment%3Dgmf-js' +
'&cmsid=496&vid=short_onecue&correlator='

};
player.ima(imaOptions);
}

checkUnmutedAutoplaySupport();
3 changes: 2 additions & 1 deletion examples/autoplay/index.html
View file
Open in desktop
Original file line number Diff line number Diff line change
Expand Up @@ -26,14 +26,15 @@
<body>
<video id="content_video" class="video-js vjs-default-skin"
poster = "../posters/bbb_poster.jpg" controls preload="auto" width="640"
height="360" autoplay muted playsinline>
height="360" playsinline>
<source src="//commondatastorage.googleapis.com/gtv-videos-bucket/sample/BigBuckBunny.mp4"
type="video/mp4" ></source>
</video>
<script src="//imasdk.googleapis.com/js/sdkloader/ima3.js"></script>
<script src="../../node_modules/video.js/dist/video.min.js"></script>
<script src="../../node_modules/videojs-contrib-ads/dist/videojs.ads.min.js"></script>
<script src="../../dist/videojs.ima.js"></script>
<script src="../../node_modules/can-autoplay/build/can-autoplay.min.js"></script>
<script src="ads.js"></script>
</body>
</html>