Skip to content
angular directives for media events
JavaScript HTML
Branch: master
Clone or download
Fetching latest commit…
Cannot retrieve the latest commit at this time.
Permalink
Type Name Latest commit message Commit time
Failed to load latest commit information.
dist
gulp
src
tests
.gitignore
.jshintrc
.npmignore
.travis.yml
CONTRIBUTING.md
README.md
bower.json
gulpfile.js
package.json
yarn.lock

README.md

Angular Media Events Build Status

This library should introduce angular directives that respond to events on media objects.

Sauce Test Status

Please note, the SauceLabs badge will show results for all tests run, not just master. If the build status is "passing" on the master branch, you can be sure that all these browser versions are passing.

**To Rollup from Webpack**

v2 will use rollup.js to do packaging instead of webpack. This is due to the fact that webpack is better suited for application building, and rollup is better suited for library/module building. Please let me know if it doesn't work in any way.

Supported Events

This list should grow as time goes on.

Setup

Installing

Bower

bower install angular-media-events --save

NPM

npm install angular-media-events --save

Including

<script src="/bower_components/angular-media-events/dist/media-events.js"></script>
// or
import angularMediaEvents from 'angular-media-events';

Using in Angular

// using script include
angular.module('myApp', ['media-events']);
angular.module('myApp', [window.angularMediaEvents]);

// or using import
angular.module('myApp', [angularMediaEvents]);

Events

loadedmetadata

  • available params (in template):
    • anything in the scope
    • $event (jqlite/jQuery Event object)
    • attrs
      • width
      • height
    • Note: some videos do not return these attributes. I believe this is due to how it is encoded/what codec is used
  <video ng-src="..." on-loaded-metadata="someFunction($event, attrs)" />

progress

  • available params (in template):
    • anything in the scope
    • $event (jqlite/jQuery Event object)
    • attrs
      • buffered
  <video ng-src="..." on-progress="someFunction($event, attrs)" />

play (on-play)

  • available params (in template):
    • anything in the scope
    • $event (jqlite/jQuery Event object)
  <video ng-src="..." on-play="someFunction($event)" />

pause (on-pause)

  • available params (in template):
    • anything in the scope
    • $event (jqlite/jQuery Event object)
  <video ng-src="..." on-pause="someFunction($event)" />

ended (on-ended)

  • available params (in template):
    • anything in the scope
    • $event (jqlite/jQuery Event object)
  <video ng-src="..." on-ended="someFunction($event)" />

Contributing

Please feel free to contribute. Checkout the guidelines. I'm pretty responsive, if I say so myself, so hit me up.

You can’t perform that action at this time.