Fixed: Flex layout ObservableMedia is depreciated

This commit is contained in:
sercan 2019-01-17 07:29:39 +03:00
parent 6f3ce4059d
commit 3827b10fc5
5 changed files with 22 additions and 22 deletions

View File

@ -1,5 +1,5 @@
import { Component, ElementRef, Input, OnDestroy, OnInit, Renderer2, ViewChild } from '@angular/core'; import { Component, ElementRef, Input, OnDestroy, OnInit, Renderer2, ViewChild } from '@angular/core';
import { ObservableMedia } from '@angular/flex-layout'; import { MediaObserver } from '@angular/flex-layout';
import { CookieService } from 'ngx-cookie-service'; import { CookieService } from 'ngx-cookie-service';
import { Subject } from 'rxjs'; import { Subject } from 'rxjs';
import { takeUntil } from 'rxjs/operators'; import { takeUntil } from 'rxjs/operators';
@ -35,17 +35,17 @@ export class FuseShortcutsComponent implements OnInit, OnDestroy
/** /**
* Constructor * Constructor
* *
* @param {Renderer2} _renderer
* @param {CookieService} _cookieService * @param {CookieService} _cookieService
* @param {FuseMatchMediaService} _fuseMatchMediaService * @param {FuseMatchMediaService} _fuseMatchMediaService
* @param {FuseNavigationService} _fuseNavigationService * @param {FuseNavigationService} _fuseNavigationService
* @param {ObservableMedia} _observableMedia * @param {MediaObserver} _mediaObserver
* @param {Renderer2} _renderer
*/ */
constructor( constructor(
private _cookieService: CookieService, private _cookieService: CookieService,
private _fuseMatchMediaService: FuseMatchMediaService, private _fuseMatchMediaService: FuseMatchMediaService,
private _fuseNavigationService: FuseNavigationService, private _fuseNavigationService: FuseNavigationService,
private _observableMedia: ObservableMedia, private _mediaObserver: MediaObserver,
private _renderer: Renderer2 private _renderer: Renderer2
) )
{ {
@ -109,7 +109,7 @@ export class FuseShortcutsComponent implements OnInit, OnDestroy
this._fuseMatchMediaService.onMediaChange this._fuseMatchMediaService.onMediaChange
.pipe(takeUntil(this._unsubscribeAll)) .pipe(takeUntil(this._unsubscribeAll))
.subscribe(() => { .subscribe(() => {
if ( this._observableMedia.isActive('gt-sm') ) if ( this._mediaObserver.isActive('gt-sm') )
{ {
this.hideMobileShortcutsPanel(); this.hideMobileShortcutsPanel();
} }

View File

@ -2,7 +2,7 @@ import {
ChangeDetectorRef, Component, ElementRef, EventEmitter, HostBinding, HostListener, Input, OnDestroy, OnInit, Output, Renderer2, ViewEncapsulation ChangeDetectorRef, Component, ElementRef, EventEmitter, HostBinding, HostListener, Input, OnDestroy, OnInit, Output, Renderer2, ViewEncapsulation
} from '@angular/core'; } from '@angular/core';
import { animate, AnimationBuilder, AnimationPlayer, style } from '@angular/animations'; import { animate, AnimationBuilder, AnimationPlayer, style } from '@angular/animations';
import { ObservableMedia } from '@angular/flex-layout'; import { MediaObserver } from '@angular/flex-layout';
import { Subject } from 'rxjs'; import { Subject } from 'rxjs';
import { takeUntil } from 'rxjs/operators'; import { takeUntil } from 'rxjs/operators';
@ -87,7 +87,7 @@ export class FuseSidebarComponent implements OnInit, OnDestroy
* @param {FuseConfigService} _fuseConfigService * @param {FuseConfigService} _fuseConfigService
* @param {FuseMatchMediaService} _fuseMatchMediaService * @param {FuseMatchMediaService} _fuseMatchMediaService
* @param {FuseSidebarService} _fuseSidebarService * @param {FuseSidebarService} _fuseSidebarService
* @param {ObservableMedia} _observableMedia * @param {MediaObserver} _mediaObserver
* @param {Renderer2} _renderer * @param {Renderer2} _renderer
*/ */
constructor( constructor(
@ -97,7 +97,7 @@ export class FuseSidebarComponent implements OnInit, OnDestroy
private _fuseConfigService: FuseConfigService, private _fuseConfigService: FuseConfigService,
private _fuseMatchMediaService: FuseMatchMediaService, private _fuseMatchMediaService: FuseMatchMediaService,
private _fuseSidebarService: FuseSidebarService, private _fuseSidebarService: FuseSidebarService,
private _observableMedia: ObservableMedia, private _mediaObserver: MediaObserver,
private _renderer: Renderer2 private _renderer: Renderer2
) )
{ {
@ -319,7 +319,7 @@ export class FuseSidebarComponent implements OnInit, OnDestroy
.subscribe(() => { .subscribe(() => {
// Get the active status // Get the active status
const isActive = this._observableMedia.isActive(this.lockedOpen); const isActive = this._mediaObserver.isActive(this.lockedOpen);
// If the both status are the same, don't act // If the both status are the same, don't act
if ( this._wasActive === isActive ) if ( this._wasActive === isActive )

View File

@ -1,6 +1,6 @@
import { Directive, Input, OnInit, HostListener, OnDestroy, HostBinding } from '@angular/core'; import { Directive, Input, OnInit, HostListener, OnDestroy, HostBinding } from '@angular/core';
import { MatSidenav } from '@angular/material'; import { MatSidenav } from '@angular/material';
import { ObservableMedia } from '@angular/flex-layout'; import { MediaObserver } from '@angular/flex-layout';
import { Subject } from 'rxjs'; import { Subject } from 'rxjs';
import { takeUntil } from 'rxjs/operators'; import { takeUntil } from 'rxjs/operators';
@ -30,13 +30,13 @@ export class FuseMatSidenavHelperDirective implements OnInit, OnDestroy
* @param {FuseMatchMediaService} _fuseMatchMediaService * @param {FuseMatchMediaService} _fuseMatchMediaService
* @param {FuseMatSidenavHelperService} _fuseMatSidenavHelperService * @param {FuseMatSidenavHelperService} _fuseMatSidenavHelperService
* @param {MatSidenav} _matSidenav * @param {MatSidenav} _matSidenav
* @param {ObservableMedia} _observableMedia * @param {MediaObserver} _mediaObserver
*/ */
constructor( constructor(
private _fuseMatchMediaService: FuseMatchMediaService, private _fuseMatchMediaService: FuseMatchMediaService,
private _fuseMatSidenavHelperService: FuseMatSidenavHelperService, private _fuseMatSidenavHelperService: FuseMatSidenavHelperService,
private _matSidenav: MatSidenav, private _matSidenav: MatSidenav,
private _observableMedia: ObservableMedia private _mediaObserver: MediaObserver
) )
{ {
// Set the defaults // Set the defaults
@ -58,7 +58,7 @@ export class FuseMatSidenavHelperDirective implements OnInit, OnDestroy
// Register the sidenav to the service // Register the sidenav to the service
this._fuseMatSidenavHelperService.setSidenav(this.fuseMatSidenavHelper, this._matSidenav); this._fuseMatSidenavHelperService.setSidenav(this.fuseMatSidenavHelper, this._matSidenav);
if ( this._observableMedia.isActive(this.matIsLockedOpen) ) if ( this._mediaObserver.isActive(this.matIsLockedOpen) )
{ {
this.isLockedOpen = true; this.isLockedOpen = true;
this._matSidenav.mode = 'side'; this._matSidenav.mode = 'side';
@ -74,7 +74,7 @@ export class FuseMatSidenavHelperDirective implements OnInit, OnDestroy
this._fuseMatchMediaService.onMediaChange this._fuseMatchMediaService.onMediaChange
.pipe(takeUntil(this._unsubscribeAll)) .pipe(takeUntil(this._unsubscribeAll))
.subscribe(() => { .subscribe(() => {
if ( this._observableMedia.isActive(this.matIsLockedOpen) ) if ( this._mediaObserver.isActive(this.matIsLockedOpen) )
{ {
this.isLockedOpen = true; this.isLockedOpen = true;
this._matSidenav.mode = 'side'; this._matSidenav.mode = 'side';

View File

@ -1,4 +1,4 @@
import { MediaChange, ObservableMedia } from '@angular/flex-layout'; import { MediaChange, MediaObserver } from '@angular/flex-layout';
import { Injectable } from '@angular/core'; import { Injectable } from '@angular/core';
import { BehaviorSubject } from 'rxjs'; import { BehaviorSubject } from 'rxjs';
import { debounceTime, distinctUntilChanged } from 'rxjs/operators'; import { debounceTime, distinctUntilChanged } from 'rxjs/operators';
@ -14,10 +14,10 @@ export class FuseMatchMediaService
/** /**
* Constructor * Constructor
* *
* @param {ObservableMedia} _observableMedia * @param {MediaObserver} _mediaObserver
*/ */
constructor( constructor(
private _observableMedia: ObservableMedia private _mediaObserver: MediaObserver
) )
{ {
// Set the defaults // Set the defaults
@ -39,7 +39,7 @@ export class FuseMatchMediaService
*/ */
private _init(): void private _init(): void
{ {
this._observableMedia.asObservable() this._mediaObserver.media$
.pipe( .pipe(
debounceTime(500), debounceTime(500),
distinctUntilChanged() distinctUntilChanged()

View File

@ -1,5 +1,5 @@
import { Component, OnDestroy, OnInit, ViewEncapsulation } from '@angular/core'; import { Component, OnDestroy, OnInit, ViewEncapsulation } from '@angular/core';
import { ObservableMedia } from '@angular/flex-layout'; import { MediaObserver } from '@angular/flex-layout';
import { Subject } from 'rxjs'; import { Subject } from 'rxjs';
import { takeUntil } from 'rxjs/operators'; import { takeUntil } from 'rxjs/operators';
@ -31,12 +31,12 @@ export class ChatChatsSidenavComponent implements OnInit, OnDestroy
* *
* @param {ChatService} _chatService * @param {ChatService} _chatService
* @param {FuseMatSidenavHelperService} _fuseMatSidenavHelperService * @param {FuseMatSidenavHelperService} _fuseMatSidenavHelperService
* @param {ObservableMedia} _observableMedia * @param {MediaObserver} _mediaObserver
*/ */
constructor( constructor(
private _chatService: ChatService, private _chatService: ChatService,
private _fuseMatSidenavHelperService: FuseMatSidenavHelperService, private _fuseMatSidenavHelperService: FuseMatSidenavHelperService,
public _observableMedia: ObservableMedia public _mediaObserver: MediaObserver
) )
{ {
// Set the defaults // Set the defaults
@ -98,7 +98,7 @@ export class ChatChatsSidenavComponent implements OnInit, OnDestroy
{ {
this._chatService.getChat(contact); this._chatService.getChat(contact);
if ( !this._observableMedia.isActive('gt-md') ) if ( !this._mediaObserver.isActive('gt-md') )
{ {
this._fuseMatSidenavHelperService.getSidenav('chat-left-sidenav').toggle(); this._fuseMatSidenavHelperService.getSidenav('chat-left-sidenav').toggle();
} }