]> git.openstreetmap.org Git - potlatch2.git/blob - net/systemeD/potlatch2/help/VideoPlayer.mxml
Remove the mx.events.VideoEvent import, since it clashes with flash.video.VideoEvent
[potlatch2.git] / net / systemeD / potlatch2 / help / VideoPlayer.mxml
1 <?xml version="1.0" encoding="utf-8"?>
2 <mx:VBox xmlns:mx="http://www.adobe.com/2006/mxml" verticalGap="0">
3         <mx:ViewStack id="videoStack" width="100%" height="100%">
4                 <mx:Box id="previewContainer">
5                         <mx:Image id="preview" width="100%" height="100%" source="{previewImage}" 
6                                 click="playVideo()" />
7                 </mx:Box>
8                 <mx:Box id="videoContainer">
9                         <mx:VideoDisplay id="video" 
10                                 metadataReceived="prepareVideo()"
11                                 playheadUpdate="advanceProgress(event)"
12                                 click="playVideo()"
13                                 autoPlay="false"
14                                 width="100%" height="100%" />
15                 </mx:Box>
16         </mx:ViewStack>
17         <mx:HBox backgroundColor="#6495ED" width="100%" height="16"> 
18                 <mx:Image id="playButton" width="16" height="16" source="{playImage}" click="playVideo()" />
19                 <mx:HSlider width="100%" id="progressBar" liveDragging="true" 
20                         allowTrackClick="false" 
21                         thumbPress="progressThumbPress(event);" 
22                         thumbRelease="progressThumbRelease(event);" />
23         </mx:HBox> 
24
25         <mx:Script> 
26                 <![CDATA[ 
27
28                         /** VideoPlayer component for P2 help dialog.
29                                 Embed like this:
30
31                                 <help:VideoPlayer width="400" height="300" 
32                                         file="videos/test.flv" 
33                                         previewImage="videos/test_preview.png" />
34                                         
35                                 previewImage is the image that will be shown in the video pane
36                                 before the user clicks 'play' - usually a still of the first frame
37                                 of the video. (This means the video file won't be downloaded unless 
38                                 the user actually wants it.)
39                         */
40
41                         [Bindable] public var file:String;
42                         [Bindable] public var previewImage:String; 
43                         private var wasPlaying:Boolean;
44
45                         [Bindable] [Embed(source="../../../../embedded/video_play.png" )] public var playImage:Class;
46                         [Bindable] [Embed(source="../../../../embedded/video_pause.png")] public var pauseImage:Class;
47
48                         public function playVideo():void {
49                                 if (videoStack.selectedChild==previewContainer) {
50                                         preview.alpha=0.5;
51                                         video.source=file;
52                                         video.play();
53                                         playButton.source=pauseImage;
54                                 } else if (video.playing) {
55                                         video.pause();
56                                         playButton.source=playImage;
57                                 } else {
58                                         video.play();
59                                         playButton.source=pauseImage;
60                                 }
61                         }
62                         public function prepareVideo():void {
63                                 videoStack.selectedChild=videoContainer;
64                                 progressBar.maximum=video.totalTime;
65                         }
66                         public function progressThumbPress(event:Event):void { 
67                                 wasPlaying=video.playing;
68                                 video.pause();
69                                 playButton.source=playImage;
70                         }
71                         public function progressThumbRelease(event:Event):void { 
72                                 video.playheadTime = event.currentTarget.value; 
73                                 if (wasPlaying) playVideo();
74                         } 
75                         public function advanceProgress(event:VideoEvent):void {
76                                 progressBar.value = event.playheadTime;
77                         }
78                         public function stopPlaying():void {
79                                 if (!video.playing) return;
80                                 video.pause();
81                                 playButton.source=playImage;
82                         }
83
84                 ]]> 
85         </mx:Script>
86 </mx:VBox>