diff --git a/contact-us/contact-us.component.html b/contact-us/contact-us.component.html index 11285a71..ad78e795 100644 --- a/contact-us/contact-us.component.html +++ b/contact-us/contact-us.component.html @@ -26,7 +26,7 @@
- +
diff --git a/contact-us/contact-us.component.ts b/contact-us/contact-us.component.ts index 19c1a9dc..e86006a2 100644 --- a/contact-us/contact-us.component.ts +++ b/contact-us/contact-us.component.ts @@ -1,7 +1,8 @@ -import {Component, EventEmitter, Input, Output} from '@angular/core'; +import {Component, EventEmitter, Input, Output, ViewChild} from '@angular/core'; import {FormGroup} from '@angular/forms'; import {EnvProperties} from "../utils/properties/env-properties"; import {properties} from "../../../environments/environment"; +import {RecaptchaComponent} from "ng-recaptcha"; @Component({ selector: 'contact-us', @@ -18,6 +19,8 @@ export class ContactUsComponent { @Input() public scrollspy: boolean = false; @Input() public sending: boolean = false; @Output() sendEmitter: EventEmitter = new EventEmitter(); + @ViewChild('captchaElem') captchaElem: RecaptchaComponent; + public properties: EnvProperties = properties; public send() { @@ -29,4 +32,8 @@ export class ContactUsComponent { public handleRecaptcha(captchaResponse: string) { this.contactForm.get('recaptcha').setValue(captchaResponse); } + + public resetRecaptcha() { + this.captchaElem.reset(); + } } diff --git a/dashboard/portal/portals.component.html b/dashboard/portal/portals.component.html index 9f57de8c..6910431c 100644 --- a/dashboard/portal/portals.component.html +++ b/dashboard/portal/portals.component.html @@ -55,11 +55,11 @@ Bulk Actions ({{getSelectedPortals().length}})
-
@@ -67,6 +67,7 @@ Name Type + Piwik Actions @@ -81,6 +82,9 @@
{{check.portal.type}}
+ +
{{check.portal.piwik}}
+
diff --git a/dashboard/portal/portals.component.ts b/dashboard/portal/portals.component.ts index be2ed599..d9dec3ec 100644 --- a/dashboard/portal/portals.component.ts +++ b/dashboard/portal/portals.component.ts @@ -229,11 +229,11 @@ export class PortalsComponent implements OnInit { public filterByType(portal: Portal): boolean { let type = this.filterForm.get("type").value; - return type == "all" || (type == portal.type); + return type == "all" || (type === portal.type); } public filterPortals(portal: Portal): boolean { - return this.searchText.toString() === '' || (portal.name || portal.type).match(this.searchText) != null; + return this.searchText.toString() === '' || (portal.name + portal.type + portal.pid).match(this.searchText) != null; } handleUpdateError(message: string, error = null) { diff --git a/dashboard/sharedComponents/page-content/page-content.component.ts b/dashboard/sharedComponents/page-content/page-content.component.ts index 64ff4522..35f64427 100644 --- a/dashboard/sharedComponents/page-content/page-content.component.ts +++ b/dashboard/sharedComponents/page-content/page-content.component.ts @@ -2,14 +2,15 @@ import { AfterViewInit, ChangeDetectorRef, Component, - ElementRef, Inject, + ElementRef, + Inject, Input, OnDestroy, - OnInit, PLATFORM_ID, + OnInit, + PLATFORM_ID, ViewChild } from "@angular/core"; import {LayoutService} from "../sidebar/layout.service"; -import {Subscription} from "rxjs"; declare var UIkit; declare var ResizeObserver; @@ -18,29 +19,27 @@ declare var ResizeObserver; selector: '[page-content]', template: `
-
+
-
+
-
-
+
-
+
-
+
@@ -48,13 +47,13 @@ declare var ResizeObserver;
-
+
-
+
@@ -65,47 +64,65 @@ declare var ResizeObserver; export class PageContentComponent implements OnInit, AfterViewInit, OnDestroy { @Input() public headerSticky: boolean = false; + @Input() + public border: boolean = true; public offset: number; public shouldSticky: boolean = true; + public isMobile: boolean = false; @ViewChild('header') header: ElementRef; @ViewChild('actions') actions: ElementRef; - public footer_offset: number = 0; public footer_height: number = 0; - @ViewChild("sticky_footer") sticky_footer; + @ViewChild("sticky_footer") sticky_footer: ElementRef; + private sticky = { + header: null, + footer: null + } + public isStickyActive: boolean = false; subscriptions = []; - + constructor(private layoutService: LayoutService, private cdr: ChangeDetectorRef, @Inject(PLATFORM_ID) private platformId) { } - + ngOnInit() { if (typeof document !== "undefined") { this.offset = Number.parseInt(getComputedStyle(document.documentElement).getPropertyValue('--header-height')); + this.stickyBugWorkaround(); } + this.subscriptions.push(this.layoutService.isMobile.subscribe(isMobile => { + this.isMobile = isMobile; + this.cdr.detectChanges(); + })); } - + get isBrowser() { return this.platformId === 'browser'; } - - get isStickyActive() { - if (this.header && this.actions && this.shouldSticky) { - let sticky = this.headerSticky ? this.header.nativeElement : this.actions.nativeElement; - return UIkit.sticky(sticky).isActive; - } else { - return false; - } - } - + ngAfterViewInit() { if (typeof document !== "undefined") { - // TODO make it smooth - // this.observeBottom(); - this.observeHeader(); this.observeStickyFooter(); + if (this.shouldSticky && typeof document !== 'undefined') { + this.sticky.header = UIkit.sticky((this.headerSticky ? this.header.nativeElement : this.actions.nativeElement), { + media: '@m', + offset: this.offset + }); + this.subscriptions.push(UIkit.util.on(document, 'active', '#' + this.sticky.header.$el.id, () => { + this.isStickyActive = true; + this.cdr.detectChanges(); + })); + this.subscriptions.push(UIkit.util.on(document, 'inactive', '#' + this.sticky.header.$el.id, () => { + this.isStickyActive = false; + this.cdr.detectChanges(); + })); + } + if (this.sticky_footer) { + let footer_offset = this.calcStickyFooterOffset(this.sticky_footer.nativeElement); + this.sticky.footer = UIkit.sticky(this.sticky_footer.nativeElement, {bottom: true, offset: footer_offset}); + } } } - + ngOnDestroy() { this.subscriptions.forEach(subscription => { if (subscription instanceof (ResizeObserver || IntersectionObserver)) { @@ -113,13 +130,48 @@ export class PageContentComponent implements OnInit, AfterViewInit, OnDestroy { } }); } - - ngAfterContentChecked() { - if (this.sticky_footer && typeof document !== 'undefined') { - this.footer_offset = this.calcStickyFooterOffset(this.sticky_footer.nativeElement); - } + + + /** + * Workaround for sticky not update bug when sidebar is toggled. + * TODO when UIKit will be updated => remove + * + * */ + stickyBugWorkaround() { + let sidebarOffset = Number.parseInt(getComputedStyle(document.documentElement).getPropertyValue('--dashboard-sidebar-width')) - + Number.parseInt(getComputedStyle(document.documentElement).getPropertyValue('--dashboard-sidebar-mini-width')); + let transitionDelay = Number.parseFloat(getComputedStyle(document.documentElement).getPropertyValue('--dashboard-transition-delay')) * 1000; + this.subscriptions.push(this.layoutService.isOpen.subscribe(isOpen => { + if (this.sticky.header) { + if (isOpen) { + this.sticky.header.$el.style.width = Number.parseInt(this.sticky.header.$el.style.width) - sidebarOffset + 'px'; + } else { + this.sticky.header.$el.style.width = Number.parseInt(this.sticky.header.$el.style.width) + sidebarOffset + 'px'; + } + setTimeout(() => { + this.sticky.header.$emit(); + }, transitionDelay); + } + if (this.sticky.footer) { + if (isOpen) { + this.sticky.footer.$el.style.width = Number.parseInt(this.sticky.footer.$el.style.width) - sidebarOffset + 'px'; + } else { + this.sticky.footer.$el.style.width = Number.parseInt(this.sticky.footer.$el.style.width) + sidebarOffset + 'px'; + } + setTimeout(() => { + this.sticky.footer.$emit(); + }, transitionDelay); + } + this.cdr.detectChanges(); + })); } - + + /** + * @deprecated + * + * Should be smooth + * + * */ private observeBottom() { let bottom = document.getElementById('bottom'); if (bottom) { @@ -132,12 +184,15 @@ export class PageContentComponent implements OnInit, AfterViewInit, OnDestroy { bottomObs.observe(bottom); } } - + + /** + * @deprecated + * */ private observeHeader() { if (this.header) { let headerObs = new IntersectionObserver(entries => { entries.forEach(entry => { - if(entry.boundingClientRect.height > 0) { + if (entry.boundingClientRect.height > 0) { this.layoutService.setReplaceHeader(!entry.isIntersecting); } }) @@ -146,13 +201,13 @@ export class PageContentComponent implements OnInit, AfterViewInit, OnDestroy { headerObs.observe(this.header.nativeElement); } } - + private observeStickyFooter() { if (this.sticky_footer) { let resizeObs = new ResizeObserver(entries => { entries.forEach(entry => { setTimeout(() => { - this.footer_offset = this.calcStickyFooterOffset(entry.target); + this.sticky.footer.offset = this.calcStickyFooterOffset(entry.target); this.cdr.detectChanges(); }); }) @@ -161,7 +216,7 @@ export class PageContentComponent implements OnInit, AfterViewInit, OnDestroy { resizeObs.observe(this.sticky_footer.nativeElement); } } - + calcStickyFooterOffset(element) { this.footer_height = element.offsetHeight; return window.innerHeight - this.footer_height; diff --git a/dashboard/sharedComponents/sidebar/layout.service.ts b/dashboard/sharedComponents/sidebar/layout.service.ts index f39048df..d39fb765 100644 --- a/dashboard/sharedComponents/sidebar/layout.service.ts +++ b/dashboard/sharedComponents/sidebar/layout.service.ts @@ -17,6 +17,11 @@ export class LayoutService { */ private openSubject: BehaviorSubject = new BehaviorSubject(false); + /** + * Set this to true when sidebar is hovered, otherwise false. + */ + private hoverSubject: BehaviorSubject = new BehaviorSubject(false); + /** * Add hasSidebar: false on data of route config, if sidebar is not needed. */ @@ -41,6 +46,7 @@ export class LayoutService { private isFrontPageSubject: BehaviorSubject = new BehaviorSubject(false); /** * Add isSmallScreen: true on data of route config, if screen is small. + * @deprecated */ private isSmallScreenSubject: BehaviorSubject = new BehaviorSubject(false); /** @@ -155,7 +161,11 @@ export class LayoutService { })); this.setObserver(); } - + + get isOpen(): Observable { + return this.openSubject.asObservable(); + } + get open(): boolean { return this.openSubject.getValue(); } @@ -164,6 +174,14 @@ export class LayoutService { this.openSubject.next(value); } + get hover(): boolean { + return this.hoverSubject.getValue(); + } + + setHover(value: boolean) { + this.hoverSubject.next(value); + } + get hasSidebar(): Observable { return this.hasSidebarSubject.asObservable(); } @@ -216,10 +234,16 @@ export class LayoutService { this.replaceHeaderSubject.next(value); } + /** + * @deprecated + * */ get isSmallScreen(): boolean { return this.isSmallScreenSubject.getValue(); } + /** + * @deprecated + * */ setSmallScreen(value: boolean) { this.isSmallScreenSubject.next(value); } diff --git a/dashboard/sharedComponents/sidebar/sideBar.component.html b/dashboard/sharedComponents/sidebar/sideBar.component.html index 22c4cb2a..29682e8e 100644 --- a/dashboard/sharedComponents/sidebar/sideBar.component.html +++ b/dashboard/sharedComponents/sidebar/sideBar.component.html @@ -1,19 +1,16 @@