Skip navigation
signsupplies5
Currently Being Moderated

cs5 Advanced Photo Album Template Live Links

Jun 12, 2012 10:58 AM

Tags: #as3 #xml #actionscript #flash_cs5

I'm using this template as a "quick & dirty" content slider for my website. I got everything to work great, there's no issues with it's functionality or actionscript. I would just like to make each image a "clickable" link. I got 4 images that I want to take users to 4 separate webpages, I've searched and searched for answers but most are over my head. Is there anybody that could help me? Here's the actions:

 

****

import fl.data.DataProvider;

import fl.events.ListEvent;

import fl.transitions.*;

import fl.controls.*;

 

// USER CONFIG SETTINGS =====

var secondsDelay:Number = 7;

var autoStart:Boolean = true;

var transitionOn:Boolean = true; // true, false

var transitionType:String = "Fade"; // Blinds, Fade, Fly, Iris, Photo, PixelDissolve, Rotate, Squeeze, Wipe, Zoom, Random

var hardcodedXML:String="<photos><image title='Your Choice'>image1.jpg</image><image title='Quick Option'>image2.jpg</image><image title='New Product'>image3.jpg</image><image title='Get Started'>image4.jpg</image></photos>";

// END USER CONFIG SETTINGS

 

// DECLARE VARIABLES AND OBJECTS =====

var imageList:XML = new XML();

var currentImageID:Number = 0;

var imageDP:DataProvider = new DataProvider();

var slideshowTimer:Timer = new Timer((secondsDelay*1000), 0);

// END DECLARATIONS

 

// CODE FOR HARDCODED XML =====

imageList = XML(hardcodedXML);

fl_parseImageXML(imageList);

// END CODE FOR HARDCODED XML

 

// EVENTS =====

imageTiles.addEventListener(ListEvent.ITEM_CLICK, fl_tileClickHandler);

function fl_tileClickHandler(evt:ListEvent):void

{

    imageHolder.imageLoader.source = evt.item.source;

    currentImageID = evt.item.imgID;

}

playPauseToggle_mc.addEventListener(MouseEvent.CLICK, fl_togglePlayPause);

function fl_togglePlayPause(evt:MouseEvent):void

{

    if(playPauseToggle_mc.currentLabel == "play")

    {

        fl_startSlideShow();

        playPauseToggle_mc.gotoAndStop("pause");

    }

    else if(playPauseToggle_mc.currentLabel == "pause")

    {

        fl_pauseSlideShow();

        playPauseToggle_mc.gotoAndStop("play");

    }

}

next_btn.addEventListener(MouseEvent.CLICK, fl_nextButtonClick);

prev_btn.addEventListener(MouseEvent.CLICK, fl_prevButtonClick);

function fl_nextButtonClick(evt:MouseEvent):void

{

    fl_nextSlide();

}

function fl_prevButtonClick(evt:MouseEvent):void

{

    fl_prevSlide();

}

slideshowTimer.addEventListener(TimerEvent.TIMER, fl_slideShowNext);

function fl_slideShowNext(evt:TimerEvent):void

{

    fl_nextSlide();

}

// END EVENTS

 

// FUNCTIONS AND LOGIC =====

function fl_parseImageXML(imageXML:XML):void

{

    var imagesNodes:XMLList = imageXML.children();

    for(var i in imagesNodes)

    {

        var imgURL:String = imagesNodes[i];

        var imgTitle:String = imagesNodes[i].attribute("title");

        imageDP.addItem({label:imgTitle, source:imgURL, imgID:i});

    }

    imageTiles.dataProvider = imageDP;

    imageHolder.imageLoader.source = imageDP.getItemAt(currentImageID).source;

    title_txt.text = imageDP.getItemAt(currentImageID).label;

}

function fl_startSlideShow():void

{

    slideshowTimer.start();

}

function fl_pauseSlideShow():void

{

    slideshowTimer.stop();

}

function fl_nextSlide():void

{

    currentImageID++;

    if(currentImageID >= imageDP.length)

    {

        currentImageID = 0;

    }

    if(transitionOn == true)

    {

        fl_doTransition();

    }

    imageHolder.imageLoader.source = imageDP.getItemAt(currentImageID).source;

    title_txt.text = imageDP.getItemAt(currentImageID).label;

}

function fl_prevSlide():void

{

    currentImageID--;

    if(currentImageID < 0)

    {

        currentImageID = imageDP.length-1;

    }

    if(transitionOn == true)

    {

        fl_doTransition();

    }

    imageHolder.imageLoader.source = imageDP.getItemAt(currentImageID).source;

    title_txt.text = imageDP.getItemAt(currentImageID).label;

}

function fl_doTransition():void

