EVOgeek/Vmeda.Online
1
0
Fork 1
Code Issues Pull Requests Packages Projects Releases Wiki Activity

MOBILE-4075 h5p: Full screen iframe hide course header and ion-tab-bar

Browse Source
This commit is contained in:
Alfonso Salces 2022-11-23 11:46:39 +01:00
parent 9dfe87e2b2
commit c851105b79
4 changed files with 19 additions and 2 deletions
Show Stats Download Patch File Download Diff File Expand all files Collapse all files

2
src/core/features/course/pages/index/index.html
View File

@ -1,4 +1,4 @@
<ion-header [collapsible]="tabsComponent?.selectedIndex == 0 || tabsComponent?.selectedIndex === undefined">
<ion-header [collapsible]="(tabsComponent?.selectedIndex == 0 || tabsComponent?.selectedIndex === undefined) && !fullScreenEnabled">
<ion-toolbar>
<ion-buttons slot="start">
<ion-back-button [text]="'core.back' | translate"></ion-back-button>

7
src/core/features/course/pages/index/index.ts
View File

@ -49,8 +49,10 @@ export class CoreCourseIndexPage implements OnInit, OnDestroy {
tabs: CourseTab[] = [];
loaded = false;
progress?: number;
fullScreenEnabled = false;
protected currentPagePath = '';
protected fullScreenObserver: CoreEventObserver;
protected selectTabObserver: CoreEventObserver;
protected completionObserver: CoreEventObserver;
protected sections: CoreCourseWSSection[] = []; // List of course sections.
@ -114,6 +116,10 @@ export class CoreCourseIndexPage implements OnInit, OnDestroy {
this.updateProgress();
});
this.fullScreenObserver = CoreEvents.on(CoreEvents.FULL_SCREEN_CHANGED, (event: { enabled: boolean }) => {
this.fullScreenEnabled = event.enabled;
});
}
/**
@ -267,6 +273,7 @@ export class CoreCourseIndexPage implements OnInit, OnDestroy {
CoreNavigator.decreaseRouteDepth(path.replace(/(\/deep)+/, ''));
this.selectTabObserver?.off();
this.completionObserver?.off();
this.fullScreenObserver?.off();
}
/**

1
src/core/singletons/events.ts
View File

@ -122,6 +122,7 @@ export class CoreEvents {
static readonly COURSE_MODULE_VIEWED = 'course_module_viewed';
static readonly COMPLETE_REQUIRED_PROFILE_DATA_FINISHED = 'complete_required_profile_data_finished';
static readonly MAIN_HOME_LOADED = 'main_home_loaded';
static readonly FULL_SCREEN_CHANGED = 'full_screen_changed';
protected static logger = CoreLogger.getInstance('CoreEvents');
protected static observables: { [eventName: string]: Subject<unknown> } = {};

11
src/theme/theme.base.scss
View File

@ -592,6 +592,11 @@ core-split-view.menu-and-content {
// Using router outlet to avoid changing styles on modals.
body.core-iframe-fullscreen ion-router-outlet {
.core-course-header,
ion-tab-bar {
display: none !important;
}
ion-tab-bar.mainmenu-tabs {
display: none;
@ -627,7 +632,7 @@ body.core-iframe-fullscreen ion-router-outlet {
.ion-page {
flex-direction: row-reverse;
ion-header {
width: calc(var(--core-header-toolbar-height), var(--ion-safe-area-right));
width: calc(var(--core-header-toolbar-height) + var(--ion-safe-area-right));
@include safe-area-padding-horizontal(null, 0px);
background: var(--core-header-toolbar-background);
@ -643,6 +648,10 @@ body.core-iframe-fullscreen ion-router-outlet {
}
}
}
core-tabs-outlet {
width: 100%;
}
}
}