Description

This is the ActionScript behind the navigation which is currently running this site.

Example

Code Sample: Navigation.as

package com.trevolution.navigation {

  import flash.display.Sprite;
  import flash.display.*;
  import flash.events.*;
  import flash.net.*;

  public class Navigation extends Sprite {

    private var playlists:XML = new XML();
    private var area:Sprite = new Sprite();

    private var bar:NavigationBar = new NavigationBar();  // Custom

    private var urlLoader:URLLoader = new URLLoader();

    private var buttonX:uint = 0;
    private var lastX:uint = 0;
    private var spaceX:uint = 10;

    public function Navigation() {
      loadXML( "/playlists.xml" );

      addChild( area );
      area.y = 17;
    }

    private function buildNavigation():void {
      // Build a button for each entry in the playlist and then assign a x coordinate based on the last
      // with a little space
      for each( var playlist:XML in playlists.* ) {
        var button:NavigationButton = new NavigationButton( playlist.label, playlist.locator, 0xff9900 );

        buttonX = lastX + spaceX;
        lastX += button.width + spaceX;

        area.addChild( button );
        button.x = buttonX;
      }
    }

    private function loadXML( path:String ):void {
      // Load the external XML and assign a listener to it
      var urlRequest:URLRequest = new URLRequest( path );
      urlLoader.addEventListener( Event.COMPLETE, completeListener );
      urlLoader.load( urlRequest );
    }

    private function completeListener( e:Event ):void {
      playlists = new XML( urlLoader.data );

      buildNavigation();
    }
  }
}
      

Code Sample: NavigationButton.as

package com.trevolution.navigation {

  import flash.display.Sprite;
  import flash.display.Shape;
  import flash.text.*;
  import flash.events.*;
  import flash.net.*;

  public class NavigationButton extends Sprite {

    private var font:ArialFont = new ArialFont();  // Embedded in the Library

    private var area:Sprite = new Sprite();
    private var shape:Shape = new Shape();
    private var screen:Shape = new Shape();
    private var ring:Shape = new Shape();

    private var field:TextField = new TextField();
    private var format:TextFormat = new TextFormat();

    private var locator:URLRequest = new URLRequest();

    private var w:uint;  // The width of field:TextField after it has text
    private var h:uint;  // The height of field:TextField after it has text
    private var c:uint = 10;  // The width and height of the rectangle's edge bevel

    public function NavigationButton( string:String, url:String, color:Number ) {
      buildField( string );
      drawShape( shape, color );
      drawShape( screen, 0xcc6600 );
      drawRing( 0xcc6600 );

      area.addChild( ring );
      area.addChild( shape );
      area.addChild( screen );
      area.addChild( field );
      addChild( area );

      field.x = c;
      field.y -= c / 2;
      screen.visible = false;  // By default, screen is invisible

      locator.url = url;

      area.buttonMode = true;
      area.addEventListener( MouseEvent.MOUSE_OVER, mouseEventHandler );
      area.addEventListener( MouseEvent.MOUSE_OUT, mouseEventHandler );
      area.addEventListener( MouseEvent.MOUSE_DOWN, mouseEventHandler );
    }

    private function buildField( string:String ) {
      format.bold = true;
      format.font = font.fontName;
      format.size = 12;
      format.color = 0xffffff;

      field.text = string;
      field.embedFonts = true;
      field.selectable = false;
      field.mouseEnabled = false;
      field.antiAliasType = AntiAliasType.ADVANCED;
      field.autoSize = TextFieldAutoSize.LEFT;
      field.setTextFormat( format );

      w = Math.ceil( field.width );
      h = Math.ceil( field.height ) - c;
    }

    private function drawShape( target:Shape, color:Number ):void {
      with( target ) {
        graphics.beginFill( color, 1 );
        graphics.lineTo( 0, h + c );
        graphics.lineTo( w + c, h + c );
        graphics.lineTo( w + ( 2 * c ), h );
        graphics.lineTo( w + ( 2 * c ), 0 - c );
        graphics.lineTo( c, 0 - c );
        graphics.lineTo( 0, 0 );
        graphics.endFill();
      }
    }

    private function drawRing( color:Number ):void {
      ring.graphics.beginFill( color, 1 );
      ring.graphics.lineTo( 0, h + c + 3 );
      ring.graphics.lineTo( w + c + 3, h + c + 3 );
      ring.graphics.lineTo( w + ( 2 * c ) + 3, h + 3 );
      ring.graphics.lineTo( w + ( 2 * c ) + 3, 0 - c - 3 );
      ring.graphics.lineTo( c, 0 - c - 3 );
      ring.graphics.lineTo( 0, 0 );
      ring.graphics.endFill();
    }

    private function mouseEventHandler( mouseEvent:MouseEvent ):void {
      switch( mouseEvent.type ) {
        case "mouseDown":
          navigateToURL( locator, "_parent" );
          trace( locator );
          break;
        case "mouseOver":
          screen.visible = true;
          break;
        case "mouseOut":
          screen.visible = false;
          break;
      }
    }
  }
}