controls.min.js 7.5 KB

1
  1. "use strict";angular.module("com.2fdevs.videogular.plugins.controls",[]).directive("vgControls",["$timeout","VG_STATES",function(a){return{restrict:"E",require:"^videogular",transclude:!0,template:'<div id="controls-container" ng-mousemove="onMouseMove()" ng-class="animationClass" ng-transclude></div>',scope:{autoHide:"=vgAutohide",autoHideTime:"=vgAutohideTime"},link:function(b){function c(){b.animationClass="hide-animation"}function d(){b.animationClass="show-animation",a.cancel(e),b.autoHide&&(e=a(c,f))}var e,f=2e3;b.onMouseMove=function(){b.autoHide&&d()},void 0!=b.autoHide&&b.$watch("autoHide",function(c){c?b.animationClass="hide-animation":(b.animationClass="",a.cancel(e),d())}),void 0!=b.autoHideTime&&b.$watch("autoHideTime",function(a){f=a})}}}]).directive("vgPlayPauseButton",["VG_STATES",function(a){return{restrict:"E",require:"^videogular",template:"<button class='iconButton' ng-click='onClickPlayPause()' ng-class='playPauseIcon' aria-label='Play/Pause'></button>",link:function(b,c,d,e){function f(c){switch(c){case a.PLAY:b.playPauseIcon={pause:!0};break;case a.PAUSE:b.playPauseIcon={play:!0};break;case a.STOP:b.playPauseIcon={play:!0}}}b.onClickPlayPause=function(){e.playPause()},b.playPauseIcon={play:!0},b.$watch(function(){return e.currentState},function(a,b){a!=b&&f(a)})}}}]).directive("vgTimedisplay",[function(){return{require:"^videogular",restrict:"E",link:function(a,b,c,d){a.currentTime=d.currentTime,a.timeLeft=d.timeLeft,a.totalTime=d.totalTime,a.isLive=d.isLive,a.$watch(function(){return d.currentTime},function(b,c){b!=c&&(a.currentTime=b)}),a.$watch(function(){return d.timeLeft},function(b,c){b!=c&&(a.timeLeft=b)}),a.$watch(function(){return d.totalTime},function(b,c){b!=c&&(a.totalTime=b)}),a.$watch(function(){return d.isLive},function(b,c){b!=c&&(a.isLive=b)})}}}]).directive("vgScrubbar",["VG_STATES","VG_UTILS",function(a,b){return{restrict:"AE",require:"^videogular",transclude:!0,template:'<div role="slider" aria-valuemax="{{ariaTime(API.totalTime)}}" aria-valuenow="{{ariaTime(API.currentTime)}}" aria-valuemin="0" aria-label="Time scrub bar" tabindex="0" ng-transclude ng-keydown="onScrubBarKeyDown($event)"></div>',link:function(c,d,e,f){function g(a){var e,g=a.originalEvent||a,h=g.touches;s=b.isiOSDevice()?-1*(h[0].clientX-g.layerX):g.layerX,e=h[0].clientX+s-h[0].target.offsetLeft,p=!0,q&&(r=!0),f.pause(),n(e*f.mediaElement[0].duration/d[0].scrollWidth),c.$apply()}function h(a){a.originalEvent||a;r&&(r=!1,f.play()),p=!1,c.$apply()}function h(a){var b,e=a.originalEvent||a,g=e.touches;p&&(b=g[0].clientX+s-g[0].target.offsetLeft,n(b*f.mediaElement[0].duration/d[0].scrollWidth)),c.$apply()}function i(){p=!1,c.$apply()}function j(a){a=b.fixEventOffset(a),p=!0,q&&(r=!0),f.pause(),n(a.offsetX*f.mediaElement[0].duration/d[0].scrollWidth),c.$apply()}function k(a){a=b.fixEventOffset(a),r&&(r=!1,f.play()),p=!1,n(a.offsetX*f.mediaElement[0].duration/d[0].scrollWidth),c.$apply()}function l(a){p&&(a=b.fixEventOffset(a),n(a.offsetX*f.mediaElement[0].duration/d[0].scrollWidth)),c.$apply()}function m(){p=!1,c.$apply()}function n(a){f.seekTime(a,!1)}function o(b){if(!p)switch(b){case a.PLAY:q=!0;break;case a.PAUSE:q=!1;break;case a.STOP:q=!1}}var p=!1,q=!1,r=!1,s=0,t=37,u=39,v=5;c.API=f,c.ariaTime=function(a){return 0===a?"0":Math.round(a.getTime()/1e3)},c.onScrubBarKeyDown=function(a){var b=f.currentTime.getTime()-6e4*f.totalTime.getTimezoneOffset(),c=f.totalTime.getTime()-6e4*f.totalTime.getTimezoneOffset(),d=b/c*100;a.which===t||a.keyCode===t?(f.seekTime(d-v,!0),a.preventDefault()):(a.which===u||a.keyCode===u)&&(f.seekTime(d+v,!0),a.preventDefault())},c.$watch(function(){return f.currentState},function(a,b){a!=b&&o(a)}),b.isMobileDevice()?(d.bind("touchstart",g),d.bind("touchend",onScrubBarTouchEnd),d.bind("touchmove",h),d.bind("touchleave",i)):(d.bind("mousedown",j),d.bind("mouseup",k),d.bind("mousemove",l),d.bind("mouseleave",m))}}}]).directive("vgScrubbarcurrenttime",[function(){return{restrict:"E",require:"^videogular",link:function(a,b,c,d){function e(a){if(a&&d.totalTime){var c=a.getTime()-6e4*d.totalTime.getTimezoneOffset(),e=d.totalTime.getTime()-6e4*d.totalTime.getTimezoneOffset();g=-1*c/1e3*100/(-1*e/1e3),b.css("width",g+"%")}}function f(){g=0,b.css("width",g+"%")}var g=0;a.$watch(function(){return d.currentTime},function(a){e(a)}),a.$watch(function(){return d.isCompleted},function(a){f(a)})}}}]).directive("vgVolume",["VG_UTILS",function(a){return{restrict:"E",link:function(b,c){function d(){b.volumeVisibility="visible",b.$apply()}function e(){b.volumeVisibility="hidden",b.$apply()}a.isMobileDevice()?c.css("display","none"):(b.volumeVisibility="hidden",c.bind("mouseover",d),c.bind("mouseleave",e))}}}]).directive("vgVolumebar",["VG_UTILS",function(a){return{restrict:"E",require:"^videogular",template:"<div class='verticalVolumeBar'><div class='volumeBackground' ng-click='onClickVolume($event)' ng-mousedown='onMouseDownVolume()' ng-mouseup='onMouseUpVolume()' ng-mousemove='onMouseMoveVolume($event)' ng-mouseleave='onMouseLeaveVolume()'><div class='volumeValue'></div><div class='volumeClickArea'></div></div></div>",link:function(b,c,d,e){function f(a){a=100*a,j.css("height",a+"%"),j.css("top",100-a+"%")}function g(a){c.css("visibility",a)}var h=!1,i=angular.element(c[0].getElementsByClassName("volumeBackground")),j=angular.element(c[0].getElementsByClassName("volumeValue"));b.onClickVolume=function(b){b=a.fixEventOffset(b);var c=parseInt(i.prop("offsetHeight")),d=100*b.offsetY/c,f=1-d/100;e.setVolume(f)},b.onMouseDownVolume=function(){h=!0},b.onMouseUpVolume=function(){h=!1},b.onMouseLeaveVolume=function(){h=!1},b.onMouseMoveVolume=function(b){if(h){b=a.fixEventOffset(b);var c=parseInt(i.prop("offsetHeight")),d=100*b.offsetY/c,f=1-d/100;e.setVolume(f)}},c.css("visibility",b.volumeVisibility),b.$watch("volumeVisibility",g),b.$watch(function(){return e.volume},function(a,b){a!=b&&f(a)})}}}]).directive("vgMutebutton",[function(){return{restrict:"E",require:"^videogular",template:"<button class='iconButton' ng-class='muteIcon' ng-click='onClickMute()' ng-focus='onMuteButtonFocus()' ng-blur='onMuteButtonLoseFocus()' ng-keydown='onMuteButtonKeyDown($event)' aria-label='Mute'></button>",link:function(a,b,c,d){function e(b){a.currentVolume=b,f?b>0&&(a.defaultVolume=b):a.defaultVolume=b;var c=Math.round(100*b);0==c?a.muteIcon={mute:!0}:c>0&&25>c?a.muteIcon={level0:!0}:c>=25&&50>c?a.muteIcon={level1:!0}:c>=50&&75>c?a.muteIcon={level2:!0}:c>=75&&(a.muteIcon={level3:!0})}var f=!1,g=38,h=40,i=.05;a.onClickMute=function(){f?a.currentVolume=a.defaultVolume:(a.currentVolume=0,a.muteIcon={mute:!0}),f=!f,d.setVolume(a.currentVolume)},a.onMuteButtonFocus=function(){a.volumeVisibility="visible"},a.onMuteButtonLoseFocus=function(){a.volumeVisibility="hidden"},a.onMuteButtonKeyDown=function(a){var b,c=null!=d.volume?d.volume:1;a.which===g||a.keyCode===g?(b=c+i,b>1&&(b=1),d.setVolume(b),a.preventDefault()):(a.which===h||a.keyCode===h)&&(b=c-i,0>b&&(b=0),d.setVolume(b),a.preventDefault())},a.defaultVolume=1,a.currentVolume=a.defaultVolume,a.muteIcon={level3:!0},a.$watch(function(){return d.volume},function(a,b){a!=b&&e(a)})}}}]).directive("vgFullscreenbutton",[function(){return{restrict:"AE",require:"^videogular",scope:{vgEnterFullScreenIcon:"=",vgExitFullScreenIcon:"="},template:"<button class='iconButton' ng-click='onClickFullScreen()' ng-class='fullscreenIcon' aria-label='Toggle full screen'></button>",link:function(a,b,c,d){function e(b){a.fullscreenIcon={enter:!b,exit:b}}a.onClickFullScreen=function(){d.toggleFullScreen()},a.fullscreenIcon={exit:!1},a.fullscreenIcon={enter:!0},a.$watch(function(){return d.isFullScreen},function(a,b){a!=b&&e(a)})}}}]);