Skip to main content
SheaB
Inspiring
June 22, 2018
Answered

Play movie clip buttons that will only go forward/back in consecutive order

  • June 22, 2018
  • 4 replies
  • 937 views

Hello -

I need to work out how to have buttons that will only work in a certain order. So button1 must be clicked first (play movie clip1), then button2, then button3. You can't click/play button3 before clicking/playing button1, and button2 first. And when going in reverse they can only go back one step so if on button3 they can only click button2 or continue forward by clicking button4. I've looked through forums and googled, can't find anything on how to set this up. I'd appreciate any help.

Here's what I'm currently using for buttons to play the movie clips (Count1, Count2, etc). All of this functions like I need it too except having them only play in order. I'll also need to add a reset button once I figure out how to work in order.

var playing:Boolean = false;

function stopAllCounts():void {

     Count1.gotoAndStop(1);

     Count2.gotoAndStop(1);

     Count3.gotoAndStop(1);

     Count4.gotoAndStop(1);

}

/*1st movieclip*/

Count1.stop();

function startCount1(event:MouseEvent):void {

     var stopped:Boolean = Count1.currentFrame == 1 || Count1.currentFrame == Count1.totalFrames;

     stopAllCounts();

     if (stopped) {

  addChild(Count1);

          Count1.gotoAndPlay(1);

     }

}

startButton1.addEventListener(MouseEvent.CLICK, startCount1);

/*2nd movieclip*/

Count2.stop();

function startCount2(event:MouseEvent):void {

     var stopped:Boolean = Count2.currentFrame == 1 || Count2.currentFrame == Count2.totalFrames;

     stopAllCounts();

     if (stopped) {

  addChild(Count2);

          Count2.gotoAndPlay(1);

     }

}

startButton2.addEventListener(MouseEvent.CLICK, startCount2);

stop();

/*3nd movieclip*/

etc......

This topic is closed to new replies. Start a new post to keep the conversation going.
Correct answer JoãoCésar17023019

Hi.

I don't know if this is exactly what you want, but I hope this helps somehow.

AS3 code:

import flash.display.SimpleButton;

import flash.events.MouseEvent;

var buttons:Array =

[

{button:button0, toggled:false},

{button:button1, toggled:false},

{button:button2, toggled:false},

{button:button3, toggled:false}

];

function mouseHandler(e:MouseEvent):void

{

if (e.type == MouseEvent.CLICK)

{

  if (e.target.name.indexOf("button") == 0)

  {

   var ind:int = int(e.target.name.slice(6, e.target.name.length));

   buttons[ind].toggled = !buttons[ind].toggled;

   setOrder(buttons[ind].toggled ? ind : ind - 1);

   this["bar" + ind].gotoAndPlay(1);

  }

}

}

function setOrder(index:int):void

{

for (var i:int = 0, total:int = buttons.length; i < total; i++)

{

  if (i <= index || i == Math.min(index + 1, total - 1))

  {

   buttons.button.alpha = 1;

   buttons.button.mouseEnabled = true;

  }

  else

  {

   buttons.button.alpha = 0.2;

   buttons.button.mouseEnabled = false;

   buttons.toggled = false;

   this["bar" + i].gotoAndStop(0);

  }

}

}

addEventListener(MouseEvent.CLICK, mouseHandler);

setOrder(-1);

FLA download:

animate_cc_as3_click_sequence.zip - Google Drive

Regards,

JC

4 replies

SheaB
SheaBAuthor
Inspiring
June 27, 2018

This is almost there. The buttons work well when clicked in order going forward. However, when clicking backwards things get glitchy. The buttons are either all able to be played or as you go backwards only the first button works and has to be stopped before the next button will work again. Anybody have any suggestions?

To either the original code posted or the code offered by JC and modified to include stopping the previous movie clip when moving through the buttons:

TESTING click btns in order_2.fla - Google Drive

TESTING click btns in order_2.swf - Google Drive

import flash.display.SimpleButton;

import flash.events.MouseEvent;

var buttons:Array =

[

     {button:button0, toggled:false},

     {button:button1, toggled:false},

     {button:button2, toggled:false},

     {button:button3, toggled:false}

];

function mouseHandler(e:MouseEvent):void

{

     if (e.type == MouseEvent.CLICK)

     {

          if (e.target.name.indexOf("button") == 0)

          {

               var ind:int = int(e.target.name.slice(6, e.target.name.length));

               buttons[ind].toggled = !buttons[ind].toggled;

               setOrder(buttons[ind].toggled ? ind : ind - 1);

               this["bar" + ind].gotoAndPlay(1);

              }

     }

}

function setOrder(index:int):void

{

     for (var i:int = 0, total:int = buttons.length; i < total; i++)

     {

          if (i <= index || i == Math.min(index + 1, total - 1))

          {

               buttons.button.alpha = 1;

               buttons.button.mouseEnabled = true;

  

               if (i < index)

               this["bar" + i].gotoAndStop(0);

  

          }

          else

          {

               buttons.button.alpha = 0.2;

               buttons.button.mouseEnabled = false;

               buttons.toggled = false;

               this["bar" + i].gotoAndStop(0);

          }

     }

}

addEventListener(MouseEvent.CLICK, mouseHandler);

setOrder(-1);

JoãoCésar17023019
Community Expert
JoãoCésar17023019Community ExpertCorrect answer
Community Expert
June 23, 2018

Hi.

I don't know if this is exactly what you want, but I hope this helps somehow.

AS3 code:

import flash.display.SimpleButton;

import flash.events.MouseEvent;

var buttons:Array =

[

{button:button0, toggled:false},

{button:button1, toggled:false},

{button:button2, toggled:false},

{button:button3, toggled:false}

];

function mouseHandler(e:MouseEvent):void

{

if (e.type == MouseEvent.CLICK)

{

  if (e.target.name.indexOf("button") == 0)

  {

   var ind:int = int(e.target.name.slice(6, e.target.name.length));

   buttons[ind].toggled = !buttons[ind].toggled;

   setOrder(buttons[ind].toggled ? ind : ind - 1);

   this["bar" + ind].gotoAndPlay(1);

  }

}

}

function setOrder(index:int):void

{

for (var i:int = 0, total:int = buttons.length; i < total; i++)

{

  if (i <= index || i == Math.min(index + 1, total - 1))

  {

   buttons.button.alpha = 1;

   buttons.button.mouseEnabled = true;

  }

  else

  {

   buttons.button.alpha = 0.2;

   buttons.button.mouseEnabled = false;

   buttons.toggled = false;

   this["bar" + i].gotoAndStop(0);

  }

}

}

addEventListener(MouseEvent.CLICK, mouseHandler);

setOrder(-1);

FLA download:

animate_cc_as3_click_sequence.zip - Google Drive

Regards,

JC

SheaB
SheaBAuthor
Inspiring
June 23, 2018

Thanks JC. Yes! Excellent. This is sooo close. Okay, it's working with all the buttons. I need to figure out how to stop the previous movie clip playing if the next btn is clicked and starts playing. I've got audio involved so it has to stop any other clips so they don't overlap sounds. Do you know what I would add and where in the code you provided?