{

    if(transitionType == "Blinds")

    {

        TransitionManager.start(imageHolder, {type:Blinds, direction:Transition.IN, duration:0.25});

    } else if (transitionType == "Fade")

    {

        TransitionManager.start(imageHolder, {type:Fade, direction:Transition.IN, duration:0.25});

    } else if (transitionType == "Fly")

    {

        TransitionManager.start(imageHolder, {type:Fly, direction:Transition.IN, duration:0.25});

    } else if (transitionType == "Iris")

    {

        TransitionManager.start(imageHolder, {type:Iris, direction:Transition.IN, duration:0.25});

    } else if (transitionType == "Photo")

    {

        TransitionManager.start(imageHolder, {type:Photo, direction:Transition.IN, duration:0.25});

    } else if (transitionType == "PixelDissolve")

    {

        TransitionManager.start(imageHolder, {type:PixelDissolve, direction:Transition.IN, duration:0.25});

    } else if (transitionType == "Rotate")

    {

        TransitionManager.start(imageHolder, {type:Rotate, direction:Transition.IN, duration:0.25});

    } else if (transitionType == "Squeeze")

    {

        TransitionManager.start(imageHolder, {type:Squeeze, direction:Transition.IN, duration:0.25});

    } else if (transitionType == "Wipe")

    {

        TransitionManager.start(imageHolder, {type:Wipe, direction:Transition.IN, duration:0.25});

    } else if (transitionType == "Zoom")

    {

        TransitionManager.start(imageHolder, {type:Zoom, direction:Transition.IN, duration:0.25});

    } else if (transitionType == "Random")

    {

        var randomNumber:Number = Math.round(Math.random()*9) + 1;

        switch (randomNumber) {

            case 1:

                TransitionManager.start(imageHolder, {type:Blinds, direction:Transition.IN, duration:0.25});

                break;

            case 2:

                TransitionManager.start(imageHolder, {type:Fade, direction:Transition.IN, duration:0.25});

                break;

            case 3:

                TransitionManager.start(imageHolder, {type:Fly, direction:Transition.IN, duration:0.25});

                break;

            case 4:

                TransitionManager.start(imageHolder, {type:Iris, direction:Transition.IN, duration:0.25});

                break;

            case 5:

                TransitionManager.start(imageHolder, {type:Photo, direction:Transition.IN, duration:0.25});

                break;

            case 6:

                TransitionManager.start(imageHolder, {type:PixelDissolve, direction:Transition.IN, duration:0.25});

                break;

            case 7:

                TransitionManager.start(imageHolder, {type:Rotate, direction:Transition.IN, duration:0.25});

                break;

            case 8:

                TransitionManager.start(imageHolder, {type:Squeeze, direction:Transition.IN, duration:0.25});

                break;

            case 9:

                TransitionManager.start(imageHolder, {type:Wipe, direction:Transition.IN, duration:0.25});

                break;

            case 10:

                TransitionManager.start(imageHolder, {type:Zoom, direction:Transition.IN, duration:0.25});

                break;

        }

    } else

    {

        trace("error - transitionType not recognized");

    }

}

if(autoStart == true)

{

   fl_startSlideShow();

   playPauseToggle_mc.gotoAndStop("pause");

}

***

 
Replies
  • Currently Being Moderated
    Jun 19, 2012 5:02 PM   in reply to signsupplies5

    Without writing the code for you, the general idea is knowing what the image number is. That seems to be your issue. Your click events need to be able to extract the name of the image that was clicked (who's instance name can have that number in it). Based on that number you can determine what to do.

     

    Any MouseEvent.CLICK function handlers will give you the name (if you set it) of what was clicked.

     

    e.g.

     

    import flash.display.Sprite;

    import flash.events.MouseEvent;

     

    var a:Sprite = new Sprite();

    a.beginFill(0xFF0000,1);

    a.graphics.drawRect(0,0,100,100); // draw red rectangle

    a.graphics.endFill();

     

    addChild(a);

     

    // give it a name

    a.name = "a_1";

    a.addEventListener(MouseEvent.CLICK, handleClick);

     

    // Now on a click, extract the name and use it:

    function handleClick(e:MouseEvent):void

    {

         // what button was clicked?

         trace(e.target.name);

     

         // get the number

         var num:int = int(e.target.name.toString().split('_')[1]);

     

         trace("Button #" + num + " clicked");

     

         // do something based on the number

         if (num == 1)

         {

              // do something based on button 1

         }

         else if (num == 2)

         {

              // do something based on button 2

         }

         // etc...

    }

     
    |
    Mark as:

More Like This

  • Retrieving data ...

Bookmarked By (0)

Answers + Points = Status

  • 10 points awarded for Correct Answers
  • 5 points awarded for Helpful Answers
  • 10,000+ points
  • 1,001-10,000 points
  • 501-1,000 points
  • 5-500 points