• Global community
    • Language:
      • Deutsch
      • English
      • Español
      • Français
      • Português
  • 日本語コミュニティ
    Dedicated community for Japanese speakers
  • 한국 커뮤니티
    Dedicated community for Korean speakers
Exit
0

Open and close action with single button

Explorer ,
Aug 10, 2017 Aug 10, 2017

Copy link to clipboard

Copied

On my HTML5 Canvas stage I have several buttons that perform different actions such as opening an information box, or even a sub-menu. I'm trying to code it so that when a button is clicked it not only opens the relevant action, but it also closes any other actions that were already opened. Furthermore, if the same button is clicked again it will close its own action.

Is there a function that exists to do this? Thanks, appreciate any help - I'm obviously new and trying my hardest to learn it!

My current process for opening is

this.mc_Contact_Box.visible = false;

this.Contact_Btn.addEventListener("click", fl_ClickToShow_4.bind(this));

function fl_ClickToShow_4()

{

    this.mc_Contact_Box.visible = true;

}

Views

384

Translate

Translate

Report

Report
Community guidelines
Be kind and respectful, give credit to the original source of content, and search for duplicates before posting. Learn more
community guidelines

correct answers 1 Correct answer

Contributor , Aug 10, 2017 Aug 10, 2017

Here's one way you could write it:

// Store the last opened window

var lastOpened = null;

// Function for creating a button

function CreateButton (_button, _window) {

     // Create function for clicking on the button

     var click = function () {

          // If a window have been opened previously then hide it

          if (lastOpened != null) {

               lastOpened.visible = false;

          }

          // If the window isn't the same as the last one then show it

          if (_window != lastOpened

...

Votes

Translate

Translate
Contributor ,
Aug 10, 2017 Aug 10, 2017

Copy link to clipboard

Copied

Here's one way you could write it:

// Store the last opened window

var lastOpened = null;

// Function for creating a button

function CreateButton (_button, _window) {

     // Create function for clicking on the button

     var click = function () {

          // If a window have been opened previously then hide it

          if (lastOpened != null) {

               lastOpened.visible = false;

          }

          // If the window isn't the same as the last one then show it

          if (_window != lastOpened) {

               _window.visible = true;

               lastOpened = _window;

          } else { // Otherwise clear last opened so that that the window can be opened again

               lastOpened = null;

          }

     }

     // Add an event listener to the button with the function stored in the click variable

     _button.addEventListener("click", click);

}

// Create buttons

CreateButton(this.Button1, this.Window1);

CreateButton(this.Button2, this.Window2);

CreateButton(this.Button3, this.Window3);

Votes

Translate

Translate

Report

Report
Community guidelines
Be kind and respectful, give credit to the original source of content, and search for duplicates before posting. Learn more
community guidelines
Explorer ,
Aug 10, 2017 Aug 10, 2017

Copy link to clipboard

Copied

Thank you. The descriptions really help!

So Button1 etc. and Window1 etc. will be the Instance names of those items. I tried it but nothing appears on the stage. Here's my little test .fla file https://s3-ap-southeast-2.amazonaws.com/steve-pottery/button-test.zip

Votes

Translate

Translate

Report

Report
Community guidelines
Be kind and respectful, give credit to the original source of content, and search for duplicates before posting. Learn more
community guidelines
Contributor ,
Aug 10, 2017 Aug 10, 2017

Copy link to clipboard

Copied

The reason why you don't see anything, is because there is an error, which prevents anything from running. In chrome, you can open the console by pressing Ctrl + Shift + J on Windows, or Command + Option + J on Mac.

Once the console is open, you should see an error starting with: "Cannot read property 'addEventListener' of undefined". This essentially means that the code is trying to add an event listener to something that doesn't exist.

On the stage there's only Button1 and Window1, so the last two CreateButton calls are attempting to create buttons with symbols that doesn't exist. So you can just remove those two lines and it should work.

Votes

Translate

Translate

Report

Report
Community guidelines
Be kind and respectful, give credit to the original source of content, and search for duplicates before posting. Learn more
community guidelines
Explorer ,
Aug 10, 2017 Aug 10, 2017

Copy link to clipboard

Copied

LATEST

Of course, I thought about it too but rushed my reply. Thanks for these tips. I'll try it later when I get home.

Votes

Translate

Translate

Report

Report
Community guidelines
Be kind and respectful, give credit to the original source of content, and search for duplicates before posting. Learn more
community guidelines