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

MOBILE-3464 tabs: Show tabs again if height changed

main
Pau Ferrer Ocaña 2020-09-17 14:25:56 +02:00
parent 495ff96094
commit 3c3aa464c7
1 changed files with 18 additions and 3 deletions
Show Stats Download Patch File Download Diff File Expand all files Collapse all files

21
src/components/tabs/tabs.ts
View File

@ -52,6 +52,8 @@ export class CoreTabsComponent implements OnInit, AfterViewInit, OnChanges, OnDe
// Minimum tab's width to display fully the word "Competencies" which is the longest tab in the app. // Minimum tab's width to display fully the word "Competencies" which is the longest tab in the app.
static MIN_TAB_WIDTH = 107; static MIN_TAB_WIDTH = 107;
// Max height that allows tab hiding.
static MAX_HEIGHT_TO_HIDE_TABS = 768;
@Input() selectedIndex = 0; // Index of the tab to select. @Input() selectedIndex = 0; // Index of the tab to select.
@Input() hideUntil = true; // Determine when should the contents be shown. @Input() hideUntil = true; // Determine when should the contents be shown.
@ -229,11 +231,24 @@ export class CoreTabsComponent implements OnInit, AfterViewInit, OnChanges, OnDe
* Calculate slides. * Calculate slides.
*/ */
calculateSlides(): void { calculateSlides(): void {
if (!this.isCurrentView || !this.tabsShown || !this.initialized) { if (!this.isCurrentView || !this.initialized) {
// Don't calculate if component isn't in current view, the calculations are wrong. // Don't calculate if component isn't in current view, the calculations are wrong.
return; return;
} }
if (!this.tabsShown) {
if (window.innerHeight >= CoreTabsComponent.MAX_HEIGHT_TO_HIDE_TABS) {
// Ensure tabbar is shown.
this.tabsShown = true;
this.tabBarElement.classList.remove('tabs-hidden');
this.lastScroll = 0;
this.calculateTabBarHeight();
} else {
// Don't recalculate.
return;
}
}
this.calculateMaxSlides().then(() => { this.calculateMaxSlides().then(() => {
this.updateSlides(); this.updateSlides();
}); });
@ -477,8 +492,8 @@ export class CoreTabsComponent implements OnInit, AfterViewInit, OnChanges, OnDe
* @param scrollElement Scroll element to check scroll position. * @param scrollElement Scroll element to check scroll position.
*/ */
showHideTabs(scrollElement: any): void { showHideTabs(scrollElement: any): void {
// Do not scroll on very tall screens. // Always show on very tall screens.
if (window.innerHeight >= 1024) { if (window.innerHeight >= CoreTabsComponent.MAX_HEIGHT_TO_HIDE_TABS) {
return; return;
} }