Skip to content
This repository was archived by the owner on Jan 6, 2025. It is now read-only.

Commit 57ba228

Browse files
CaerusKaruCaerusKaru
committed
second PR comment pass
1 parent 176958e commit 57ba228

File tree

7 files changed

+33
-106
lines changed

7 files changed

+33
-106
lines changed

‎src/lib/media-query/_module.ts

Lines changed: 2 additions & 2 deletions
Original file line numberDiff line numberDiff line change
@@ -11,7 +11,7 @@ import {MediaMonitor} from './media-monitor';
1111
import {OBSERVABLE_MEDIA_PROVIDER} from './observable-media-provider';
1212
import {DEFAULT_BREAKPOINTS_PROVIDER} from './breakpoints/break-points-provider';
1313
import {BreakPointRegistry} from './breakpoints/break-point-registry';
14-
import {MATCH_MEDIA_PROVIDER} from './match-media-provider';
14+
import {MatchMedia} from './match-media';
1515

1616
/**
1717
* *****************************************************************
@@ -23,7 +23,7 @@ import {MATCH_MEDIA_PROVIDER} from './match-media-provider';
2323
providers: [
2424
DEFAULT_BREAKPOINTS_PROVIDER, // Supports developer overrides of list of known breakpoints
2525
BreakPointRegistry, // Registry of known/used BreakPoint(s)
26-
MATCH_MEDIA_PROVIDER, // Low-level service to publish observables w/ window.matchMedia()
26+
MatchMedia, // Low-level service to publish observables w/ window.matchMedia()
2727
MediaMonitor, // MediaQuery monitor service observes all known breakpoints
2828
OBSERVABLE_MEDIA_PROVIDER // easy subscription injectable `media$` matchMedia observable
2929
]

‎src/lib/media-query/index.ts

Lines changed: 0 additions & 1 deletion
Original file line numberDiff line numberDiff line change
@@ -21,6 +21,5 @@ export * from './breakpoints/break-points-provider';
2121
export * from './observable-media-provider';
2222
export * from './media-monitor-provider';
2323
export * from './server-match-media';
24-
export * from './match-media-provider';
2524

2625
export * from './_module';

‎src/lib/media-query/match-media-provider.ts

Lines changed: 0 additions & 39 deletions
This file was deleted.

‎src/lib/media-query/mock/mock-match-media.ts

Lines changed: 14 additions & 31 deletions
Original file line numberDiff line numberDiff line change
@@ -19,9 +19,7 @@ import {BreakPointRegistry} from '../breakpoints/break-point-registry';
1919
@Injectable()
2020
export class MockMatchMedia extends MatchMedia {
2121

22-
/**
23-
* Special flag used to test BreakPoint registrations with MatchMedia
24-
*/
22+
/** Special flag used to test BreakPoint registrations with MatchMedia */
2523
autoRegisterQueries = true;
2624

