mirror of https://github.com/ThunixdotNet/site.git
Add current draft version
This commit is contained in:
Dei Layborer
GitHub
parent
0c9ed6daf1
commit
532c3884fb
|
|
@ -0,0 +1,61 @@
|
|||
|
||||
// syntax: command (what to type in terminal), ['Description', callback]
|
||||
const commandList = new Map();
|
||||
commandList.set('about', ['Basic information about Thunix', showAbout]);
|
||||
commandList.set('chat', ['Join us on IRC!', gotoChat]);
|
||||
commandList.set('clear', ['Clears the screen', clear]);
|
||||
commandList.set('help', ['Shows this help text', showCommandList]);
|
||||
|
||||
function runCommand() {
|
||||
|
||||
const command = input.value;
|
||||
if (command == '') { return; }
|
||||
|
||||
if (document.getElementById('motd')) {
|
||||
document.getElementById('motd').remove();
|
||||
}
|
||||
|
||||
input.value = '';
|
||||
|
||||
if (commandList.has(command)) {
|
||||
commandList.get(command)[1].call();
|
||||
} else {
|
||||
printLine(`Invalid command "${command}"`);
|
||||
}
|
||||
}
|
||||
|
||||
function showAbout() {
|
||||
const lines = [
|
||||
'The Thunix project provides Secure Shell (SSH) accounts, Web Hosting, Email Accounts, and many other UNIX-like services. But, most of all, we are a community of users. It was founded by hexhaxtron in the Summer of 2017, then continued by ubergeek in 2018. In 2023, deepend took on the role. We aim to provide the best service possible with a wide variety of features, and we hope you have fun with it!',
|
||||
'Join us on IRC on irc.newnet.net/6697 in the #thunix channel, or you can go here to chat from your browser: https://newnet.net/chat.php?channel=%23thunix',
|
||||
'[signup block]',
|
||||
`thunix tries to adhere to the values and philosophy of the Hacker Ethic whenever possible. The hacker ethics and beliefs as described by Levy are:`,
|
||||
' - Access to computers - and anything which might teach you something about the way the world works - should be unlimited and total. Always yield to the Hands-On Imperative!',
|
||||
' - All information should be free',
|
||||
' - Mistrust authority - promote decentralization',
|
||||
' - Hackers should be judged by their hacking, not criteria such as degrees, age, race, sex, or position',
|
||||
' - You can create art and beauty on a computer',
|
||||
' - Computers can change your life for the better',
|
||||
'thunix will never use proprietary software but users can do that if they wish. This is something they should avoid, however.',
|
||||
'If you want to help keep thunix running, please consider donating.'
|
||||
];
|
||||
|
||||
printLine('About Thunix', 'h1');
|
||||
printLines(lines, true);
|
||||
}
|
||||
|
||||
function gotoChat() {
|
||||
window.open('https://newnet.net/chat.php?channel=%23thunix', '_blank');
|
||||
}
|
||||
|
||||
function showCommandList() {
|
||||
printLine('Available commands', 'h1');
|
||||
commandList.forEach((value, key) => {
|
||||
printLine(`${key} - ${value[0]}`);
|
||||
});
|
||||
printLine(' ');
|
||||
}
|
||||
|
||||
function clear() {
|
||||
term.replaceChildren();
|
||||
}
|
||||
|
|
@ -0,0 +1,22 @@
|
|||
<!DOCTYPE html>
|
||||
<html>
|
||||
<head>
|
||||
<title>thunix.net</title>
|
||||
<meta charset="utf-8">
|
||||
<link rel="stylesheet" href="thooniks.css">
|
||||
</head>
|
||||
<body>
|
||||
<div id="head">thunix.net
|
||||
<div>est. 2017, reborn 2018</div>
|
||||
</div>
|
||||
<div id="terminal">
|
||||
<span id="motd">Enter 'help' to see a list of commands.</span>
|
||||
</div>
|
||||
<div id="input-container">
|
||||
<span>></span><input type="text" id="user-input">
|
||||
</div>
|
||||
|
||||
<script src="commands.js"></script>
|
||||
<script src="term.js"></script>
|
||||
</body>
|
||||
</html>
|
||||
|
|
@ -0,0 +1,57 @@
|
|||
document.addEventListener('DOMContentLoaded', init);
|
||||
|
||||
let term;
|
||||
let input;
|
||||
const history = [];
|
||||
|
||||
function init() {
|
||||
|
||||
term = document.getElementById('terminal');
|
||||
input = document.getElementById('user-input');
|
||||
term.addEventListener('click', () => input.focus());
|
||||
input.addEventListener('keyup', inputHandler);
|
||||
input.value = '';
|
||||
input.focus();
|
||||
}
|
||||
|
||||
function inputHandler(e) {
|
||||
|
||||
switch (e.key) {
|
||||
|
||||
case 'Enter':
|
||||
runCommand();
|
||||
break;
|
||||
|
||||
default:
|
||||
break;
|
||||
|
||||
}
|
||||
|
||||
}
|
||||
|
||||
function printLine(line, fmt = 'regular') {
|
||||
if (line.length == 0) { return; }
|
||||
|
||||
if (typeof line == 'string') {
|
||||
const newLine = document.createElement('div');
|
||||
newLine.textContent = line;
|
||||
term.appendChild(newLine);
|
||||
|
||||
if (fmt == 'h1') {
|
||||
const len = lines.length;
|
||||
const addlLine = document.createElement('div');
|
||||
addlLine.textContent = '='.repeat(len);
|
||||
addlLine.setAttribute('style', 'margin-bottom: 1em;');
|
||||
term.appendChild(addlLine);
|
||||
}
|
||||
}
|
||||
|
||||
}
|
||||
|
||||
function printLines(lines, lineBetween = false) {
|
||||
for (let line of lines) {
|
||||
printLine(line);
|
||||
if (lineBetween) { printLine(' '); }
|
||||
}
|
||||
|
||||
}
|
||||
|
|
@ -0,0 +1,111 @@
|
|||
:root {
|
||||
--mono: "0xProto", monospace;
|
||||
--amber: #edb200;
|
||||
--amber-txt: #ffc828;
|
||||
--scrollin-time: 0.1s;
|
||||
}
|
||||
|
||||
* {
|
||||
box-sizing: border-box;
|
||||
}
|
||||
|
||||
html, body {
|
||||
margin: 0;
|
||||
padding: 0;
|
||||
width: 100%;
|
||||
height: 100%;
|
||||
overflow: hidden;
|
||||
}
|
||||
|
||||
body {
|
||||
--lineCount: 1;
|
||||
--theme-color: var(--amber);
|
||||
background-color: #111;
|
||||
font-family: var(--mono);
|
||||
color: var(--amber);
|
||||
font-size: 1.25em;
|
||||
}
|
||||
|
||||
body::before {
|
||||
content: ' ';
|
||||
display: block;
|
||||
position: absolute;
|
||||
top: 0;
|
||||
left: 0;
|
||||
width: 100%;
|
||||
height: 100%;
|
||||
z-index: 2;
|
||||
background: linear-gradient(to bottom, transparent 50%, rgba(0, 0, 0, 0.3) 51%);
|
||||
background-size: 100% 4px;
|
||||
pointer-events: none;
|
||||
}
|
||||
|
||||
#head {
|
||||
margin: 8vh auto 0.5vh auto;
|
||||
width: 70vw;
|
||||
font-size: 3rem;
|
||||
text-shadow: 0 0 1.75rem var(--theme-color);
|
||||
}
|
||||
|
||||
#head div {
|
||||
font-size: 0.75rem;
|
||||
}
|
||||
|
||||
#terminal {
|
||||
height: 60vh;
|
||||
width: 70vw;
|
||||
margin: 0 auto;
|
||||
background-color: rgba(255, 255, 255, 0.025);
|
||||
border: 1px dotted var(--theme-color);
|
||||
border-radius: 5px;
|
||||
overflow: hidden;
|
||||
padding: 0.5em 1ch;
|
||||
display: flex;
|
||||
flex-wrap: nowrap;
|
||||
flex-direction: column;
|
||||
justify-content: flex-end;
|
||||
}
|
||||
|
||||
#terminal div {
|
||||
padding: 0 1ch;
|
||||
transition: margin 0.2s;
|
||||
min-height: 1em;
|
||||
white-space: pre-wrap;
|
||||
/* transform: translateY(calc(var(--lineCount) * -1em)); */
|
||||
animation-name: scrollIn;
|
||||
animation-duration: var(--scrollin-time);
|
||||
|
||||
}
|
||||
|
||||
@keyframes scrollIn {
|
||||
from {
|
||||
margin-bottom: -100%;
|
||||
}
|
||||
to {
|
||||
margin-bottom: 0;
|
||||
}
|
||||
}
|
||||
|
||||
#input-container {
|
||||
height: 1.5em;
|
||||
width: 70vw;
|
||||
margin: 0 auto;
|
||||
background-color: rgba(255, 255, 255, 0.025);
|
||||
}
|
||||
|
||||
#input-container span {
|
||||
font-weight: bold;
|
||||
margin: 0 0.5ch;
|
||||
}
|
||||
|
||||
#user-input {
|
||||
background: transparent;
|
||||
border: 0;
|
||||
font-family: var(--mono);
|
||||
font-size: 1.5rem;
|
||||
color: var(--amber);
|
||||
}
|
||||
|
||||
#user-input:focus-visible {
|
||||
outline: 0;
|
||||
}
|
||||
Loading…
Reference in New Issue