259 lines
9 KiB
HTML
259 lines
9 KiB
HTML
<!DOCTYPE html>
|
|
<html lang="en" data-bs-theme="auto">
|
|
|
|
<head>
|
|
<%- header %>
|
|
</head>
|
|
|
|
<body id="app" v-cloak>
|
|
<Navbar></Navbar>
|
|
<div id="content" class="container">
|
|
<h1 class="my-4">{{ $t('index.welcome') }}</h1>
|
|
<p>{{ $t('index.description') }}</p>
|
|
|
|
<!-- Fatal Errors Alert -->
|
|
<div class="alert alert-danger my-4" v-if="fancyLogs.find(x => x.level === 'Fatal')">
|
|
<div>
|
|
<div class="d-flex align-items-center mb-3">
|
|
<alert-circle :size="32" class="icon-lg me-3"></alert-circle>
|
|
<div v-html="$t('index.startup_errors')"></div>
|
|
</div>
|
|
<ul class="mb-3">
|
|
<li v-for="v in fancyLogs.filter(x => x.level === 'Fatal')">{{v.value}}</li>
|
|
</ul>
|
|
<a class="btn btn-danger" href="./troubleshooting#logs">
|
|
<file-text :size="18" class="icon"></file-text>
|
|
View Logs
|
|
</a>
|
|
</div>
|
|
</div>
|
|
|
|
<!-- ViGEmBus Warning -->
|
|
<div class="alert alert-warning my-4" v-if="platform === 'windows' && controllerEnabled && vigembus && (!vigembus.installed || !vigembus.version_compatible)">
|
|
<div>
|
|
<div class="d-flex align-items-center mb-3">
|
|
<alert-triangle :size="32" class="icon-lg me-3"></alert-triangle>
|
|
<div>
|
|
<div v-if="!vigembus.installed">
|
|
<p class="mb-1"><strong>{{ $t('index.vigembus_not_installed_title') }}</strong></p>
|
|
<p class="mb-0">{{ $t('index.vigembus_not_installed_desc') }}</p>
|
|
</div>
|
|
<div v-else-if="!vigembus.version_compatible">
|
|
<p class="mb-1"><strong>{{ $t('index.vigembus_outdated_title') }}</strong></p>
|
|
<p class="mb-0">{{ $t('index.vigembus_outdated_desc', { version: vigembus.version }) }}</p>
|
|
</div>
|
|
</div>
|
|
</div>
|
|
<a class="btn btn-warning" href="./troubleshooting#vigembus">
|
|
<wrench :size="18" class="icon"></wrench>
|
|
{{ $t('index.fix_now') }}
|
|
</a>
|
|
</div>
|
|
</div>
|
|
|
|
<!-- Version -->
|
|
<div class="card my-4">
|
|
<div class="card-body" v-if="version">
|
|
<h2>Version {{version.version}}</h2>
|
|
|
|
<div v-if="loading" class="my-3">
|
|
{{ $t('index.loading_latest') }}
|
|
</div>
|
|
|
|
<div class="alert alert-success my-3" v-if="buildVersionIsDirty">
|
|
<package :size="18" class="icon"></package>
|
|
{{ $t('index.version_dirty') }} 🌇
|
|
</div>
|
|
|
|
<div class="alert alert-info my-3" v-if="installedVersionNotStable">
|
|
<info :size="18" class="icon"></info>
|
|
{{ $t('index.installed_version_not_stable') }}
|
|
</div>
|
|
|
|
<div v-else-if="(!preReleaseBuildAvailable || !notifyPreReleases) && !stableBuildAvailable && !buildVersionIsDirty">
|
|
<div class="alert alert-success my-3">
|
|
<check-circle :size="18" class="icon"></check-circle>
|
|
{{ $t('index.version_latest') }}
|
|
</div>
|
|
</div>
|
|
|
|
<div v-if="notifyPreReleases && preReleaseBuildAvailable">
|
|
<div class="alert alert-warning my-3">
|
|
<!-- header row -->
|
|
<div class="d-flex align-items-center justify-content-between gap-3 flex-wrap mb-3">
|
|
<div class="d-flex align-items-center gap-3 flex-wrap">
|
|
<alert-circle :size="18" class="icon"></alert-circle>
|
|
<span>{{ $t('index.new_pre_release') }}</span>
|
|
<h5 class="mb-0">{{ preReleaseVersion.release.name }}</h5>
|
|
</div>
|
|
<a class="btn btn-success flex-shrink-0" :href="preReleaseVersion.release.html_url" target="_blank">
|
|
<download :size="18" class="icon"></download>
|
|
{{ $t('index.download') }}
|
|
</a>
|
|
</div>
|
|
|
|
<!-- body row (full width) -->
|
|
<div class="markdown-body release-notes" v-html="convertMarkdownToHtml(preReleaseVersion.release.body)"></div>
|
|
</div>
|
|
</div>
|
|
|
|
<div v-if="stableBuildAvailable">
|
|
<div class="alert alert-warning my-3">
|
|
<!-- header row -->
|
|
<div class="d-flex align-items-center justify-content-between gap-3 flex-wrap mb-3">
|
|
<div class="d-flex align-items-center gap-3 flex-wrap">
|
|
<alert-circle :size="18" class="icon"></alert-circle>
|
|
<span>{{ $t('index.new_stable') }}</span>
|
|
<h5 class="mb-0">{{ githubVersion.release.name }}</h5>
|
|
</div>
|
|
<a class="btn btn-success flex-shrink-0" :href="githubVersion.release.html_url" target="_blank">
|
|
<download :size="18" class="icon"></download>
|
|
{{ $t('index.download') }}
|
|
</a>
|
|
</div>
|
|
|
|
<!-- body row (full width) -->
|
|
<div class="markdown-body release-notes" v-html="convertMarkdownToHtml(githubVersion.release.body)"></div>
|
|
</div>
|
|
</div>
|
|
</div>
|
|
</div>
|
|
|
|
<!-- Resources -->
|
|
<div class="my-4">
|
|
<Resource-Card></Resource-Card>
|
|
</div>
|
|
</div>
|
|
</body>
|
|
|
|
<script type="module">
|
|
import { createApp } from 'vue'
|
|
import { marked } from 'marked'
|
|
import { initApp } from './init'
|
|
import Navbar from './Navbar.vue'
|
|
import ResourceCard from './ResourceCard.vue'
|
|
import SunshineVersion from './sunshine_version'
|
|
import {
|
|
AlertCircle,
|
|
AlertTriangle,
|
|
FileText,
|
|
Wrench,
|
|
Package,
|
|
Info,
|
|
CheckCircle,
|
|
Download
|
|
} from 'lucide-vue-next'
|
|
|
|
// Configure marked to allow HTML
|
|
marked.setOptions({
|
|
breaks: true,
|
|
gfm: true,
|
|
headerIds: true,
|
|
mangle: false,
|
|
sanitize: false
|
|
});
|
|
|
|
console.log("Hello, Sunshine!")
|
|
let app = createApp({
|
|
components: {
|
|
Navbar,
|
|
ResourceCard,
|
|
AlertCircle,
|
|
AlertTriangle,
|
|
FileText,
|
|
Wrench,
|
|
Package,
|
|
Info,
|
|
CheckCircle,
|
|
Download
|
|
},
|
|
data() {
|
|
return {
|
|
version: null,
|
|
githubVersion: null,
|
|
notifyPreReleases: false,
|
|
preReleaseVersion: null,
|
|
loading: true,
|
|
logs: null,
|
|
platform: "",
|
|
controllerEnabled: false,
|
|
vigembus: null,
|
|
}
|
|
},
|
|
async created() {
|
|
try {
|
|
let config = await fetch("./api/config").then((r) => r.json());
|
|
this.notifyPreReleases = config.notify_pre_releases;
|
|
this.platform = config.platform;
|
|
this.controllerEnabled = config.controller !== "disabled";
|
|
this.version = new SunshineVersion(null, config.version);
|
|
console.log("Version: ", this.version.version)
|
|
this.githubVersion = new SunshineVersion(await fetch("https://api.github.com/repos/LizardByte/Sunshine/releases/latest").then((r) => r.json()), null);
|
|
console.log("GitHub Version: ", this.githubVersion.version)
|
|
this.preReleaseVersion = new SunshineVersion((await fetch("https://api.github.com/repos/LizardByte/Sunshine/releases").then((r) => r.json())).find(release => release.prerelease), null);
|
|
console.log("Pre-Release Version: ", this.preReleaseVersion.version)
|
|
|
|
// Fetch ViGEmBus status only on Windows when controller is enabled
|
|
if (this.platform === 'windows' && this.controllerEnabled) {
|
|
try {
|
|
this.vigembus = await fetch("./api/vigembus/status").then((r) => r.json());
|
|
} catch (e) {
|
|
console.error("Failed to fetch ViGEmBus status:", e);
|
|
}
|
|
}
|
|
} catch (e) {
|
|
console.error(e);
|
|
}
|
|
try {
|
|
this.logs = (await fetch("./api/logs").then(r => r.text()))
|
|
} catch (e) {
|
|
console.error(e);
|
|
}
|
|
this.loading = false;
|
|
},
|
|
computed: {
|
|
installedVersionNotStable() {
|
|
if (!this.githubVersion || !this.version) {
|
|
return false;
|
|
}
|
|
return this.version.isGreater(this.githubVersion);
|
|
},
|
|
stableBuildAvailable() {
|
|
if (!this.githubVersion || !this.version) {
|
|
return false;
|
|
}
|
|
return this.githubVersion.isGreater(this.version);
|
|
},
|
|
preReleaseBuildAvailable() {
|
|
if (!this.preReleaseVersion || !this.githubVersion || !this.version) {
|
|
return false;
|
|
}
|
|
return this.preReleaseVersion.isGreater(this.version) && this.preReleaseVersion.isGreater(this.githubVersion);
|
|
},
|
|
buildVersionIsDirty() {
|
|
return this.version.version?.split(".").length === 5 &&
|
|
this.version.version.indexOf("dirty") !== -1
|
|
},
|
|
/** Parse the text errors, calculating the text, the timestamp and the level */
|
|
fancyLogs() {
|
|
if (!this.logs) return [];
|
|
let regex = /(\[\d{4}-\d{2}-\d{2} \d{2}:\d{2}:\d{2}\.\d{3}]):\s/g;
|
|
let rawLogLines = (this.logs.split(regex)).splice(1);
|
|
let logLines = []
|
|
for (let i = 0; i < rawLogLines.length; i += 2) {
|
|
logLines.push({ timestamp: rawLogLines[i], level: rawLogLines[i + 1].split(":")[0], value: rawLogLines[i + 1] });
|
|
}
|
|
return logLines;
|
|
}
|
|
},
|
|
methods: {
|
|
convertMarkdownToHtml(markdown) {
|
|
if (!markdown) return '';
|
|
return marked.parse(markdown);
|
|
}
|
|
}
|
|
});
|
|
|
|
initApp(app);
|
|
</script>
|
|
</html>
|