Context Navigation

ControlbarComponentV4.as @ 416

Visit:

Revision 416, 18.8 KB checked in by zach, 4 years ago (diff)
Fixed fullscreen

Line
1	package com.longtailvideo.jwplayer.view.components {
2	import com.longtailvideo.jwplayer.events.MediaEvent;
3	import com.longtailvideo.jwplayer.events.PlayerEvent;
4	import com.longtailvideo.jwplayer.events.PlayerStateEvent;
5	import com.longtailvideo.jwplayer.events.PlaylistEvent;
6	import com.longtailvideo.jwplayer.events.ViewEvent;
7	import com.longtailvideo.jwplayer.player.Player;
8	import com.longtailvideo.jwplayer.player.PlayerState;
9	import com.longtailvideo.jwplayer.utils.Draw;
10	import com.longtailvideo.jwplayer.utils.Stacker;
11	import com.longtailvideo.jwplayer.utils.Strings;
12	import com.longtailvideo.jwplayer.view.interfaces.IControlbarComponent;
13	import flash.accessibility.AccessibilityProperties;
14	import flash.display.DisplayObject;
15	import flash.display.MovieClip;
16	import flash.display.Sprite;
17	import flash.events.MouseEvent;
18	import flash.geom.ColorTransform;
19	import flash.geom.Rectangle;
20	import flash.text.TextField;
21	import flash.ui.Mouse;
22	import flash.utils.clearTimeout;
23	import flash.utils.setTimeout;
24	import mx.effects.Fade;
25	import com.jeroenwijering.events.ControllerEvent;
26	import com.longtailvideo.jwplayer.events.PlayerStateEvent;
27	import com.longtailvideo.jwplayer.plugins.PluginConfig;
28	import com.longtailvideo.jwplayer.utils.Logger;
29
30
31	public class ControlbarComponentV4 extends CoreComponent implements IControlbarComponent {
32	/ Reference to the original skin /
33	private var skin:Sprite;
34	/ A list with all controls. /
35	private var stacker:Stacker;
36	/ Timeout for hiding the /
37	private var hiding:Number;
38	/ When scrubbing, icon shouldn't be set. /
39	private var scrubber:MovieClip;
40	/ Color object for frontcolor. /
41	private var front:ColorTransform;
42	/ Color object for lightcolor. /
43	private var light:ColorTransform;
44	/ The actions for all controlbar buttons. /
45	private var BUTTONS:Object;
46	/ The actions for all sliders /
47	private var SLIDERS:Object = {timeSlider: ViewEvent.JWPLAYER_VIEW_SEEK, volumeSlider: ViewEvent.JWPLAYER_VIEW_VOLUME};
48	/ The button to clone for all custom buttons. /
49	private var clonee:MovieClip;
50	/ Saving the block state of the controlbar. /
51	private var blocking:Boolean;
52	/ Controlbar config /
53	private var controlbarConfig:PluginConfig;
54
55
56	public function ControlbarComponentV4(player:Player) {
57	super(player);
58	controlbarConfig = player.config.pluginConfig("controlbar");
59	// TODO: Remove Link button
60	BUTTONS = {
61	playButton: ViewEvent.JWPLAYER_VIEW_PLAY,
62	pauseButton: ViewEvent.JWPLAYER_VIEW_PAUSE,
63	stopButton: ViewEvent.JWPLAYER_VIEW_STOP,
64	prevButton: ViewEvent.JWPLAYER_VIEW_PREV,
65	nextButton: ViewEvent.JWPLAYER_VIEW_NEXT,
66	fullscreenButton: ViewEvent.JWPLAYER_VIEW_FULLSCREEN,
67	normalscreenButton: ViewEvent.JWPLAYER_VIEW_FULLSCREEN,
68	muteButton: ViewEvent.JWPLAYER_VIEW_MUTE,
69	unmuteButton: ViewEvent.JWPLAYER_VIEW_MUTE};
70	var temp:Sprite = player.skin.getSWFSkin();
71	skin = player.skin.getSWFSkin().getChildByName('controlbar') as Sprite;
72	skin.x = 0;
73	skin.y = 0;
74	addChild(skin);
75	player.addEventListener(PlayerStateEvent.JWPLAYER_PLAYER_STATE, stateHandler);
76	player.addEventListener(MediaEvent.JWPLAYER_MEDIA_TIME, timeHandler);
77	player.addEventListener(MediaEvent.JWPLAYER_MEDIA_MUTE, muteHandler);
78	player.addEventListener(MediaEvent.JWPLAYER_MEDIA_VOLUME, volumeHandler);
79	player.addEventListener(MediaEvent.JWPLAYER_MEDIA_BUFFER, loadedHandler);
80	player.addEventListener(PlaylistEvent.JWPLAYER_PLAYLIST_LOADED, itemHandler);
81	player.addEventListener(PlaylistEvent.JWPLAYER_PLAYLIST_UPDATED, itemHandler);
82	player.addEventListener(PlaylistEvent.JWPLAYER_PLAYLIST_ITEM, itemHandler);
83	stacker = new Stacker(skin as MovieClip);
84	setButtons();
85	setColors();
86	itemHandler();
87	loadedHandler();
88	muteHandler();
89	stateHandler();
90	timeHandler();
91	volumeHandler();
92	}
93
94
95	/**
96	* Add a new button to the control
97	*
98	* @param icn A graphic to show as icon
99	* @param nam Name of the button
100	getSkinElement('* @param hdl The function to call when clicking the Button').
101	**/
102	public function addButton(name:String, icon:DisplayObject, handler:Function = null):void {
103	if (getSkinElement('linkButton') && getSkinElementChild('linkButton', 'back')) {
104	var btn:* = Draw.clone(getSkinElement('linkButton') as Sprite);
105	btn.name = name + 'Button';
106	btn.visible = true;
107	btn.tabEnabled = true;
108	btn.tabIndex = 6;
109	var acs:AccessibilityProperties = new AccessibilityProperties();
110	acs.name = name + 'Button';
111	btn.accessibilityProperties = acs;
112	addChild(btn);
113	var off:Number = Math.round((btn.height - icon.height) / 2);
114	Draw.clear(btn.icon);
115	btn.icon.addChild(icon);
116	icon.x = icon.y = 0;
117	btn.icon.x = btn.icon.y = off;
118	btn.back.width = icon.width + 2 * off;
119	btn.buttonMode = true;
120	btn.mouseChildren = false;
121	btn.addEventListener(MouseEvent.CLICK, handler);
122	if (front) {
123	btn.icon.transform.colorTransform = front;
124	btn.addEventListener(MouseEvent.MOUSE_OVER, overHandler);
125	btn.addEventListener(MouseEvent.MOUSE_OUT, outHandler);
126	}
127	stacker.insert(btn, getSkinElement('linkButton') as MovieClip);
128	}
129	}
130
131
132	public function removeButton(name:String):void {
133	skin.removeChild(getSkinElement(name));
134	}
135
136	public function resize(width:Number, height:Number):void {
137	var wid:Number = width;
138	if (controlbarConfig['position'] == 'over' \|\| player.config.fullscreen == true) {
139	//x = player.config.x + player.config.margin;
140	//y = player.config.y + player.config.height - player.config.margin - player.config.size;
141	wid = width - 2 * controlbarConfig['margin'];
142	}
143	try {
144	getSkinElement('fullscreenButton').visible = false;
145	getSkinElement('normalscreenButton').visible = false;
146	if (stage['displayState'] && player.config.height > 40) {
147	if (player.config.fullscreen) {
148	getSkinElement('fullscreenButton').visible = false;
149	getSkinElement('normalscreenButton').visible = true;
150	} else {
151	getSkinElement('fullscreenButton').visible = true;
152	getSkinElement('normalscreenButton').visible = false;
153	}
154	}
155	} catch (err:Error) {
156	}
157	stacker.rearrange(width);
158	stateHandler();
159	fixTime();
160	Mouse.show();
161	}
162
163
164	public function getButton(buttonName:String):DisplayObject {
165	return null;
166	}
167
168
169	/ Hide the controlbar /
170	public function block(stt:Boolean):void {
171	blocking = stt;
172	timeHandler();
173	}
174
175
176	/ Handle clicks from all buttons. /
177	private function clickHandler(evt:MouseEvent):void {
178	var act:String = BUTTONS[evt.target.name];
179	var data:Object = null;
180	if (blocking != true \|\| act == ViewEvent.JWPLAYER_VIEW_FULLSCREEN \|\| act == ViewEvent.JWPLAYER_VIEW_MUTE) {
181	switch (act) {
182	case ViewEvent.JWPLAYER_VIEW_FULLSCREEN:
183	data = Boolean(!player.config.fullscreen);
184	break;
185	case ViewEvent.JWPLAYER_VIEW_PAUSE:
186	data = Boolean(_player.state == PlayerState.IDLE \|\| _player.state == PlayerState.PAUSED);
187	break;
188	case ViewEvent.JWPLAYER_VIEW_MUTE:
189	data = Boolean(!player.mute);
190	break;
191	}
192	var event:ViewEvent = new ViewEvent(act, data);
193	dispatchEvent(event);
194	}
195	}
196
197
198	/ Handle mouse presses on sliders. /
199	private function downHandler(evt:MouseEvent):void {
200	scrubber = MovieClip(evt.target);
201	if (blocking != true \|\| scrubber.name == 'volumeSlider') {
202	var rct:Rectangle = new Rectangle(scrubber.rail.x, scrubber.icon.y, scrubber.rail.width - scrubber.icon.width, 0);
203	scrubber.icon.startDrag(true, rct);
204	stage.addEventListener(MouseEvent.MOUSE_UP, upHandler);
205	} else {
206	scrubber = undefined;
207	}
208	}
209
210
211	/ Fix the timeline display. /
212	private function fixTime():void {
213	try {
214	var scp:Number = getSkinElement('timeSlider').scaleX;
215	getSkinElement('timeSlider').scaleX = 1;
216	getSkinElementChild('timeSlider', 'icon').x = scp * getSkinElementChild('timeSlider', 'icon').x;
217	getSkinElementChild('timeSlider', 'mark').x = scp * getSkinElementChild('timeSlider', 'mark').x;
218	getSkinElementChild('timeSlider', 'mark').width = scp * getSkinElementChild('timeSlider', 'mark').width;
219	getSkinElementChild('timeSlider', 'rail').width = scp * getSkinElementChild('timeSlider', 'rail').width;
220	getSkinElementChild('timeSlider', 'done').x = scp * getSkinElementChild('timeSlider', 'done').x;
221	getSkinElementChild('timeSlider', 'done').width = scp * getSkinElementChild('timeSlider', 'done').width;
222	} catch (err:Error) {
223	}
224	}
225
226
227	/ Handle a change in the current item /
228	private function itemHandler(evt:PlaylistEvent = null):void {
229	try {
230	if (player.playlist && player.playlist.length > 1) {
231	getSkinElement('prevButton').visible = getSkinElement('nextButton').visible = true;
232	} else {
233	getSkinElement('prevButton').visible = getSkinElement('nextButton').visible = false;
234	}
235	} catch (err:Error) {
236	}
237	timeHandler();
238	stacker.rearrange();
239	fixTime();
240	loadedHandler();
241	}
242
243
244	/ Process bytesloaded updates given by the model. /
245	private function loadedHandler(evt:MediaEvent = null):void {
246	try {
247	var wid:Number = getSkinElementChild('timeSlider', 'rail').width;
248	//getSkinElement('timeSlider').getChildByName('mark').x = evt.position / evt.duration * wid;
249	var icw:Number = getSkinElementChild('timeSlider', 'icon').x + getSkinElementChild('timeSlider', 'icon').width;
250	var markWidth:Number = ((evt.bufferPercent / 100) * player.config.bufferlength) / evt.duration * wid + icw;
251	getSkinElementChild('timeSlider', 'mark').width = Math.abs(markWidth);
252	} catch (err:Error) {
253	}
254	}
255
256
257	/ Show above controlbar on mousemove. /
258	private function moveHandler(evt:MouseEvent = null):void {
259	if (alpha == 0) {
260	var fade:Fade = new Fade(this);
261	fade.alphaTo = 1;
262	fade.play();
263	}
264	clearTimeout(hiding);
265	hiding = setTimeout(moveTimeout, 2000);
266	Mouse.show();
267	}
268
269
270	/ Hide above controlbar again when move has timed out. /
271	private function moveTimeout():void {
272	var fade:Fade = new Fade(this);
273	fade.alphaTo = 0;
274	fade.play();
275	}
276
277
278	/ Show a mute icon if playing. /
279	private function muteHandler(evt:MediaEvent = null):void {
280	if (player.mute == true) {
281	try {
282	getSkinElement('muteButton').visible = false;
283	getSkinElement('unmuteButton').visible = true;
284	} catch (err:Error) {
285	}
286	try {
287	getSkinElementChild('volumeSlider', 'mark').visible = false;
288	getSkinElementChild('volumeSlider', 'icon').x = getSkinElementChild('volumeSlider', 'rail').x;
289	} catch (err:Error) {
290	}
291	} else {
292	try {
293	getSkinElement('muteButton').visible = true;
294	getSkinElement('unmuteButton').visible = false;
295	} catch (err:Error) {
296	}
297	try {
298	getSkinElementChild('volumeSlider', 'mark').visible = true;
299	volumeHandler();
300	} catch (err:Error) {
301	}
302	}
303	}
304
305
306	/ Handle mouseouts from all buttons /
307	private function outHandler(evt:MouseEvent):void {
308	if (front && evt.target['icon']) {
309	evt.target['icon'].transform.colorTransform = front;
310	} else {
311	evt.target.gotoAndPlay('out');
312	}
313	}
314
315
316	/ Handle clicks from all buttons /
317	private function overHandler(evt:MouseEvent):void {
318	if (front && evt.target['icon']) {
319	evt.target['icon'].transform.colorTransform = light;
320	} else {
321	evt.target.gotoAndPlay('over');
322	}
323	}
324
325
326	/ Clickhandler for all buttons. /
327	private function setButtons():void {
328	for (var btn:String in BUTTONS) {
329	if (getSkinElement(btn)) {
330	(getSkinElement(btn) as MovieClip).mouseChildren = false;
331	(getSkinElement(btn) as MovieClip).buttonMode = true;
332	getSkinElement(btn).addEventListener(MouseEvent.CLICK, clickHandler);
333	getSkinElement(btn).addEventListener(MouseEvent.MOUSE_OVER, overHandler);
334	getSkinElement(btn).addEventListener(MouseEvent.MOUSE_OUT, outHandler);
335	}
336	}
337	for (var sld:String in SLIDERS) {
338	if (getSkinElement(sld)) {
339	(getSkinElement(sld) as MovieClip).mouseChildren = false;
340	(getSkinElement(sld) as MovieClip).buttonMode = true;
341	getSkinElement(sld).addEventListener(MouseEvent.MOUSE_DOWN, downHandler);
342	getSkinElement(sld).addEventListener(MouseEvent.MOUSE_OVER, overHandler);
343	getSkinElement(sld).addEventListener(MouseEvent.MOUSE_OUT, outHandler);
344	}
345	}
346	}
347
348
349	/ Init the colors. /
350	private function setColors():void {
351	if (player.config.backcolor && getSkinElementChild('playButton', 'icon')) {
352	var clr:ColorTransform = new ColorTransform();
353	clr.color = player.config.backcolor;
354	getSkinElement('back').transform.colorTransform = clr;
355	}
356	if (player.config.frontcolor) {
357	try {
358	front = new ColorTransform();
359	front.color = player.config.frontcolor;
360	for (var btn:String in BUTTONS) {
361	if (getSkinElement(btn)) {
362	getSkinElementChild(btn, 'icon').transform.colorTransform = front;
363	}
364	}
365	for (var sld:String in SLIDERS) {
366	if (getSkinElement(sld)) {
367	getSkinElementChild(sld, 'icon').transform.colorTransform = front;
368	getSkinElementChild(sld, 'mark').transform.colorTransform = front;
369	getSkinElementChild(sld, 'rail').transform.colorTransform = front;
370	}
371	}
372	(getSkinElement('elapsedText') as TextField).textColor = front.color;
373	(getSkinElement('totalText') as TextField).textColor = front.color;
374	} catch (err:Error) {
375	}
376	}
377	if (player.config.lightcolor) {
378	light = new ColorTransform();
379	light.color = player.config.lightcolor;
380	} else {
381	light = front;
382	}
383	if (light) {
384	try {
385	getSkinElementChild('timeSlider', 'done').transform.colorTransform = light;
386	getSkinElementChild('volumeSlider', 'mark').transform.colorTransform = light;
387	} catch (err:Error) {
388	}
389	}
390	}
391
392
393	/ Process state changes /
394	private function stateHandler(evt:PlayerEvent = undefined):void {
395	clearTimeout(hiding);
396	player.skin.removeEventListener(MouseEvent.MOUSE_MOVE, moveHandler);
397	try {
398	var dps:String = stage['displayState'];
399	} catch (err:Error) {
400	}
401	switch (player.state) {
402	case PlayerState.PLAYING:
403	try {
404	getSkinElement('playButton').visible = false;
405	getSkinElement('pauseButton').visible = true;
406	} catch (err:Error) {
407	}
408	if (controlbarConfig['position'] == 'over' \|\| dps == 'fullScreen') {
409	Mouse.show();
410	/*var fade2:Fade = new Fade(this);
411	fade2.alphaTo = 1;
412	fade2.play();*/
413	}
414	break;
415	case PlayerState.PAUSED:
416	try {
417	getSkinElement('playButton').visible = true;
418	getSkinElement('pauseButton').visible = false;
419	} catch (err:Error) {
420	}
421	if (controlbarConfig['position'] == 'over' \|\| dps == 'fullScreen') {
422	Mouse.show();
423	/*var fade2:Fade = new Fade(this);
424	fade2.alphaTo = 1;
425	fade2.play();*/
426	}
427	break;
428	case PlayerState.BUFFERING:
429	try {
430	getSkinElement('playButton').visible = false;
431	getSkinElement('pauseButton').visible = true;
432	} catch (err:Error) {
433	}
434	if (controlbarConfig['position'] == 'over' \|\| (dps == 'fullScreen' && controlbarConfig['position'] != 'none')) {
435	hiding = setTimeout(moveTimeout, 2000);
436	player.skin.addEventListener(MouseEvent.MOUSE_MOVE, moveHandler);
437	} else {
438	/*var fade1:Fade = new Fade(this);
439	fade1.alphaTo = 1;
440	fade1.play();*/
441	}
442	break;
443	case PlayerState.IDLE:
444	try {
445	getSkinElement('playButton').visible = true;
446	getSkinElement('pauseButton').visible = false;
447	timeHandler();
448	} catch (err:Error) {
449	}
450	if (controlbarConfig['position'] == 'over' \|\| dps == 'fullScreen') {
451	Mouse.show();
452	/*var fade2:Fade = new Fade(this);
453	fade2.alphaTo = 1;
454	fade2.play();*/
455	}
456	}
457	}
458
459
460	/ Process time updates given by the model. /
461	private function timeHandler(evt:MediaEvent = null):void {
462	var dur:Number = 0;
463	var pos:Number = 0;
464	if (evt) {
465	dur = evt.duration;
466	pos = evt.position;
467	} else if (player.playlist.length > 0 && player.playlist.currentItem) {
468	dur = player.playlist.currentItem.duration;
469	pos = 0;
470	}
471	var pct:Number = pos / dur;
472	if (isNaN(pct)) {
473	pct = 1;
474	}
475	try {
476	var temp:DisplayObject = skin.getChildByName('elapsedText');
477	(getSkinElement('elapsedText') as TextField).text = Strings.digits(pos);
478	(getSkinElement('totalText') as TextField).text = Strings.digits(dur);
479	} catch (err:Error) {
480	Logger.log(err);
481	}
482	try {
483	var tsl:MovieClip = getSkinElement('timeSlider') as MovieClip;
484	var xps:Number = Math.round(pct * (tsl.rail.width - tsl.icon.width));
485	if (dur > 0) {
486	getSkinElementChild('timeSlider', 'icon').visible = true;
487	getSkinElementChild('timeSlider', 'mark').visible = true;
488	if (!scrubber) {
489	getSkinElementChild('timeSlider', 'icon').x = xps;
490	getSkinElementChild('timeSlider', 'done').width = xps;
491	}
492	getSkinElementChild('timeSlider', 'done').visible = true;
493	} else {
494	getSkinElementChild('timeSlider', 'icon').visible = false;
495	getSkinElementChild('timeSlider', 'mark').visible = false;
496	getSkinElementChild('timeSlider', 'done').visible = false;
497	}
498	} catch (err:Error) {
499	}
500	}
501
502
503	/ Handle mouse releases on sliders. /
504	private function upHandler(evt:MouseEvent):void {
505	var mpl:Number = 0;
506	stage.removeEventListener(MouseEvent.MOUSE_UP, upHandler);
507	scrubber.icon.stopDrag();
508	if (scrubber.name == 'timeSlider' && player.playlist) {
509	mpl = player.playlist.currentItem.duration;
510	} else if (scrubber.name == 'volumeSlider') {
511	mpl = 100;
512	}
513	var pct:Number = (scrubber.icon.x - scrubber.rail.x) / (scrubber.rail.width - scrubber.icon.width) * mpl;
514	dispatchEvent(new ViewEvent(SLIDERS[scrubber.name], Math.round(pct)));
515	scrubber = undefined;
516	}
517
518
519	/ Reflect the new volume in the controlbar /
520	private function volumeHandler(evt:MediaEvent = null):void {
521	try {
522	var vsl:MovieClip = getSkinElement('volumeSlider') as MovieClip;
523	vsl.mark.width = player.config.volume * (vsl.rail.width - vsl.icon.width / 2) / 100;
524	vsl.icon.x = vsl.mark.x + player.config.volume * (vsl.rail.width - vsl.icon.width) / 100;
525	} catch (err:Error) {
526	}
527	}
528
529
530	private function getSkinElement(element:String):DisplayObject {
531	return skin.getChildByName(element) as DisplayObject;
532	}
533
534
535	private function getSkinElementChild(element:String, child:String):DisplayObject {
536	return (skin.getChildByName(element) as MovieClip).getChildByName(child);
537	}
538	}
539	}

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

Download in other formats:

Original Format