mirror of
https://github.com/MrUnknownDE/VRCX.git
synced 2026-04-11 19:03:51 +02:00
119 lines
3.2 KiB
JavaScript
119 lines
3.2 KiB
JavaScript
import '@fontsource/noto-sans-kr';
|
||
import '@fontsource/noto-sans-jp';
|
||
import '@fontsource/noto-sans-sc';
|
||
import '@fontsource/noto-sans-tc';
|
||
|
||
import Vue from 'vue';
|
||
import { PiniaVuePlugin } from 'pinia';
|
||
import { DataTables } from 'vue-data-tables';
|
||
import VueLazyload from 'vue-lazyload';
|
||
import configRepository from './service/config';
|
||
import vrcxJsonStorage from './service/jsonStorage';
|
||
import {
|
||
changeAppDarkStyle,
|
||
changeAppThemeStyle,
|
||
refreshCustomCss,
|
||
refreshCustomScript,
|
||
systemIsDarkMode
|
||
} from './shared/utils';
|
||
import { i18n } from './plugin';
|
||
import { initNoty } from './plugin/noty';
|
||
|
||
initNoty(false);
|
||
|
||
configRepository.init();
|
||
|
||
AppApi.SetUserAgent();
|
||
|
||
// prevent flicker on login page
|
||
function setLoginContainerStyle(isDarkMode) {
|
||
const loginContainerStyle = document.createElement('style');
|
||
loginContainerStyle.id = 'login-container-style';
|
||
loginContainerStyle.type = 'text/css';
|
||
|
||
const backgroundColor = isDarkMode ? '#101010' : '#ffffff';
|
||
const inputBackgroundColor = isDarkMode ? '#333333' : '#ffffff';
|
||
const inputBorder = isDarkMode ? '1px solid #3b3b3b' : '1px solid #DCDFE6';
|
||
|
||
loginContainerStyle.innerHTML = `
|
||
.x-login-container {
|
||
background-color: ${backgroundColor} !important;
|
||
transition: background-color 0.3s ease;
|
||
}
|
||
|
||
.x-login-container .el-input__inner {
|
||
background-color: ${inputBackgroundColor} !important;
|
||
border: ${inputBorder} !important;
|
||
transition: background-color 0.3s ease, border-color 0.3s ease;
|
||
}
|
||
`;
|
||
|
||
document.head.insertBefore(loginContainerStyle, document.head.firstChild);
|
||
}
|
||
|
||
async function getThemeMode() {
|
||
const initThemeMode = await configRepository.getString(
|
||
'VRCX_ThemeMode',
|
||
'system'
|
||
);
|
||
|
||
let isDarkMode;
|
||
|
||
if (initThemeMode === 'light') {
|
||
isDarkMode = false;
|
||
} else if (initThemeMode === 'system') {
|
||
isDarkMode = systemIsDarkMode();
|
||
} else {
|
||
isDarkMode = true;
|
||
}
|
||
|
||
return { initThemeMode, isDarkMode };
|
||
}
|
||
|
||
try {
|
||
// @ts-ignore
|
||
i18n.locale = await configRepository.getString('VRCX_appLanguage', 'en');
|
||
|
||
const { initThemeMode, isDarkMode } = await getThemeMode();
|
||
|
||
setLoginContainerStyle(isDarkMode);
|
||
changeAppDarkStyle(isDarkMode);
|
||
changeAppThemeStyle(initThemeMode);
|
||
} catch (error) {
|
||
console.error('Error initializing locale and theme:', error);
|
||
}
|
||
|
||
refreshCustomCss();
|
||
refreshCustomScript();
|
||
|
||
Vue.use(PiniaVuePlugin);
|
||
Vue.use(DataTables);
|
||
|
||
Vue.use(VueLazyload, {
|
||
preLoad: 1,
|
||
observer: true,
|
||
observerOptions: {
|
||
rootMargin: '0px',
|
||
threshold: 0
|
||
},
|
||
attempt: 3
|
||
});
|
||
|
||
new vrcxJsonStorage(VRCXStorage);
|
||
|
||
// some workaround for failing to get voice list first run
|
||
speechSynthesis.getVoices();
|
||
|
||
if (process.env.NODE_ENV !== 'production') {
|
||
Vue.config.errorHandler = function (err, vm, info) {
|
||
console.error('Vue Error：', err);
|
||
console.error('Component：', vm);
|
||
console.error('Error Info：', info);
|
||
};
|
||
Vue.config.warnHandler = function (msg, vm, trace) {
|
||
console.warn('Vue Warning：', msg);
|
||
console.warn('Component：', vm);
|
||
console.warn('Trace：', trace);
|
||
};
|
||
}
|