@foxford/foxford-navigation v1.0.0
Новая навигация
Обзорная документация по работе навигации находится по этой ссылке
Детали реализации
Чтобы использовать навигацию на портале нужно обращаться к сервису NavigationService
. В будущем, есть желание вынести навигацию в отдельный пакет и постараться максимально отвязаться от зависимостей портала, а всё с ней взаимодействие организовать при помощи "шины-событий".
Высота контейнера
В текущем виде у навигации есть подложка и её высота захардкожена (CONTAINER_HEIGHT
в constants.js
), чтобы компенсировать высоту внутренней части, которая фиксирована относительно верхнего края контейнера страницы. Сам контейнер лежит в ./molecules/container
В модели есть хранилище $navigationOptions
, в котором хранятся значения высоты навигации. На них могут быть завязаны другие части интерфейса на портала:
1. containerUnderlayHeight
- значение высоты подложки, которое обновляется в зависимости от ширины экрана (брейкпоинта)
2. 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
— закрытие меню и меню профиля по клику на кнопку Escapp.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
— клик по пункту меню пользователя