MOBILE-3807 core: Add user menu button to all level 1 pages
parent
806e29ce10
commit
434a2a90f2
|
@ -22,6 +22,7 @@ import { CoreCommentsComponentsModule } from '@features/comments/components/comp
|
|||
import { CoreTagComponentsModule } from '@features/tag/components/components.module';
|
||||
import { buildTabMainRoutes } from '@features/mainmenu/mainmenu-tab-routing.module';
|
||||
import { AddonBlogMainMenuHandlerService } from './services/handlers/mainmenu';
|
||||
import { CoreMainMenuComponentsModule } from '@features/mainmenu/components/components.module';
|
||||
|
||||
function buildRoutes(injector: Injector): Routes {
|
||||
return [
|
||||
|
@ -39,6 +40,7 @@ function buildRoutes(injector: Injector): Routes {
|
|||
CoreSharedModule,
|
||||
CoreCommentsComponentsModule,
|
||||
CoreTagComponentsModule,
|
||||
CoreMainMenuComponentsModule,
|
||||
],
|
||||
exports: [RouterModule],
|
||||
providers: [
|
||||
|
|
|
@ -4,7 +4,9 @@
|
|||
<ion-back-button [text]="'core.back' | translate"></ion-back-button>
|
||||
</ion-buttons>
|
||||
<h1>{{ title | translate }}</h1>
|
||||
<ion-buttons slot="end"></ion-buttons>
|
||||
<ion-buttons slot="end">
|
||||
<core-user-menu-button></core-user-menu-button>
|
||||
</ion-buttons>
|
||||
</ion-toolbar>
|
||||
</ion-header>
|
||||
<ion-content>
|
||||
|
|
|
@ -22,6 +22,7 @@
|
|||
[content]="'core.settings.synchronizenow' | translate" (action)="doRefresh(undefined, $event, true)"
|
||||
[iconAction]="syncIcon" [closeOnClick]="false"></core-context-menu-item>
|
||||
</core-context-menu>
|
||||
<core-user-menu-button></core-user-menu-button>
|
||||
</ion-buttons>
|
||||
</ion-toolbar>
|
||||
</ion-header>
|
||||
|
|
|
@ -19,6 +19,7 @@ import { CoreSharedModule } from '@/core/shared.module';
|
|||
import { AddonCalendarComponentsModule } from '../../components/components.module';
|
||||
|
||||
import { AddonCalendarIndexPage } from './index.page';
|
||||
import { CoreMainMenuComponentsModule } from '@features/mainmenu/components/components.module';
|
||||
|
||||
const routes: Routes = [
|
||||
{
|
||||
|
@ -32,6 +33,7 @@ const routes: Routes = [
|
|||
RouterModule.forChild(routes),
|
||||
CoreSharedModule,
|
||||
AddonCalendarComponentsModule,
|
||||
CoreMainMenuComponentsModule,
|
||||
],
|
||||
declarations: [
|
||||
AddonCalendarIndexPage,
|
||||
|
|
|
@ -5,6 +5,7 @@
|
|||
</ion-buttons>
|
||||
<h1>{{ 'addon.messages.messages' | translate }}</h1>
|
||||
<ion-buttons slot="end">
|
||||
<core-user-menu-button></core-user-menu-button>
|
||||
</ion-buttons>
|
||||
</ion-toolbar>
|
||||
</ion-header>
|
||||
|
|
|
@ -23,6 +23,7 @@ import { CoreSearchComponentsModule } from '@features/search/components/componen
|
|||
|
||||
import { AddonMessagesDiscussions35Page } from './discussions.page';
|
||||
import { AddonMessagesMainMenuHandlerService } from '@addons/messages/services/handlers/mainmenu';
|
||||
import { CoreMainMenuComponentsModule } from '@features/mainmenu/components/components.module';
|
||||
|
||||
const mobileRoutes: Routes = [
|
||||
{
|
||||
|
@ -58,6 +59,7 @@ const routes: Routes = [
|
|||
RouterModule.forChild(routes),
|
||||
CoreSharedModule,
|
||||
CoreSearchComponentsModule,
|
||||
CoreMainMenuComponentsModule,
|
||||
],
|
||||
declarations: [
|
||||
AddonMessagesDiscussions35Page,
|
||||
|
|
|
@ -11,6 +11,7 @@
|
|||
<ion-button (click)="gotoSettings()" [attr.aria-label]="'addon.messages.messagepreferences' | translate">
|
||||
<ion-icon name="fas-cog" slot="icon-only" aria-hidden="true"></ion-icon>
|
||||
</ion-button>
|
||||
<core-user-menu-button></core-user-menu-button>
|
||||
</ion-buttons>
|
||||
</ion-toolbar>
|
||||
</ion-header>
|
||||
|
|
|
@ -22,6 +22,7 @@ import { CoreSharedModule } from '@/core/shared.module';
|
|||
|
||||
import { AddonMessagesGroupConversationsPage } from './group-conversations.page';
|
||||
import { AddonMessagesMainMenuHandlerService } from '@addons/messages/services/handlers/mainmenu';
|
||||
import { CoreMainMenuComponentsModule } from '@features/mainmenu/components/components.module';
|
||||
|
||||
const mobileRoutes: Routes = [
|
||||
{
|
||||
|
@ -56,6 +57,7 @@ const routes: Routes = [
|
|||
imports: [
|
||||
RouterModule.forChild(routes),
|
||||
CoreSharedModule,
|
||||
CoreMainMenuComponentsModule,
|
||||
],
|
||||
declarations: [
|
||||
AddonMessagesGroupConversationsPage,
|
||||
|
|
|
@ -4,6 +4,9 @@
|
|||
<ion-back-button [text]="'core.back' | translate"></ion-back-button>
|
||||
</ion-buttons>
|
||||
<h1>{{ 'addon.notifications.notifications' | translate }}</h1>
|
||||
<ion-buttons slot="end">
|
||||
<core-user-menu-button></core-user-menu-button>
|
||||
</ion-buttons>
|
||||
</ion-toolbar>
|
||||
</ion-header>
|
||||
<ion-content>
|
||||
|
|
|
@ -18,6 +18,7 @@ import { RouterModule, Routes } from '@angular/router';
|
|||
import { CoreSharedModule } from '@/core/shared.module';
|
||||
import { AddonNotificationsComponentsModule } from '../../components/components.module';
|
||||
import { AddonNotificationsListPage } from './list';
|
||||
import { CoreMainMenuComponentsModule } from '@features/mainmenu/components/components.module';
|
||||
|
||||
const routes: Routes = [
|
||||
{
|
||||
|
@ -31,6 +32,7 @@ const routes: Routes = [
|
|||
RouterModule.forChild(routes),
|
||||
CoreSharedModule,
|
||||
AddonNotificationsComponentsModule,
|
||||
CoreMainMenuComponentsModule,
|
||||
],
|
||||
declarations: [
|
||||
AddonNotificationsListPage,
|
||||
|
|
|
@ -56,7 +56,7 @@ const BUTTON_HIDDEN_CLASS = 'core-navbar-button-hidden';
|
|||
})
|
||||
export class CoreNavBarButtonsComponent implements OnInit, OnDestroy {
|
||||
|
||||
@ViewChild('contextMenuContainer', { read: ViewContainerRef }) container?: ViewContainerRef;
|
||||
@ViewChild('contextMenuContainer', { read: ViewContainerRef }) container!: ViewContainerRef;
|
||||
|
||||
// If the hidden input is true, hide all buttons.
|
||||
// eslint-disable-next-line @angular-eslint/no-input-rename
|
||||
|
@ -113,7 +113,13 @@ export class CoreNavBarButtonsComponent implements OnInit, OnDestroy {
|
|||
|
||||
// Make sure that context-menu is always at the end of buttons if any.
|
||||
const contextMenu = buttonsContainer.querySelector('core-context-menu');
|
||||
contextMenu?.parentElement?.appendChild(contextMenu);
|
||||
const userMenu = buttonsContainer.querySelector('core-user-menu-button');
|
||||
|
||||
if (userMenu) {
|
||||
contextMenu?.parentElement?.insertBefore(contextMenu, userMenu);
|
||||
} else {
|
||||
contextMenu?.parentElement?.appendChild(contextMenu);
|
||||
}
|
||||
} else {
|
||||
this.logger.warn('The header was found, but it didn\'t have the right ion-buttons.', selector);
|
||||
}
|
||||
|
@ -177,7 +183,7 @@ export class CoreNavBarButtonsComponent implements OnInit, OnDestroy {
|
|||
*/
|
||||
protected createMainContextMenu(): CoreContextMenuComponent {
|
||||
const factory = this.factoryResolver.resolveComponentFactory(CoreContextMenuComponent);
|
||||
const componentRef = this.container!.createComponent<CoreContextMenuComponent>(factory);
|
||||
const componentRef = this.container.createComponent<CoreContextMenuComponent>(factory);
|
||||
|
||||
this.createdMainContextMenuElement = componentRef.location.nativeElement;
|
||||
|
||||
|
|
|
@ -36,13 +36,19 @@
|
|||
content: "";
|
||||
}
|
||||
}
|
||||
&.core-bar-button-image img {
|
||||
&.core-bar-button-image {
|
||||
padding: 0;
|
||||
width: var(--core-header-toolbar-button-image-size);
|
||||
height: var(--core-header-toolbar-button-image-size);
|
||||
max-width: var(--core-header-toolbar-button-image-size);
|
||||
max-height: var(--core-header-toolbar-button-image-size);
|
||||
border-radius: 50%;
|
||||
display: block;
|
||||
|
||||
img {
|
||||
padding: 4px;
|
||||
border-radius: 50%;
|
||||
}
|
||||
}
|
||||
|
||||
.contact-status {
|
||||
|
|
|
@ -1,4 +1,4 @@
|
|||
<core-navbar-buttons slot="end">
|
||||
<core-navbar-buttons slot="end" prepend>
|
||||
<ion-button *ngIf="searchEnabled" (click)="openSearch()" [attr.aria-label]="'core.courses.searchcourses' | translate">
|
||||
<ion-icon name="fas-search" slot="icon-only" aria-hidden="true"></ion-icon>
|
||||
</ion-button>
|
||||
|
|
|
@ -5,20 +5,20 @@
|
|||
</ion-buttons>
|
||||
<h1 *ngIf="!showOnlyEnrolled">{{ 'core.courses.availablecourses' | translate }}</h1>
|
||||
<h1 *ngIf="showOnlyEnrolled">{{ 'core.courses.mycourses' | translate }}</h1>
|
||||
<ion-buttons slot="end"></ion-buttons>
|
||||
<ion-buttons slot="end">
|
||||
<core-context-menu>
|
||||
<core-context-menu-item *ngIf="downloadCourseEnabled || downloadCoursesEnabled" [priority]="1000"
|
||||
[content]="'core.settings.showdownloadoptions' | translate" (action)="toggleDownload()"
|
||||
iconAction="toggle" [(toggle)]="downloadEnabled"></core-context-menu-item>
|
||||
<core-context-menu-item [priority]="900"
|
||||
[content]="'core.courses.showonlyenrolled' | translate" (action)="toggleEnrolled()"
|
||||
iconAction="toggle" [(toggle)]="showOnlyEnrolled"></core-context-menu-item>
|
||||
</core-context-menu>
|
||||
<core-user-menu-button></core-user-menu-button>
|
||||
</ion-buttons>
|
||||
</ion-toolbar>
|
||||
</ion-header>
|
||||
<ion-content>
|
||||
<core-navbar-buttons slot="end">
|
||||
<core-context-menu>
|
||||
<core-context-menu-item *ngIf="downloadCourseEnabled || downloadCoursesEnabled" [priority]="1000"
|
||||
[content]="'core.settings.showdownloadoptions' | translate" (action)="toggleDownload()"
|
||||
iconAction="toggle" [(toggle)]="downloadEnabled"></core-context-menu-item>
|
||||
<core-context-menu-item [priority]="900"
|
||||
[content]="'core.courses.showonlyenrolled' | translate" (action)="toggleEnrolled()"
|
||||
iconAction="toggle" [(toggle)]="showOnlyEnrolled"></core-context-menu-item>
|
||||
</core-context-menu>
|
||||
</core-navbar-buttons>
|
||||
<ion-refresher slot="fixed" [disabled]="!loaded" (ionRefresh)="refreshCourses($event.target)">
|
||||
<ion-refresher-content pullingText="{{ 'core.pulltorefresh' | translate }}"></ion-refresher-content>
|
||||
</ion-refresher>
|
||||
|
|
|
@ -20,6 +20,7 @@ import { CoreCoursesComponentsModule } from '../../components/components.module'
|
|||
import { CoreSearchComponentsModule } from '@features/search/components/components.module';
|
||||
|
||||
import { CoreCoursesListPage } from './list';
|
||||
import { CoreMainMenuComponentsModule } from '@features/mainmenu/components/components.module';
|
||||
|
||||
const routes: Routes = [
|
||||
{
|
||||
|
@ -34,6 +35,7 @@ const routes: Routes = [
|
|||
CoreSharedModule,
|
||||
CoreCoursesComponentsModule,
|
||||
CoreSearchComponentsModule,
|
||||
CoreMainMenuComponentsModule,
|
||||
],
|
||||
declarations: [
|
||||
CoreCoursesListPage,
|
||||
|
|
|
@ -8,6 +8,7 @@
|
|||
<img src="assets/img/top_logo.png" class="core-header-logo" [alt]="siteName">
|
||||
</h1>
|
||||
<ion-buttons slot="end">
|
||||
<core-user-menu-button></core-user-menu-button>
|
||||
</ion-buttons>
|
||||
</ion-toolbar>
|
||||
</ion-header>
|
||||
|
|
|
@ -22,6 +22,7 @@ import { CoreMainMenuHomePage } from './home';
|
|||
import { MAIN_MENU_HOME_ROUTES } from './home-routing.module';
|
||||
import { buildTabMainRoutes } from '@features/mainmenu/mainmenu-tab-routing.module';
|
||||
import { CoreMainMenuHomeHandlerService } from '@features/mainmenu/services/handlers/mainmenu';
|
||||
import { CoreMainMenuComponentsModule } from '@features/mainmenu/components/components.module';
|
||||
|
||||
function buildRoutes(injector: Injector): Routes {
|
||||
const routes = resolveModuleRoutes(injector, MAIN_MENU_HOME_ROUTES);
|
||||
|
@ -42,6 +43,7 @@ function buildRoutes(injector: Injector): Routes {
|
|||
@NgModule({
|
||||
imports: [
|
||||
CoreSharedModule,
|
||||
CoreMainMenuComponentsModule,
|
||||
],
|
||||
providers: [
|
||||
{ provide: ROUTES, multi: true, useFactory: buildRoutes, deps: [Injector] },
|
||||
|
|
|
@ -1,4 +1,4 @@
|
|||
<core-navbar-buttons slot="end">
|
||||
<core-navbar-buttons slot="end" prepend>
|
||||
<ion-button *ngIf="searchEnabled" (click)="openSearch()" [attr.aria-label]="'core.courses.searchcourses' | translate">
|
||||
<ion-icon name="fas-search" slot="icon-only" aria-hidden="true"></ion-icon>
|
||||
</ion-button>
|
||||
|
|
|
@ -4,6 +4,9 @@
|
|||
<ion-back-button [text]="'core.back' | translate"></ion-back-button>
|
||||
</ion-buttons>
|
||||
<h1>{{ 'core.tag.searchtags' | translate }}</h1>
|
||||
<ion-buttons slot="end">
|
||||
<core-user-menu-button></core-user-menu-button>
|
||||
</ion-buttons>
|
||||
</ion-toolbar>
|
||||
</ion-header>
|
||||
<ion-content>
|
||||
|
|
|
@ -19,6 +19,7 @@ import { CoreSharedModule } from '@/core/shared.module';
|
|||
import { CoreSearchComponentsModule } from '@features/search/components/components.module';
|
||||
|
||||
import { CoreTagSearchPage } from './search.page';
|
||||
import { CoreMainMenuComponentsModule } from '@features/mainmenu/components/components.module';
|
||||
|
||||
const routes: Routes = [
|
||||
{
|
||||
|
@ -34,6 +35,7 @@ const routes: Routes = [
|
|||
RouterModule.forChild(routes),
|
||||
CoreSharedModule,
|
||||
CoreSearchComponentsModule,
|
||||
CoreMainMenuComponentsModule,
|
||||
],
|
||||
exports: [RouterModule],
|
||||
})
|
||||
|
|
|
@ -655,12 +655,13 @@ ion-card ion-item:only-child {
|
|||
|
||||
ion-toolbar h1 img.core-bar-button-image,
|
||||
ion-toolbar h1 .core-bar-button-image img {
|
||||
padding: 0;
|
||||
padding: 4px;
|
||||
width: var(--core-header-toolbar-button-image-size);
|
||||
height: var(--core-header-toolbar-button-image-size);
|
||||
max-width: var(--core-header-toolbar-button-image-size);
|
||||
max-height: var(--core-header-toolbar-button-image-size);
|
||||
border-radius: 50%;
|
||||
display: block;
|
||||
}
|
||||
|
||||
// Action sheet.
|
||||
|
|
Loading…
Reference in New Issue