ngCovervid.min.js

/**!
 * NgCoverVid
 * Make your HTML5 video behave like a background cover image with this lightweight Angular directive
 * @author  James Feigel <james.feigel@gmail.com>
 * @version 0.1.0
 */
angular.module("ngCovervid",[]).directive("covervid",["$window","$timeout",function(a,b){return{replace:!0,restrict:"EA",scope:{height:"@",width:"@"},template:"<video ng-transclude></video>",transclude:!0,link:function(c,d){function e(a,c){var d=null;return function(){var e=this,f=arguments;b.cancel(d),d=b(function(){a.apply(e,f)},c)}}function f(){var a=d.parent()[0].offsetHeight,b=d.parent()[0].offsetWidth,c=g,e=h,f=a/c,i=b/e;i>f?(d.css("height","auto"),d.css("width",b+"px")):(d.css("height",a+"px"),d.css("width","auto"))}var g=parseInt(c.height),h=parseInt(c.width);void 0!==c.height&&isNaN(g)&&console.error("Error: [covervid] 'height' provided is not a number. Found '"+c.height+"'. Using native height of video."),void 0!==c.width&&isNaN(h)&&console.error("Error: [covervid] 'width' provided is not a number. Found '"+c.width+"'. Using native width of video."),angular.element(a).bind("resize",function(){e(f(),50)}),d.css("position","absolute"),d.css("top","50%"),d.css("left","50%"),d.css("-webkit-transform","translate(-50%, -50%)"),d.css("-ms-transform","translate(-50%, -50%)"),d.css("transform","translate(-50%, -50%)"),d.parent().css("overflow","hidden"),isNaN(h)||isNaN(g)?d.bind("loadedmetadata",function(){h=d[0].videoWidth,g=d[0].videoHeight,f()}):f()}}}]);