logo

VisibilityController

The VisibilityController class is used to control the visibility of anything that can be hidden or shown.

Methods

  • isHidden(name: string): boolean: Checks if the entity with the given name is hidden.
  • isHiding(name: string): boolean: Checks if the entity with the given name is hiding.
  • isShowing(name: string): boolean: Checks if the entity with the given name is showing.
  • isVisible(name: string): boolean: Checks if the entity with the given name is visible.

Getters

  • hasHidden (boolean): Checks if any entity is hidden. Returns true if any entity’s visibility status is ‘HIDDEN’, false otherwise.
  • hasHiding (boolean): Checks if any entity is hiding. Returns true if any entity’s visibility status is ‘HIDING’, false otherwise.
  • hasShowing (boolean): Checks if any entity is showing. Returns true if any entity’s visibility status is ‘SHOWING’, false otherwise.
  • hasVisible (boolean): Checks if any entity is visible. Returns true if any entity’s visibility status is ‘VISIBLE’, false otherwise.

Show an entity

The show method shows an entity. Optionally a delay can be set to delay the showing of the entity.

import { VisibilityController } from '@aracna/core';

const controller = new VisibilityController();

(async () => {
  await controller.show('dialog');

  // will log true
  console.log(controller.isVisible('dialog'));
})();

Hide an entity

The hide method hides an entity. Optionally a delay can be set to delay the hiding of the entity.

import { VisibilityController } from '@aracna/core';

const controller = new VisibilityController();

(async () => {
  await controller.show('dialog');

  // will log true
  console.log(controller.isVisible('dialog'));

  await controller.hide('dialog');

  // will log true
  console.log(controller.isHidden('dialog'));
})();

Toggle the visibility of an entity

The toggle method toggles the visibility of an entity. Optionally a delay which can be different for showing and hiding can be set to delay the visibility change of the entity.

import { VisibilityController } from '@aracna/core';

const controller = new VisibilityController();

(async () => {
  await controller.toggle('dialog');

  // will log true
  console.log(controller.isVisible('dialog'));

  await controller.toggle('dialog');

  // will log true
  console.log(controller.isHidden('dialog'));
})();