Skip to content

Add match media change listener in browser ts #143287

New issue

Have a question about this project? Sign up for a free GitHub account to open an issue and contact its maintainers and the community.

Sign up for GitHub

By clicking “Sign up for GitHub”, you agree to our terms of service and privacy statement. We’ll occasionally send you account related emails.

Already on GitHub? Sign in to your account

Merged
merged 5 commits into from
Feb 26, 2022
Merged

Add match media change listener in browser ts #143287

Show file tree
Hide file tree
Changes from 2 commits
Commits
Show all changes
5 commits
Select commit Hold shift + click to select a range
49ef9dc
Replace the isStandalone const with a method of the same name
a-stewart Feb 16, 2022
1147e11
Adding the matchMediaChangeListener into browser.ts so it can be used…
a-stewart Feb 16, 2022
679095b
Merge branch 'microsoft:main' into addMatchMediaChangeLIstener-in-bro…
a-stewart Feb 17, 2022
a3e5b46
Fix formatting
a-stewart Feb 17, 2022
41d8081
Use browser.ts for all usages of addMatchMediaChangeListener
a-stewart Feb 23, 2022
File filter

Filter by extension

Filter by extension
Conversations
Failed to load comments.
Loading
Jump to
Jump to file
Failed to load files.
Loading
Diff view
Diff view
20 changes: 19 additions & 1 deletion src/vs/base/browser/browser.ts
View file
Open in desktop
Original file line number Diff line number Diff line change
Expand Up @@ -144,6 +144,13 @@ class PixelRatioFacade {
}
}

export function addMatchMediaChangeListener(query: string|MediaQueryList, callback: (this: MediaQueryList, ev: MediaQueryListEvent) => any): void {
if (typeof query === 'string') {
query = window.matchMedia(query);
}
query.addEventListener('change', callback);
}

/**
* Returns the pixel ratio.
*
Expand Down Expand Up @@ -186,4 +193,15 @@ export const isSafari = (!isChrome && (userAgent.indexOf('Safari') >= 0));
export const isWebkitWebView = (!isChrome && !isSafari && isWebKit);
export const isElectron = (userAgent.indexOf('Electron/') >= 0);
export const isAndroid = (userAgent.indexOf('Android') >= 0);
export const isStandalone = (window.matchMedia && window.matchMedia('(display-mode: standalone)').matches);

let standalone = false;
if (window.matchMedia) {
const matchMedia = window.matchMedia('(display-mode: standalone)');
standalone = matchMedia.matches;
addMatchMediaChangeListener(matchMedia, ({ matches }) => {
standalone = matches;
});
}
export function isStandalone(): boolean {
return standalone;
}
2 changes: 1 addition & 1 deletion src/vs/base/browser/canIUse.ts
View file
Open in desktop
Original file line number Diff line number Diff line change
Expand Up @@ -28,7 +28,7 @@ export const BrowserFeatures = {
)
},
keyboard: (() => {
if (platform.isNative || browser.isStandalone) {
if (platform.isNative || browser.isStandalone()) {
return KeyboardSupport.Always;
}

Expand Down
7 changes: 2 additions & 5 deletions src/vs/base/browser/dom.ts
View file
Open in desktop
Original file line number Diff line number Diff line change
Expand Up @@ -18,6 +18,8 @@ import * as platform from 'vs/base/common/platform';
import { withNullAsUndefined } from 'vs/base/common/types';
import { URI } from 'vs/base/common/uri';

export { addMatchMediaChangeListener } from 'vs/base/browser/browser';
Copy link
Member

@bpasero bpasero Feb 17, 2022

Choose a reason for hiding this comment

The reason will be displayed to describe this comment to others. Learn more.

Why is this being re-exported?

Copy link
Contributor Author

@a-stewart a-stewart Feb 17, 2022

Choose a reason for hiding this comment

The reason will be displayed to describe this comment to others. Learn more.

As some things import addMatchMediaChangeListener from dom.ts.

If you prefer I could update all the imports to point at browser.ts?

Copy link
Member

@bpasero bpasero Feb 18, 2022

Choose a reason for hiding this comment

The reason will be displayed to describe this comment to others. Learn more.

Yes why not.

Copy link
Contributor Author

@a-stewart a-stewart Feb 23, 2022

Choose a reason for hiding this comment

The reason will be displayed to describe this comment to others. Learn more.

Done, sorry for the delay


export function clearNode(node: HTMLElement): void {
while (node.firstChild) {
node.firstChild.remove();
Expand Down Expand Up @@ -1638,11 +1640,6 @@ export function getCookieValue(name: string): string | undefined {
return match ? match.pop() : undefined;
}

export function addMatchMediaChangeListener(query: string, callback: () => void): void {
const mediaQueryList = window.matchMedia(query);
mediaQueryList.addEventListener('change', callback);
}

export const enum ZIndex {
SASH = 35,
SuggestWidget = 40,
Expand Down
2 changes: 1 addition & 1 deletion src/vs/code/browser/workbench/workbench.ts
View file
Open in desktop
Original file line number Diff line number Diff line change
Expand Up @@ -375,7 +375,7 @@ class WorkspaceProvider implements IWorkspaceProvider {
return true;
} else {
let result;
if (isStandalone) {
if (isStandalone()) {
result = window.open(targetHref, '_blank', 'toolbar=no'); // ensures to open another 'standalone' window!
} else {
result = window.open(targetHref);
Expand Down
2 changes: 1 addition & 1 deletion src/vs/editor/contrib/gotoSymbol/browser/goToCommands.ts
View file
Open in desktop
Original file line number Diff line number Diff line change
Expand Up @@ -257,7 +257,7 @@ export class DefinitionAction extends SymbolNavigationAction {
}
}

const goToDefinitionKb = isWeb && !isStandalone
const goToDefinitionKb = isWeb && !isStandalone()
? KeyMod.CtrlCmd | KeyCode.F12
: KeyCode.F12;

Expand Down
2 changes: 1 addition & 1 deletion src/vs/workbench/browser/style.ts
View file
Open in desktop
Original file line number Diff line number Diff line change
Expand Up @@ -144,7 +144,7 @@ registerThemingParticipant((theme, collector) => {
}

// Update body background color to ensure the home indicator area looks similar to the workbench
if (isIOS && isStandalone) {
if (isIOS && isStandalone()) {
collector.addRule(`body { background-color: ${workbenchBackground}; }`);
}

Expand Down
2 changes: 1 addition & 1 deletion src/vs/workbench/browser/workbench.contribution.ts
View file
Open in desktop
Original file line number Diff line number Diff line change
Expand Up @@ -492,7 +492,7 @@ const registry = Registry.as<IConfigurationRegistry>(ConfigurationExtensions.Con
localize('window.confirmBeforeClose.keyboardOnly', "Only ask for confirmation if a keybinding was detected. Note that detection may not be possible in some cases."),
localize('window.confirmBeforeClose.never', "Never explicitly ask for confirmation unless data loss is imminent.")
],
'default': isWeb && !isStandalone ? 'keyboardOnly' : 'never', // on by default in web, unless PWA
'default': isWeb && !isStandalone() ? 'keyboardOnly' : 'never', // on by default in web, unless PWA
'description': localize('confirmBeforeCloseWeb', "Controls whether to show a confirmation dialog before closing the browser tab or window. Note that even if enabled, browsers may still decide to close a tab or window without confirmation and that this setting is only a hint that may not work in all cases."),
'scope': ConfigurationScope.APPLICATION,
'included': isWeb
Expand Down