rushilwiz/website-2018
1
0
Fork 0
mirror of https://github.com/tjsga/website-2018.git synced 2025-04-09 22:10:18 -04:00
Code Issues Actions Packages Projects Releases Wiki Activity

Editing Site is now a possibility

Browse Source
This commit is contained in:
AnubisSQLi 2018-08-08 23:25:51 -04:00
parent a4d7908cdb
commit 8237dc668d
3 changed files with 301 additions and 355 deletions
Show Stats Download Patch File Download Diff File Expand all files Collapse all files

26
server.js
View File

@ -1,8 +1,11 @@
const EDITINGPASSWORD = '#420dglazeit'
// MODULES // MODULES
var express = require('express') var express = require('express')
var path = require('path') var path = require('path')
var hbs = require('hbs') var hbs = require('hbs')
var fs = require('fs') var fs = require('fs')
var bodyParser = require("body-parser")
// SERVER INIT // SERVER INIT
var app = express() var app = express()
@ -11,6 +14,10 @@ var server = require('http').createServer(app)
// SERVER CONFIG // SERVER CONFIG
app.set('trust proxy', 1) app.set('trust proxy', 1)
app.set('view engine', 'hbs') app.set('view engine', 'hbs')
app.use(bodyParser.urlencoded({ extended: false }))
app.use(bodyParser.json())
hbs.registerPartials(path.join(__dirname, 'views')) hbs.registerPartials(path.join(__dirname, 'views'))
hbs.registerHelper('listFirstThree', function (context, options) { hbs.registerHelper('listFirstThree', function (context, options) {
var ret = "" var ret = ""
@ -35,6 +42,25 @@ app.use('/css', express.static(path.join(__dirname, 'css')))
app.use('/resources', express.static(path.join(__dirname, 'resources'))) app.use('/resources', express.static(path.join(__dirname, 'resources')))
// PAGES // PAGES
app.get('/edit', function (req, res) {
var content = JSON.parse(fs.readFileSync('site.json'))
res.render('edit', { officers: JSON.stringify(content.officers), committee: JSON.stringify(content.committee), council: JSON.stringify(content.council) })
})
app.post('/edit', function (req, res) {
var data = JSON.parse(req.body.data)
if (data.password === EDITINGPASSWORD) {
var content = JSON.parse(fs.readFileSync('site.json'))
content.officers = data.officers
content.committee = data.committee
content.council = data.council
fs.writeFileSync('site.json', JSON.stringify(content))
res.send({ status: 'editsSaved' })
} else {
res.send({ status: 'incorrectPassword' })
}
})
app.get('/officers', function (req, res) { app.get('/officers', function (req, res) {
var content = JSON.parse(fs.readFileSync('site.json')) var content = JSON.parse(fs.readFileSync('site.json'))
res.render('officers', { site: content }) res.render('officers', { site: content })

356
site.json
View File

File diff suppressed because one or more lines are too long

274
views/edit.hbs Normal file
View File

@ -0,0 +1,274 @@
<!doctype html>
<html lang='en'>
<head>
<style>
.hidden {
display: none;
}
input {
color: #525f7f;
font-family: 'Nunito-Bold', 'Nunito', sans-serif;
font-weight: 700;
outline: none;
text-decoration: none;
border: none;
font-size: 20px;
margin: 10px 0px;
padding: 10px 20px;
-webkit-border-radius: 4px;
-moz-border-radius: 4px;
border-radius: 4px;
-webkit-background-clip: padding-box;
-moz-background-clip: padding;
background-clip: padding-box;
display: inline-block;
-webkit-box-shadow: 0 15px 35px rgba(50, 50, 98, 0.1), 0 5px 15px rgba(0, 0, 0, 0.07);
-moz-box-shadow: 0 15px 35px rgba(50, 50, 98, 0.1), 0 5px 15px rgba(0, 0, 0, 0.07);
box-shadow: 0 15px 35px rgba(50, 50, 98, 0.1), 0 5px 15px rgba(0, 0, 0, 0.07);
-moz-transform: scale(1, 1);
-o-transform: scale(1, 1);
-ms-transform: scale(1, 1);
-webkit-transform: scale(1, 1);
transform: scale(1, 1);
-moz-transition: all 0.15s ease;
-o-transition: all 0.15s ease;
-webkit-transition: all 0.15s ease;
transition: all 0.15s ease;
margin-right: 20px;
min-width: 250px;
}
textarea {
color: #525f7f;
font-family: 'Nunito-Bold', 'Nunito', sans-serif;
font-weight: 700;
outline: none;
text-decoration: none;
border: none;
font-size: 20px;
padding: 10px 20px;
-webkit-border-radius: 4px;
-moz-border-radius: 4px;
border-radius: 4px;
-webkit-background-clip: padding-box;
-moz-background-clip: padding;
background-clip: padding-box;
display: inline-block;
-webkit-box-shadow: 0 15px 35px rgba(50, 50, 98, 0.1), 0 5px 15px rgba(0, 0, 0, 0.07);
-moz-box-shadow: 0 15px 35px rgba(50, 50, 98, 0.1), 0 5px 15px rgba(0, 0, 0, 0.07);
box-shadow: 0 15px 35px rgba(50, 50, 98, 0.1), 0 5px 15px rgba(0, 0, 0, 0.07);
-moz-transform: scale(1, 1);
-o-transform: scale(1, 1);
-ms-transform: scale(1, 1);
-webkit-transform: scale(1, 1);
transform: scale(1, 1);
-moz-transition: all 0.15s ease;
-o-transition: all 0.15s ease;
-webkit-transition: all 0.15s ease;
transition: all 0.15s ease;
margin-right: 20px;
width: 90%;
height: 165px;
margin-top: 10px;
}
textarea::placeholder {
color: #b8b8d3;
font-family: 'Nunito', sans-serif;
font-weight: 400;
}
textarea:hover {
-webkit-box-shadow: 0 15px 35px rgba(50, 50, 98, 0.1), 0 8px 15px rgba(0, 0, 0, 0.07);
-moz-box-shadow: 0 15px 35px rgba(50, 50, 98, 0.1), 0 8px 15px rgba(0, 0, 0, 0.07);
box-shadow: 0 15px 35px rgba(50, 50, 98, 0.1), 0 8px 15px rgba(0, 0, 0, 0.07);
-moz-transform: scale(1.01, 1.01);
-o-transform: scale(1.01, 1.01);
-ms-transform: scale(1.01, 1.01);
-webkit-transform: scale(1.01, 1.01);
transform: scale(1.01, 1.01);
}
textarea:focus {
-webkit-box-shadow: 0 15px 35px rgba(50, 50, 98, 0.1), 0 8px 15px rgba(0, 0, 0, 0.07);
-moz-box-shadow: 0 15px 35px rgba(50, 50, 98, 0.1), 0 8px 15px rgba(0, 0, 0, 0.07);
box-shadow: 0 15px 35px rgba(50, 50, 98, 0.1), 0 8px 15px rgba(0, 0, 0, 0.07);
-moz-transform: scale(1.01, 1.01);
-o-transform: scale(1.01, 1.01);
-ms-transform: scale(1.01, 1.01);
-webkit-transform: scale(1.01, 1.01);
transform: scale(1.01, 1.01);
}
.title {
min-width: 565px;
color: #323f5f;
}
input:hover {
-webkit-box-shadow: 0 15px 35px rgba(50, 50, 98, 0.1), 0 8px 15px rgba(0, 0, 0, 0.07);
-moz-box-shadow: 0 15px 35px rgba(50, 50, 98, 0.1), 0 8px 15px rgba(0, 0, 0, 0.07);
box-shadow: 0 15px 35px rgba(50, 50, 98, 0.1), 0 8px 15px rgba(0, 0, 0, 0.07);
-moz-transform: scale(1.02, 1.02);
-o-transform: scale(1.02, 1.02);
-ms-transform: scale(1.02, 1.02);
-webkit-transform: scale(1.02, 1.02);
transform: scale(1.02, 1.02);
}
input:focus {
-webkit-box-shadow: 0 15px 35px rgba(50, 50, 98, 0.1), 0 8px 15px rgba(0, 0, 0, 0.07);
-moz-box-shadow: 0 15px 35px rgba(50, 50, 98, 0.1), 0 8px 15px rgba(0, 0, 0, 0.07);
box-shadow: 0 15px 35px rgba(50, 50, 98, 0.1), 0 8px 15px rgba(0, 0, 0, 0.07);
-moz-transform: scale(1.02, 1.02);
-o-transform: scale(1.02, 1.02);
-ms-transform: scale(1.02, 1.02);
-webkit-transform: scale(1.02, 1.02);
transform: scale(1.02, 1.02);
}
input::placeholder {
color: #b8b8d3;
font-family: 'Nunito', sans-serif;
font-weight: 400;
}
b {
color: #525f7f;
font-size: 36px;
font-family: 'Nunito-SemiBold', 'Nunito', sans-serif;
margin: 7px;
}
#editApp {
margin: 0px 10px;
}
.btn {
font-family: 'Nunito-Bold', 'Nunito', sans-serif;
font-weight: 700;
outline: none;
cursor: pointer;
text-align: center;
text-decoration: none;
font-size: 20px;
padding: 10px 20px;
-webkit-border-radius: 4px;
-moz-border-radius: 4px;
border-radius: 4px;
-webkit-background-clip: padding-box;
-moz-background-clip: padding;
background-clip: padding-box;
display: inline-block;
-webkit-box-shadow: 0 15px 35px rgba(50, 50, 98, 0.1), 0 5px 15px rgba(0, 0, 0, 0.07);
-moz-box-shadow: 0 15px 35px rgba(50, 50, 98, 0.1), 0 5px 15px rgba(0, 0, 0, 0.07);
box-shadow: 0 15px 35px rgba(50, 50, 98, 0.1), 0 5px 15px rgba(0, 0, 0, 0.07);
-moz-transform: scale(1, 1);
-o-transform: scale(1, 1);
-ms-transform: scale(1, 1);
-webkit-transform: scale(1, 1);
transform: scale(1, 1);
-moz-transition: all 0.15s ease;
-o-transition: all 0.15s ease;
-webkit-transition: all 0.15s ease;
transition: all 0.15s ease;
background-color: #53CB8B;
color: #F7F7FA;
margin: 10px 0px;
}
.btn:hover {
-webkit-box-shadow: 0 15px 35px rgba(50, 50, 98, 0.1), 0 8px 15px rgba(0, 0, 0, 0.07);
-moz-box-shadow: 0 15px 35px rgba(50, 50, 98, 0.1), 0 8px 15px rgba(0, 0, 0, 0.07);
box-shadow: 0 15px 35px rgba(50, 50, 98, 0.1), 0 8px 15px rgba(0, 0, 0, 0.07);
-moz-transform: scale(1.02, 1.02);
-o-transform: scale(1.02, 1.02);
-ms-transform: scale(1.02, 1.02);
-webkit-transform: scale(1.02, 1.02);
transform: scale(1.02, 1.02);
background-color: #67d198;
}
.btn:focus {
-webkit-box-shadow: 0 15px 35px rgba(50, 50, 98, 0.1), 0 8px 15px rgba(0, 0, 0, 0.07);
-moz-box-shadow: 0 15px 35px rgba(50, 50, 98, 0.1), 0 8px 15px rgba(0, 0, 0, 0.07);
box-shadow: 0 15px 35px rgba(50, 50, 98, 0.1), 0 8px 15px rgba(0, 0, 0, 0.07);
-moz-transform: scale(1.02, 1.02);
-o-transform: scale(1.02, 1.02);
-ms-transform: scale(1.02, 1.02);
-webkit-transform: scale(1.02, 1.02);
transform: scale(1.02, 1.02);
}
.red {
background-color: #E9676F;
color: #F7F7FA;
}
.red:hover {
background-color: #ec7d84;
}
.wrap {
margin: 0px;
position: absolute;
}
</style>
<title>SGA Website Editor</title>
<link rel='icon' href='https://i.imgur.com/IRJiPeO.png'>
<link rel='stylesheet' href='https://use.fontawesome.com/releases/v5.2.0/css/all.css' integrity='sha384-hWVjflwFxL6sNzntih27bfxkr27PmbbK/iSvJ+a4+0owXq79v+lsFkW54bOGbiDQ' crossorigin='anonymous'>
</head>
<body>
<div id='editApp'>
<b>Officers</b>
<div v-for='(officer, idx) in officers'>
<input v-model='officer.title' placeholder='Title'>
<input v-model='officer.name' placeholder='Name'>
<input v-model='officer.img' placeholder='Image URL'>
<textarea v-model='officer.paragraphs[0].para' placeholder='Description'></textarea>
<a class='btn red wrap' @click='officers.splice(idx, 1)'><i class='fas fa-times'></i></a>
</div>
<a class='btn' @click='officers.push({"paragraphs": [{"para":""}]})'>Add Person</a>
<hr/>
<b>Executive Committee</b>
<div v-for='(commit, i) in committee'>
<input v-model='commit.title' placeholder='Committee Title' class='title'>
<a class='btn red' @click='committee.splice(i, 1)'><i class='fas fa-times'></i></a>
<div v-for='(person, idx) in commit.people'>
<input v-model='person.name' placeholder='Name'>
<input v-model='person.year' placeholder='Year'>
<a class='btn red' @click='commit.people.splice(idx, 1)'><i class='fas fa-times'></i></a>
</div>
<a class='btn' @click='commit.people.push({})'>Add Person</a>
</div>
<a class='btn title' @click='committee.push({"people": []})'>Add Committee</a>
<hr/>
<b>Class Council</b>
<div v-for='(coun, i) in council'>
<input v-model='coun.title' placeholder='Type "Class Of ..."' class='title'>
<a class='btn red' @click='council.splice(i, 1)'><i class='fas fa-times'></i></a>
<div v-for='(person, idx) in coun.people'>
<input v-model='person.name' placeholder='Name'>
<input v-model='person.role' placeholder='Role'>
<a class='btn red' @click='coun.people.splice(idx, 1)'><i class='fas fa-times'></i></a>
</div>
<a class='btn' @click='coun.people.push({})'>Add Person</a>
</div>
<a class='btn title' @click='council.push({"people": []})'>Add Council</a>
<hr/>
<input v-model='password' placeholder='Password' id='password' @keyup.enter='sendEdits' type='password'/>
<a class='btn' @click='sendEdits'>SAVE EDITS</a>
</div>
<p class='hidden' id='officers'>{{officers}}</p>
<p class='hidden' id='committee'>{{committee}}</p>
<p class='hidden' id='council'>{{council}}</p>
</body>
<script src='https://code.jquery.com/jquery-3.3.1.min.js' integrity='sha256-FgpCb/KJQlLNfOu91ta32o/NMZxltwRo8QtmkMRdAu8=' crossorigin='anonymous'></script>
<script src='https://cdn.jsdelivr.net/npm/vue'></script>
<script>
var V = {
officers: JSON.parse($('#officers').text()),
committee: JSON.parse($('#committee').text()),
council: JSON.parse($('#council').text()),
password: ''
}
var app = new Vue({
el: '#editApp',
data: V,
methods: {
sendEdits: function(event) {
$.post('/edit', { "data": JSON.stringify(V) }, function(resp) {
console.log(resp)
})
}
}
});
console.log(V);
</script>
</html>