Carousel question!

programming flash
1

Hi!

Doing my very best to crack this one but in rather over my head! I’m using an AS3 carousel which has been adapted from Lee Brimelow (by matbury @ actionscript.org)…

…and I’m trying to figure out how to display more than one type of icon in the carousel - in other words - it seems to me items in carousel are generated onto the stage by a for loop:

// place Items on stage
function init():void {
for(var i:uint = 0; i < numOfItems; i++) {
var item:Item = new Item();
// public var angl:Number; is in Item class.
// Item class extends ItemInner in FLA library.
item.angl = i * ((Math.PI * 2) / numOfItems);
item.ref.mask = item.masker;
item.alpha = 0.5;
itemArray.push(item);
addChild(item);
item.addEventListener(Event.ENTER_FRAME, enterFrameHandler);
// listen for MouseEvents only on icons, not on reflections
item.icon.addEventListener(MouseEvent.CLICK, clickHandler);
item.icon.addEventListener(MouseEvent.ROLL_OVER, rollOverHandler);
item.icon.addEventListener(MouseEvent.ROLL_OUT, rollOutHandler);
}
}

…which refers to an Item class:

package {

public class Item extends ItemInner {

public var angl:Number;

public function Item() {
//
}
}
}

…which generates the items onto the stage…but - what would the best way be to make say, 4 or 5 DIFFERENT items in the carousel[FONT=Times New Roman][SIZE=3]?[/SIZE][/FONT]

