RSEMCS mostly complete.
This commit is contained in:
@@ -1,15 +1,199 @@
|
||||
<template>
|
||||
<main>
|
||||
<h1>REMCS</h1>
|
||||
</main>
|
||||
<div class="pages">
|
||||
<div
|
||||
id="introduction"
|
||||
class="page"
|
||||
>
|
||||
<div class="title">
|
||||
<h1>RSEMCS</h1>
|
||||
<p>Reslate Systems - Entertainment: Minecraft Server, or RSEMCS (for brevity, of course), a the private survival Minecraft server. There is an overall objective to keep the server close to vanilla however with a few minor tweaks.</p>
|
||||
</div>
|
||||
<div class="content">
|
||||
<h2>Status</h2>
|
||||
<p>The server is currently <b>{{ online ? "online" : "offline" }}</b><span v-if="online"> with <b>{{ players.now }} players out of {{ players.max }}</b> slots currently playing. The server is running <b>{{ server.name }}</b></span><span v-else-if="lastOnline">. It was last seen online {{ LastOnlineInMin }} minutes ago</span>. This information was updated <b>{{ LastUpdateInSec }} seconds ago</b>.</p>
|
||||
</div>
|
||||
</div>
|
||||
<div
|
||||
id="about"
|
||||
class="page"
|
||||
>
|
||||
<div class="panels">
|
||||
<div
|
||||
id="join"
|
||||
class="panel"
|
||||
>
|
||||
<div class="title">
|
||||
<h2>Looking to play?</h2>
|
||||
</div>
|
||||
<div class="content map">
|
||||
<p>Assuming you are whitelisted, there's nothing to it asides from just joining the server at <code>ent.sys.reslate.xyz</code> (yup, exactly the same as this website).</p>
|
||||
</div>
|
||||
</div>
|
||||
<div
|
||||
id="basics"
|
||||
class="panel"
|
||||
>
|
||||
<div class="board">
|
||||
<div class="title">
|
||||
<h2>Basics</h2>
|
||||
<p>Some basics explaining the server.</p>
|
||||
</div>
|
||||
<div class="content">
|
||||
<ul>
|
||||
<li>The <b>currency</b> on the server is <b>emeralds</b>.</li>
|
||||
<li>To create a <b>vault</b>, place a <b>sign</b> on any storage block</li>
|
||||
<li><b>Grave Artifacts</b> can be held to produce a grave on death!</li>
|
||||
<li><b>Protection Artifacts</b> can be used to protect your land and yourself!</li>
|
||||
<li><b>/money help</b> will tell you how to use your money.</li>
|
||||
<li><b>/ps help</b> will show you the commands for your <b>protection artifact</b>.</li>
|
||||
<li><b>New recipes</b> can be found by checking your <b>recipe book</b>. Remember to check in the <b>crafting table</b>!</li>
|
||||
<li><b>Infernal hostiles</b> are like minibosses! They are incredibly rare, however have equally incredible drops!</li>
|
||||
</ul>
|
||||
</div>
|
||||
</div>
|
||||
</div>
|
||||
</div>
|
||||
</div>
|
||||
<div
|
||||
id="maps"
|
||||
class="page"
|
||||
>
|
||||
<div class="title">
|
||||
<h2>Maps</h2>
|
||||
<p>For all your reconnaissance needs...</p>
|
||||
</div>
|
||||
<iframe
|
||||
ref="dynmap"
|
||||
src="https:/ent.sys.reslate.xyz/resmcs/dynmap/"
|
||||
class="map"
|
||||
allowTransparency="true"
|
||||
@load="iframeLoaded"
|
||||
>
|
||||
<p>Your browser does not support iframes. Visit <a href="https:/ent.sys.reslate.xyz/resmcs/dynmap/">the full dynmap page here</a></p>
|
||||
</iframe>
|
||||
</div>
|
||||
</div>
|
||||
</template>
|
||||
|
||||
<script>
|
||||
import axios from "axios";
|
||||
export default {
|
||||
|
||||
data() {
|
||||
return {
|
||||
online: "loading...",
|
||||
motd: "loading...",
|
||||
players: {
|
||||
max: "loading...",
|
||||
now: "loading..."
|
||||
},
|
||||
server: {
|
||||
name: "loading...",
|
||||
protocol: "loading...",
|
||||
},
|
||||
lastOnline: "loading...",
|
||||
lastUpdate: "loading..."
|
||||
};
|
||||
},
|
||||
computed: {
|
||||
LastUpdateInSec() {
|
||||
let date = new Date(this.lastUpdate * 1000);
|
||||
return date.getSeconds();
|
||||
},
|
||||
LastOnlineInMin() {
|
||||
let date = new Date(this.lastOnline * 1000);
|
||||
return date.getMinutes();
|
||||
}
|
||||
},
|
||||
async mounted() {
|
||||
let results = await axios.get("https://mcapi.us/server/status?ip=ent.sys.reslate.xyz");
|
||||
let info = results.data;
|
||||
this.online = info.online;
|
||||
this.motd = info.motd;
|
||||
this.players = info.players;
|
||||
this.server = info.server;
|
||||
this.lastOnline = info.last_online;
|
||||
this.lastUpdate = info.last_updated;
|
||||
},
|
||||
methods: {
|
||||
},
|
||||
};
|
||||
</script>
|
||||
|
||||
<style lang="scss" scoped>
|
||||
@use "@/styles/themer";
|
||||
@use "sass:color";
|
||||
|
||||
#introduction {
|
||||
@include themer.themed {
|
||||
$gradient-color: themer.color-of("background");
|
||||
background-image:
|
||||
radial-gradient(circle at center,
|
||||
color.change($color: $gradient-color, $alpha: 0.8) 0%,
|
||||
color.change($color: $gradient-color, $alpha: 0.1) 60%,
|
||||
color.change($color: $gradient-color, $alpha: 0.2) 100%
|
||||
),
|
||||
url("@/assets/images/minecraft/landscapes/day.png");
|
||||
}
|
||||
}
|
||||
|
||||
#about {
|
||||
#basics {
|
||||
.board {
|
||||
.title, .content {
|
||||
width: auto;
|
||||
max-width: 35rem;
|
||||
}
|
||||
}
|
||||
|
||||
@include themer.themed {
|
||||
$gradient-color: themer.color-of("background");
|
||||
background-image:
|
||||
radial-gradient(circle at center,
|
||||
color.change($color: $gradient-color, $alpha: 0.8) 0%,
|
||||
color.change($color: $gradient-color, $alpha: 0.5) 60%,
|
||||
color.change($color: $gradient-color, $alpha: 0.2) 100%
|
||||
),
|
||||
url("@/assets/images/minecraft/textures/birch_plank.png");
|
||||
}
|
||||
background-repeat: repeat;
|
||||
background-size: auto;
|
||||
font-size: 1.25rem;
|
||||
}
|
||||
}
|
||||
|
||||
@font-face {
|
||||
font-family: Pixel;
|
||||
src: url("https://res.sys.reslate.xyz/dl/fonts/PublicPixel.ttf");
|
||||
}
|
||||
|
||||
|
||||
#maps {
|
||||
padding-top: 4rem;
|
||||
@include themer.themed {
|
||||
$gradient-color: themer.color-of("background");
|
||||
background-image:
|
||||
linear-gradient(180deg,
|
||||
color.change($color: $gradient-color, $alpha: 0.8) 0%,
|
||||
color.change($color: $gradient-color, $alpha: 0.8) 100%
|
||||
),
|
||||
url("@/assets/images/minecraft/landscapes/sunset.png");
|
||||
}
|
||||
|
||||
.map {
|
||||
width: 95%;
|
||||
flex-grow: 1;
|
||||
margin-bottom: 2.5%;
|
||||
background-color: transparent;
|
||||
|
||||
border-width: 20px;
|
||||
|
||||
border-image-slice:27 27 27 27;
|
||||
border-image-width:20px 20px 20px 20px;
|
||||
border-image-outset:0px 0px 0px 0px;
|
||||
border-image-repeat:repeat repeat;
|
||||
border-image-source:url("@/assets/images/minecraft/textures/map.png");
|
||||
border-style:solid;
|
||||
}
|
||||
}
|
||||
|
||||
</style>
|
||||
@@ -6,7 +6,7 @@
|
||||
id="steam"
|
||||
class="panel"
|
||||
>
|
||||
<div class="contained-title">
|
||||
<div class="title">
|
||||
<h2>Steam System</h2>
|
||||
<hr>
|
||||
<p>Access the RES Steam web interface for establishing connections to the game system and viewing some statistics.</p>
|
||||
@@ -16,7 +16,7 @@
|
||||
id="minecraft"
|
||||
class="panel"
|
||||
>
|
||||
<div class="contained-title">
|
||||
<div class="title">
|
||||
<h2>Minecraft Server</h2>
|
||||
<hr>
|
||||
<p> Access the RES Minecraft Server web interface for interacting with a variety of game utilities and information.</p>
|
||||
@@ -28,7 +28,7 @@
|
||||
id="about"
|
||||
class="page"
|
||||
>
|
||||
<div class="contained-title">
|
||||
<div class="title">
|
||||
<h1>What is this?</h1>
|
||||
<p>This is the web interface for Reslate Entertainment Systems. This is <b>not</b> a public service and you may be on this page by mistake. Alternatively, you may be this page completely intentionally!</p>
|
||||
</div>
|
||||
@@ -41,9 +41,15 @@
|
||||
@use "sass:color";
|
||||
#steam {
|
||||
@include themer.themed {
|
||||
$gradient-color: themer.color-of("main");
|
||||
background-size: cover;
|
||||
background-image: radial-gradient(circle at center, color.change($color: $gradient-color, $alpha: 0.0) 0%, color.change($color: $gradient-color, $alpha: 0.1) 60%, color.change($color: $gradient-color, $alpha: 0.2) 100%), url("@/assets/images/controller.png");
|
||||
$gradient-color: themer.color-of("background");
|
||||
background-image:
|
||||
radial-gradient(
|
||||
circle at center,
|
||||
color.change($color: $gradient-color, $alpha: 0.0) 0%,
|
||||
color.change($color: $gradient-color, $alpha: 0.1) 60%,
|
||||
color.change($color: $gradient-color, $alpha: 0.2) 100%
|
||||
),
|
||||
url("@/assets/images/steam/controller.png");
|
||||
|
||||
.contained-title {
|
||||
color: white;
|
||||
@@ -53,9 +59,15 @@
|
||||
|
||||
#minecraft {
|
||||
@include themer.themed {
|
||||
$gradient-color: themer.color-of("main");
|
||||
background-size: cover;
|
||||
background-image: radial-gradient(circle at center, color.change($color: $gradient-color, $alpha: 0.2) 0%, color.change($color: $gradient-color, $alpha: 0.1) 60%, color.change($color: $gradient-color, $alpha: 0.8, $lightness: 10%) 100%), url("@/assets/images/minecraft.png");
|
||||
$gradient-color: themer.color-of("background");
|
||||
background-image:
|
||||
radial-gradient(
|
||||
circle at center,
|
||||
color.change($color: $gradient-color, $alpha: 0.2) 0%,
|
||||
color.change($color: $gradient-color, $alpha: 0.1) 60%,
|
||||
color.change($color: $gradient-color, $alpha: 0.8, $lightness: 10%) 100%
|
||||
),
|
||||
url("@/assets/images/minecraft/landscapes/day.png");
|
||||
|
||||
.contained-title {
|
||||
color: white;
|
||||
@@ -65,9 +77,15 @@
|
||||
|
||||
#about {
|
||||
@include themer.themed {
|
||||
$gradient-color: themer.color-of("main");
|
||||
background-size: cover;
|
||||
background-image: radial-gradient(circle at center, color.change($color: $gradient-color, $alpha: 0.55) 0%, color.change($color: $gradient-color, $alpha: 0.5) 60%, color.change($color: $gradient-color, $alpha: 1, $lightness: 10%) 100%), url("@/assets/images/about.png");
|
||||
$gradient-color: themer.color-of("background");
|
||||
background-image:
|
||||
radial-gradient(
|
||||
circle at center,
|
||||
color.change($color: $gradient-color, $alpha: 0.55) 0%,
|
||||
color.change($color: $gradient-color, $alpha: 0.5) 60%,
|
||||
color.change($color: $gradient-color, $alpha: 1, $lightness: 10%) 100%
|
||||
),
|
||||
url("@/assets/images/generic_room.png");
|
||||
.contained-title {
|
||||
color: white;
|
||||
}
|
||||
|
||||
Reference in New Issue
Block a user