Context Navigation

PlaylistComponent.as @ 627

Visit:

Revision 627, 20.4 KB checked in by pablo, 4 years ago (diff)
PLAYLIST_ITEM event sent after PLAYER_READY if playlist was loaded during player setup V4 COMPLETE state set in view.config if playlist is at last item during IDLE state Fixed playlist masking issue

Line
1	package com.longtailvideo.jwplayer.view.components {
2	import com.longtailvideo.jwplayer.events.PlayerStateEvent;
3	import com.longtailvideo.jwplayer.events.PlaylistEvent;
4	import com.longtailvideo.jwplayer.model.PlaylistItem;
5	import com.longtailvideo.jwplayer.player.IPlayer;
6	import com.longtailvideo.jwplayer.player.PlayerState;
7	import com.longtailvideo.jwplayer.utils.Draw;
8	import com.longtailvideo.jwplayer.utils.RootReference;
9	import com.longtailvideo.jwplayer.utils.Stacker;
10	import com.longtailvideo.jwplayer.utils.Stretcher;
11	import com.longtailvideo.jwplayer.utils.Strings;
12	import com.longtailvideo.jwplayer.view.PlayerLayoutManager;
13	import com.longtailvideo.jwplayer.view.interfaces.IPlaylistComponent;
14	import com.longtailvideo.jwplayer.view.interfaces.ISkin;
15	import com.longtailvideo.jwplayer.view.skins.DefaultSkin;
16	import com.longtailvideo.jwplayer.view.skins.SWFSkin;
17
18	import flash.display.DisplayObject;
19	import flash.display.DisplayObjectContainer;
20	import flash.display.Loader;
21	import flash.display.MovieClip;
22	import flash.display.Sprite;
23	import flash.events.Event;
24	import flash.events.MouseEvent;
25	import flash.geom.ColorTransform;
26	import flash.geom.Rectangle;
27	import flash.net.URLRequest;
28	import flash.text.TextField;
29	import flash.text.TextFormat;
30	import flash.utils.clearInterval;
31	import flash.utils.setInterval;
32
33
34	public class PlaylistComponent extends CoreComponent implements IPlaylistComponent {
35	/ Array with all button instances /
36	private var buttons:Array;
37	/ Height of a button (to calculate scrolling) /
38	private var buttonheight:Number;
39	/ Currently active button. /
40	private var active:Number;
41	/ Proportion between clip and mask. /
42	private var proportion:Number;
43	/ Interval ID for scrolling /
44	private var scrollInterval:Number;
45	/ Image dimensions. /
46	private var image:Array;
47	/ Color object for backcolor. /
48	private var back:ColorTransform;
49	/ Color object for frontcolor. /
50	private var front:ColorTransform;
51	/ Color object for lightcolor. /
52	private var light:ColorTransform;
53	/ Visual representation of a the playlist /
54	private var list:Sprite;
55	/ Visual representation of a playlist item /
56	private var button:Sprite;
57	/ The playlist mask /
58	private var listmask:Sprite;
59	/ The playlist slider /
60	private var slider:Sprite;
61	/ The playlist background /
62	private var background:Sprite;
63	/ Internal reference to the skin /
64	private var skin:ISkin;
65	private var skinLoaded:Boolean = false;
66	private var pendingResize:Rectangle;
67	private var pendingBuild:Boolean = false;
68
69	public function PlaylistComponent(player:IPlayer) {
70	super(player, "playlist");
71	player.addEventListener(PlaylistEvent.JWPLAYER_PLAYLIST_ITEM, itemHandler);
72	player.addEventListener(PlaylistEvent.JWPLAYER_PLAYLIST_LOADED, playlistHandler);
73	player.addEventListener(PlaylistEvent.JWPLAYER_PLAYLIST_UPDATED, playlistHandler);
74	player.addEventListener(PlayerStateEvent.JWPLAYER_PLAYER_STATE, stateHandler);
75
76	if (_player.skin is SWFSkin && !_player.skin.hasComponent('playlist')) {
77	var defaultSkin:DefaultSkin = new DefaultSkin();
78	defaultSkin.addEventListener(Event.COMPLETE, continueSetup);
79	skin = defaultSkin;
80	defaultSkin.load();
81	} else {
82	skinLoaded = true;
83	skin = _player.skin;
84	continueSetup();
85	}
86	}
87
88	protected function continueSetup(evt:Event=null):void {
89	skinLoaded = true;
90
91	background = getSkinElement("background") as Sprite;
92	if (!background) {
93	background = new Sprite();
94	background.name = "background";
95	background.graphics.beginFill(0, 1);
96	background.graphics.drawRect(0, 0, 1, 1);
97	background.graphics.endFill();
98	}
99	addElement(background);
100	slider = getSkinElement("slider") as Sprite;
101	if (!slider) {
102	slider = new Sprite();
103
104	var sliderBack:Sprite = getSkinElement("sliderBackground") as Sprite;
105	if (!sliderBack) {
106	sliderBack = new Sprite();
107	sliderBack.graphics.beginFill(0, 1);
108	sliderBack.graphics.drawRect(0, 0, 1, 1);
109	sliderBack.graphics.endFill();
110	}
111	sliderBack.name = "back";
112	addElement(sliderBack,slider);
113
114	var sliderRail:Sprite = getSkinElement("sliderRail") as Sprite;
115	if (!sliderRail){
116	sliderRail = new Sprite();
117	sliderRail.graphics.beginFill(0, 1);
118	sliderRail.graphics.drawRect(0, 0, 7, 22);
119	sliderRail.graphics.endFill();
120	}
121	sliderRail.name = "rail";
122	addElement(sliderRail,slider);
123
124	var sliderThumb:Sprite = getSkinElement("sliderThumb") as Sprite;
125	if (!sliderThumb) {
126	sliderThumb = new Sprite();
127	sliderThumb.graphics.beginFill(0, 1);
128	sliderThumb.graphics.drawRect(0, 0, 5, 54);
129	sliderThumb.graphics.endFill();
130	}
131	sliderThumb.name = "icon";
132	addElement(sliderThumb,slider,(sliderRail.width - sliderThumb.width)/2);
133	}
134	addElement(slider);
135	slider.buttonMode = true;
136	slider.mouseChildren = false;
137	slider.addEventListener(MouseEvent.MOUSE_DOWN, sdownHandler);
138	slider.addEventListener(MouseEvent.MOUSE_OVER, soverHandler);
139	slider.addEventListener(MouseEvent.MOUSE_OUT, soutHandler);
140	slider.visible = false;
141	listmask = getSkinElement("masker") as Sprite;
142	if (!listmask) {
143	listmask = new Sprite();
144	listmask.graphics.beginFill(0xff0000, 1);
145	listmask.graphics.drawRect(0, 0, 1, 1);
146	listmask.graphics.endFill();
147	}
148	addElement(listmask);
149	list = getSkinElement("list") as Sprite;
150	if (!list) {
151	list = new Sprite();
152	button = buildButton() as Sprite;
153	addElement(button, list);
154	} else {
155	button = list.getChildByName("button") as Sprite;
156	}
157	buttonheight = button.height;
158	button.visible = false;
159	list.mask = listmask;
160	list.addEventListener(MouseEvent.CLICK, clickHandler);
161	list.addEventListener(MouseEvent.MOUSE_OVER, overHandler);
162	list.addEventListener(MouseEvent.MOUSE_OUT, outHandler);
163	addElement(list);
164	buttons = new Array();
165	this.addEventListener(MouseEvent.MOUSE_WHEEL, wheelHandler);
166	try {
167	image = new Array(button.getChildByName("image").width, button.getChildByName("image").height);
168	} catch (err:Error) {
169	}
170	if (button.getChildByName("back")) {
171	setColors();
172	}
173	if (pendingBuild) {
174	buildPlaylist(true);
175	}
176	if (pendingResize) {
177	resize(pendingResize.width, pendingResize.height);
178	}
179	}
180
181
182	private function buildButton():MovieClip {
183	var btn:MovieClip = new MovieClip();
184
185	var backOver:Sprite = getSkinElement("itemOver") as Sprite;
186	if (!backOver) {
187	backOver = new Sprite();
188	backOver.graphics.beginFill(0, 1);
189	backOver.graphics.drawRect(0, 0, 1, 1);
190	backOver.graphics.endFill();
191	}
192	backOver.name = "backOver";
193	addElement(backOver, btn, 0, 0);
194
195	var back:Sprite = getSkinElement("item") as Sprite;
196	if (!back) {
197	back = new Sprite();
198	back.graphics.beginFill(0, 1);
199	back.graphics.drawRect(0, 0, 100, 100);
200	back.graphics.endFill();
201	}
202	back.name = "back";
203	addElement(back, btn, 0, 0);
204
205	var img:Sprite = new Sprite();
206	img.name = "image";
207	img.graphics.beginFill(0, 1);
208	img.graphics.drawRect(0, 0, 80, back.height);
209	img.graphics.endFill();
210	addElement(img, btn, 1, 1);
211
212	var titleTextFormat:TextFormat = new TextFormat();
213	titleTextFormat.size = 13;
214	titleTextFormat.font = "_sans";
215	titleTextFormat.bold = true;
216	var title:TextField = new TextField();
217	title.name = "title";
218	//title.autoSize = TextFieldAutoSize.LEFT;
219	title.defaultTextFormat = titleTextFormat;
220	title.wordWrap = true;
221	title.multiline = true;
222	title.width = 250;
223	title.height = 20;
224	addElement(title, btn, 85, 2);
225
226	var descriptionTextFormat:TextFormat = new TextFormat();
227	descriptionTextFormat.size = 11;
228	descriptionTextFormat.font = "_sans";
229	var description:TextField = new TextField();
230	description.name = "description";
231	//description.autoSize = TextFieldAutoSize.LEFT;
232	description.wordWrap = true;
233	description.multiline = true;
234	description.width= 290;
235	description.height = back.height - 20;
236	description.defaultTextFormat = descriptionTextFormat;
237	addElement(description, btn, 86, 20);
238
239	var duration:TextField = new TextField();
240	duration.name = "duration";
241	duration.width = 40;
242	duration.height = 20;
243	addElement(duration, btn, 335, 4);
244
245	backOver.width = btn.width;
246	back.width = btn.width;
247
248	return btn;
249	}
250
251	private function addElement(doc:DisplayObject, parent:DisplayObjectContainer = null, x:Number = 0, y:Number = 0):void {
252	if (!parent) {
253	parent = this;
254	}
255	parent.addChild(doc);
256	doc.x = x;
257	doc.y = y;
258	}
259
260
261	/ Handle a button rollover. /
262	private function overHandler(evt:MouseEvent):void {
263	var idx:Number = Number(evt.target.name);
264	if (front && back) {
265	for (var itm:String in _player.playlist.getItemAt(idx)) {
266	if (getButton(idx).getChildByName(itm) && getButton(idx).getChildByName(itm) is TextField) {
267	(getButton(idx).getChildByName(itm) as TextField).textColor = back.color;
268	}
269	}
270	if (swfSkinned) {
271	getButton(idx).getChildByName("back").transform.colorTransform = light;
272	} else {
273	getButton(idx).setChildIndex(getButton(idx).getChildByName("back"), 0);
274	getButton(idx).setChildIndex(getButton(idx).getChildByName("backOver"), 1);
275	}
276	}
277	}
278
279
280	/ Handle a button rollover. /
281	private function outHandler(evt:MouseEvent):void {
282	var idx:Number = Number(evt.target.name);
283	if (front && back) {
284	for (var itm:String in _player.playlist.getItemAt(idx)) {
285	if (getButton(idx).getChildByName(itm) && getButton(idx).getChildByName(itm) is TextField) {
286	if (idx == active) {
287	(getButton(idx).getChildByName(itm) as TextField).textColor = light.color;
288	} else {
289	(getButton(idx).getChildByName(itm) as TextField).textColor = front.color;
290	}
291	}
292	}
293	if (swfSkinned) {
294	getButton(idx).getChildByName("back").transform.colorTransform = back;
295	} else {
296	getButton(idx).setChildIndex(getButton(idx).getChildByName("backOver"), 0);
297	getButton(idx).setChildIndex(getButton(idx).getChildByName("back"), 1);
298	}
299	}
300	}
301
302
303	/ Setup all buttons in the playlist /
304	private function buildPlaylist(clr:Boolean):void {
305	if (!_player.playlist \|\| player.playlist.length < 1) {
306	return;
307	}
308	if (!skinLoaded) {
309	pendingBuild = true;
310	return
311	}
312	var wid:Number = getConfigParam("width");
313	var hei:Number = getConfigParam("height");
314	listmask.height = hei;
315	listmask.width = wid;
316	proportion = _player.playlist.length * buttonheight / hei;
317	if (proportion > 1.01) {
318	wid -= slider.width;
319	buildSlider();
320	} else {
321	slider.visible = false;
322	}
323	if (clr) {
324	list.y = listmask.y;
325	for (var j:Number = 0; j < buttons.length; j++) {
326	list.removeChild(getButton(j));
327	}
328	buttons = new Array();
329	} else {
330	if (proportion > 1) {
331	scrollEase();
332	}
333	}
334	for (var i:Number = 0; i < _player.playlist.length; i++) {
335	if (clr) {
336	var btn:MovieClip;
337	if (swfSkinned) {
338	btn = Draw.clone(button, true) as MovieClip;
339	} else {
340	btn = buildButton();
341	list.addChild(btn);
342	}
343	var stc:Stacker = new Stacker(btn);
344	btn.y = i * buttonheight;
345	btn.buttonMode = true;
346	btn.mouseChildren = false;
347	btn.name = i.toString();
348	buttons.push({c: btn, s: stc});
349	setContents(i);
350	}
351	if (buttons[i]) {
352	(buttons[i].s as Stacker).rearrange(wid);
353	}
354	}
355	}
356
357
358	/ Setup the scrollbar component /
359	private function buildSlider():void {
360	slider.visible = true;
361	slider.x = getConfigParam("width") - slider.width;
362	var dif:Number = getConfigParam("height") - slider.height - slider.y;
363	slider.getChildByName("back").height += dif;
364	slider.getChildByName("rail").height += dif;
365	slider.getChildByName("icon").height = Math.round(slider.getChildByName("rail").height / proportion);
366	}
367
368
369	/ Make sure the playlist is not out of range. /
370	private function scrollEase(ips:Number = -1, cps:Number = -1):void {
371	if (ips != -1) {
372	slider.getChildByName("icon").y = Math.round(ips - (ips - slider.getChildByName("icon").y) / 1.5);
373	list.y = Math.round((cps - (cps - list.y) / 1.5));
374	}
375	if (list.y > 0 \|\| slider.getChildByName("icon").y < slider.getChildByName("rail").y) {
376	list.y = listmask.y;
377	slider.getChildByName("icon").y = slider.getChildByName("rail").y;
378	} else if (list.y < listmask.height - list.height \|\| slider.getChildByName("icon").y > slider.getChildByName("rail").y + slider.getChildByName("rail").height - slider.getChildByName("icon").height) {
379	slider.getChildByName("icon").y = slider.getChildByName("rail").y + slider.getChildByName("rail").height - slider.getChildByName("icon").height;
380	list.y = listmask.y + listmask.height - list.height;
381	}
382	}
383
384
385	/ Scrolling handler. /
386	private function scrollHandler():void {
387	var yps:Number = slider.mouseY - slider.getChildByName("rail").y;
388	var ips:Number = yps - slider.getChildByName("icon").height / 2;
389	var cps:Number = listmask.y + listmask.height / 2 - proportion * yps;
390	scrollEase(ips, cps);
391	}
392
393
394	/ Init the colors. /
395	private function setColors():void {
396	if (_player.config.backcolor) {
397	back = new ColorTransform();
398	back.color = _player.config.backcolor.color;
399	if (swfSkinned) {
400	background.transform.colorTransform = back;
401	slider.getChildByName("back").transform.colorTransform = back;
402	}
403	}
404	if (_player.config.frontcolor) {
405	front = new ColorTransform();
406	front.color = _player.config.frontcolor.color;
407	try {
408	if (swfSkinned) {
409	slider.getChildByName("icon").transform.colorTransform = front;
410	slider.getChildByName("rail").transform.colorTransform = front;
411	}
412	} catch (err:Error) {
413	}
414	if (_player.config.lightcolor) {
415	light = new ColorTransform();
416	light.color = _player.config.lightcolor.color;
417	} else {
418	light = front;
419	}
420	}
421	}
422
423
424	/ Setup button elements /
425	private function setContents(idx:Number):void {
426	var playlistItem:PlaylistItem = _player.playlist.getItemAt(idx);
427	var title:TextField = getButton(idx).getChildByName("title") as TextField;
428	var description:TextField = getButton(idx).getChildByName("description") as TextField;
429	var duration:TextField = getButton(idx).getChildByName("duration") as TextField;
430	if (playlistItem.image) {
431	if (getConfigParam('thumbs') != false && _player.config.playlist != 'none' && playlistItem.image) {
432	var img:Sprite = getButton(idx).getChildByName("image") as Sprite;
433	if (img) {
434	var msk:Sprite = Draw.rect(getButton(idx), '0xFF0000', img.width, img.height, img.x, img.y);
435	var ldr:Loader = new Loader();
436	img.mask = msk;
437	img.addChild(ldr);
438	ldr.contentLoaderInfo.addEventListener(Event.COMPLETE, loaderHandler);
439	if (playlistItem.image) {
440	ldr.load(new URLRequest(playlistItem.image));
441	}
442	}
443	}
444	}
445	if (duration && playlistItem.duration) {
446	if (playlistItem.duration > 0) {
447	duration.text = Strings.digits(playlistItem.duration);
448	if (front) {
449	duration.textColor = front.color;
450	}
451	}
452	}
453	try {
454	if (description) {
455	description.htmlText = playlistItem.description;
456	}
457	if (title) {
458	title.htmlText = "<b>" + playlistItem.title + "</b>";
459	}
460	if (front) {
461	description.textColor = front.color;
462	title.textColor = front.color;
463	}
464	} catch (e:Error) {
465	}
466	if (getButton(idx).getChildByName("image") && (!playlistItem.image \|\| getConfigParam('thumbs') == false)) {
467	getButton(idx).getChildByName("image").visible = false;
468	}
469	if (back && swfSkinned) {
470	getButton(idx).getChildByName("back").transform.colorTransform = back;
471	}
472	}
473
474
475	/ Loading of image completed; resume loading /
476	private function loaderHandler(evt:Event):void {
477	var ldr:Loader = Loader(evt.target.loader);
478	Stretcher.stretch(ldr, image[0], image[1], Stretcher.FILL);
479	}
480
481
482	private function wheelHandler(evt:MouseEvent):void {
483	//scrollEase(evt.delta * -1, getConfigParam("height"));
484	}
485
486
487	/ Start scrolling the playlist on mousedown. /
488	private function sdownHandler(evt:MouseEvent):void {
489	clearInterval(scrollInterval);
490	RootReference.stage.addEventListener(MouseEvent.MOUSE_UP, supHandler);
491	scrollHandler();
492	scrollInterval = setInterval(scrollHandler, 50);
493	}
494
495
496	/ Revert the highlight on mouseout. /
497	private function soutHandler(evt:MouseEvent):void {
498	if (front && swfSkinned) {
499	slider.getChildByName("icon").transform.colorTransform = front;
500	} else {
501	//slider.getChildByName("icon").gotoAndStop('out');
502	}
503	}
504
505
506	/ Highlight the icon on rollover. /
507	private function soverHandler(evt:MouseEvent):void {
508	if (front && swfSkinned) {
509	slider.getChildByName("icon").transform.colorTransform = light;
510	} else {
511	//slider.getChildByName("icon").gotoAndStop('over');
512	}
513	}
514
515
516	/ Stop scrolling the playlist on mouseout. /
517	private function supHandler(evt:MouseEvent):void {
518	clearInterval(scrollInterval);
519	RootReference.stage.removeEventListener(MouseEvent.MOUSE_UP, supHandler);
520	}
521
522
523	/ Handle a click on a button. /
524	private function clickHandler(evt:MouseEvent):void {
525	_player.playlistItem(Number(evt.target.name));
526	}
527
528
529	/ Process resizing requests /
530	public function resize(width:Number, height:Number):void {
531	if (skinLoaded) {
532	setConfigParam("width", width);
533	setConfigParam("height", height);
534	background.width = width;
535	background.height = height;
536	buildPlaylist(false);
537	if (PlayerLayoutManager.testPosition(getConfigParam('position'))) {
538	visible = true;
539	} else if (getConfigParam('position') == "over") {
540	stateHandler();
541	} else {
542	visible = false;
543	}
544	if (visible && getConfigParam('visible') === false) {
545	visible = false;
546	}
547	} else {
548	pendingResize = new Rectangle(0,0,width,height);
549	}
550	}
551
552
553	/** Switch the currently active item */
554	protected function itemHandler(evt:PlaylistEvent = null):void {
555	var idx:Number = _player.playlist.currentIndex;
556	clearInterval(scrollInterval);
557	if (proportion > 1.01) {
558	scrollInterval = setInterval(scrollEase, 50, idx * buttonheight / proportion, -idx * buttonheight + listmask.y);
559	}
560	if (light) {
561	for (var itm:String in _player.playlist.getItemAt(idx)) {
562	if (getButton(idx).getChildByName(itm)) {
563	try {
564	(getButton(idx).getChildByName(itm) as TextField).textColor = light.color;
565	} catch (err:Error) {
566	}
567	}
568	}
569	}
570	if (back && swfSkinned) {
571	getButton(idx).getChildByName("back").transform.colorTransform = back;
572	}
573	if (!isNaN(active)) {
574	if (front) {
575	for (var act:String in _player.playlist.getItemAt(active)) {
576	if (getButton(active).getChildByName(act)) {
577	try {
578	(getButton(active).getChildByName(act) as TextField).textColor = front.color;
579	} catch (err:Error) {
580	}
581	}
582	}
583	}
584	}
585	active = idx;
586	}
587
588
589	/ New playlist loaded: rebuild the playclip. /
590	protected function playlistHandler(evt:PlaylistEvent = null):void {
591	clearInterval(scrollInterval);
592	active = undefined;
593	buildPlaylist(true);
594	resize(background.width, background.height);
595	}
596
597
598	/ Process state changes /
599	protected function stateHandler(evt:PlayerStateEvent = null):void {
600	if (getConfigParam('position') == "over") {
601	if (player.state == PlayerState.PLAYING \|\| player.state == PlayerState.PAUSED \|\| player.state == PlayerState.BUFFERING) {
602	visible = false;
603	} else {
604	visible = true;
605	}
606	}
607	}
608
609
610	private function getButton(id:Number):Sprite {
611	return buttons[id].c as Sprite;
612	}
613
614	private function get swfSkinned():Boolean {
615	if (skin is SWFSkin) {
616	return (skin.hasComponent('playlist'));
617	}
618	return false;
619	}
620
621	protected override function getSkinElement(element:String):DisplayObject {
622	return skin.getSkinElement(_name,element);
623	}
624
625	}
626	}
627

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

Download in other formats:

Original Format