-
Notifications
You must be signed in to change notification settings - Fork 1.4k
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.
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
Support Media Session title in demo #689
Support Media Session title in demo #689
Conversation
demo/asset_section.js
Outdated
if (playPromise !== undefined) { | ||
// If video plays successfully, set media session title. | ||
playPromise.then(function() { | ||
navigator.mediaSession.metadata.title = asset.name; |
There was a problem hiding this comment.
Choose a reason for hiding this comment
The reason will be displayed to describe this comment to others. Learn more.
Would it make sense to have something like:
var playPromise = shakaDemo.video_.play();
if (playPromise !== undefined && 'mediaSession' in navigator) {
playPromise.then(function() {
navigator.mediaSession.metadata = new MediaMetadata({ title: asset.name });
});
}
There was a problem hiding this comment.
Choose a reason for hiding this comment
The reason will be displayed to describe this comment to others. Learn more.
I was thinking about future use of the play promise so that people don't have to refactor the Media Session part and could simply add their code when play promise is resolved. Does that make sense?
There was a problem hiding this comment.
Choose a reason for hiding this comment
The reason will be displayed to describe this comment to others. Learn more.
Should the play promise check be first then?
There was a problem hiding this comment.
Choose a reason for hiding this comment
The reason will be displayed to describe this comment to others. Learn more.
You're absolutely right. I've updated patch.
demo/asset_section.js
Outdated
// Reset the media session. | ||
navigator.mediaSession.metadata = new MediaMetadata(); | ||
if (playPromise !== undefined) { | ||
if (playPromise !== undefined) { |
There was a problem hiding this comment.
Choose a reason for hiding this comment
The reason will be displayed to describe this comment to others. Learn more.
Thanks for the PR! Small nit: we generally avoid using '===' operator in the project unless there's a good reason to have it instead of just '=='.
There was a problem hiding this comment.
Choose a reason for hiding this comment
The reason will be displayed to describe this comment to others. Learn more.
Done.
@ismena I've addressed your feedback. |
@beaufortfrancois Cool, let me run it through our test bot. |
Testing in progress... |
Failure:
|
This is a new API and our compiler doesn't know about the types involved. You will need to add an additional file to the You can also run |
I've added missing externs.js files in aa693a9 but it looks like tests are still failing for the play promise:
I'd appreciate some help there. |
externs/mediaelements.js
Outdated
/** | ||
* @override | ||
*/ | ||
HTMLMediaElement.prototype.play = function() {}; |
There was a problem hiding this comment.
Choose a reason for hiding this comment
The reason will be displayed to describe this comment to others. Learn more.
This file is not needed. This is already known by the compiler (the error is about duplicate definitions).
demo/asset_section.js
Outdated
// If video plays successfully, set media session title. | ||
playPromise.then(function() { | ||
navigator.mediaSession.metadata.title = asset.name; | ||
}); |
There was a problem hiding this comment.
Choose a reason for hiding this comment
The reason will be displayed to describe this comment to others. Learn more.
How about doing this after player.load()
resolves instead?
|
||
|
||
/** | ||
* @constructor |
There was a problem hiding this comment.
Choose a reason for hiding this comment
The reason will be displayed to describe this comment to others. Learn more.
Replace with:
/** @type {MediaMetadata} */
Navigator.prototype.mediaSession;
externs/mediasession.js
Outdated
*/ | ||
var MediaMetadata = function() {}; | ||
|
||
|
There was a problem hiding this comment.
Choose a reason for hiding this comment
The reason will be displayed to describe this comment to others. Learn more.
You'll need a line like:
/** @type {string} */
MediaMetadata.prototype.title;
externs/mediasession.js
Outdated
|
||
/** | ||
* @fileoverview Externs for MediaSession based on | ||
* {@link https://goo.gl/8QS094i Editor's Draft, 12 January 2017} |
There was a problem hiding this comment.
Choose a reason for hiding this comment
The reason will be displayed to describe this comment to others. Learn more.
Double check this URL, it doesn't work for me.
@TheModMaker Done! Thanks ;) |
Testing in progress... |
All tests passed! |
Thanks for the PR and thanks for introducing this to us. This will be helpful if we decide to add more UI elements to our demo app. |
Yeah! Please let me know when it's live @TheModMaker! |
It is already live on the nightly site: https://nightly-dot-shaka-player-demo.appspot.com/demo/. It will appear in the normal demo once we release v2.1. |
With the brand new Media Session API, we can now customize media notifications by providing metadata for the media the web app is playing. It also allows us to handle media related events such as seeking or track changing which may come from notifications or media keys.
So here's a first stab to support the Media Session in the shaka demo.
WDYT?