2725
/**
@@ -37,9 +35,7 @@ export class MockMatchMedia extends MatchMedia {
3735
this._actives = [];
3836
}
3937

40-
/**
41-
* Easy method to clear all listeners for all mediaQueries
42-
*/
38+
/** Easy method to clear all listeners for all mediaQueries */
4339
clearAll() {
4440
this._registry.forEach((mql: MockMediaQueryList, _) => {
4541
mql.destroy();
@@ -48,9 +44,7 @@ export class MockMatchMedia extends MatchMedia {
4844
this.useOverlaps = false;
4945
}
5046

51-
/**
52-
* Feature to support manual, simulated activation of a mediaQuery.
53-
*/
47+
/** Feature to support manual, simulated activation of a mediaQuery. */
5448
activate(mediaQuery: string, useOverlaps = false): boolean {
5549
useOverlaps = useOverlaps || this.useOverlaps;
5650
mediaQuery = this._validateQuery(mediaQuery);
@@ -65,9 +59,7 @@ export class MockMatchMedia extends MatchMedia {
6559
return this.hasActivated;
6660
}
6761

68-
/**
69-
* Converts an optional mediaQuery alias to a specific, valid mediaQuery
70-
*/
62+
/** Converts an optional mediaQuery alias to a specific, valid mediaQuery */
7163
_validateQuery(queryOrAlias) {
7264
let bp = this._breakpoints.findByAlias(queryOrAlias);
7365
if (bp) {
@@ -147,9 +139,7 @@ export class MockMatchMedia extends MatchMedia {
147139
return this.hasActivated;
148140
}
149141

150-
/**
151-
* Deactivate all current Mock MQLs
152-
*/
142+
/** Deactivate all current Mock MQLs */
153143
private _deactivateAll() {
154144
if (this._actives.length) {
155145
// Deactivate all current MQLs and reset the buffer
@@ -161,9 +151,7 @@ export class MockMatchMedia extends MatchMedia {
161151
return this;
162152
}
163153

164-
/**
165-
* Insure the mediaQuery is registered with MatchMedia
166-
*/
154+
/** Insure the mediaQuery is registered with MatchMedia */
167155
private _registerMediaQuery(mediaQuery) {
168156
if (!this._registry.has(mediaQuery) && this.autoRegisterQueries) {
169157
this.registerQuery(mediaQuery);
@@ -192,7 +180,7 @@ export class MockMatchMedia extends MatchMedia {
192180
*/
193181
export class MockMediaQueryList implements MediaQueryList {
194182
private _isActive = false;
195-
private _listeners: Array<MediaQueryListListener> = [];
183+
private _listeners: MediaQueryListListener[] = [];
196184

197185
get matches(): boolean {
198186
return this._isActive;
@@ -202,20 +190,18 @@ export class MockMediaQueryList implements MediaQueryList {
202190
return this._mediaQuery;
203191
}
204192

205-
constructor(private _mediaQuery: string) {
206-
}
193+
constructor(private _mediaQuery: string) {}
207194

208195
/**
209-
*
196+
* Destroy the current list by deactivating the
197+
* listeners and clearing the internal list
210198
*/
211199
destroy() {
212200
this.deactivate();
213201
this._listeners = [];
214202
}
215203

216-
/**
217-
* Notify all listeners that 'matches === TRUE'
218-
*/
204+
/** Notify all listeners that 'matches === TRUE' */
219205
activate(): MockMediaQueryList {
220206
if (!this._isActive) {
221207
this._isActive = true;
@@ -226,9 +212,7 @@ export class MockMediaQueryList implements MediaQueryList {
226212
return this;
227213
}
228214

229-
/**
230-
* Notify all listeners that 'matches === false'
231-
*/
215+
/** Notify all listeners that 'matches === false' */
232216
deactivate(): MockMediaQueryList {
233217
if (this._isActive) {
234218
this._isActive = false;
@@ -239,9 +223,7 @@ export class MockMediaQueryList implements MediaQueryList {
239223
return this;
240224
}
241225

242-
/**
243-
*
244-
*/
226+
/** Add a listener to our internal list to activate later */
245227
addListener(listener: MediaQueryListListener) {
246228
if (this._listeners.indexOf(listener) === -1) {
247229
this._listeners.push(listener);
@@ -251,6 +233,7 @@ export class MockMediaQueryList implements MediaQueryList {
251233
}
252234
}
253235

236+
/** Don't need to remove listeners in the testing environment */
254237
removeListener(_: MediaQueryListListener) {
255238
}
256239
}

‎src/lib/media-query/server-match-media.ts

Lines changed: 7 additions & 19 deletions
Original file line numberDiff line numberDiff line change
@@ -20,7 +20,7 @@ import {MatchMedia} from './match-media';
2020
*/
2121
export class ServerMediaQueryList implements MediaQueryList {
2222
private _isActive = false;
23-
private _listeners: Array<MediaQueryListListener> = [];
23+
private _listeners: MediaQueryListListener[] = [];
2424

2525
get matches(): boolean {
2626
return this._isActive;
@@ -41,9 +41,7 @@ export class ServerMediaQueryList implements MediaQueryList {
4141
this._listeners = [];
4242
}
4343

44-
/**
45-
* Notify all listeners that 'matches === TRUE'
46-
*/
44+
/** Notify all listeners that 'matches === TRUE' */
4745
activate(): ServerMediaQueryList {
4846
if (!this._isActive) {
4947
this._isActive = true;
@@ -54,9 +52,7 @@ export class ServerMediaQueryList implements MediaQueryList {
5452
return this;
5553
}
5654

57-
/**
58-
* Notify all listeners that 'matches === false'
59-
*/
55+
/** Notify all listeners that 'matches === false' */
6056
deactivate(): ServerMediaQueryList {
6157
if (this._isActive) {
6258
this._isActive = false;
@@ -67,9 +63,7 @@ export class ServerMediaQueryList implements MediaQueryList {
6763
return this;
6864
}
6965

70-
/**
71-
* Add a listener to our internal list to activate later
72-
*/
66+
/** Add a listener to our internal list to activate later */
7367
addListener(listener: MediaQueryListListener) {
7468
if (this._listeners.indexOf(listener) === -1) {
7569
this._listeners.push(listener);
@@ -79,9 +73,7 @@ export class ServerMediaQueryList implements MediaQueryList {
7973
}
8074
}
8175

82-
/**
83-
* Don't need to remove listeners in the server environment
84-
*/
76+
/** Don't need to remove listeners in the server environment */
8577
removeListener(_: MediaQueryListListener) {
8678
}
8779
}
@@ -106,19 +98,15 @@ export class ServerMatchMedia extends MatchMedia {
10698
this._observable$ = this._source.asObservable();
10799
}
108100

109-
/**
110-
* Activate the specified breakpoint if we're on the server, no-op otherwise
111-
*/
101+
/** Activate the specified breakpoint if we're on the server, no-op otherwise */
112102
activateBreakpoint(bp: BreakPoint) {
113103
const lookupBreakpoint = this._registry.get(bp.mediaQuery);
114104
if (lookupBreakpoint) {
115105
lookupBreakpoint.activate();
116106
}
117107
}
118108

119-
/**
120-
* Deactivate the specified breakpoint if we're on the server, no-op otherwise
121-
*/
109+
/** Deactivate the specified breakpoint if we're on the server, no-op otherwise */
122110
deactivateBreakpoint(bp: BreakPoint) {
123111
const lookupBreakpoint = this._registry.get(bp.mediaQuery);
124112
if (lookupBreakpoint) {

‎src/lib/server/server-provider.ts

Lines changed: 8 additions & 7 deletions
Original file line numberDiff line numberDiff line change
@@ -5,10 +5,7 @@
55
* Use of this source code is governed by an MIT-style license that can be
66
* found in the LICENSE file at https://angular.io/license
77
*/
8-
import {
9-
InjectionToken, // tslint:disable-line:no-unused-variable
10-
ComponentRef, // tslint:disable-line:no-unused-variable
11-
} from '@angular/core';
8+
import {InjectionToken} from '@angular/core';
129
import {DOCUMENT} from '@angular/common';
1310
import {BEFORE_APP_SERIALIZED} from '@angular/platform-server';
1411

@@ -22,7 +19,7 @@ import {
2219
ServerMatchMedia
2320
} from '@angular/flex-layout';
2421

25-
let UNIQUE_CLASS = 0;
22+
let nextId = 0;
2623
const IS_DEBUG_MODE = false;
2724

2825
/**
@@ -42,7 +39,7 @@ function generateCss(stylesheet: Map<HTMLElement, Map<string, string|number>>,
4239
stylesheet.forEach((styles, el) => {
4340
let className = classMap.get(el);
4441
if (!className) {
45-
className = `${CLASS_NAME}${UNIQUE_CLASS++}`;
42+
className = `${CLASS_NAME}${nextId++}`;
4643
classMap.set(el, className);
4744
}
4845
el.classList.add(className);
@@ -123,7 +120,7 @@ export function FLEX_SSR_SERIALIZER_FACTORY(serverSheet: ServerStylesheet,
123120
*/
124121
export const SERVER_PROVIDERS = [
125122
{
126-
provide: BEFORE_APP_SERIALIZED,
123+
provide: <InjectionToken<() => void>>BEFORE_APP_SERIALIZED,
127124
useFactory: FLEX_SSR_SERIALIZER_FACTORY,
128125
deps: [
129126
ServerStylesheet,
@@ -136,5 +133,9 @@ export const SERVER_PROVIDERS = [
136133
{
137134
provide: SERVER_TOKEN,
138135
useValue: true
136+
},
137+
{
138+
provide: MatchMedia,
139+
useClass: ServerMatchMedia
139140
}
140141
];

‎src/lib/utils/styling/browser-provider.ts

Lines changed: 2 additions & 7 deletions
Original file line numberDiff line numberDiff line change
@@ -5,12 +5,7 @@
55
* Use of this source code is governed by an MIT-style license that can be
66
* found in the LICENSE file at https://angular.io/license
77
*/
8-
import {
9-
APP_BOOTSTRAP_LISTENER,
10-
PLATFORM_ID,
11-
InjectionToken, // tslint:disable-line:no-unused-variable
12-
ComponentRef, // tslint:disable-line:no-unused-variable
13-
} from '@angular/core';
8+
import {APP_BOOTSTRAP_LISTENER, PLATFORM_ID, InjectionToken, ComponentRef} from '@angular/core';
149
import {DOCUMENT, isPlatformBrowser} from '@angular/common';
1510

1611
/**
@@ -35,7 +30,7 @@ export function removeStyles(_document: Document, platformId: Object) {
3530
* Provider to remove SSR styles on the browser
3631
*/
3732
export const BROWSER_PROVIDER = {
38-
provide: APP_BOOTSTRAP_LISTENER,
33+
provide: <InjectionToken<((compRef: ComponentRef<any>) => void)[]>>APP_BOOTSTRAP_LISTENER,
3934
useFactory: removeStyles,
4035
deps: [DOCUMENT, PLATFORM_ID],
4136
multi: true

0 commit comments

Comments
 (0)