diff --git a/web/index.html b/web/index.html
index a39c319..61652cf 100644
--- a/web/index.html
+++ b/web/index.html
@@ -3,6 +3,11 @@
+
+
+
音乐和
diff --git a/web/scripts/fix.ts b/web/scripts/fix.ts
index 5c96f47..d039c97 100644
--- a/web/scripts/fix.ts
+++ b/web/scripts/fix.ts
@@ -59,10 +59,7 @@ function transformIndexHtmlHandler(html: string) {
prependedHtml += '\n ' + scriptPwa;
html = html.replace(matchScript, '');
}
- return html.replace(
- '',
- '' + prependedHtml.replaceAll('="./', '="/musiche/')
- );
+ return html.replace('', '' + prependedHtml);
}
export const FixPwaPlugin = function () {
diff --git a/web/src/App.vue b/web/src/App.vue
index c3a870d..6681149 100644
--- a/web/src/App.vue
+++ b/web/src/App.vue
@@ -6,7 +6,7 @@ import Footer from './components/Footer.vue';
import CurrentList from './components/CurrentList.vue';
import PlayDetail from './components/PlayDetail.vue';
import WindowHelper from './components/WindowHelper.vue';
-import { webView2Services } from './utils/utils';
+import { isIOS, isInStandaloneMode, webView2Services } from './utils/utils';
import { MusicConnection } from './stores/connection';
import { usePlayStore } from './stores/play';
import { useSettingStore } from './stores/setting';
@@ -29,13 +29,16 @@ iconLink.rel = 'icon';
iconLink.href = LogoCircleImage;
document.head.appendChild(iconLink);
new MusicConnection(webView2Services.enabled);
+let rootClass = webView2Services.enabled ? 'webview-host' : '';
+if (isInStandaloneMode) rootClass += ' standalone';
+if (isIOS) rootClass += ' ios';
-.music-main > .el-scrollbar > .el-scrollbar__wrap > .el-scrollbar__view {
- position: relative;
- min-height: 100%;
+@media (max-width: 720px) {
+ .music-layout.standalone.ios {
+ .music-footer {
+ padding-bottom: 10px;
+ }
+ }
}
diff --git a/web/src/components/Footer.vue b/web/src/components/Footer.vue
index 1d9e2c5..812175c 100644
--- a/web/src/components/Footer.vue
+++ b/web/src/components/Footer.vue
@@ -177,8 +177,6 @@ const play = usePlayStore();
opacity: 0.8;
}
.music-footer {
- position: fixed;
- bottom: 0;
background-color: var(--music-footer-background);
height: 80px;
width: 100vw;
diff --git a/web/src/stores/setting.ts b/web/src/stores/setting.ts
index 9f87da2..8bb4cf5 100644
--- a/web/src/stores/setting.ts
+++ b/web/src/stores/setting.ts
@@ -32,6 +32,8 @@ const controlKeys = [
'metaright'
];
const darkModeMediaQuery = window.matchMedia('(prefers-color-scheme: dark)');
+const appleMobileWebAppStatusBarStyle: HTMLMetaElement | null =
+ document.querySelector('meta[name="apple-mobile-web-app-status-bar-style"]');
export const useSettingStore = defineStore('setting', {
state: () => ({
maximized: false,
@@ -242,8 +244,9 @@ export const useSettingStore = defineStore('setting', {
},
setAppTheme(appTheme?: AppTheme) {
let preferredColorScheme = 0;
+ const dark = appTheme?.id.includes('dark');
if (!this.autoAppTheme) {
- preferredColorScheme = appTheme?.id.includes('dark') ? 2 : 1;
+ preferredColorScheme = dark ? 2 : 1;
}
this.appTheme.id = appTheme?.id || '';
this.appTheme.color = appTheme?.color || '';
@@ -254,6 +257,11 @@ export const useSettingStore = defineStore('setting', {
id: this.appTheme.id,
name: this.appTheme.name
});
+ if (appleMobileWebAppStatusBarStyle) {
+ appleMobileWebAppStatusBarStyle.content = dark
+ ? 'black-translucent'
+ : 'default';
+ }
musicOperate('/theme?theme=' + preferredColorScheme);
},
setCustomTheme(appTheme?: AppTheme) {
diff --git a/web/src/utils/utils.ts b/web/src/utils/utils.ts
index 114c11c..a9cb41c 100644
--- a/web/src/utils/utils.ts
+++ b/web/src/utils/utils.ts
@@ -42,6 +42,13 @@ try {
webView2Services.enabled = !!webView2Services.specialService;
} catch (error) {}
+export const isInStandaloneMode = Boolean(
+ 'standalone' in window.navigator && window.navigator.standalone
+);
+export const isIOS = !!navigator.userAgent.match(
+ /\(i[^;]+;( U;)? CPU.+Mac OS X/
+);
+
export function scrollToElementId(
id: string,
center?: boolean,
diff --git a/web/vite.config.ts b/web/vite.config.ts
index 56d6822..020e9de 100644
--- a/web/vite.config.ts
+++ b/web/vite.config.ts
@@ -20,10 +20,11 @@ const plugins = [
FixJSMediaTagsErrorPlugin(),
VitePWA({
manifest: {
+ id: 'top.picapico.musiche',
name: 'Musiche',
short_name: 'Musiche',
description: '音乐播放器[支持网易云、QQ音乐、咪咕音乐].',
- start_url: 'musiche',
+ start_url: '',
scope: '.',
display: 'standalone',
background_color: '#ffffff',