I am trying to modify a fla i got from flash den.
http://flashden.net/item/xml-driven-vertical-zoom-menu/21047
It works by clicking on menu items, and or using your mouse wheel.
I am trying to make it so that it responds to mouse movement. So if you mouse up, the menu moves up, and if you mouse down, it moves down.
The file populates the menu using xml, and below is the primary code that makes it work.
Every mouseposition functionality that I’ve worked on required that the content be in an MC, but this is all xml generated content, and I don’t know how to target or control it.
Any help would be appreciated.
package net.flashden.lydian {
import fl.transitions.Tween;
import fl.transitions.easing.Strong;
import flash.display.MovieClip;
import flash.display.Sprite;
import flash.events.Event;
import flash.events.KeyboardEvent;
import flash.events.MouseEvent;
import flash.ui.Keyboard;
public class VerticalMenu extends MovieClip {
// The configuration manager which holds some constants
private var configManager:ConfigManager = new ConfigManager();
// An XMLLoader instance to load xml file to the memory
private var dataXMLLoader:XMLLoader;
// The xml data
private var xml:XML;
// An array to hold menu items
private var items:Array = new Array();
// The container for adding menu items
private var container:Sprite = new Sprite();
// The index number of the current selected item
private var selectedIndex:int = -1;
// A tween to be used to move the container.
private var moveTween:Tween;
// A mask for the entire menu
private var menuMask:Sprite = new Sprite();
// The factor to be used while zooming
private var zoomFactor:Number;
public function VerticalMenu() {
// Initialize the object
init();
}
/**
* Initializes the menu
*/
private function init():void {
// Start reading the configuration file
configManager.addEventListener(ConfigManager.CONFIG_LOADED, onConfigLoaded);
configManager.load();
}
/**
* This method is called when the configuration file is loaded.
*/
private function onConfigLoaded(evt:Event):void {
zoomFactor = ConfigManager.ZOOM_FACTOR;
// Create the menu mask if it's enabled
if (ConfigManager.ENABLE_MENU_MASK) {
menuMask.graphics.beginFill(0, 0);
menuMask.graphics.drawRect(-200, -105, 500, 410);
menuMask.graphics.endFill();
container.mask = menuMask;
addChild(menuMask);
}
if (ConfigManager.DISPLAY_ARROW) {
// Create an arrow and locate at the selected menu location
var arrow:Arrow = new Arrow();
arrow.x = ConfigManager.ARROW_SPACE;
arrow.y = ConfigManager.SELECTED_ITEM_LOCATION;
addChild(arrow);
}
// After reading the configuration file, start reading the data xml
dataXMLLoader = new XMLLoader(ConfigManager.DATA_XML_URL);
dataXMLLoader.addEventListener(XMLLoader.XML_LOADED, onDataXMLLoaded);
}
/**
* This method is called when the data.xml is loaded.
*/
private function onDataXMLLoaded(evt:Event):void {
// Get the xml data
xml = dataXMLLoader.getXML();
var index:int = 0;
// Create the menu items from the xml data
for each (var item:XML in xml.item) {
var url:String = item.url;
var title:String = item.title;
var subtitle:String = item.subtitle;
var targetFrame:String = item.target_frame;
var menuItem:MenuItem = new MenuItem(url, title, subtitle, targetFrame, index);
items.push(menuItem);
++index;
}
// Get the first menu item
menuItem = items[0];
menuItem.scaleX = zoomFactor;
menuItem.scaleY = zoomFactor;
container.addChild(menuItem);
// Add each menu item to the container
for (var i:uint = 1; i < items.length; i++) {
menuItem = items*;
menuItem.scaleX = zoomFactor;
menuItem.scaleY = zoomFactor;
menuItem.y = items[i - 1].y + items[i - 1].normHeight + ConfigManager.MENU_SPACE;
menuItem.alpha = .4;
container.addChild(menuItem);
}
// Draw a transparent background to catch mouse events on spaces
container.graphics.beginFill(0xFFFFFF, 0);
container.graphics.drawRect(0, 0, container.width, container.height);
container.graphics.endFill();
// Create the move tween
moveTween = new Tween(container, "y", Strong.easeOut, container.x, container.x, 1, true);
moveTween.stop();
// Add event listeners
addEventListener(MouseEvent.MOUSE_WHEEL, onMouseWheel, false, 0, true);
addEventListener(MouseEvent.MOUSE_DOWN, onMouseDown, false, 0, true);
addEventListener(KeyboardEvent.KEY_DOWN, onKeyDown, false, 0, true);
// Add the container to the menu
addChild(container);
// Select the first menu item
var firstItem:MenuItem = items[0];
firstItem.scaleX = 1;
firstItem.scaleY = 1;
firstItem.x -= (ConfigManager.MENU_ITEM_WIDTH - ConfigManager.MENU_ITEM_WIDTH * zoomFactor) / 2;
firstItem.y -= (ConfigManager.MENU_ITEM_HEIGHT - ConfigManager.MENU_ITEM_HEIGHT * zoomFactor) / 2;
container.y = (ConfigManager.SELECTED_ITEM_LOCATION - firstItem.y - firstItem.normHeight / 2);
container.setChildIndex(firstItem, container.numChildren - 1);
selectedIndex = 0;
// Add glow effect to the first menu item if it's enabled
if (ConfigManager.ENABLE_GLOW) {
firstItem.filters = [firstItem.glow];
}
}
/**
* This method is called when a key is pressed.
* It calls necessary menu methods by considering the key pressed.
*/
private function onKeyDown(evt:KeyboardEvent):void {
if (evt.keyCode == Keyboard.UP) {
up();
} else if (evt.keyCode == Keyboard.DOWN) {
down();
}
}
/**
* This method is called when the mouse wheel is moved.
*/
private function onMouseWheel(evt:MouseEvent):void {
// Find the direction of the movement and select the appropriate menu item
if (evt.delta > 0) {
selectItem(selectedIndex - 1);
} else if (evt.delta < 0) {
selectItem(selectedIndex + 1);
}
}
/**
* This method is called when mouse is clicked on menu items.
*/
private function onMouseDown(evt:MouseEvent):void {
var menuItem:MenuItem = evt.target as MenuItem;
if (menuItem != null) {
selectItem(menuItem.index);
}
}
/**
* Deselects the menu item with the given index.
*/
private function deselect(index:int):void {
var item:MenuItem = items[index];
item.playScaleDown();
}
/**
* Selects the menu item with the given index.
*/
private function select(index:int):void {
var item:MenuItem = items[index];
container.setChildIndex(item, container.numChildren - 1);
item.playScaleUp();
}
/**
* Changes the position of the container to the selected menu item.
*/
private function relocate():void {
var item:MenuItem = items[selectedIndex];
var targetY:Number = (ConfigManager.SELECTED_ITEM_LOCATION - item.y - item.normHeight / 2);
moveTween.begin = container.y;
moveTween.finish = targetY;
moveTween.start();
}
/**
* Selects the menu item with the given index number.
*/
private function selectItem(index:int):void {
if (index == -1 || index >= items.length) {
return;
}
deselect(selectedIndex);
select(index);
selectedIndex = index;
relocate();
// Play the target frame
if (parent is MovieClip) {
var par:MovieClip = MovieClip(parent);
par.gotoAndPlay(items[selectedIndex].targetFrame);
}
}
/**
* Selects the previous menu item.
*/
public function up():void {
selectItem(selectedIndex - 1);
}
/**
* Selects the next menu item.
*/
public function down():void {
selectItem(selectedIndex + 1);
}
}
}
