Posted By

redconservatory on 04/05/11


Tagged

toggle video pause play loadermax seek


Versions (?)

Who likes this?

1 person have marked this snippet as a favorite

burnandbass


LoaderMax: simple video player with a play/pause toggle button and a seekbar


 / Published in: ActionScript 3
 

Requires two MovieClips: 1. a MovieClip instance named, "playPause" that has two frames with frame labels ("play", "pause") with the corresponding graphics for a play / pause button. 2. A MovieClip instance named, "videoBar" that has two instances inside - a long background named "bar" and a shorter slider bar named, "slider".

  1. package
  2. {
  3. import flash.display.MovieClip;
  4. import com.greensock.loading.*;
  5. import com.greensock.loading.display.*;
  6. import com.greensock.*;
  7. import com.greensock.events.LoaderEvent;
  8. import flash.events.MouseEvent;
  9. import flash.events.Event;
  10. import flash.geom.Rectangle;
  11. import flash.geom.Point;
  12.  
  13. public class VideoPlayer extends MovieClip
  14. {
  15.  
  16. public var videoBar:MovieClip = new MovieClip ;// the videoBar
  17. public var playPause:MovieClip = new MovieClip ;
  18.  
  19. // check whether you are displaying the time or changing the time
  20. private var seeking:Boolean = false;
  21. private var video:VideoLoader;
  22. private var endOfVideo:Number;
  23.  
  24. public function VideoPlayer ():void
  25. {
  26. init ();
  27. }
  28.  
  29. public function init ():void
  30. {
  31.  
  32. //create a VideoLoader
  33. video = new VideoLoader("song.flv",{name:"myVideo",container:this,width:400,height:300,scaleMode:"proportionalInside",bgColor:0x000000,autoPlay:false,volume:1,requireWithRoot:this.root});
  34.  
  35. //start loading
  36. video.load ();
  37.  
  38. // set up the play/pause toggle
  39. playPause.buttonMode = true;
  40. playPause.addEventListener (MouseEvent.CLICK, togglePause);
  41.  
  42. // set up the videoBar
  43. videoBar.slider.buttonMode = true;
  44. videoBar.slider.addEventListener (MouseEvent.MOUSE_DOWN, scrubToTime);
  45.  
  46. // listen to the stopDrag method on the stage, not the videoBar!
  47. stage.addEventListener (MouseEvent.MOUSE_UP, stopScrubToTime);
  48.  
  49. // check the video time and update the videoBar accordingly
  50. addEventListener (Event.ENTER_FRAME, updateVideoTime, false, 0, true);
  51.  
  52. videoBar.addEventListener (MouseEvent.CLICK, onSeekToClick, false, 0, true);
  53.  
  54. endOfVideo = videoBar.width - videoBar.slider.width;
  55. }
  56.  
  57. private function updateVideoTime (e:Event):void
  58. {
  59. // moves the videoBar
  60. if (! seeking)
  61. {
  62. if (videoBar.slider.x <= endOfVideo)
  63. {
  64. videoBar.slider.x = (video.videoTime /video.duration)*videoBar.width;
  65. }
  66. else
  67. {
  68. video.videoTime = 0;
  69. videoBar.slider.x = (video.videoTime /video.duration)*videoBar.width;
  70. video.pauseVideo ();
  71. playPause.gotoAndStop ("play");
  72. }
  73. }
  74. else
  75. {
  76. seekToPoint ();
  77. }
  78. }
  79.  
  80. private function seekToPoint ():void
  81. {
  82. var c:Number = (videoBar.slider.x);
  83. var value:Number = Math.abs(c / videoBar.width);
  84. video.gotoVideoTime (value*video.duration, true);
  85. }
  86.  
  87. private function scrubToTime (e:Event):void
  88. {
  89. // constrain to rectangle
  90. videoBar.slider.startDrag (false, new Rectangle(0,0,videoBar.width - videoBar.slider.width, 0));
  91. seeking = true;
  92.  
  93. }
  94.  
  95. private function stopScrubToTime (e:Event):void
  96. {
  97. videoBar.slider.stopDrag ();
  98. seeking = false;
  99. }
  100.  
  101. private function togglePause (event:MouseEvent):void
  102. {
  103. if (video.videoPaused)
  104. {
  105. video.playVideo ();
  106. playPause.gotoAndStop ("pause");
  107. }
  108. else
  109. {
  110. video.pauseVideo ();
  111. playPause.gotoAndStop ("play");
  112. }
  113. }
  114.  
  115. private function onSeekToClick (e:MouseEvent):void
  116. {
  117. removeEventListener (Event.ENTER_FRAME, updateVideoTime);
  118. var point:Point = new Point(this.mouseX,this.mouseY);
  119. var stagePoint = videoBar.globalToLocal(point);
  120. if (stagePoint.x < videoBar.x + videoBar.width)
  121. {
  122. videoBar.slider.x = stagePoint.x;
  123. seekToPoint ();
  124. addEventListener (Event.ENTER_FRAME, updateVideoTime, false, 0, true);
  125. }
  126. }
  127.  
  128. }
  129. }

Report this snippet  

You need to login to post a comment.