2015
Lynda
Joseph Labrecque
1h 22m
English
HTML video doesn't require plugins for playback, but the default experience differs drastically across browsers. Using a combination of Bootstrap and AngularJS, you can develop a responsive video app that performs and appears great in all browsers—unifying the user experience and allowing custom functionality, such as playlists and full-screen playback. Join Joseph Labrecque for this start-to-finish course that guides you through every step in the process, from installing the software to employing a variety of foundational AngularJS directives. All you need to bring is the video and the time.
Topics include:
Setting up
Creating a video element
Making the video element responsive
Building controls
Setting up an AngularJS controller
Binding properties
Customizing the playback controls and time display
Enabling full-screen playback and playlist support
Using AngularJS directives and filters
Introduction
2m 13s
Welcome
1m 0s
What you should know before taking this course
28s
Using the exercise files
45s
1. Setting Up the Project
7m 40s
Acquiring Bootstrap, jQuery, and a dark theme
3m 4s
Acquiring AngularJS and Animate.css
2m 29s
Creating a working project in Brackets
2m 7s
2. HTML Video Playback
8m 58s
Creating a video element
2m 14s
Making it responsive
2m 7s
Building simple controls
1m 55s
Basic JavaScript interactions
2m 42s
3. AngularJS Integration
12m 24s
Initializing our AngularJS app
2m 42s
Setting up the AngularJS controller
3m 33s
Preparing our AngularJS app properties
3m 51s
Binding dynamic properties to our app
2m 18s
4. Playback Customization with AngularJS
37m 21s
Layout and display
4m 47s
Playback and mute controls
5m 1s
Time display
5m 31s
Formatting time and setting interval
4m 36s
Playback progress meters
5m 17s
Seeking the playback
3m 35s
Scrubbing the playback
5m 36s
Enabling Fullscreen
2m 58s
5. Advanced Features
13m 25s
Building a details panel
4m 19s
Playlist data formation
2m 30s
Rendering playlist selections
4m 7s
Animating player controls
2m 29s
Conclusion
23s
Next steps
23s
http://0s.o53xo.nr4w4zdbfzrw63i.cmle.ru/AngularJS-tutorials/Building-Custom-HTML5-Video-Playback-AngularJS/383036-2.ht
Download File Size:526.93 MB
|
