@foxford/foxford-navigation

Новая навигация

Обзорная документация по работе навигации находится по этой ссылке

Детали реализации

Чтобы использовать навигацию на портале нужно обращаться к сервису NavigationService. В будущем, есть желание вынести навигацию в отдельный пакет и постараться максимально отвязаться от зависимостей портала, а всё с ней взаимодействие организовать при помощи "шины-событий".

Высота контейнера

В текущем виде у навигации есть подложка и её высота захардкожена (CONTAINER_HEIGHT в constants.js), чтобы компенсировать высоту внутренней части, которая фиксирована относительно верхнего края контейнера страницы. Сам контейнер лежит в ./molecules/container

В модели есть хранилище $navigationOptions, в котором хранятся значения высоты навигации. На них могут быть завязаны другие части интерфейса на портала:

• containerUnderlayHeight - значение высоты подложки, которое обновляется в зависимости от ширины экрана (брейкпоинта)
• containerHeight - значение высоты фиксированной части, которое может изменяться в зависимости от реальной высоты контейнера фиксированной части (пример: сворачивается "Меню в один клик" при скролле вниз)

Ссылки

Все ссылки внутри навигации необходимо создавать при помощи компонента ./atoms/link, тк внутри компонента вызывается событие clickOnLink, на которое завязана внешняя обвязка перехода по страницам.

События аналитики

• app.navigation.login_button_clicked — клик по кнопке "Войти"
• app.navigation.logo_clicked — клик по логотипу
• app.navigation.logout_button_clicked — клик по кнопке "Выйти"
• app.navigation.menu_closed — закрытие меню по клику на кнопку "Меню" или по клику вне области навигации
• app.navigation.menu_closed_by_esc_button_clicked — закрытие меню и меню профиля по клику на кнопку Esc
• app.navigation.menu_opened — открытие меню по клику на кнопку "Меню"
• app.navigation.menu_segment_list_item_clicked — клик по элементу списка в блоке контента сегмента
• app.navigation.menu_segment_list_title_clicked — клик по заголовку списка в блоке контента сегмента
• app.navigation.menu_segment_selected — выбор сегмента из списка по наведению (по тапу в мобилках)
• app.navigation.menu_segment_title_clicked — клик по заголовку в блоке контента сегмента
• app.navigation.oneclick_menu_item_clicked — клик по пункту "Меню в один клик"
• app.navigation.profile_menu_closed — закрытие меню профиля по клику вне области
• app.navigation.profile_menu_elementary_level_clicked — клик на бейдж уровня в меню профиля для начальных классов и дошкольников
• app.navigation.profile_menu_elementary_user_area_clicked — клик по области пользователя в меню профиля для начальных классов и дошкольников
• app.navigation.profile_menu_elementary_xp_clicked — клик на бейдж XP в меню профиля для начальных классов и дошкольников
• app.navigation.profile_menu_item_clicked — клик по пункту меню профиля
• app.navigation.profile_menu_opened — открытие меню профиля по клику на аватар пользователя
• app.navigation.user_panel_item_clicked — клик по пункту меню пользователя