[FONT=Times New Roman][SIZE=3]Really, I`ve been trying very hard but…anyone give me a hint?[/SIZE][/FONT]

[FONT=Times New Roman][SIZE=3]Entire AS3 code is posted below![/SIZE][/FONT]

[FONT=Times New Roman][SIZE=3]Help is MOST appreciated,[/SIZE][/FONT]

[FONT=Times New Roman][SIZE=3]Galland :block:[/SIZE][/FONT]

[FONT=Times New Roman][SIZE=3]/[/SIZE][/FONT]
[FONT=Times New Roman][SIZE=3]The ‘reflections’ will only work if ‘bitmap caching’ for the Icon[/SIZE][/FONT]
[SIZE=3][FONT=Times New Roman]instance ‘ref’ and the ‘masker’ instance is turned on in the properties panel.[/FONT][/SIZE]
[FONT=Times New Roman][SIZE=3]/[/SIZE][/FONT]
[FONT=Times New Roman][SIZE=3]var numOfItems:uint = 5; // number of Items to put on stage[/SIZE][/FONT]
[SIZE=3][FONT=Times New Roman]var radiusX:uint = 250; // width of carousel[/FONT][/SIZE]
[SIZE=3][FONT=Times New Roman]var radiusY:uint = 75; // height of carousel[/FONT][/SIZE]
[SIZE=3][FONT=Times New Roman]var centerX:Number = 560; // x position of center of carousel[/FONT][/SIZE]
[SIZE=3][FONT=Times New Roman]var centerY:Number = 320; // y position of center of carousel[/FONT][/SIZE]
[SIZE=3][FONT=Times New Roman]var speed:Number = 0.05; // initial speed of rotation of carousel[/FONT][/SIZE]
[SIZE=3][FONT=Times New Roman]var itemArray:Array = new Array(); // store the Items to sort them according to their ‘depth’ - see sortBySize() function.[/FONT][/SIZE]
[FONT=Times New Roman][SIZE=3]init();[/SIZE][/FONT]
[FONT=Times New Roman][SIZE=3]// place Items on stage[/SIZE][/FONT]
[SIZE=3][FONT=Times New Roman]function init():void {[/FONT][/SIZE]
[SIZE=3][FONT=Times New Roman]for(var i:uint = 0; i < numOfItems; i++) {[/FONT][/SIZE]
[SIZE=3][FONT=Times New Roman]var item:Item = new Item();[/FONT][/SIZE]
[SIZE=3][FONT=Times New Roman]// public var angl:Number; is in Item class.[/FONT][/SIZE]
[SIZE=3][FONT=Times New Roman]// Item class extends ItemInner in FLA library.[/FONT][/SIZE]
[SIZE=3][FONT=Times New Roman]item.angl = i * ((Math.PI * 2) / numOfItems);[/FONT][/SIZE]
[SIZE=3][FONT=Times New Roman]item.ref.mask = item.masker;[/FONT][/SIZE]
[SIZE=3][FONT=Times New Roman]item.alpha = 0.5;[/FONT][/SIZE]
[SIZE=3][FONT=Times New Roman]itemArray.push(item);[/FONT][/SIZE]
[SIZE=3][FONT=Times New Roman]addChild(item);[/FONT][/SIZE]
[SIZE=3][FONT=Times New Roman]item.addEventListener(Event.ENTER_FRAME, enterFrameHandler);[/FONT][/SIZE]
[SIZE=3][FONT=Times New Roman]// listen for MouseEvents only on icons, not on reflections[/FONT][/SIZE]
[SIZE=3][FONT=Times New Roman]item.icon.addEventListener(MouseEvent.CLICK, clickHandler);[/FONT][/SIZE]
[SIZE=3][FONT=Times New Roman]item.icon.addEventListener(MouseEvent.ROLL_OVER, rollOverHandler);[/FONT][/SIZE]
[SIZE=3][FONT=Times New Roman]item.icon.addEventListener(MouseEvent.ROLL_OUT, rollOutHandler);[/FONT][/SIZE]
[SIZE=3][FONT=Times New Roman]}[/FONT][/SIZE]
[SIZE=3][FONT=Times New Roman]}[/FONT][/SIZE]
[FONT=Times New Roman][SIZE=3]// position Items in elipse[/SIZE][/FONT]
[SIZE=3][FONT=Times New Roman]function enterFrameHandler(event:Event):void {[/FONT][/SIZE]
[SIZE=3][FONT=Times New Roman]event.target.x = Math.cos(event.target.angl) * radiusX + centerX; // x position of Item[/FONT][/SIZE]
[SIZE=3][FONT=Times New Roman]event.target.y = Math.sin(event.target.angl) * radiusY + centerY; // y postion of Item[/FONT][/SIZE]
[SIZE=3][FONT=Times New Roman]// scale Item according to y position to give perspective[/FONT][/SIZE]
[SIZE=3][FONT=Times New Roman]var s:Number = event.target.y / (centerY + radiusY);[/FONT][/SIZE]
[SIZE=3][FONT=Times New Roman]event.target.scaleX = event.target.scaleY = s;[/FONT][/SIZE]
[SIZE=3][FONT=Times New Roman]event.target.angl += speed; // speed is updated by mouseMoveHandler[/FONT][/SIZE]
[SIZE=3][FONT=Times New Roman]sortBySize();[/FONT][/SIZE]
[SIZE=3][FONT=Times New Roman]}[/FONT][/SIZE]
[FONT=Times New Roman][SIZE=3]// set the display list index (depth) of the Items according to their[/SIZE][/FONT]
[SIZE=3][FONT=Times New Roman]// scaleX property so that the bigger the Item, the higher the index (depth)[/FONT][/SIZE]
[SIZE=3][FONT=Times New Roman]function sortBySize():void {[/FONT][/SIZE]
[SIZE=3][FONT=Times New Roman]// There isn’t an Array.ASCENDING property so use DESCENDING and reverse()[/FONT][/SIZE]
[SIZE=3][FONT=Times New Roman]itemArray.sortOn(“scaleX”, Array.DESCENDING | Array.NUMERIC);[/FONT][/SIZE]
[SIZE=3][FONT=Times New Roman]itemArray.reverse();[/FONT][/SIZE]
[SIZE=3][FONT=Times New Roman]for(var i:uint = 0; i < itemArray.length; i++) {[/FONT][/SIZE]
[SIZE=3][FONT=Times New Roman]var item:Item = itemArray*;[/FONT][/SIZE]
[SIZE=3][FONT=Times New Roman]setChildIndex(item, i);[/FONT][/SIZE]
[SIZE=3][FONT=Times New Roman]}[/FONT][/SIZE]
[SIZE=3][FONT=Times New Roman]}[/FONT][/SIZE]
[FONT=Times New Roman][SIZE=3]function clickHandler(event:MouseEvent):void {[/SIZE][/FONT]
[SIZE=3][FONT=Times New Roman]// clean up your listeners before you do anything else to free up[/FONT][/SIZE]
[SIZE=3][FONT=Times New Roman]// user’s CPU resources[/FONT][/SIZE]
[SIZE=3][FONT=Times New Roman]for(var i:uint = 0; i < itemArray.length; i++) {[/FONT][/SIZE]
[SIZE=3][FONT=Times New Roman]var item:Item = itemArray*;[/FONT][/SIZE]
[SIZE=3][FONT=Times New Roman]item.removeEventListener(Event.ENTER_FRAME, enterFrameHandler);[/FONT][/SIZE]
[SIZE=3][FONT=Times New Roman]item.icon.removeEventListener(MouseEvent.CLICK, clickHandler);[/FONT][/SIZE]
[SIZE=3][FONT=Times New Roman]item.icon.removeEventListener(MouseEvent.ROLL_OVER, rollOverHandler);[/FONT][/SIZE]
[SIZE=3][FONT=Times New Roman]item.icon.removeEventListener(MouseEvent.ROLL_OUT, rollOutHandler);[/FONT][/SIZE]
[SIZE=3][FONT=Times New Roman]// optional:[/FONT][/SIZE]
[SIZE=3][FONT=Times New Roman]removeChild(item);[/FONT][/SIZE]
[SIZE=3][FONT=Times New Roman]// to replace the carousel again see reInit() function[/FONT][/SIZE]
[SIZE=3][FONT=Times New Roman]}[/FONT][/SIZE]
[SIZE=3][FONT=Times New Roman]// put your own code here.[/FONT][/SIZE]
[SIZE=3][FONT=Times New Roman]}[/FONT][/SIZE]
[FONT=Times New Roman][SIZE=3]function rollOverHandler(event:MouseEvent):void {[/SIZE][/FONT]
[SIZE=3][FONT=Times New Roman]event.target.parent.alpha = 1;[/FONT][/SIZE]
[SIZE=3][FONT=Times New Roman]}[/FONT][/SIZE]
[FONT=Times New Roman][SIZE=3]function rollOutHandler(event:MouseEvent):void {[/SIZE][/FONT]
[SIZE=3][FONT=Times New Roman]event.target.parent.alpha = 0.5;[/FONT][/SIZE]
[SIZE=3][FONT=Times New Roman]}[/FONT][/SIZE]
[FONT=Times New Roman][SIZE=3]addEventListener(MouseEvent.MOUSE_MOVE, mouseMoveHandler);[/SIZE][/FONT]
[FONT=Times New Roman][SIZE=3]/[/SIZE][/FONT]
[SIZE=3][FONT=Times New Roman]Update the speed at which the carousel rotates accoring to the distance of the mouse from the center of the stage. The speed variable only gets updated when the mouse moves over the Item Sprites.[/FONT][/SIZE]
[SIZE=3][FONT=Times New Roman]/[/FONT][/SIZE]
[SIZE=3][FONT=Times New Roman]function mouseMoveHandler(event:MouseEvent):void {[/FONT][/SIZE]
[SIZE=3][FONT=Times New Roman]speed = (mouseX - centerX) / 6000;[/FONT][/SIZE]
[SIZE=3][FONT=Times New Roman]}[/FONT][/SIZE]
[FONT=Times New Roman][SIZE=3]// click to put Items back on stage[/SIZE][/FONT]
[SIZE=3][FONT=Times New Roman]rewButton.buttonMode = true;[/FONT][/SIZE]
[SIZE=3][FONT=Times New Roman]rewButton.addEventListener(MouseEvent.CLICK, reInit);[/FONT][/SIZE]
[FONT=Times New Roman][SIZE=3]// put items back on stage[/SIZE][/FONT]
[SIZE=3][FONT=Times New Roman]function reInit(event:MouseEvent):void {[/FONT][/SIZE]
[SIZE=3][FONT=Times New Roman]for(var i:uint = 0; i < itemArray.length; i++) {[/FONT][/SIZE]
[SIZE=3][FONT=Times New Roman]var item:Item = itemArray*;[/FONT][/SIZE]
[SIZE=3][FONT=Times New Roman]item.alpha = 0.5;[/FONT][/SIZE]
[SIZE=3][FONT=Times New Roman]addChild(item);[/FONT][/SIZE]
[SIZE=3][FONT=Times New Roman]item.addEventListener(Event.ENTER_FRAME, enterFrameHandler);[/FONT][/SIZE]
[SIZE=3][FONT=Times New Roman]item.icon.addEventListener(MouseEvent.CLICK, clickHandler);[/FONT][/SIZE]
[SIZE=3][FONT=Times New Roman]item.icon.addEventListener(MouseEvent.ROLL_OVER, rollOverHandler);[/FONT][/SIZE]
[SIZE=3][FONT=Times New Roman]item.icon.addEventListener(MouseEvent.ROLL_OUT, rollOutHandler);[/FONT][/SIZE]
[SIZE=3][FONT=Times New Roman]}[/FONT][/SIZE]
[SIZE=3][FONT=Times New Roman]}[/FONT][/SIZE]