mirror of
https://github.com/MrUnknownDE/VRCX.git
synced 2026-04-18 22:33:50 +02:00
Switch VRC status to notification
This commit is contained in:
@@ -1,7 +1,6 @@
|
||||
<template>
|
||||
<!DOCTYPE html>
|
||||
<el-config-provider :locale="currentLocale">
|
||||
<VrcStatus></VrcStatus>
|
||||
<div
|
||||
id="x-app"
|
||||
class="x-app"
|
||||
@@ -105,8 +104,6 @@
|
||||
import zhTW from 'element-plus/es/locale/lang/zh-tw';
|
||||
import th from 'element-plus/es/locale/lang/th';
|
||||
|
||||
import VrcStatus from './components/VrcStatus.vue';
|
||||
|
||||
import Login from './views/Login/Login.vue';
|
||||
import NavMenu from './components/NavMenu.vue';
|
||||
import Sidebar from './views/Sidebar/Sidebar.vue';
|
||||
|
||||
@@ -1,39 +0,0 @@
|
||||
<template>
|
||||
<el-alert v-if="statusText" type="warning" show-icon center :closable="true" @close="onAlertClose">
|
||||
<template #title>
|
||||
<span @click="openStatusPage" class="status-text">
|
||||
{{ statusText }}
|
||||
</span>
|
||||
</template>
|
||||
</el-alert>
|
||||
</template>
|
||||
<script setup>
|
||||
import { storeToRefs } from 'pinia';
|
||||
import { useVrcStatusStore } from '../stores';
|
||||
import { openExternalLink } from '../shared/utils';
|
||||
|
||||
const { statusText, isAlertClosed } = storeToRefs(useVrcStatusStore());
|
||||
|
||||
isAlertClosed.value = false;
|
||||
|
||||
function onAlertClose() {
|
||||
isAlertClosed.value = true;
|
||||
}
|
||||
|
||||
function openStatusPage() {
|
||||
if (isAlertClosed.value) {
|
||||
return;
|
||||
}
|
||||
openExternalLink('https://status.vrchat.com');
|
||||
}
|
||||
</script>
|
||||
|
||||
<style scoped>
|
||||
.status-text {
|
||||
cursor: pointer;
|
||||
}
|
||||
|
||||
.status-text:hover {
|
||||
text-decoration: underline;
|
||||
}
|
||||
</style>
|
||||
@@ -1,6 +1,8 @@
|
||||
import { defineStore } from 'pinia';
|
||||
import webApiService from '../service/webapi';
|
||||
import { ref, computed } from 'vue';
|
||||
import { ElNotification } from 'element-plus';
|
||||
import { openExternalLink } from '../shared/utils';
|
||||
|
||||
export const useVrcStatusStore = defineStore('VrcStatus', () => {
|
||||
const vrcStatusApiUrl = 'https://status.vrchat.com/api/v2';
|
||||
@@ -8,9 +10,10 @@ export const useVrcStatusStore = defineStore('VrcStatus', () => {
|
||||
const lastStatus = ref('');
|
||||
const lastStatusSummary = ref('');
|
||||
const lastTimeFetched = ref(0);
|
||||
const isAlertClosed = ref(false);
|
||||
const pollingInterval = ref(0);
|
||||
const alertRef = ref(null);
|
||||
|
||||
const lastStatusText = ref('');
|
||||
const statusText = computed(() => {
|
||||
if (lastStatusSummary.value) {
|
||||
return `${lastStatus.value}: ${lastStatusSummary.value}`;
|
||||
@@ -18,6 +21,52 @@ export const useVrcStatusStore = defineStore('VrcStatus', () => {
|
||||
return lastStatus.value;
|
||||
});
|
||||
|
||||
function updateAlert() {
|
||||
if (lastStatusText.value === statusText.value) {
|
||||
return;
|
||||
}
|
||||
lastStatusText.value = statusText.value;
|
||||
|
||||
if (!statusText.value) {
|
||||
if (alertRef.value) {
|
||||
alertRef.value.close();
|
||||
alertRef.value = ElNotification({
|
||||
title: 'VRChat Status',
|
||||
message: 'All Systems Operational',
|
||||
type: 'success',
|
||||
duration: 0,
|
||||
showClose: true,
|
||||
onClick: () => {
|
||||
openStatusPage();
|
||||
},
|
||||
onClose: () => {
|
||||
alertRef.value = null;
|
||||
}
|
||||
});
|
||||
}
|
||||
return;
|
||||
}
|
||||
|
||||
alertRef.value?.close();
|
||||
alertRef.value = ElNotification({
|
||||
title: 'VRChat Status',
|
||||
message: statusText.value,
|
||||
type: 'warning',
|
||||
duration: 0,
|
||||
showClose: true,
|
||||
onClick: () => {
|
||||
openStatusPage();
|
||||
},
|
||||
onClose: () => {
|
||||
alertRef.value = null;
|
||||
}
|
||||
});
|
||||
}
|
||||
|
||||
function openStatusPage() {
|
||||
openExternalLink('https://status.vrchat.com');
|
||||
}
|
||||
|
||||
async function getVrcStatus() {
|
||||
const response = await webApiService.execute({
|
||||
url: `${vrcStatusApiUrl}/status.json`,
|
||||
@@ -31,10 +80,12 @@ export const useVrcStatusStore = defineStore('VrcStatus', () => {
|
||||
if (data.status.description === 'All Systems Operational') {
|
||||
lastStatus.value = '';
|
||||
pollingInterval.value = 15 * 60 * 1000; // 15 minutes
|
||||
updateAlert();
|
||||
return;
|
||||
}
|
||||
lastStatus.value = data.status.description;
|
||||
pollingInterval.value = 2 * 60 * 1000; // 2 minutes
|
||||
updateAlert();
|
||||
getVrcStatusSummary();
|
||||
}
|
||||
|
||||
@@ -57,6 +108,7 @@ export const useVrcStatusStore = defineStore('VrcStatus', () => {
|
||||
summary = summary.slice(0, -2);
|
||||
}
|
||||
lastStatusSummary.value = summary;
|
||||
updateAlert();
|
||||
}
|
||||
|
||||
// ran from Cef and Electron when browser is focused
|
||||
@@ -69,9 +121,6 @@ export const useVrcStatusStore = defineStore('VrcStatus', () => {
|
||||
function init() {
|
||||
getVrcStatus();
|
||||
setInterval(() => {
|
||||
if (isAlertClosed.value) {
|
||||
return;
|
||||
}
|
||||
if (Date.now() - lastTimeFetched.value > pollingInterval.value) {
|
||||
getVrcStatus();
|
||||
}
|
||||
@@ -81,8 +130,8 @@ export const useVrcStatusStore = defineStore('VrcStatus', () => {
|
||||
init();
|
||||
|
||||
return {
|
||||
lastStatus,
|
||||
statusText,
|
||||
isAlertClosed,
|
||||
onBrowserFocus,
|
||||
getVrcStatus
|
||||
};
|
||||
|
||||
@@ -170,7 +170,7 @@
|
||||
<span class="extra">
|
||||
<span class="time">{{ formatDate(feed.created_at) }}</span>
|
||||
<i class="ri-mail-send-line mr-5"></i>
|
||||
<span class="name" v-text="feed.senderUsername"></span>
|
||||
<span class="name mr-5" v-text="feed.senderUsername"></span>
|
||||
<VrLocation
|
||||
:location="feed.details.worldId"
|
||||
:hint="feed.details.worldName"
|
||||
@@ -401,9 +401,8 @@
|
||||
<template v-if="feed.displayName">
|
||||
<i class="ri-bard-line mr-5"></i>
|
||||
<span
|
||||
class="name"
|
||||
class="name mr-5"
|
||||
v-text="feed.displayName"
|
||||
style="margin-right: 5px"
|
||||
:style="{ color: feed.tagColour }"></span>
|
||||
<VrLocation
|
||||
:location="feed.instanceId"
|
||||
|
||||
Reference in New Issue
Block a user