🎰

MainView - Главный экран

Блочный элемент контейнер для основных экранов приложения. Включает полосу вкладок и контентную область текущей выбранной вкладки.

new MainView(parent, tabTitles)

Конструктор принимает указатель на DOM-элемент для вставки компонента и массив заголовков для вкладок (он сохраняется в this.tabTitles). При этом компонент рендерится на странице, в нём создаются соответствующие вкладки. Ссылки на их контентные элементы записываются в this.tabContentHolders[tabTitle] .

Методы экземпляра

.gotoTab(tabTitle)

Открывает вкладку с указанным заголовком.

.useTabOpenHandler(tabTitle, fn)

Запоминает обработчик открытия вкладки с указанным заголовком.

.useTabCloseHandler(tabTitle, fn)

Запоминает обработчик зарытия вкладки с указанным заголовком.

.getOpenTabTitle()

Возвращает заголовок активной (открытой) вкладки.

Дизайн

Вкладки сверху, всё остальное место в компоненте отдаётся контенту открытой вкладки. Первая вкладка и её контент не имеют своего фона и рамки, как бы выводятся прямо на фон компонента. Когда она открыта, остальные вкладки больше похожи на панель кнопок чем на вкладки.

Поведение

При клике на неактивной вкладке вызывается обработчик закрытия текущей, закрывается текущая вкладка, открывается кликнутая, вызывается обработчик открытия кликнутой.