adb
/
cybre.town
1
0
Fork 0
Code Issues Pull Requests Releases Wiki Activity

render console dynamically

Browse Source
master
adb 4 years ago
parent ee8480c1e9
commit 66db4de7ee
7 changed files with 161 additions and 61 deletions
Show Stats Download Patch File Download Diff File

44
.eslintrc.js
Unescape Escape View File

@ -1,17 +1,39 @@
module.exports = { module.exports = {
root: true, "env": {
env: { "browser": true,
node: true "es6": true
}, },
'extends': [ "extends": [
'plugin:vue/vue3-essential', "eslint:recommended",
'eslint:recommended' "plugin:vue/essential"
], ],
parserOptions: { "globals": {
parser: 'babel-eslint' "Atomics": "readonly",
"SharedArrayBuffer": "readonly"
}, },
rules: { "parserOptions": {
'no-console': process.env.NODE_ENV === 'production' ? 'warn' : 'off', "ecmaVersion": 2018,
'no-debugger': process.env.NODE_ENV === 'production' ? 'warn' : 'off' "sourceType": "module"
},
"plugins": [
"vue"
],
"rules": {
"indent": [
"error",
2
],
"linebreak-style": [
"error",
"unix"
],
"quotes": [
"error",
"double"
],
"semi": [
"error",
"never"
]
} }
} }

2
package.json
Unescape Escape View File

@ -20,7 +20,7 @@
"@vue/compiler-sfc": "^3.0.0", "@vue/compiler-sfc": "^3.0.0",
"babel-eslint": "^10.1.0", "babel-eslint": "^10.1.0",
"eslint": "^6.7.2", "eslint": "^6.7.2",
"eslint-plugin-vue": "^7.0.0-0", "eslint-plugin-vue": "^7.5.0",
"node-sass": "^5.0.0", "node-sass": "^5.0.0",
"sass-loader": "^10.1.1" "sass-loader": "^10.1.1"
} }

17
public/index.html
Unescape Escape View File

@ -0,0 +1,17 @@
<!DOCTYPE html>
<html lang="">
<head>
<meta charset="utf-8">
<meta http-equiv="X-UA-Compatible" content="IE=edge">
<meta name="viewport" content="width=device-width,initial-scale=1.0">
<link rel="icon" href="<%= BASE_URL %>favicon.ico">
<title><%= htmlWebpackPlugin.options.title %></title>
</head>
<body style="background-color: #1d1d1d;">
<noscript>
<strong>We're sorry but <%= htmlWebpackPlugin.options.title %> doesn't work properly without JavaScript enabled. Please enable it to continue.</strong>
</noscript>
<div id="app"></div>
<!-- built files will be auto injected -->
</body>
</html>

2
public/robots.txt
Unescape Escape View File

@ -0,0 +1,2 @@
User-agent: *
Disallow:

49
src/App.vue
Unescape Escape View File

