v0.2 + first commit ever for the git repo!
This commit is contained in:
commit
738b7fde0c
13 changed files with 525 additions and 0 deletions
11
.gitignore
vendored
Normal file
11
.gitignore
vendored
Normal file
|
@ -0,0 +1,11 @@
|
|||
node_modules/
|
||||
bin/*
|
||||
!bin/changelogs.json
|
||||
!bin/1aa5ca4b19daea70e3268ac88ef3c8f3.json
|
||||
yarn.lock
|
||||
yarn-error.log
|
||||
package-lock.json
|
||||
.env
|
||||
users/*
|
||||
!users/admin.json
|
||||
.git
|
1
bin/1aa5ca4b19daea70e3268ac88ef3c8f3.json
Normal file
1
bin/1aa5ca4b19daea70e3268ac88ef3c8f3.json
Normal file
|
@ -0,0 +1 @@
|
|||
{"name":"Oh, hi there!","text":"Here's an image of a duck :)\n\n⠀⠀⠀⠀⠀⠀⠀⠀⠀⠀⠀⠀⠀⠀⠀⠀⠀⠀⣀⡀⠀⠀⠀⠀⠀⠀⠀⠀⠀⠀\n⠀⠀⠀⠀⠀⠀⠀⠀⠀⠀⠀⠀⠀⠀⠀⢀⣴⣿⣿⣿⣿⣦⡀⠀⠀⠀⠀⠀⠀⠀\n⠀⠀⠀⠀⠀⠀⠀⠀⠀⠀⠀⠀⠀⠀⠀⣿⣿⣿⣿⡟⠉⣿⣷⠀⠀⠀⠀⠀⠀⠀\n⠀⠀⠀⠀⠀⠀⠀⠀⠀⠀⠀⠀⠀⠀⠀⣿⣿⣿⣿⣿⣿⣿⣿⣿⣶⣶⣶⣦⠄⠀\n⠀⠀⠀⠀⠀⠀⠀⠀⠀⠀⠀⠀⠀⠀⠀⠘⣿⣿⣿⣿⣿⣿⠟⠋⠉⠉⠉⠁⠀⠀\n⠀⠀⠀⠀⠀⠀⠀⠀⠀⠀⠀⠀⠀⠀⠀⠀⠸⢿⣿⡿⠿⠟⢀⠀⠀⠀⠀⠀⠀⠀\n⠀⠀⠀⠀⠀⠀⠀⠀⠀⠀⠀⠀⠀⢀⣀⣠⣤⣤⣤⣤⣶⣾⣿⣷⣄⠀⠀⠀⠀⠀\n⠀⠀⣷⣦⣤⣤⣤⣤⣤⣶⣶⣾⣿⣿⣿⣿⣿⣿⣿⣿⠛⣿⣿⣿⣿⣇⠀⠀⠀⠀\n⠀⠀⢸⣿⣿⣿⣿⣿⣿⣿⣿⣿⣿⣿⣿⣿⣿⣿⣿⠏⢠⣿⣿⣿⣿⡿⠀⠀⠀⠀\n⠀⠀⠈⢿⣿⣿⣯⡙⠛⠿⠿⠿⣿⠿⠿⠿⠛⠋⣁⣴⣿⣿⣿⣿⣿⡇⠀⠀⠀⠀\n⠀⠀⠀⠈⠛⠿⣿⣿⣷⣶⣶⣤⣤⣤⣴⣶⣾⣿⣿⣿⣿⣿⣿⣿⠟⠀⠀⠀⠀⠀\n⠀⠀⠀⠀⠀⠀⠀⠉⠙⠛⠿⠿⢿⣿⣿⣿⣿⡿⠿⠿⠛⠋⠁⠀⠀⠀⠀⠀⠀⠀\n⠀⠀⠀⠀⠀⠀⠀⠀⠀⠀⢰⠀⣤⡄⠀⠀⠀⠀⠀⠀⠀⠀⠀⠀⠀⠀⠀⠀⠀⠀\n⠀⠀⠀⠀⠀⠀⠀⠀⠀⣀⣼⣶⣿⣷⣶⣤⡀⠀⠀⠀⠀⠀⠀⠀⠀⠀⠀⠀⠀⠀\n⠀⠀⠀⠀⠀⠀⠀⠀⠀⠉⠉⠉⠉⠉⠉⠉⠉⠀⠀⠀⠀⠀⠀⠀⠀⠀⠀⠀⠀⠀\n\nHow'd you find this?"}
|
4
bin/changelogs.json
Normal file
4
bin/changelogs.json
Normal file
|
@ -0,0 +1,4 @@
|
|||
{
|
||||
"name": "Changelogs",
|
||||
"text": "v0.2 (2022 Jun 06)\n - Added a changelogs page\n - Git Repository now exists!\n - Added placeholders for textboxes.\n - Added alerts!\n / Some bugfixes are in progress for next update.\n\nv0.1 (2022 Jun 05)\n - Website is first made!\n - Things like git repository weren't even a thing.\n - Was spammed the first day lol"
|
||||
}
|
52
index.js
Normal file
52
index.js
Normal file
|
@ -0,0 +1,52 @@
|
|||
const express = require('express');
|
||||
const bodyParser = require('body-parser');
|
||||
const app = express();
|
||||
|
||||
app.use(bodyParser.json());
|
||||
app.set('view engine', 'ejs');
|
||||
app.use(express.static('static'));
|
||||
|
||||
app.get('/', (req, res) => {
|
||||
res.render('index.ejs');
|
||||
});
|
||||
|
||||
app.post('/write', (req, res) => {
|
||||
let filename = require('crypto').randomBytes(16).toString('hex');
|
||||
let datainput = req.body;
|
||||
let fs = require('fs');
|
||||
|
||||
if(datainput.text == undefined || datainput.text == "") return res.send('Error: Text is invalid').status(403);
|
||||
if(fs.existsSync(__dirname+'/bin/'+filename+'.json')) return res.send('Internal error - randomly generated ID already exists? Try again.').status(500);
|
||||
|
||||
let data = {
|
||||
name: datainput.name == undefined ? '' : datainput.name,
|
||||
text: datainput.text
|
||||
}
|
||||
|
||||
fs.writeFile(__dirname+'/bin/'+filename+'.json', JSON.stringify(data), (err) => {
|
||||
if (err) {
|
||||
console.log(err);
|
||||
res.status(500);
|
||||
} else {
|
||||
res.send(filename).status(200);
|
||||
}
|
||||
});
|
||||
});
|
||||
|
||||
app.get('/new', (req, res) => {
|
||||
res.render('new.ejs');
|
||||
});
|
||||
|
||||
app.get('/paste/:id', (req, res) => {
|
||||
let fs = require('fs');
|
||||
let filename = req.params.id;
|
||||
if(!fs.existsSync(__dirname+'/bin/'+filename+'.json')) return res.send('Error: Paste not found').status(404);
|
||||
let data = JSON.parse(fs.readFileSync(__dirname+'/bin/'+filename+'.json', 'utf8'));
|
||||
res.render('paste.ejs', {
|
||||
name: data.name,
|
||||
text: data.text,
|
||||
id: filename
|
||||
});
|
||||
});
|
||||
|
||||
app.listen(30180);
|
11
package.json
Normal file
11
package.json
Normal file
|
@ -0,0 +1,11 @@
|
|||
{
|
||||
"dependencies": {
|
||||
"body-parser": "^1.20.0",
|
||||
"ejs": "^3.1.8",
|
||||
"express": "^4.18.1"
|
||||
},
|
||||
"name": "the-bin",
|
||||
"version": "1.0.0",
|
||||
"main": "index.js",
|
||||
"license": "AGPLv3"
|
||||
}
|
BIN
static/charger.otf
Normal file
BIN
static/charger.otf
Normal file
Binary file not shown.
BIN
static/hack.ttf
Normal file
BIN
static/hack.ttf
Normal file
Binary file not shown.
BIN
static/newspaper.ttf
Normal file
BIN
static/newspaper.ttf
Normal file
Binary file not shown.
BIN
static/pasti.otf
Normal file
BIN
static/pasti.otf
Normal file
Binary file not shown.
288
static/style.css
Normal file
288
static/style.css
Normal file
|
@ -0,0 +1,288 @@
|
|||
@font-face {
|
||||
font-family: 'newspaper';
|
||||
src: url('newspaper.ttf');
|
||||
}
|
||||
|
||||
@font-face {
|
||||
font-family: 'charger';
|
||||
src: url('charger.otf');
|
||||
}
|
||||
|
||||
@font-face {
|
||||
font-family: 'pasti';
|
||||
src: url('pasti.otf');
|
||||
}
|
||||
|
||||
@font-face {
|
||||
font-family: 'hack';
|
||||
src: url('hack.ttf');
|
||||
}
|
||||
|
||||
@keyframes flash {
|
||||
0% {
|
||||
color: #c1d1ff;
|
||||
}
|
||||
50% {
|
||||
color: #5f87ff;
|
||||
}
|
||||
100% {
|
||||
color: #c1d1ff;
|
||||
}
|
||||
}
|
||||
|
||||
@keyframes slidein {
|
||||
0% {
|
||||
transform: translateY(500%);
|
||||
}
|
||||
10% {
|
||||
transform: translateY(0);
|
||||
}
|
||||
90% {
|
||||
transform: translateY(0);
|
||||
}
|
||||
100% {
|
||||
transform: translateY(500%);
|
||||
}
|
||||
}
|
||||
|
||||
* {
|
||||
margin: 0 auto;
|
||||
padding: 0;
|
||||
}
|
||||
|
||||
body {
|
||||
background-color: #1a2034;
|
||||
color: #d2ddff;
|
||||
}
|
||||
|
||||
.header {
|
||||
font-family: 'newspaper';
|
||||
font-size:70pt;
|
||||
text-align: center;
|
||||
margin-top:20px;
|
||||
}
|
||||
.subheader {
|
||||
font-family: 'charger';
|
||||
font-size:25pt;
|
||||
text-align: center;
|
||||
margin-bottom:20px;
|
||||
border-top:5px white solid;
|
||||
padding:20px;
|
||||
padding-top:30px;
|
||||
}
|
||||
.container {
|
||||
background-color: #242d4a;
|
||||
border: 5px #87a5ff solid;
|
||||
border-radius: 0px;
|
||||
max-width:800px;
|
||||
width:800px;
|
||||
display:block;
|
||||
margin-left: auto;
|
||||
margin-right: auto;
|
||||
box-shadow: 10px 10px rgba(210,221,255,1);
|
||||
-webkit-box-shadow: 10px 10px rgba(210,221,255,1);
|
||||
-moz-box-shadow: 10px 10px rgba(210,221,255,1);
|
||||
margin-bottom:80px;
|
||||
}
|
||||
.container-middle {
|
||||
display: table-cell;
|
||||
vertical-align: middle;
|
||||
height:min-content;
|
||||
}
|
||||
.container-external {
|
||||
display: table;
|
||||
width: 100%;
|
||||
height:100%;
|
||||
position: absolute;
|
||||
}
|
||||
.button {
|
||||
background-color: #2e395f;
|
||||
border: 2px #87a5ff solid;
|
||||
border-radius: 5px;
|
||||
padding-left:10px;
|
||||
padding-right:10px;
|
||||
padding-top:13px;
|
||||
padding-bottom:10px;
|
||||
display:block;
|
||||
transition: all .2s ease-in-out;
|
||||
width: fit-content;
|
||||
margin-bottom:20px;
|
||||
margin-top:-20px;
|
||||
font-family:'pasti';
|
||||
font-size:20pt;
|
||||
color:#d2ddff;
|
||||
font-style:normal;
|
||||
text-decoration: none;
|
||||
}
|
||||
.button:hover {
|
||||
background-color: #4b5c99;
|
||||
border: 2px #87a5ff solid;
|
||||
cursor:pointer;
|
||||
padding-left:30px;
|
||||
padding-right:30px;
|
||||
padding-top:13px;
|
||||
padding-bottom:10px;
|
||||
}
|
||||
|
||||
.button-custom {
|
||||
background-color: #2e395f;
|
||||
border: 2px #87a5ff solid;
|
||||
border-radius: 5px;
|
||||
padding-left:20px;
|
||||
padding-right:20px;
|
||||
padding-top:2px;
|
||||
display:block;
|
||||
transition: all .2s ease-in-out;
|
||||
width: fit-content;
|
||||
font-family:'pasti';
|
||||
font-size:12pt;
|
||||
color:#d2ddff;
|
||||
height:min-content;
|
||||
margin-top:8px;
|
||||
float:right;
|
||||
margin-right:20px;
|
||||
margin-left:0px;
|
||||
}
|
||||
.button-custom:hover {
|
||||
background-color: #4b5c99;
|
||||
border: 2px #87a5ff solid;
|
||||
cursor:pointer;
|
||||
padding-left:30px;
|
||||
padding-right:30px;
|
||||
margin-right:10px;
|
||||
margin-left:-10px;
|
||||
}
|
||||
|
||||
.button-custom-box {
|
||||
position:relative;
|
||||
display:block;
|
||||
}
|
||||
|
||||
.credits {
|
||||
font-family: 'pasti';
|
||||
font-size:12pt;
|
||||
text-align: left;
|
||||
margin:5px;
|
||||
position:absolute;
|
||||
font-style:italic;
|
||||
}
|
||||
.editor-box {
|
||||
margin:10px;
|
||||
border: 2px #87a5ff solid;
|
||||
max-height:100%;
|
||||
border-radius:10px;
|
||||
background-color:#181d30;
|
||||
}
|
||||
.editor > textarea {
|
||||
width:max-content;
|
||||
resize: none;
|
||||
background-color:#181d30;
|
||||
border:none;
|
||||
color:#d2ddff;
|
||||
font-family:'hack';
|
||||
font-size:11pt;
|
||||
display: block;
|
||||
height:calc( 100vh - 86px );
|
||||
overflow-y:scroll;
|
||||
width:calc( 100% - 40px );
|
||||
padding:10px;
|
||||
}
|
||||
|
||||
.editor > textarea:focus {
|
||||
outline:none;
|
||||
}
|
||||
|
||||
.editor > textarea::selection {
|
||||
background-color:#5a6db7;
|
||||
}
|
||||
::-moz-selection {
|
||||
background-color:#5a6db7;
|
||||
}
|
||||
.editor-header {
|
||||
font-family:'pasti';
|
||||
font-size:12pt;
|
||||
max-height:40px;
|
||||
height:40px;
|
||||
border-bottom: 2px #87a5ff solid;
|
||||
background-color:#2a3253;
|
||||
border-radius:10px 10px 0px 0px;
|
||||
}
|
||||
|
||||
.name-box > input {
|
||||
background-color:#2a3253;
|
||||
border: 1px #87a5ff solid;
|
||||
outline:none;
|
||||
font-size:12pt;
|
||||
margin-left:10px;
|
||||
margin-top:5px;
|
||||
border-radius:10px;
|
||||
padding:5px;
|
||||
color: #87a5ff;
|
||||
font-family: 'hack';
|
||||
width:50%;
|
||||
max-width:500px;
|
||||
min-width:100px;
|
||||
font-style:italic;
|
||||
}
|
||||
|
||||
.id-box {
|
||||
float: right;
|
||||
margin-top:12px;
|
||||
margin-right:15px;
|
||||
font-size:10pt;
|
||||
font-family: 'hack';
|
||||
}
|
||||
|
||||
#editor {
|
||||
scrollbar-base-color: #ffffff #ffffff;
|
||||
}
|
||||
|
||||
.alert {
|
||||
background-color:#5f87ff;
|
||||
color: black;
|
||||
padding:10px;
|
||||
padding-left:20px;
|
||||
padding-right:20px;
|
||||
font-family: 'hack';
|
||||
font-size:12pt;
|
||||
text-align: center;
|
||||
margin-bottom:20px;
|
||||
border: 0px white solid;
|
||||
border-radius:10px;
|
||||
margin-left: auto;
|
||||
margin-right: auto;
|
||||
display: block;
|
||||
position: absolute;
|
||||
z-index:10;
|
||||
bottom:0px;
|
||||
left:0px;
|
||||
right:0px;
|
||||
width:fit-content;
|
||||
pointer-events: none;
|
||||
animation-name: slidein;
|
||||
animation-duration: 3s;
|
||||
animation-timing-function: ease-in-out;
|
||||
animation-fill-mode: forwards;
|
||||
animation-iteration-count: 1;
|
||||
animation-direction: normal;
|
||||
}
|
||||
|
||||
/* #editor {
|
||||
-webkit-background-clip: text;
|
||||
background-clip: text;
|
||||
color: transparent;
|
||||
} */
|
||||
|
||||
/* #editor::after {
|
||||
content: "";
|
||||
position: absolute;
|
||||
top: 10px;
|
||||
left: 10px;
|
||||
right: 10px;
|
||||
bottom:10px;
|
||||
width: calc(100% - 20px);
|
||||
height: calc(100% - 20px);
|
||||
background-color: #0026ff;
|
||||
border-radius: 10px;
|
||||
z-index: 1000;
|
||||
} */
|
39
views/index.ejs
Normal file
39
views/index.ejs
Normal file
|
@ -0,0 +1,39 @@
|
|||
<!DOCTYPE html>
|
||||
<html lang="en">
|
||||
<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="stylesheet" href="style.css">
|
||||
<title>The Bin</title>
|
||||
<script>
|
||||
function alert(text) {
|
||||
var alert = document.createElement("div");
|
||||
alert.className = "alert";
|
||||
alert.innerHTML = text;
|
||||
document.body.appendChild(alert);
|
||||
setTimeout(function() {
|
||||
document.body.removeChild(alert);
|
||||
}, 3000);
|
||||
}
|
||||
</script>
|
||||
</head>
|
||||
<body style="overflow-y: hidden">
|
||||
<div class="credits">
|
||||
<p>Developed by TheRed with <3</p>
|
||||
</div>
|
||||
<div class="container-external">
|
||||
<div class="container-middle">
|
||||
<div class="container">
|
||||
<h1 class="header">welcome to the new kind of bin.</h1>
|
||||
<h3 class="subheader">Completely Open-Source, uncensored.</h3>
|
||||
<a href="/new" class="button">Get Started</a>
|
||||
</div>
|
||||
</div>
|
||||
<p style="font-family:'hack';font-size:13pt;position:absolute;bottom:5px;right:5px;font-style:italic;"><a href="/paste/1aa5ca4b19daea70e3268ac88ef3c8f3" style="text-decoration: none;color:#3f4d7c;">Version 0.2</a></p>
|
||||
<p style="font-family:'hack';font-size:13pt;position:absolute;top:5px;right:5px;font-style:italic;"><a href="/paste/1aa5ca4b19daea70e3268ac88ef3c8f3" style="text-decoration: underline;color:#3f4d7c;">Git Repository</a></p>
|
||||
<p style="font-family:'hack';font-size:13pt;position:absolute;bottom:5px;left:5px;font-style:italic;"><a href="/paste/changelogs" style="text-decoration: underline;color:#3f4d7c;">Changelogs</a></p>
|
||||
</div>
|
||||
<script defer>alert("Welcome aboard. Honored to meet you.");</script>
|
||||
</body>
|
||||
</html>
|
61
views/new.ejs
Normal file
61
views/new.ejs
Normal file
|
@ -0,0 +1,61 @@
|
|||
<!DOCTYPE html>
|
||||
<html lang="en">
|
||||
<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="stylesheet" href="style.css">
|
||||
<title>New Paste</title>
|
||||
<script>
|
||||
function alert(text) {
|
||||
var alert = document.createElement("div");
|
||||
alert.className = "alert";
|
||||
alert.innerHTML = text;
|
||||
document.body.appendChild(alert);
|
||||
setTimeout(function() {
|
||||
document.body.removeChild(alert);
|
||||
}, 3000);
|
||||
}
|
||||
function savePaste() {
|
||||
document.getElementById('save-button').style = 'display: none';
|
||||
let xhr = new XMLHttpRequest();
|
||||
xhr.open("POST", "/write");
|
||||
|
||||
xhr.setRequestHeader("Accept", "application/json");
|
||||
xhr.setRequestHeader("Content-Type", "application/json");
|
||||
|
||||
let text = document.getElementById('editor').value;
|
||||
let name = document.getElementById('name').value;
|
||||
|
||||
let data = JSON.stringify({"text": text, "name": name});
|
||||
|
||||
xhr.send(data);
|
||||
|
||||
xhr.onload = () => {
|
||||
let rq = xhr.responseText;
|
||||
if (xhr.status == 200) {
|
||||
alert("Paste saved! Redirecting...");
|
||||
setTimeout(() => {window.location.href = "/paste/" + rq;}, 1000);
|
||||
} else {
|
||||
document.getElementById('save-button').style = 'display: block';
|
||||
}
|
||||
};
|
||||
}
|
||||
function goToHome() {
|
||||
window.location.href = "/";
|
||||
}
|
||||
</script>
|
||||
</head>
|
||||
<body style="overflow-y:hidden">
|
||||
<div class="editor-box">
|
||||
<div class="editor-header">
|
||||
<div class="button-custom-box"><button type="button" class="button-custom" onclick="savePaste()" id="save-button">Save</button></div>
|
||||
<div class="button-custom-box"><button type="button" class="button-custom" onclick="goToHome()" id="save-button">Home</button></div>
|
||||
<div class="name-box"><input placeholder="<Empty>" type="text" id="name" autocomplete="off" spellcheck="off"></input></div>
|
||||
</div>
|
||||
<div class="editor">
|
||||
<textarea placeholder="Enter some text to get started!" id="editor" spellcheck="off" autofocus="on" autocomplete="off"></textarea>
|
||||
</div>
|
||||
</div>
|
||||
</body>
|
||||
</html>
|
58
views/paste.ejs
Normal file
58
views/paste.ejs
Normal file
|
@ -0,0 +1,58 @@
|
|||
<!DOCTYPE html>
|
||||
<html lang="en">
|
||||
<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="stylesheet" href="../style.css">
|
||||
<title>Paste #<%= id %></title>
|
||||
<script>
|
||||
function alert(text) {
|
||||
var alert = document.createElement("div");
|
||||
alert.className = "alert";
|
||||
alert.innerHTML = text;
|
||||
document.body.appendChild(alert);
|
||||
setTimeout(function() {
|
||||
document.body.removeChild(alert);
|
||||
}, 3000);
|
||||
}
|
||||
function copyPaste() {
|
||||
/* Get the text field */
|
||||
var copyText = document.getElementById("editor");
|
||||
|
||||
/* Select the text field */
|
||||
copyText.select();
|
||||
copyText.setSelectionRange(0, 99999); /* For mobile devices */
|
||||
|
||||
/* Copy the text inside the text field */
|
||||
navigator.clipboard.writeText(copyText.value);
|
||||
alert("Copied text to clipboard!");
|
||||
}
|
||||
|
||||
function copyLink() {
|
||||
/* Get the text field */
|
||||
var copyText = window.location.href;
|
||||
|
||||
/* Copy the text inside the text field */
|
||||
navigator.clipboard.writeText(copyText);
|
||||
alert("Copied link to clipboard!");
|
||||
}
|
||||
function goToHome() {
|
||||
window.location.href = "/";
|
||||
}
|
||||
</script>
|
||||
</head>
|
||||
<body style="overflow-y:hidden">
|
||||
<div class="editor-box">
|
||||
<div class="editor-header">
|
||||
<div class="button-custom-box"><button type="button" class="button-custom" onclick="copyPaste()" id="save-button">Copy</button></div>
|
||||
<div class="button-custom-box"><button type="button" class="button-custom" onclick="goToHome()" id="save-button">Home</button></div>
|
||||
<div class="button-custom-box"><button type="button" class="button-custom" onclick="copyLink()" id="save-button">Copy Link</button></div>
|
||||
<div class="name-box"><input placeholder="<Empty>" value="<%= name %>" readonly></input></div>
|
||||
</div>
|
||||
<div class="editor">
|
||||
<textarea id="editor" spellcheck="false" autofocus="true" autocomplete="false" readonly><%= text %></textarea>
|
||||
</div>
|
||||
</div>
|
||||
</body>
|
||||
</html>
|
Loading…
Reference in a new issue