Fade in and out for Menu commands

[TheEmbracedOne]

Since fading in and out for Say commands is a thing, it feels like Fade In should also be an option for Menu commands also.

Screenshots Menus are always displayed instantly, no fade available:

[breadnone]

@TheEmbracedOne I made a pr for this, perhaps you can try them out. Thanks!

[TheEmbracedOne]

@breadnone thanks I'll try it asap!

[TheEmbracedOne]

Hey @breadnone I tried your PR but I'm running into issues with it. I triple checked the code and the only differences are as follows (these should not interfere I think):

instead of [SerializeField] protected bool autoSelectFirstButton = false; I have [SerializeField] public bool autoSelectFirstButton = true;

I have this custom code:

        public void TurnOnAutoFirstSelect() {
            autoSelectFirstButton = true;
        }

        public void TurnOffAutoFirstSelect() {
            autoSelectFirstButton = false;
        }

and in private bool AddOption, instead of:

            button.gameObject.SetActive(true);
            button.interactable = interactable;
            if (interactable && autoSelectFirstButton && !cachedButtons.Select(x => x.gameObject).Contains(EventSystem.current.currentSelectedGameObject)) {
                EventSystem.current.SetSelectedGameObject(button.gameObject);
            }

I have:

            button.gameObject.SetActive(true);
            button.interactable = interactable;
            if (interactable && autoSelectFirstButton && !cachedButtons.Select(x => x.gameObject).Contains(EventSystem.current.currentSelectedGameObject)) {
                EventSystem.current.SetSelectedGameObject(button.gameObject);
                //custom
                button.Select();
                //custom
            }

With that out of the way, I have added a CanvasGroup to the gameobject that has the MenuDialog on it and set the fade enabled, and set the time to 0.5.

What happens is, after the first time I click a menu option, the menudialogue fades to 0 then 1, but then it gets disabled (SetActive(false)) somehow. Any idea what might cause this? I attached a gif of the problem in action.

[breadnone]

autoSelectFirstButton, protected is the default form fungus. As for the behavior, it fades, then set to inactive, that is also the default behavior of Fungus MenuDialog, just added fade out in between. Nothing changed other than just fading in/out before and after calling the MenuDialog.

The goal of that pr is just fade in/out in general and not for specific user use cases, sorry to say.

Seems to me you have modified/non-standard MenuDialog, it should look like this

https://user-images.githubusercontent.com/64100867/121836588-f2f70800-ccfd-11eb-9da9-d6615756a9a0.mp4

[TheEmbracedOne]

My problem is that MenuDialog REMAINS inactive even after the next block calls for menus that use it.

None of my modifications should interfere with this however, but just to be sure, I have copypasted the entirety of your PR, overriding my changes completely. Now the code is identical and the exact same thing happens as per the above video, but if I put a 1 sec wait to the next block that I navigate to via the Menu option, the fade itself works:

https://user-images.githubusercontent.com/16197906/121942402-f612e800-cd3f-11eb-8376-2d448f31b406.mp4

However the MenuDialog remains inactive so whatever Menus I have in the next block to display further options are not displayed.

as for the behavior, it fades, then set to inactive, that is also the default behavior of Fungus MenuDialog not quite! The MenuDialog itself doesnt get deactivated, only the buttons (this is a recording with the default fungus MenuDialog) UNLESS you go to another flowchart!

These menus take you from node to node inside the same flowchart. Note the MenuDialog doesnt deactivate, only the buttons:

https://user-images.githubusercontent.com/16197906/121943686-5ce4d100-cd41-11eb-9093-be805ed9903d.mp4

Here the "Settings" menu takes you to a different flowchart. Note the MenuDialog temporarily deactivates:

https://user-images.githubusercontent.com/16197906/121944175-e399ae00-cd41-11eb-96e8-0e16429451b5.mp4

[breadnone]

@TheEmbracedOne I see what you mean now, yeah I missed that part. Could you pls test it again? Thanks!

Edit; I got mixed from different branches, closed first pr and open new one. https://github.com/snozbot/fungus/pull/991

[TheEmbracedOne]

For logkeeping purposes, I have now taken the #991 PR and it works as a solution for this, but by hiding the canvas. This has been reverted since because it probably isnt a good longterm solution, so I wont close this issue for the time being.

[breadnone]

As discussed on discord, hiding it would block the raycast under it. This won't be a problem for users who are well aware on how Unity's work as the can just toggle off the blockraycast, but it would cause confusions/problems for newbies...

[TheEmbracedOne]

Follow-up from PR #991 and some changes I did to the code to make sure the current fade-out completes before a new fade-in may begin:

I added to MenuDialog.cs a public LTDescr tween; variable that gets saved when I tween out (fade-out). I also added another float variable called postDelay that controls how long after a tween we delay the oncomplete events from firing.

the following are my additions to the MenuDialog.cs in PR #991

		protected virtual void AlphaCanvasMenu(bool state) {
			var canvyG = GetComponent<CanvasGroup>();

			if (state) {
				gameObject.SetActive(true);
				canvyG.alpha = 0;
				LeanTween.alphaCanvas(canvyG, 1f, duration).setEaseOutQuad();

			} else {
				tween = LeanTween.alphaCanvas(canvyG, 0f, duration).setEaseOutQuad()
					.setDelay(postDelay).setOnComplete(() => {
						ClearButtons();
				});
			}
		}

		/// <summary>
		/// Clear all displayed options in the Menu Dialog.
		/// </summary>
		public virtual void Clear() {
			if (enableFadeInOut) {
				var canvyG = GetComponent<CanvasGroup>();

				tween = LeanTween.alphaCanvas(canvyG, 0f, duration).setEaseOutQuad()
					.setDelay(postDelay).setOnComplete(() => {
						ClearButtons();
					});

			} else {
				ClearButtons();
			}
		}

		public void ClearButtons() {
			StopAllCoroutines();

			//note if something was shown notify that we are ending
			if (nextOptionIndex != 0) { MenuSignals.DoMenuEnd(this); }

			nextOptionIndex = 0;

			Button[] optionButtons = CachedButtons;
			for (int i = 0; i < optionButtons.Length; i++) {
				optionButtons[i].onClick.RemoveAllListeners();
			}
			
			for (int i = 0; i < optionButtons.Length; i++) {
				if (optionButtons[i] != null) {
					optionButtons[i].transform.SetSiblingIndex(i);
					optionButtons[i].gameObject.SetActive(false);
				}
			}

			Slider timeoutSlider = CachedSlider;
			if (timeoutSlider != null) { timeoutSlider.gameObject.SetActive(false); }

			tween = null;
			gameObject.SetActive(false);
		}

and additionally, this is the relevant bit from Menu.cs OnEnter:

			MenuDialog menuDialog = MenuDialog.GetMenuDialog();
			if (menuDialog.tween != null) {
				menuDialog.tween.setDelay(menuDialog.postDelay).setOnComplete(() => {
					menuDialog.ClearButtons();
					menuDialog.SetActive(true);
					menuDialog.AddOption(text, interactable, hideOption, targetBlock);

					menuDialog.tween = null;

					Continue();
				});

			} else {
				menuDialog.SetActive(true);
				menuDialog.AddOption(text, interactable, hideOption, targetBlock);

				Continue();
			}