@ -1,38 +1,16 @@
<template> <template>
<div class="top"> <div class="top">
<pre class="console"> <console class="console"></console>
<span class="host">[cybre.town]$ ></span> welcome --help
Welcome to:
<span class="logo">
__ __
/\ \ /\ \__
___ __ __\ \ \____ _____ ____ \ \ _\ ____ __ __ __ ______
/ ___\/\ \/\ \\ \ __ \/\ __\/ __ \ \ \ \/ / __ \/\ \/\ \/\ \/\ __ \
/\ \__/\ \ \_\ \\ \ \_\ \ \ \_/\ __/ __\ \ \_/\ \_\ \ \ \_\ \_\ \ \ \/\ \
\ \____\\ \____ \\ \____/\ \_\\ \____\/\_\\ \__\ \____/\ \________/\ \_\ \_\
\/____/ \/___/ \\/___/ \/_/ \/____/\/_/ \/__/\/___/ \/_______/ \/_/\/_/
/\___/
\/__/ @adb.sh
</span>
free services on this server:
- Mastodon > social
- Gitea > git
- Matrix > element
- Etherpad > ether
- short url > surl
- Jitsi > meet
<span class="host">[cybre.town]$ ></span> <span contenteditable="true">_</span>
</pre>
</div> </div>
</template> </template>
<script> <script>
import console from "@/components/console"
export default { export default {
name: 'App', name: "App",
components: { components: {
console
} }
} }
</script> </script>
@ -40,25 +18,10 @@ export default {
<style lang="scss"> <style lang="scss">
#app { #app {
font-family: Avenir, Helvetica, Arial, sans-serif; font-family: Avenir, Helvetica, Arial, sans-serif;
text-align: left;
color: #2c3e50;
margin-top: 60px;
}
body{
background-color: #1d1d1d;
} }
.top{ .console{
position: absolute; position: absolute;
left: 50%; left: 50%;
transform: translate(-50%,0); transform: translate(-50%,0);
.logo{
color: #4d8;
}
.console{
color: #fff;
.host{color: #02a594;}
}
} }
</style> </style>

50
src/components/console.vue
Unescape Escape View File

@ -0,0 +1,50 @@
<template>
<div class="console">
<div class="group" v-for="group in history" :key="group">
<pre><span class="host">{{group.host}}</span><span>{{group.command}}</span></pre>
<pre><span v-for="output in group.output" :key="output" :class="output.color">{{output.content}}</span></pre>
</div>
</div>
</template>
<script>
import commands from "@/render-commands.js"
export default {
name: "console",
data(){
return{
console:{
},
history:[
{
host: "[cybre.town]$ > ",
command: "welcome --help",
output: commands.data().commands.welcome.output
},
{
host: "[cybre.town]$ > ",
command: "_",
output: []
}
]
}
}
}
</script>
<style scoped lang="scss">
pre{
margin: 0;
padding: 0;
}
.console{
color: #fff;
.group{
.host{color: #02a594;}
.white{color: #fff}
.green{color: #44dd88;}
.blue{color: #0081b1;}
}
}
</style>

46
src/render-commands.js
Unescape Escape View File

@ -0,0 +1,46 @@
let commands = {
welcome:{
output:[
{
color: "white",
content: "\nWelcome to:\n",
delay: 100
},
{
color: "green",
content:
" __ __\n" +
" /\\ \\ /\\ \\__\n" +
" ___ __ __\\ \\ \\____ _____ ____ \\ \\ _\\ ____ __ __ __ ______\n" +
" / ___\\/\\ \\/\\ \\\\ \\ __ \\/\\ __\\/ __ \\ \\ \\ \\/ / __ \\/\\ \\/\\ \\/\\ \\/\\ __ \\\n" +
"/\\ \\__/\\ \\ \\_\\ \\\\ \\ \\_\\ \\ \\ \\_/\\ __/ __\\ \\ \\_/\\ \\_\\ \\ \\ \\_\\ \\_\\ \\ \\ \\/\\ \\\n" +
"\\ \\____\\\\ \\____ \\\\ \\____/\\ \\_\\\\ \\____\\/\\_\\\\ \\__\\ \\____/\\ \\________/\\ \\_\\ \\_\\\n" +
" \\/____/ \\/___/ \\\\/___/ \\/_/ \\/____/\\/_/ \\/__/\\/___/ \\/_______/ \\/_/\\/_/\n" +
" /\\___/\n" +
" \\/__/ @adb.sh\n\n",
delay: 100
},
{
color: "white",
content:
"free services on this server:\n" +
"\n" +
" - Mastodon > social\n" +
" - Gitea > git\n" +
" - Matrix > element\n" +
" - Etherpad > ether\n" +
" - short url > surl\n" +
" - Jitsi > meet\n",
delay: 100
},
]
}
}
export default {
data(){
return {
commands:commands
}
}
}
Write Preview
Loading…
Cancel
Save