Context Navigation

ControlbarComponent.as @ 576

Visit:

Revision 576, 15.6 KB checked in by zach, 4 years ago (diff)
Fixing PNG controlbar transparency, adding endcaps Adding PNG Playlist component

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.IPlayer;
8	import com.longtailvideo.jwplayer.player.PlayerState;
9	import com.longtailvideo.jwplayer.utils.Strings;
10	import com.longtailvideo.jwplayer.view.interfaces.IControlbarComponent;
11
12	import flash.display.Bitmap;
13	import flash.display.DisplayObject;
14	import flash.display.MovieClip;
15	import flash.display.Sprite;
16	import flash.events.MouseEvent;
17	import flash.text.TextField;
18	import flash.text.TextFieldAutoSize;
19	import flash.text.TextFormat;
20	import flash.ui.Mouse;
21	import com.longtailvideo.jwplayer.utils.DisplayObjectUtils;
22
23
24	/**
25	* Sent when the user interface requests that the player play the currently loaded media
26	*
27	* @eventType com.longtailvideo.jwplayer.events.ViewEvent.JWPLAYER_VIEW_PLAY
28	*/
29	[Event(name="jwPlayerViewPlay", type="com.longtailvideo.jwplayer.events.ViewEvent")]
30	/**
31	* Sent when the user interface requests that the player pause the currently playing media
32	*
33	* @eventType com.longtailvideo.jwplayer.events.ViewEvent.JWPLAYER_VIEW_PAUSE
34	*/
35	[Event(name="jwPlayerViewPause", type="com.longtailvideo.jwplayer.events.ViewEvent")]
36	/**
37	* Sent when the user interface requests that the player stop the currently playing media
38	*
39	* @eventType com.longtailvideo.jwplayer.events.ViewEvent.JWPLAYER_VIEW_STOP
40	*/
41	[Event(name="jwPlayerViewStop", type="com.longtailvideo.jwplayer.events.ViewEvent")]
42	/**
43	* Sent when the user interface requests that the player play the next item in its playlist
44	*
45	* @eventType com.longtailvideo.jwplayer.events.ViewEvent.JWPLAYER_VIEW_NEXT
46	*/
47	[Event(name="jwPlayerViewNext", type="com.longtailvideo.jwplayer.events.ViewEvent")]
48	/**
49	* Sent when the user interface requests that the player play the previous item in its playlist
50	*
51	* @eventType com.longtailvideo.jwplayer.events.ViewEvent.JWPLAYER_VIEW_PREV
52	*/
53	[Event(name="jwPlayerViewPrev", type="com.longtailvideo.jwplayer.events.ViewEvent")]
54	/**
55	* Sent when the user interface requests that the player navigate to the playlist item's <code>link</code> property
56	*
57	* @eventType com.longtailvideo.jwplayer.events.ViewEvent.JWPLAYER_VIEW_LINK
58	*/
59	[Event(name="jwPlayerViewLink", type="com.longtailvideo.jwplayer.events.ViewEvent")]
60	/**
61	*
62	*
63	* @eventType com.longtailvideo.jwplayer.events.ViewEvent.JWPLAYER_VIEW_MUTE
64	*/
65	[Event(name="jwPlayerViewMute", type="com.longtailvideo.jwplayer.events.ViewEvent")]
66	/**
67	*
68	*
69	* @eventType com.longtailvideo.jwplayer.events.ViewEvent.JWPLAYER_VIEW_FULLSCREEN
70	*/
71	[Event(name="jwPlayerViewFullscreen", type="com.longtailvideo.jwplayer.events.ViewEvent")]
72	/**
73	*
74	*
75	* @eventType com.longtailvideo.jwplayer.events.ViewEvent.JWPLAYER_VIEW_VOLUME
76	*/
77	[Event(name="jwPlayerViewVolume", type="com.longtailvideo.jwplayer.events.ViewEvent")]
78	/**
79	*
80	*
81	* @eventType com.longtailvideo.jwplayer.events.ViewEvent.JWPLAYER_VIEW_SEEK
82	*/
83	[Event(name="jwPlayerViewSeek", type="com.longtailvideo.jwplayer.events.ViewEvent")]
84	public class ControlbarComponent extends CoreComponent implements IControlbarComponent {
85	protected var _buttons:Object = {};
86	protected var _dividers:Array;
87	protected var _defaultLayout:String = "[play\|stop\|prev\|next\|elapsed][time][duration\|fullscreen\|mute volume]";
88	protected var _currentLayout:String;
89	protected var _layoutManager:ControlbarLayoutManager;
90	protected var _width:Number;
91	protected var _height:Number;
92
93	public function ControlbarComponent(player:IPlayer) {
94	super(player, "controlbar");
95	_layoutManager = new ControlbarLayoutManager(this);
96	_dividers = [];
97	setupBackground();
98	setupDefaultButtons();
99	addEventListeners();
100	updateControlbarState();
101	setTime(0,0);
102	updateVolumeSlider();
103	}
104
105
106	private function addEventListeners():void {
107	player.addEventListener(PlaylistEvent.JWPLAYER_PLAYLIST_LOADED, playlistHandler);
108	player.addEventListener(PlaylistEvent.JWPLAYER_PLAYLIST_UPDATED, playlistHandler);
109	player.addEventListener(PlaylistEvent.JWPLAYER_PLAYLIST_ITEM, playlistHandler);
110	player.addEventListener(PlayerStateEvent.JWPLAYER_PLAYER_STATE, stateHandler);
111	player.addEventListener(MediaEvent.JWPLAYER_MEDIA_MUTE, stateHandler);
112	player.addEventListener(MediaEvent.JWPLAYER_MEDIA_VOLUME, updateVolumeSlider);
113	player.addEventListener(MediaEvent.JWPLAYER_MEDIA_BUFFER, mediaHandler);
114	player.addEventListener(MediaEvent.JWPLAYER_MEDIA_TIME, mediaHandler);
115	}
116
117
118	private function playlistHandler(evt:PlaylistEvent):void {
119	resetSlider();
120	updateControlbarState();
121	redraw();
122	}
123
124
125	private function resetSlider():void {
126	var scrubber:Slider = getButton('time') as Slider;
127	if (scrubber) {
128	scrubber.reset();
129	}
130	}
131
132
133	private function stateHandler(evt:PlayerEvent):void {
134	updateControlbarState();
135	redraw();
136	}
137
138
139	private function updateControlbarState():void {
140	var newLayout:String = _defaultLayout;
141	if (player.state == PlayerState.PLAYING) {
142	newLayout = newLayout.replace('play', 'pause');
143	hideButton('play');
144	} else if (player.state == PlayerState.IDLE) {
145	resetSlider();
146	if (_player.playlist.currentItem){
147	setTime(0,_player.playlist.currentItem.duration);
148	}
149	hideButton('pause');
150	} else {
151	hideButton('pause');
152	}
153	if (player.playlist.length <= 1) {
154	newLayout = newLayout.replace("\|prev\|next", "");
155	hideButton('prev');
156	hideButton('next');
157	}
158	if (player.mute) {
159	newLayout = newLayout.replace("mute", "unmute");
160	hideButton("mute");
161	} else {
162	hideButton("unmute");
163	}
164	if (player.fullscreen) {
165	newLayout = newLayout.replace("fullscreen", "normalscreen");
166	hideButton("fullscreen");
167	} else {
168	hideButton("normalscreen");
169	}
170	_currentLayout = removeInactive(newLayout);
171	}
172
173
174	private function removeInactive(layout:String):String {
175	var buttons:Array = _defaultLayout.match(/\W*([A-Za-z0-9]+?)\W/g);
176	for (var i:Number = 0; i < buttons.length; i++){
177	var button:String = (buttons[i] as String).replace(/\W/g,"");
178	if (!_buttons[button]) {
179	layout = layout.replace(button,"");
180	layout = layout.replace("\|\|", "\|");
181	}
182	}
183	return layout;
184	}
185
186	private function mediaHandler(evt:MediaEvent):void {
187	var scrubber:Slider = getButton('time') as Slider;
188	switch (evt.type) {
189	case MediaEvent.JWPLAYER_MEDIA_BUFFER:
190	//setTime(evt.position, evt.duration);
191	if (scrubber) {
192	//scrubber.setProgress(evt.position / evt.duration *100);
193	scrubber.setBuffer(evt.bufferPercent);
194	}
195	break;
196	case MediaEvent.JWPLAYER_MEDIA_TIME:
197	setTime(evt.position, evt.duration);
198	if (scrubber) {
199	scrubber.setProgress(evt.position / evt.duration * 100);
200	if (evt.bufferPercent >= 0){
201	scrubber.setBuffer(evt.bufferPercent);
202	}
203	}
204	break;
205	default:
206	scrubber.reset();
207	break;
208	}
209	}
210
211	private function updateVolumeSlider(evt:MediaEvent = null):void {
212	var volume:Slider = getButton('volume') as Slider;
213	if (volume){
214	if (!_player.config.mute) {
215	volume.setBuffer(100);
216	volume.setProgress(_player.config.volume);
217	volume.resize(getSkinElement("volumeSliderRail").width,volume.height);
218	} else {
219	volume.reset();
220	volume.resize(getSkinElement("volumeSliderRail").width,volume.height);
221	}
222	}
223	}
224
225
226	private function setTime(position:Number, duration:Number):void {
227	var textFormat:TextFormat = new TextFormat();
228	textFormat.font = "_sans";
229	textFormat.size = 10;
230	textFormat.bold = true;
231	textFormat.color = player.config.frontcolor.color;
232	if (position < 0) {
233	position = 0;
234	}
235	if (duration < 0) {
236	duration = 0;
237	}
238	var elapsedText:TextField = getButton('elapsed') as TextField;
239	elapsedText.text = Strings.digits(position);
240	elapsedText.setTextFormat(textFormat);
241	var durationField:TextField = getButton('duration') as TextField;
242	durationField.text = Strings.digits(duration);
243	durationField.setTextFormat(textFormat);
244	redraw();
245	}
246
247
248	private function setupBackground():void {
249	var back:DisplayObject = getSkinElement("background");
250	var capLeft:DisplayObject = getSkinElement("capLeft");
251	var capRight:DisplayObject = getSkinElement("capRight");
252	//var shade:DisplayObject = getSkinElement("shade");
253
254	if (!back) {
255	var newBackground:Sprite = new Sprite();
256	newBackground.name = "background";
257	newBackground.graphics.beginFill(0, 1);
258	newBackground.graphics.drawRect(0, 0, 1, 1);
259	newBackground.graphics.endFill();
260	back = newBackground as DisplayObject;
261	}
262
263	_buttons['background'] = back;
264	addChild(back);
265	_height = back.height;
266	player.config.pluginConfig("controlbar")['size'] = back.height;
267
268	if (capLeft) {
269	_buttons['capLeft'] = capLeft;
270	addChild(capLeft);
271	}
272
273	if (capRight) {
274	_buttons['capRight'] = capRight;
275	addChild(capRight);
276	}
277
278	/*if (shade) {
279	_buttons['shade'] = shade;
280	addChild(shade);
281	}*/
282	}
283
284
285	private function setupDefaultButtons():void {
286	addComponentButton('play', 'Play', ViewEvent.JWPLAYER_VIEW_PLAY);
287	addComponentButton('pause', 'Pause', ViewEvent.JWPLAYER_VIEW_PAUSE);
288	addComponentButton('prev', 'Previous', ViewEvent.JWPLAYER_VIEW_PREV);
289	addComponentButton('next', 'Next', ViewEvent.JWPLAYER_VIEW_NEXT);
290	addComponentButton('stop', 'Stop', ViewEvent.JWPLAYER_VIEW_STOP);
291	addComponentButton('fullscreen', 'Fullscreen', ViewEvent.JWPLAYER_VIEW_FULLSCREEN, true);
292	addComponentButton('normalscreen', 'Normalscreen', ViewEvent.JWPLAYER_VIEW_FULLSCREEN, false);
293	addComponentButton('unmute', 'Mute', ViewEvent.JWPLAYER_VIEW_MUTE, false);
294	addComponentButton('mute', 'Unmute', ViewEvent.JWPLAYER_VIEW_MUTE, true);
295	addTextField('elapsed');
296	addTextField('duration');
297	addSlider('time', Slider.HORIZONTAL, ViewEvent.JWPLAYER_VIEW_CLICK, seekHandler);
298	addSlider('volume', Slider.HORIZONTAL, ViewEvent.JWPLAYER_VIEW_CLICK, volumeHandler);
299	}
300
301
302	private function addComponentButton(name:String, text:String, event:String, eventData:* = null):void {
303	var button:ComponentButton = new ComponentButton();
304	button.name = name;
305	button.setOutIcon(getSkinElement(name + "Button"));
306	button.setOverIcon(getSkinElement(name + "ButtonOver"));
307	button.setBackground(getSkinElement(name + "ButtonBack"));
308	button.outColor = player.config.lightcolor;
309	button.overColor = player.config.backcolor;
310	button.clickFunction = function():void {
311	forward(new ViewEvent(event, eventData));
312	}
313	if (getSkinElement(name + "Button")
314	\|\| getSkinElement(name + "ButtonOver")
315	\|\| getSkinElement(name + "ButtonBack")) {
316	button.init();
317	addButtonDisplayObject(button, name);
318	}
319	}
320
321
322	private function addSlider(name:String, orientation:String, event:String, callback:Function):void {
323	var slider:Slider = new Slider(getSkinElement(name + "SliderRail") as Sprite, getSkinElement(name + "SliderBuffer") as Sprite, getSkinElement(name + "SliderProgress") as Sprite, getSkinElement(name + "SliderThumb") as Sprite, orientation);
324	slider.addEventListener(event, callback);
325	slider.name = name;
326	_buttons[name] = slider;
327	}
328
329
330	private function addTextField(name:String):void {
331	var textField:TextField = new TextField();
332	textField.selectable = false;
333	textField.autoSize = TextFieldAutoSize.LEFT;
334	textField.name = name;
335	addChild(textField);
336	_buttons[name] = textField;
337	}
338
339
340	private function forward(evt:ViewEvent):void {
341	dispatchEvent(evt);
342	}
343
344
345	private function volumeHandler(evt:ViewEvent):void {
346	dispatchEvent(new ViewEvent(ViewEvent.JWPLAYER_VIEW_VOLUME, evt.data * 100));
347	}
348
349
350	private function seekHandler(evt:ViewEvent):void {
351	var duration:Number = 0;
352	try {
353	duration = player.playlist.currentItem.duration;
354	} catch (err:Error) {
355	}
356	var percent:Number = Math.round(duration * evt.data);
357	dispatchEvent(new ViewEvent(ViewEvent.JWPLAYER_VIEW_SEEK, percent));
358	}
359
360
361	public function addButton(icon:DisplayObject, name:String, handler:Function = null):MovieClip {
362	_defaultLayout = _defaultLayout.replace("\|fullscreen","\|"+name+"\|fullscreen");
363	return addButtonDisplayObject(icon, name, handler);
364	}
365
366	private function addButtonDisplayObject(icon:DisplayObject, name:String, handler:Function = null):MovieClip{
367	if (icon) {
368	var clipMC:MovieClip = new MovieClip();
369	if (handler != null) {
370	clipMC.addEventListener(MouseEvent.CLICK, handler);
371	}
372	clipMC.name = name;
373	clipMC.addChild(icon);
374	_buttons[name] = clipMC;
375	return clipMC;
376	}
377	return null;
378	}
379
380	public function removeButton(name:String):void {
381	_buttons[name] = null;
382	redraw();
383	}
384
385
386	private function hideButton(name:String):void {
387	if (_buttons[name]) {
388	_buttons[name].visible = false;
389	}
390	}
391
392
393	public function getButton(buttonName:String):DisplayObject {
394	if (buttonName == "divider") {
395	var divider:DisplayObject = getSkinElement("divider");
396	if (divider) {
397	_dividers.push(divider);
398	}
399	return divider;
400	}
401	return _buttons[buttonName];
402	}
403
404
405	public function resize(width:Number, height:Number):void {
406	_width = width;
407
408	if (getConfigParam('position') == 'over' \|\| _player.fullscreen == true) {
409	player.config.pluginConfig("controlbar")['x'] = getConfigParam('margin');
410	player.config.pluginConfig("controlbar")['y'] = height - background.height - getConfigParam('margin');
411	_width = width - 2 * getConfigParam('margin');
412	}
413
414	//shade.width = _width;
415
416	var backgroundWidth:Number = _width;
417
418	backgroundWidth -= capLeft.width;
419	capLeft.x = 0;
420
421	backgroundWidth -= capRight.width;
422	capRight.x = _width - capRight.width;
423
424	background.width = backgroundWidth;
425	background.x = capLeft.width;
426	setChildIndex(capLeft,numChildren-1);
427	setChildIndex(capRight,numChildren-1);
428
429	updateControlbarState();
430	redraw();
431	Mouse.show();
432	}
433
434
435	private function redraw():void {
436	clearDividers();
437	_layoutManager.resize(_width, _height);
438	}
439
440
441	private function clearDividers():void {
442	for (var i:Number = 0; i < _dividers.length; i++){
443	_dividers[i].visible = false;
444	_dividers[i] = null;
445	}
446	_dividers = [];
447	}
448
449	public function get layout():String {
450	return _currentLayout;
451	}
452
453
454	private function getFont(textField:TextField):String {
455	var result:String;
456	if (textField) {
457	textField.getTextFormat().font;
458	}
459	return result;
460	}
461
462
463	private function get background():DisplayObject {
464	if (_buttons['background']) {
465	return _buttons['background'];
466	}
467	return (new Sprite());
468	}
469
470
471	/*private function get shade():DisplayObject {
472	if (_buttons['shade']) {
473	return _buttons['shade'];
474	}
475	return (new Sprite());
476	}*/
477
478	private function get capLeft():DisplayObject {
479	if (_buttons['capLeft']) {
480	return _buttons['capLeft'];
481	}
482	return (new Sprite());
483	}
484
485	private function get capRight():DisplayObject {
486	if (_buttons['capRight']) {
487	return _buttons['capRight'];
488	}
489	return (new Sprite());
490	}
491	}
492	}

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

Download in other formats:

Original Format