mirror of
https://github.com/toeverything/AFFiNE.git
synced 2026-02-13 12:55:00 +00:00
[AF-1325](https://linear.app/affine-design/issue/AF-1325/优化-pwa-体验), [AF-1317](https://linear.app/affine-design/issue/AF-1317/优化:-pwa-的顶部-status-bar-颜色应与背景保持一致), [AF-1318](https://linear.app/affine-design/issue/AF-1318/优化:pwa-的底部应当有符合设备安全高度的padding), [AF-1321](https://linear.app/affine-design/issue/AF-1321/更新一下-fail-的-pwa-icon) - New `<SafeArea />` ui component - New `useThemeColorV1` / `useThemeColorV2` hook: - to modify `<meta name="theme-color" />` with given theme key
92 lines
2.5 KiB
TypeScript
92 lines
2.5 KiB
TypeScript
export class UaHelper {
|
|
private readonly uaMap;
|
|
public isLinux = false;
|
|
public isMacOs = false;
|
|
public isSafari = false;
|
|
public isWindows = false;
|
|
public isFireFox = false;
|
|
public isMobile = false;
|
|
public isChrome = false;
|
|
public isIOS = false;
|
|
public isStandalone = false;
|
|
|
|
getChromeVersion = (): number => {
|
|
let raw = this.navigator.userAgent.match(/Chrom(e|ium)\/([0-9]+)\./);
|
|
if (!raw) {
|
|
raw = this.navigator.userAgent.match(/(CriOS)\/([0-9]+)/);
|
|
}
|
|
if (!raw) {
|
|
console.error('Cannot get chrome version');
|
|
return 0;
|
|
}
|
|
return parseInt(raw[2], 10);
|
|
};
|
|
|
|
constructor(private readonly navigator: Navigator) {
|
|
this.uaMap = getUa(navigator);
|
|
this.initUaFlags();
|
|
}
|
|
|
|
public checkUseragent(isUseragent: keyof ReturnType<typeof getUa>) {
|
|
return Boolean(this.uaMap[isUseragent]);
|
|
}
|
|
|
|
private isStandaloneMode() {
|
|
if ('standalone' in window.navigator) {
|
|
return !!window.navigator.standalone;
|
|
}
|
|
return !!window.matchMedia('(display-mode: standalone)').matches;
|
|
}
|
|
|
|
private initUaFlags() {
|
|
this.isLinux = this.checkUseragent('linux');
|
|
this.isMacOs = this.checkUseragent('mac');
|
|
this.isSafari = this.checkUseragent('safari');
|
|
this.isWindows = this.checkUseragent('win');
|
|
this.isFireFox = this.checkUseragent('firefox');
|
|
this.isMobile = this.checkUseragent('mobile');
|
|
this.isChrome = this.checkUseragent('chrome');
|
|
this.isIOS = this.checkUseragent('ios');
|
|
this.isStandalone = this.isStandaloneMode();
|
|
}
|
|
}
|
|
|
|
const getUa = (navigator: Navigator) => {
|
|
const ua = navigator.userAgent;
|
|
const uas = ua.toLowerCase();
|
|
const mobile = /iPhone|iPad|iPod|Android/i.test(ua);
|
|
const android =
|
|
(mobile && (uas.indexOf('android') > -1 || uas.indexOf('linux') > -1)) ||
|
|
uas.indexOf('adr') > -1;
|
|
const ios = mobile && !android && /Mac OS/i.test(ua);
|
|
const mac = !mobile && /Mac OS/i.test(ua);
|
|
const iphone = ios && uas.indexOf('iphone') > -1;
|
|
const ipad = ios && !iphone;
|
|
const wx = /MicroMessenger/i.test(ua);
|
|
const chrome = /CriOS/i.test(ua) || /Chrome/i.test(ua);
|
|
const tiktok = mobile && /aweme/i.test(ua);
|
|
const weibo = mobile && /Weibo/i.test(ua);
|
|
const safari =
|
|
ios && !chrome && !wx && !weibo && !tiktok && /Safari|Macintosh/i.test(ua);
|
|
const firefox = /Firefox/.test(ua);
|
|
const win = /windows|win32|win64|wow32|wow64/.test(uas);
|
|
const linux = /linux/.test(uas);
|
|
return {
|
|
ua,
|
|
mobile,
|
|
android,
|
|
ios,
|
|
mac,
|
|
wx,
|
|
chrome,
|
|
iphone,
|
|
ipad,
|
|
safari,
|
|
tiktok,
|
|
weibo,
|
|
win,
|
|
linux,
|
|
firefox,
|
|
};
|
|
};
|