Shaka-player: How to add download option in the player?

[hanumantha03]

Have you read the FAQ and checked for duplicate open issues?:
Yes

What version of Shaka Player are you using?:
2.3

Can you reproduce the issue with our latest release version?:

Can you reproduce the issue with the latest code from master?:

Are you using the demo app or your own custom app?:
Yes

If custom app, can you reproduce the issue using our demo app?:

What browser and OS are you using?:
chrome
windows

What are the manifest and license server URIs?:

What did you do?
Want to add Download option in ahaka player. Please tell me how

What did you expect to happen?
Download the video

What actually happened?

[ismena]

Hi! Please take a look at our Offline Storage and Playback tutorial.

If you have any follow up questions, let us know, we'd be happy to continue the discussion!

[shabab11]

Hi with the help of above mentioned tutorial I am able to add download feature to my player. But
I am getting download button outside of the player I want the option on player screen like we have picture and caption option on video screen inside ... is it possible to get it done?

[hanumantha03]

I want to add download option next Captions option.

[ismena]

Ah, got it.
The UI(controls) you have on the screenshot is Chrome native controls. You're getting them cause you have specified "controls" on the video element. They are coming from the browser (if you open the same thing in another browser like Firefox or IE, the controls will look differently). We have no control over it.

We are, however, about to release a UI layer which will be able to take care of this for you. It doesn't have a download button yet, but it's on our roadmap.
Please join our announcement list to get updates on that.

[shaka-bot]

@hanumantha03 Does this answer all your questions? Can we close the issue?

[hanumantha03]

One last thing, if I want to change the UI for the shaka player myself, what are the files I should look for and change, so that I can have my own UI interface?

[ismena]

As I mentioned, we don't currently have a UI layer at all! If you'd like to write one, you can use https://github.com/google/shaka-player/blob/master/demo/common/controls.js as an example.

[joeyparrish]

The basic template for building a UI is:

1. Remove the controls attribute on the <video> tag or set video.controls = false in JavaScript. This disables the browser's native controls.
2. Overlay other HTML elements (buttons, etc) on top of the <video> tag using CSS.
3. When those buttons are clicked, your event handlers can use the <video> and Player APIs to control playback.

As @ismena mentioned, our current demo controls are implemented in demo/common/controls.js and controls.css, and you are welcome to use those for inspiration or as a starting point for your own.

Or, you can use our UI library. which will be released as a public beta very soon.

[hanumantha03]

Thank you very much @joeyparrish and @ismena . You can close this issue now.