Context Navigation

PlaylistComponent.as @ 537

Visit:

Revision 537, 12.8 KB checked in by pablo, 4 years ago (diff)
Playlist now works on "over" state

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.Player;
6	import com.longtailvideo.jwplayer.player.PlayerState;
7	import com.longtailvideo.jwplayer.plugins.PluginConfig;
8	import com.longtailvideo.jwplayer.utils.Draw;
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
15	import flash.display.DisplayObject;
16	import flash.display.Loader;
17	import flash.display.MovieClip;
18	import flash.display.Sprite;
19	import flash.events.Event;
20	import flash.events.MouseEvent;
21	import flash.geom.ColorTransform;
22	import flash.net.URLRequest;
23	import flash.utils.clearInterval;
24	import flash.utils.setInterval;
25
26
27	public class PlaylistComponent extends CoreComponent implements IPlaylistComponent {
28	/ Reference to the playlist MC. /
29	public var clip:MovieClip;
30	/ Array with all button instances /
31	private var buttons:Array;
32	/ Height of a button (to calculate scrolling) /
33	private var buttonheight:Number;
34	/ Currently active button. /
35	private var active:Number;
36	/ Proportion between clip and mask. /
37	private var proportion:Number;
38	/ Interval ID for scrolling /
39	private var scrollInterval:Number;
40	/ Image dimensions. /
41	private var image:Array;
42	/ Color object for backcolor. /
43	private var back:ColorTransform;
44	/ Color object for frontcolor. /
45	private var front:ColorTransform;
46	/ Color object for lightcolor. /
47	private var light:ColorTransform;
48
49
50	public function PlaylistComponent(player:Player) {
51	super(player);
52	player.addEventListener(PlaylistEvent.JWPLAYER_PLAYLIST_ITEM, itemHandler);
53	player.addEventListener(PlaylistEvent.JWPLAYER_PLAYLIST_LOADED, playlistHandler);
54	player.addEventListener(PlaylistEvent.JWPLAYER_PLAYLIST_UPDATED, playlistHandler);
55	player.addEventListener(PlayerStateEvent.JWPLAYER_PLAYER_STATE, stateHandler);
56	clip = _player.skin.getSWFSkin().getChildByName("playlist") as MovieClip;
57	addChild(clip);
58	buttonheight = clip.list.button.height;
59	clip.list.button.visible = false;
60	clip.list.mask = clip.masker;
61	clip.list.addEventListener(MouseEvent.CLICK, clickHandler);
62	clip.list.addEventListener(MouseEvent.MOUSE_OVER, overHandler);
63	clip.list.addEventListener(MouseEvent.MOUSE_OUT, outHandler);
64	clip.slider.buttonMode = true;
65	clip.slider.mouseChildren = false;
66	clip.slider.addEventListener(MouseEvent.MOUSE_DOWN, sdownHandler);
67	clip.slider.addEventListener(MouseEvent.MOUSE_OVER, soverHandler);
68	clip.slider.addEventListener(MouseEvent.MOUSE_OUT, soutHandler);
69	clip.slider.visible = false;
70	buttons = new Array();
71	try {
72	image = new Array(clip.list.button.image.width, clip.list.button.image.height);
73	} catch (err:Error) {
74	}
75	if (clip.list.button['back']) {
76	setColors();
77	}
78	}
79
80
81	/ Handle a button rollover. /
82	private function overHandler(evt:MouseEvent):void {
83	var idx:Number = Number(evt.target.name);
84	if (front && back) {
85	for (var itm:String in _player.playlist.getItemAt(idx)) {
86	if (buttons[idx].c[itm] && typeof(buttons[idx].c[itm]) == "object") {
87	buttons[idx].c[itm].textColor = back.color;
88	}
89	}
90	buttons[idx].c['back'].transform.colorTransform = light;
91	}
92	buttons[idx].c.gotoAndStop('over');
93	};
94
95
96	/ Handle a button rollover. /
97	private function outHandler(evt:MouseEvent):void {
98	var idx:Number = Number(evt.target.name);
99	if (front && back) {
100	for (var itm:String in _player.playlist.getItemAt(idx)) {
101	if (buttons[idx].c[itm] && typeof(buttons[idx].c[itm]) == "object") {
102	if (idx == active) {
103	buttons[idx].c[itm].textColor = light.color;
104	} else {
105	buttons[idx].c[itm].textColor = front.color;
106	}
107	}
108	}
109	buttons[idx].c['back'].transform.colorTransform = back;
110	}
111	if (idx == active) {
112	buttons[idx].c.gotoAndStop('active');
113	} else {
114	buttons[idx].c.gotoAndStop('out');
115	}
116	};
117
118
119	/ Setup all buttons in the playlist /
120	private function buildPlaylist(clr:Boolean):void {
121	if (!_player.playlist) {
122	return;
123	}
124	var wid:Number = clip.back.width;
125	var hei:Number = clip.back.height;
126	clip.masker.height = hei;
127	clip.masker.width = wid;
128	proportion = _player.playlist.length * buttonheight / hei;
129	if (proportion > 1.01) {
130	wid -= clip.slider.width;
131	buildSlider();
132	} else {
133	clip.slider.visible = false;
134	}
135	if (clr) {
136	clip.list.y = clip.masker.y;
137	for (var j:Number = 0; j < buttons.length; j++) {
138	clip.list.removeChild(buttons[j].c);
139	}
140	buttons = new Array();
141	} else {
142	if (proportion > 1) {
143	scrollEase();
144	}
145	}
146	for (var i:Number = 0; i < _player.playlist.length; i++) {
147	if (clr) {
148	var btn:MovieClip = Draw.clone(clip.list.button, true) as MovieClip;
149	var stc:Stacker = new Stacker(btn);
150	btn.y = i * buttonheight;
151	btn.buttonMode = true;
152	btn.mouseChildren = false;
153	btn.name = i.toString();
154	buttons.push({c: btn, s: stc});
155	setContents(i);
156	}
157	if (buttons[i]) {
158	(buttons[i].s as Stacker).rearrange(wid);
159	}
160	}
161	}
162
163
164	/ Setup the scrollbar component /
165	private function buildSlider():void {
166	var scr:MovieClip = clip.slider;
167	scr.visible = true;
168	scr.x = clip.back.width - scr.width;
169	var dif:Number = clip.back.height - scr.height - scr.y;
170	scr.back.height += dif;
171	scr.rail.height += dif;
172	scr.icon.height = Math.round(scr.rail.height / proportion);
173	}
174
175
176	/ Make sure the playlist is not out of range. /
177	private function scrollEase(ips:Number = -1, cps:Number = -1):void {
178	var scr:MovieClip = clip.slider;
179	if (ips != -1) {
180	scr.icon.y = Math.round(ips - (ips - scr.icon.y) / 1.5);
181	clip.list.y = Math.round((cps - (cps - clip.list.y) / 1.5));
182	}
183	if (clip.list.y > 0 \|\| scr.icon.y < scr.rail.y) {
184	clip.list.y = clip.masker.y;
185	scr.icon.y = scr.rail.y;
186	} else if (clip.list.y < clip.masker.height - clip.list.height \|\| scr.icon.y > scr.rail.y + scr.rail.height - scr.icon.height) {
187	scr.icon.y = scr.rail.y + scr.rail.height - scr.icon.height;
188	clip.list.y = clip.masker.y + clip.masker.height - clip.list.height;
189	}
190	};
191
192
193	/ Scrolling handler. /
194	private function scrollHandler():void {
195	var scr:MovieClip = clip.slider;
196	var yps:Number = scr.mouseY - scr.rail.y;
197	var ips:Number = yps - scr.icon.height / 2;
198	var cps:Number = clip.masker.y + clip.masker.height / 2 - proportion * yps;
199	scrollEase(ips, cps);
200	};
201
202
203	/ Init the colors. /
204	private function setColors():void {
205	if (_player.config.backcolor) {
206	back = new ColorTransform();
207	back.color = _player.config.backcolor.color;
208	clip.back.transform.colorTransform = back;
209	clip.slider.back.transform.colorTransform = back;
210	}
211	if (_player.config.frontcolor) {
212	front = new ColorTransform();
213	front.color = _player.config.frontcolor.color;
214	try {
215	clip.slider.icon.transform.colorTransform = front;
216	clip.slider.rail.transform.colorTransform = front;
217	} catch (err:Error) {
218	}
219	if (_player.config.lightcolor) {
220	light = new ColorTransform();
221	light.color = _player.config.lightcolor.color;
222	} else {
223	light = front;
224	}
225	}
226	};
227
228
229	/ Setup button elements /
230	private function setContents(idx:Number):void {
231	var playlistItem:PlaylistItem = _player.playlist.getItemAt(idx);
232	buttons[idx].c.gotoAndStop(0);
233	if (playlistItem.image) {
234	if (config['thumbs'] != false && _player.config.playlist != 'none' && playlistItem.image) {
235	var img:MovieClip = buttons[idx].c.image;
236	var msk:Sprite = Draw.rect(buttons[idx].c, '0xFF0000', img.width, img.height, img.x, img.y);
237	var ldr:Loader = new Loader();
238	img.mask = msk;
239	img.addChild(ldr);
240	ldr.contentLoaderInfo.addEventListener(Event.COMPLETE, loaderHandler);
241	if (playlistItem.image) {
242	ldr.load(new URLRequest(playlistItem.image));
243	}
244	}
245	}
246	if (playlistItem.duration) {
247	if (playlistItem.duration > 0) {
248	buttons[idx].c['duration'].text = Strings.digits(playlistItem.duration);
249	if (front) {
250	buttons[idx].c['duration'].textColor = front.color;
251	}
252	}
253	}
254	try {
255	buttons[idx].c['description'].htmlText = playlistItem.description;
256	buttons[idx].c['title'].htmlText = "<b>" + playlistItem.title + "</b>";
257	if (front) {
258	buttons[idx].c['description'].textColor = front.color;
259	buttons[idx].c['title'].textColor = front.color;
260	}
261	} catch (e:Error) {
262	}
263	if (buttons[idx].c['image'] && (!playlistItem.image \|\| config['thumbs'] == false)) {
264	buttons[idx].c['image'].visible = false;
265	}
266	if (back) {
267	buttons[idx].c['back'].transform.colorTransform = back;
268	}
269	}
270
271
272	/ Loading of image completed; resume loading /
273	private function loaderHandler(evt:Event):void {
274	var ldr:Loader = Loader(evt.target.loader);
275	Stretcher.stretch(ldr, image[0], image[1], Stretcher.FILL);
276	};
277
278
279	/ Start scrolling the playlist on mousedown. /
280	private function sdownHandler(evt:MouseEvent):void {
281	clearInterval(scrollInterval);
282	clip.stage.addEventListener(MouseEvent.MOUSE_UP, supHandler);
283	scrollHandler();
284	scrollInterval = setInterval(scrollHandler, 50);
285	};
286
287
288	/ Revert the highlight on mouseout. /
289	private function soutHandler(evt:MouseEvent):void {
290	if (front) {
291	clip.slider.icon.transform.colorTransform = front;
292	} else {
293	clip.slider.icon.gotoAndStop('out');
294	}
295	};
296
297
298	/ Highlight the icon on rollover. /
299	private function soverHandler(evt:MouseEvent):void {
300	if (front) {
301	clip.slider.icon.transform.colorTransform = light;
302	} else {
303	clip.slider.icon.gotoAndStop('over');
304	}
305	};
306
307
308	/ Stop scrolling the playlist on mouseout. /
309	private function supHandler(evt:MouseEvent):void {
310	clearInterval(scrollInterval);
311	clip.stage.removeEventListener(MouseEvent.MOUSE_UP, supHandler);
312	};
313
314
315	/ Handle a click on a button. /
316	private function clickHandler(evt:MouseEvent):void {
317	_player.playlistItem(Number(evt.target.name));
318	}
319
320
321	/ Process resizing requests /
322	public function resize(width:Number, height:Number):void {
323	clip.x = 0;
324	clip.y = 0;
325	clip.back.width = width;
326	clip.back.height = height;
327	buildPlaylist(false);
328	stateHandler();
329	if (clip.visible && config['visible'] === false) {
330	clip.visible = false;
331	}
332	}
333
334
335	/** Switch the currently active item */
336	protected function itemHandler(evt:PlaylistEvent = null):void {
337	var idx:Number = _player.playlist.currentIndex;
338	clearInterval(scrollInterval);
339	if (proportion > 1.01) {
340	scrollInterval = setInterval(scrollEase, 50, idx * buttonheight / proportion, -idx * buttonheight + clip.masker.y);
341	}
342	if (light) {
343	for (var itm:String in _player.playlist.getItemAt(idx)) {
344	if (buttons[idx].c[itm]) {
345	try {
346	buttons[idx].c[itm].textColor = light.color;
347	} catch (err:Error) {
348	}
349	}
350	}
351	}
352	if (back) {
353	buttons[idx].c['back'].transform.colorTransform = back;
354	}
355	buttons[idx].c.gotoAndStop('active');
356	if (!isNaN(active)) {
357	if (front) {
358	for (var act:String in _player.playlist.getItemAt(active)) {
359	if (buttons[active].c[act]) {
360	try {
361	buttons[active].c[act].textColor = front.color;
362	} catch (err:Error) {
363	}
364	}
365	}
366	}
367	buttons[active].c.gotoAndStop('out');
368	}
369	active = idx;
370	}
371
372
373	/ New playlist loaded: rebuild the playclip. /
374	protected function playlistHandler(evt:PlaylistEvent = null):void {
375	clearInterval(scrollInterval);
376	active = undefined;
377	buildPlaylist(true);
378	resize(width, height);
379	}
380
381
382	/ Process state changes /
383	protected function stateHandler(evt:PlayerStateEvent = null):void {
384	if (config['position'] == 'over') {
385	if (player.state == PlayerState.PLAYING \|\| player.state == PlayerState.PAUSED \|\| player.state == PlayerState.BUFFERING) {
386	clip.visible = false;
387	} else {
388	clip.visible = true;
389	}
390	}
391	}
392
393
394	protected function get config():PluginConfig {
395	return player.config.pluginConfig('playlist');
396	}
397
398
399	protected function getSkinElement(component:String, element:String):DisplayObject {
400	return _player.skin.getSkinElement(component, element);
401	}
402	}
403	}

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

Download in other formats:

Original Format