mirror of
https://github.com/vrcx-team/VRCX.git
synced 2026-04-06 00:32:02 +02:00
144 lines
7.0 KiB
HTML
144 lines
7.0 KiB
HTML
<!DOCTYPE html>
|
|
<html>
|
|
<head>
|
|
<meta http-equiv="Content-Type" content="text/html;charset=utf-8">
|
|
<meta http-equiv="Cache-Control" content="no-cache">
|
|
<meta name="referrer" content="no-referrer">
|
|
<meta name="viewport" content="width=device-width,initial-scale=1,user-scalable=no">
|
|
<title>VRCXVR</title>
|
|
<link rel="dns-prefetch" href="https://fonts.gstatic.com">
|
|
<link rel="preconnect" href="https://api.vrchat.cloud">
|
|
<link rel="preconnect" href="https://d348imysud55la.cloudfront.net">
|
|
<link rel="stylesheet" href="https://cdnjs.cloudflare.com/ajax/libs/normalize/8.0.1/normalize.min.css">
|
|
<link rel="stylesheet" href="https://cdnjs.cloudflare.com/ajax/libs/animate.css/3.7.2/animate.min.css">
|
|
<link rel="stylesheet" href="https://cdnjs.cloudflare.com/ajax/libs/noty/3.2.0-beta/noty.min.css">
|
|
<link rel="stylesheet" href="https://cdnjs.cloudflare.com/ajax/libs/element-ui/2.11.1/theme-chalk/index.css">
|
|
<link rel="stylesheet" href="https://fonts.googleapis.com/css?family=Noto+Sans+JP|Noto+Sans+KR&display=swap">
|
|
</head>
|
|
<body>
|
|
<div id="x-app" class="x-app" :class="{ 'x-app-type': appType === '1' }" style="display:none">
|
|
|
|
<div class="x-container" style="flex:1">
|
|
<div ref="list" class="x-friend-list" style="color:#aaa">
|
|
<template v-for="feed in feeds">
|
|
<div v-if="feed.type === 'GPS'" class="x-friend-item" :class="{ friend: feed.isFriend, favorite: feed.isFavorite }">
|
|
<div class="detail">
|
|
<span class="extra">
|
|
<span class="time">{{ feed.created_at | formatDate('HH:MI') }}</span>
|
|
<span class="name" v-text="feed.displayName"></span> is in <location :location="feed.location[0]"></location>
|
|
</span>
|
|
</div>
|
|
</div>
|
|
<div v-else-if="feed.type === 'Offline'" class="x-friend-item" :class="{ friend: feed.isFriend, favorite: feed.isFavorite }">
|
|
<div class="detail">
|
|
<span class="extra">
|
|
<span class="time">{{ feed.created_at | formatDate('HH:MI') }}</span>
|
|
<span class="name" v-text="feed.displayName"></span> has logged out
|
|
</span>
|
|
</div>
|
|
</div>
|
|
<div v-else-if="feed.type === 'Online'" class="x-friend-item" :class="{ friend: feed.isFriend, favorite: feed.isFavorite }">
|
|
<div class="detail">
|
|
<span class="extra">
|
|
<span class="time">{{ feed.created_at | formatDate('HH:MI') }}</span>
|
|
<span class="name" v-text="feed.displayName"></span> has logged in
|
|
</span>
|
|
</div>
|
|
</div>
|
|
<div v-else-if="feed.type === 'Status'" class="x-friend-item" :class="{ friend: feed.isFriend, favorite: feed.isFavorite }">
|
|
<div class="detail">
|
|
<span class="extra">
|
|
<span class="time">{{ feed.created_at | formatDate('HH:MI') }}</span>
|
|
<span class="name" v-text="feed.displayName"></span> is <i class="x-user-status" :class="userStatusClass(feed.status[0])"></i> {{feed.status[0].statusDescription}}
|
|
</span>
|
|
</div>
|
|
</div>
|
|
<div v-else-if="feed.type === 'OnPlayerJoined'" class="x-friend-item" :class="{ friend: feed.isFriend, favorite: feed.isFavorite }">
|
|
<div class="detail">
|
|
<span class="extra">
|
|
<span class="time">{{ feed.created_at | formatDate('HH:MI') }}</span>
|
|
<span class="name" v-text="feed.data"></span> has joined
|
|
</span>
|
|
</div>
|
|
</div>
|
|
<div v-else-if="feed.type === 'OnPlayerLeft'" class="x-friend-item" :class="{ friend: feed.isFriend, favorite: feed.isFavorite }">
|
|
<div class="detail">
|
|
<span class="extra">
|
|
<span class="time">{{ feed.created_at | formatDate('HH:MI') }}</span>
|
|
<span class="name" v-text="feed.data"></span> has left
|
|
</span>
|
|
</div>
|
|
</div>
|
|
<div v-else-if="feed.type === 'Location'" class="x-friend-item" :class="{ friend: feed.isFriend, favorite: feed.isFavorite }">
|
|
<div class="detail">
|
|
<span class="extra">
|
|
<span class="time">{{ feed.created_at | formatDate('HH:MI') }}</span>
|
|
<location :location="feed.data"></location>
|
|
</span>
|
|
</div>
|
|
</div>
|
|
</template>
|
|
</div>
|
|
</div>
|
|
|
|
<div class="x-container">
|
|
<div style="display:flex;flex-direction:row">
|
|
<template v-if="devices.length">
|
|
<div v-for="device in devices" style="flex:none;text-align:center;width:64px">
|
|
<template v-if="device[0] === 'tracker'">
|
|
<img v-if="device[1] !== 'connected'" src="images/tracker_status_off.png" style="width:32px;height:32px">
|
|
<img v-else-if="device[2] < 20" src="images/tracker_status_ready_low.png" style="width:32px;height:32px">
|
|
<img v-else src="images/tracker_status_ready.png" style="width:32px;height:32px">
|
|
</template>
|
|
<template v-else-if="device[0] === 'leftController'">
|
|
<img v-if="device[1] !== 'connected'" src="images/controller_status_off.png" style="width:32px;height:32px">
|
|
<img v-else-if="device[2] < 20" src="images/controller_status_ready_low.png" style="width:32px;height:32px">
|
|
<img v-else src="images/controller_status_ready.png" style="width:32px;height:32px">
|
|
</template>
|
|
<template v-else-if="device[0] === 'rightController'">
|
|
<img v-if="device[1] !== 'connected'" src="images/controller_status_off.png" style="width:32px;height:32px">
|
|
<img v-else-if="device[2] < 20" src="images/controller_status_ready_low.png" style="width:32px;height:32px">
|
|
<img v-else src="images/controller_status_ready.png" style="width:32px;height:32px">
|
|
</template>
|
|
<template v-else-if="device[0] === 'controller'">
|
|
<img v-if="device[1] !== 'connected'" src="images/controller_status_off.png" style="width:32px;height:32px">
|
|
<img v-else-if="device[2] < 20" src="images/controller_status_ready_low.png" style="width:32px;height:32px">
|
|
<img v-else src="images/controller_status_ready.png" style="width:32px;height:32px">
|
|
</template>
|
|
<template v-else>
|
|
<img v-if="device[1] !== 'connected'" src="images/other_status_off.png" style="width:32px;height:32px">
|
|
<img v-else-if="device[2] < 20" src="images/other_status_ready_low.png" style="width:32px;height:32px">
|
|
<img v-else src="images/other_status_ready.png" style="width:32px;height:32px">
|
|
</template>
|
|
<br><span>{{ device[2] }}%</span>
|
|
</div>
|
|
</template>
|
|
<div v-else>
|
|
<span>No SteamVR Devices</span>
|
|
</div>
|
|
</div>
|
|
</div>
|
|
|
|
<div class="x-container">
|
|
<span style="float:right">{{ currentTime | formatDate('YYYY-MM-DD HH:MI:SS AMPM') }}</span>
|
|
<span>CPU {{ cpuUsage }}%</span>
|
|
</div>
|
|
|
|
</div>
|
|
<script src="https://cdnjs.cloudflare.com/ajax/libs/noty/3.2.0-beta/noty.min.js"></script>
|
|
<script src="https://cdnjs.cloudflare.com/ajax/libs/vue/2.6.10/vue.js"></script>
|
|
<script src="https://cdnjs.cloudflare.com/ajax/libs/element-ui/2.11.1/index.js"></script>
|
|
<script src="https://cdnjs.cloudflare.com/ajax/libs/element-ui/2.11.1/locale/en.min.js"></script>
|
|
<script>
|
|
(() => {
|
|
var link = document.createElement('link');
|
|
link.rel = 'stylesheet';
|
|
link.href = `vr.css?_=${Date.now()}`;
|
|
document.getElementsByTagName('head')[0].appendChild(link);
|
|
var script = document.createElement('script');
|
|
script.src = `vr.js?_=${Date.now()}`;
|
|
document.getElementsByTagName('body')[0].appendChild(script);
|
|
})();
|
|
</script>
|
|
</body>
|
|
</html> |