Context Navigation

source: Dev/branches/rest-dojo-ui/client/dojox/av/FLVideo.js @ 256

Last change on this file since 256 was 256, checked in by hendrikvanantwerpen, 13 years ago
Reworked project structure based on REST interaction and Dojo library. As soon as this is stable, the old jQueryUI branch can be removed (it's kept for reference).
File size: 8.1 KB

Line
1	define(['dojo', 'dijit', 'dijit/_Widget', 'dojox/embed/Flash', 'dojox/av/_Media'],function(dojo, dijit){
2
3	dojo.experimental("dojox.av.FLVideo");
4	dojo.declare("dojox.av.FLVideo", [dijit._Widget, dojox.av._Media], {
5
6	// summary:
7	// Inserts a Flash FLV video into the HTML page and provides methods
8	// and events for controlling the video. Also plays the H264/M4V codec
9	// with a little trickery: change the '.M4V' extension to '.flv'.
10	//
11	// example:
12	//
13	// markup:
14	// \| <div id="vid" initialVolume=".7",
15	// \| mediaUrl="../resources/Grog.flv"
16	// \| dojoType="dojox.av.FLVideo"></div>
17	// programmatic:
18	// \| new dojox.av.FLVideo({
19	// \| initialVolume:.7,
20	// \| mediaUrl:"../resources/Grog.flv"
21	// \| }, "vid");
22	//
23	// mediaUrl: String
24	// REQUIRED: The Url of the video file that will be played.
25	// NOTE: Must be either an absolute URL or relative to the HTML file.
26	// Relative paths will be converted to abslute paths
27	//
28	// _swfPath: Uri
29	// The path to the video player SWF resource
30	_swfPath: dojo.moduleUrl("dojox.av", "resources/video.swf"),
31	//
32	//
33	constructor: function(/Object/options){
34	// Provide this function for the SWF to ensure that the it is playing
35	// in HTML.
36	dojo.global.swfIsInHTML = function(){ return true; }
37	},
38
39	postCreate: function(){
40	// summary:
41	// Initialize the media.
42	//
43	//
44	this._subs = [];
45	this._cons = [];
46	this.mediaUrl = this._normalizeUrl(this.mediaUrl);
47	this.initialVolume = this._normalizeVolume(this.initialVolume);
48
49	var args = {
50	path:this._swfPath,
51	width:"100%",
52	height:"100%",
53	minimumVersion:9,
54	expressInstall:true,
55	params:{
56	allowFullScreen: this.allowFullScreen,
57	wmode:this.wmode,
58	allowScriptAccess:this.allowScriptAccess,
59	allowNetworking:this.allowNetworking
60	},
61	// only pass in simple variables - no deep objects
62	vars:{
63	videoUrl:this.mediaUrl,
64	id:this.id,
65	autoPlay:this.autoPlay,
66	volume:this.initialVolume,
67	isDebug:this.isDebug
68	}
69	};
70
71	// Setting up dojo.subscribes that listens to events
72	// from the player
73	this._sub("stageClick", "onClick");
74	this._sub("stageSized", "onSwfSized");
75	this._sub("mediaStatus", "onPlayerStatus");
76	this._sub("mediaMeta", "onMetaData");
77	this._sub("mediaError", "onError");
78	this._sub("mediaStart", "onStart");
79	this._sub("mediaEnd", "onEnd");
80
81	this._flashObject = new dojox.embed.Flash(args, this.domNode);
82	this._flashObject.onError = function(err){
83	console.error("Flash Error:", err);
84	};
85	this._flashObject.onLoad = dojo.hitch(this, function(mov){
86	this.flashMedia = mov;
87	this.isPlaying = this.autoPlay;
88	this.isStopped = !this.autoPlay;
89	this.onLoad(this.flashMedia);
90	this._initStatus();
91	this._update();
92	});
93	this.inherited(arguments);
94	},
95
96	// ============================= //
97	// Methods to control the player //
98	// ============================= //
99
100	play: function(/* String? */newUrl){
101	// summary:
102	// Plays the video. If an url is passed in, plays the new link.
103	this.isPlaying = true;
104	this.isStopped = false;
105	this.flashMedia.doPlay(this._normalizeUrl(newUrl));
106	},
107
108	pause: function(){
109	// summary:
110	// Pauses the video
111	this.isPlaying = false;
112	this.isStopped = false;
113	if(this.onPaused){
114	this.onPaused();
115	}
116	this.flashMedia.pause();
117	},
118
119	seek: function(/* Float */ time ){
120	// summary:
121	// Goes to the time passed in the argument
122	this.flashMedia.seek(time);
123	},
124
125
126	// ===================== //
127	// Player Getter/Setters //
128	// ===================== //
129
130	volume: function(/* Float */ vol){
131	// summary:
132	// Sets the volume of the video to the time in the
133	// argument - between 0 - 1.
134	//
135	if(vol){
136	if(!this.flashMedia) {
137	this.initialVolume = vol;
138	}
139	this.flashMedia.setVolume(this._normalizeVolume(vol));
140	}
141	if(!this.flashMedia \|\| !this.flashMedia.doGetVolume) {
142	return this.initialVolume;
143	}
144	return this.flashMedia.getVolume(); // Float
145	},
146
147	// ============= //
148	// Player Events //
149	// ============= //
150
151	/*=====
152	onLoad: function(mov){
153	// summary:
154	// Fired when the SWF player has loaded
155	// NOT when the video has loaded
156	},
157
158	onDownloaded: function(percent){
159	// summary:
160	// Fires the amount of that the media has been
161	// downloaded. Number, 0-100
162	},
163
164	onClick: function(evt){
165	// summary:
166	// Fires when the player is clicked
167	// Could be used to toggle play/pause, or
168	// do an external activity, like opening a new
169	// window.
170	},
171
172	onSwfSized: function(data){
173	// summary:
174	// Fired on SWF resize, or when its
175	// toggled between fullscreen.
176	},
177
178	onMetaData: function(data, evt){
179	// summary:
180	// The video properties. Width, height, duration, etc.
181	// NOTE: if data is empty, this is an older FLV with no meta data.
182	// Duration cannot be determined. In original FLVs, duration
183	// could only be obtained with Flash Media Server.
184	// NOTE: Older FLVs can still return width and height
185	// and will do so on a second event call
186	},
187
188	onPosition: function( time){
189	// summary:
190	// The position of the playhead in seconds
191	},
192
193	onStart: function( data){
194	// summary:
195	// Fires when video starts
196	// Good for setting the play button to pause
197	// during an autoPlay for example
198	},
199
200	onPlay: function(data){
201	// summary:
202	// Fires when video starts and resumes
203	},
204
205	onPause: function(data){
206	// summary:
207	// Fires when the pause button is clicked
208	},
209
210	onEnd: function(data){
211	// summary:
212	// Fires when video ends
213	// Could be used to change pause button to play
214	// or show a post video graphic, like YouTube
215	},
216
217	onStop: function(){
218	// summary:
219	// Fire when the Stop button is clicked
220	// TODO: This is not hooked up yet and shouldn't
221	// fire.
222	},
223
224	onBuffer: function(isBuffering){
225	// summary:
226	// Fires a boolean to tell if media
227	// is paused for buffering or if buffering
228	// has finished
229	this.isBuffering = isBuffering;
230	},
231
232	onError: function(data, url){
233	// summary:
234	// Fired when the player encounters an error
235	// example:
236	// \| console.warn("ERROR-"+data.type.toUpperCase()+":",
237	// \| data.info.code, " - URL:", url);
238	},
239
240	onStatus: function(data){
241	// summary:
242	// Simple status
243	},
244
245	onPlayerStatus: function(data){
246	// summary:
247	// The status of the video from the SWF
248	// playing, stopped, bufering, etc.
249	},
250
251	onResize: function(){
252	// summary:
253	// Fired on page resize
254	},
255	=====*/
256
257	// =============== //
258	// Private Methods //
259	// =============== //
260
261	_checkBuffer: function(/* Float /time, / Float */bufferLength){
262	// summary:
263	// Checks that there is a proper buffer time between
264	// current playhead time and the amount of data loaded.
265	// Works only on FLVs with a duration (not older). Pauses
266	// the video while continuing download.
267	//
268	if(this.percentDownloaded == 100){
269	if(this.isBuffering){
270	this.onBuffer(false);
271	this.flashMedia.doPlay();
272	}
273	return;
274	}
275
276	if(!this.isBuffering && bufferLength<.1){
277	this.onBuffer(true);
278	this.flashMedia.pause();
279	return;
280	}
281
282	var timePercentLoad = this.percentDownloaded.01this.duration;
283
284	// check if start buffer needed
285	if(!this.isBuffering && time+this.minBufferTime*.001>timePercentLoad){
286	this.onBuffer(true);
287	this.flashMedia.pause();
288
289	// check if end buffer needed
290	}else if(this.isBuffering && time+this.bufferTime*.001<=timePercentLoad){
291	this.onBuffer(false);
292	this.flashMedia.doPlay();
293	}
294
295	},
296	_update: function(){
297	// summary:
298	// Helper function to fire onPosition, check download progress,
299	// and check buffer.
300	var time = Math.min(this.getTime() \|\| 0, this.duration);
301
302	var dObj = this.flashMedia.getLoaded();
303	this.percentDownloaded = Math.ceil(dObj.bytesLoaded/dObj.bytesTotal*100);
304	this.onDownloaded(this.percentDownloaded);
305	this.onPosition(time);
306	if(this.duration){
307	this._checkBuffer(time, dObj.buffer);
308	}
309	// FIXME: need to remove this on destroy
310	this._updateHandle = setTimeout(dojo.hitch(this, "_update"), this.updateTime);
311	},
312
313	destroy: function(){
314	clearTimeout(this._updateHandle);
315	dojo.disconnect(this._positionHandle);
316	this.inherited(arguments);
317	}
318
319	});
320
321	return dojox.av.FLVideo;
322	});

Note: See TracBrowser for help on using the repository browser.

Download in other formats: