2017-10-06 21:24:05 +01:00
|
|
|
const episodepublishform = {
|
2017-10-28 02:39:29 +01:00
|
|
|
template: `<div>
|
|
|
|
<h3>Publish Episode</h3>
|
2017-11-21 18:38:58 +00:00
|
|
|
<form enctype="multipart/form-data" action="/admin/publish" method="post" class="publish">
|
2017-10-28 02:39:29 +01:00
|
|
|
<label for="title">Episode Title</label>
|
|
|
|
<input type="text" id="title" name="title">
|
|
|
|
<label for="description">Episode Description</label>
|
2017-11-21 18:38:58 +00:00
|
|
|
<textarea name="description" id="description" style="resize: none;" class="epdesc"></textarea>
|
2017-10-28 02:39:29 +01:00
|
|
|
<label for="file">Media File</label>
|
|
|
|
<input type="file" id="file" name="file">
|
|
|
|
<label for="date">Publish Date</label>
|
2017-11-21 18:38:58 +00:00
|
|
|
<input type="date" id="date" name="date"><br /><br />
|
|
|
|
<input type="submit" value="Publish" class="button">
|
2017-10-28 02:39:29 +01:00
|
|
|
</form>
|
|
|
|
</div>`
|
2017-10-06 23:06:04 +01:00
|
|
|
}
|
|
|
|
|
2017-11-19 19:11:46 +00:00
|
|
|
const message = {
|
|
|
|
template: `<div><h3>{{ this.$route.params.message }}</h3></div>`
|
|
|
|
}
|
|
|
|
|
2017-10-28 03:04:11 +01:00
|
|
|
const userlist = {
|
2017-10-28 02:39:29 +01:00
|
|
|
template: `<div>
|
2017-11-21 18:38:58 +00:00
|
|
|
<router-link :to="\'users/new\'" tag="button">New</router-link>
|
|
|
|
<table>
|
2017-10-28 02:39:29 +01:00
|
|
|
<tr>
|
2017-10-28 03:04:11 +01:00
|
|
|
<th>Username</th>
|
|
|
|
<th>Email</th>
|
2017-11-21 18:38:58 +00:00
|
|
|
<th></th>
|
2017-10-28 02:39:29 +01:00
|
|
|
</tr>
|
|
|
|
<tr v-for="item in items">
|
2017-10-28 03:04:11 +01:00
|
|
|
<td>{{ item.username }}</td>
|
|
|
|
<td>{{ item.email }}</td>
|
2017-10-28 02:39:29 +01:00
|
|
|
<td>
|
2017-11-21 18:38:58 +00:00
|
|
|
<router-link :to="\'user/\' + item.id" class="button">Edit</router-link>
|
2017-10-28 02:39:29 +01:00
|
|
|
</td>
|
|
|
|
</tr>
|
|
|
|
</table>
|
|
|
|
</div>`,
|
2017-10-06 23:06:04 +01:00
|
|
|
data() {
|
|
|
|
return {
|
|
|
|
loading: false,
|
|
|
|
items: null,
|
|
|
|
error: null
|
|
|
|
}
|
|
|
|
},
|
|
|
|
created() {
|
|
|
|
// fetch the data when the view is created and the data is
|
|
|
|
// already being observed
|
|
|
|
this.fetchData()
|
|
|
|
},
|
|
|
|
watch: {
|
|
|
|
// call again the method if the route changes
|
|
|
|
'$route': 'fetchData'
|
|
|
|
},
|
|
|
|
methods: {
|
|
|
|
fetchData() {
|
|
|
|
this.error = this.items = []
|
|
|
|
this.loading = true
|
|
|
|
|
2017-10-28 02:39:29 +01:00
|
|
|
get("/admin/listusers", (err, items) => {
|
2017-10-06 23:06:04 +01:00
|
|
|
this.loading = false
|
|
|
|
if (err) {
|
|
|
|
this.error = err.toString()
|
|
|
|
} else {
|
2017-10-28 03:04:11 +01:00
|
|
|
var t = JSON.parse(items).reverse();
|
2017-10-06 23:06:04 +01:00
|
|
|
for (var i = t.length - 1; i >= 0; i--) {
|
2017-10-08 18:54:48 +01:00
|
|
|
this.items.push({
|
2017-10-28 03:04:11 +01:00
|
|
|
id: t[i].id,
|
|
|
|
username: t[i].username,
|
|
|
|
email: t[i].email,
|
2017-10-08 18:54:48 +01:00
|
|
|
})
|
|
|
|
}
|
|
|
|
}
|
|
|
|
})
|
|
|
|
}
|
|
|
|
}
|
|
|
|
}
|
|
|
|
|
2017-11-19 19:11:46 +00:00
|
|
|
const usernew = {
|
|
|
|
template: `<div>
|
|
|
|
<div>
|
|
|
|
<h3>New User</h3>
|
|
|
|
<form enctype="multipart/form-data" action="/admin/adduser" method="post">
|
|
|
|
<label for="username">Username</label>
|
|
|
|
<input type="text" id="username" name="username">
|
|
|
|
<label for="email">Email</label>
|
|
|
|
<input type="text" id="email" name="email">
|
|
|
|
<label for="realname">Real Name</label>
|
|
|
|
<input type="text" id="realname" name="realname">
|
|
|
|
|
|
|
|
<label for="password">New Password</label>
|
|
|
|
<input type="password" id="password" name="password">
|
2017-12-01 21:48:29 +00:00
|
|
|
<label for="permissions">Permission Level</label>
|
|
|
|
<select name="permissions">
|
|
|
|
<option value="0">Publishing only</option>
|
|
|
|
<option value="1">Publishing and Episode Management</option>
|
|
|
|
<option value="2">Publishing, Episode and User management</option>
|
|
|
|
</select>
|
2017-11-21 18:38:58 +00:00
|
|
|
<br /><br />
|
|
|
|
<input type="submit" class="button" value="Save"></form>
|
2017-11-19 19:11:46 +00:00
|
|
|
</div>
|
|
|
|
</div>`
|
|
|
|
}
|
|
|
|
|
2017-10-28 03:04:11 +01:00
|
|
|
const useredit = {
|
|
|
|
template: `<div>
|
|
|
|
<div>
|
|
|
|
<h3>Edit User</h3>
|
|
|
|
<form enctype="multipart/form-data" action="/admin/edituser" method="post">
|
2017-11-17 21:59:53 +00:00
|
|
|
<label for="username">Username</label>
|
|
|
|
<input type="text" id="username" name="username" :value="user.username">
|
2017-10-28 03:04:11 +01:00
|
|
|
<label for="email">Email</label>
|
|
|
|
<input type="text" id="email" name="email" :value="user.email">
|
|
|
|
<label for="realname">Real Name</label>
|
|
|
|
<input type="text" id="realname" name="realname" :value="user.realname">
|
|
|
|
|
|
|
|
<label for="newpw1">New Password</label>
|
|
|
|
<input type="password" id="newpw1" name="newpw1">
|
|
|
|
<label for="newpw2">Repeat New Password</label>
|
|
|
|
<input type="password" id="newpw2" name="newpw2">
|
|
|
|
<label for="oldpw">Old Password</label>
|
|
|
|
<input type="password" id="oldpw" name="oldpw">
|
|
|
|
<input name="id" id="id" :value="user.id" type="hidden">
|
2017-11-21 18:38:58 +00:00
|
|
|
<br /><br />
|
|
|
|
<input type="submit" class="button" value="Save" class="button"></form>
|
|
|
|
<a v-bind:href="'/admin/deleteuser/'+user.id+''" class="button">Delete User</a>
|
2017-10-28 03:04:11 +01:00
|
|
|
</div>
|
|
|
|
</div>`,
|
|
|
|
data() {
|
|
|
|
return {
|
|
|
|
loading: false,
|
|
|
|
user: null,
|
|
|
|
error: null
|
|
|
|
}
|
|
|
|
},
|
|
|
|
created() {
|
|
|
|
// fetch the data when the view is created and the data is
|
|
|
|
// already being observed
|
|
|
|
this.fetchData()
|
|
|
|
},
|
|
|
|
watch: {
|
|
|
|
// call again the method if the route changes
|
|
|
|
'$route': 'fetchData'
|
|
|
|
},
|
|
|
|
methods: {
|
|
|
|
fetchData() {
|
|
|
|
this.error = this.user = []
|
|
|
|
this.loading = true
|
|
|
|
|
|
|
|
get("/admin/listusers", (err, items) => {
|
|
|
|
this.loading = false
|
|
|
|
if (err) {
|
|
|
|
this.error = err.toString()
|
|
|
|
} else {
|
|
|
|
var t = JSON.parse(items)
|
|
|
|
for (var i = t.length - 1; i >= 0; i--) {
|
|
|
|
if (t[i].id == this.$route.params.id) {
|
|
|
|
this.user = {
|
|
|
|
id: t[i].id,
|
|
|
|
username: t[i].username,
|
|
|
|
email: t[i].email,
|
|
|
|
realname: t[i].realname
|
|
|
|
}
|
|
|
|
}
|
|
|
|
}
|
|
|
|
}
|
|
|
|
})
|
|
|
|
}
|
|
|
|
}
|
|
|
|
}
|
|
|
|
|
2017-10-28 02:39:29 +01:00
|
|
|
const episodemanagement = {
|
|
|
|
template: `<div>
|
|
|
|
<table style="width:100%">
|
|
|
|
<tr>
|
2017-11-21 18:38:58 +00:00
|
|
|
<th>Title</th>
|
|
|
|
<th>URL</th>
|
|
|
|
<th></th>
|
2017-10-28 02:39:29 +01:00
|
|
|
</tr>
|
|
|
|
<tr v-for="item in items">
|
2017-11-21 18:38:58 +00:00
|
|
|
<td>{{ item.id }}: {{ item.title }}</td><td>{{ item.url }}</td><td><router-link class="button" :to="\'edit/\' + item.id">Edit</router-link></td>
|
2017-10-28 02:39:29 +01:00
|
|
|
</tr>
|
|
|
|
</table>
|
|
|
|
</div>`,
|
|
|
|
data() {
|
|
|
|
return {
|
|
|
|
loading: false,
|
|
|
|
items: null,
|
|
|
|
error: null
|
|
|
|
}
|
|
|
|
},
|
|
|
|
created() {
|
|
|
|
// fetch the data when the view is created and the data is
|
|
|
|
// already being observed
|
|
|
|
this.fetchData()
|
|
|
|
},
|
|
|
|
watch: {
|
|
|
|
// call again the method if the route changes
|
|
|
|
'$route': 'fetchData'
|
|
|
|
},
|
|
|
|
methods: {
|
|
|
|
fetchData() {
|
|
|
|
this.error = this.items = []
|
|
|
|
this.loading = true
|
|
|
|
|
|
|
|
get("/json", (err, items) => {
|
|
|
|
this.loading = false
|
|
|
|
if (err) {
|
|
|
|
this.error = err.toString()
|
|
|
|
} else {
|
|
|
|
var t = JSON.parse(items).items
|
|
|
|
for (var i = t.length - 1; i >= 0; i--) {
|
2017-11-29 21:23:54 +00:00
|
|
|
console.log(i)
|
2017-10-28 02:39:29 +01:00
|
|
|
this.items.push({
|
|
|
|
title: t[i].title,
|
|
|
|
url: t[i].url,
|
|
|
|
id: t[i].id
|
|
|
|
})
|
|
|
|
}
|
|
|
|
}
|
|
|
|
})
|
|
|
|
}
|
|
|
|
}
|
|
|
|
}
|
|
|
|
|
2017-10-08 18:54:48 +01:00
|
|
|
const episodeedit = {
|
2017-10-28 02:39:29 +01:00
|
|
|
template: `<div>
|
|
|
|
<div>
|
|
|
|
<h3>Edit Episode</h3>
|
|
|
|
<form enctype="multipart/form-data" action="/admin/edit" method="post">
|
|
|
|
<label for="title">Episode Title</label>
|
|
|
|
<input type="text" id="title" name="title" :value="episode.title">
|
|
|
|
<label for="description">Episode Description</label>
|
|
|
|
<textarea name="description" id="description" cols="100" rows="20" style="resize: none;">{{ episode.description }}</textarea>
|
|
|
|
<label for="date">Publish Date</label>
|
|
|
|
<input type="date" id="date" name="date" :value="episode.time">
|
|
|
|
<input name="previousfilename" id="previousfilename" :value="episode.previousfilename" type="hidden">
|
2017-11-21 18:38:58 +00:00
|
|
|
<input type="submit" class="button" value="Publish"></form>
|
2017-10-28 02:39:29 +01:00
|
|
|
</div>
|
|
|
|
</div>`,
|
2017-10-09 01:57:58 +01:00
|
|
|
data() {
|
2017-10-08 18:54:48 +01:00
|
|
|
return {
|
|
|
|
loading: false,
|
|
|
|
episode: null,
|
|
|
|
error: null
|
|
|
|
}
|
|
|
|
},
|
|
|
|
created() {
|
|
|
|
// fetch the data when the view is created and the data is
|
|
|
|
// already being observed
|
|
|
|
this.fetchData()
|
|
|
|
},
|
|
|
|
watch: {
|
|
|
|
// call again the method if the route changes
|
|
|
|
'$route': 'fetchData'
|
|
|
|
},
|
|
|
|
methods: {
|
|
|
|
fetchData() {
|
2017-10-09 01:57:58 +01:00
|
|
|
this.error = this.episode = {}
|
2017-10-08 18:54:48 +01:00
|
|
|
this.loading = true
|
|
|
|
|
2017-10-28 02:39:29 +01:00
|
|
|
get("/json", (err, items) => {
|
2017-10-08 18:54:48 +01:00
|
|
|
this.loading = false
|
|
|
|
if (err) {
|
|
|
|
this.error = err.toString()
|
|
|
|
} else {
|
|
|
|
var t = JSON.parse(items).items
|
|
|
|
for (var i = t.length - 1; i >= 0; i--) {
|
2017-10-09 01:57:58 +01:00
|
|
|
if (t[i].id == this.$route.params.id) {
|
2017-10-09 03:24:38 +01:00
|
|
|
time = t[i].date_published.split("T")
|
|
|
|
var prev = time[0] + "_" + t[i].title
|
2017-10-09 01:57:58 +01:00
|
|
|
this.episode = {
|
|
|
|
title: t[i].title,
|
|
|
|
description: t[i].summary,
|
|
|
|
url: t[i].url,
|
2017-10-09 03:24:38 +01:00
|
|
|
id: t[i].id,
|
|
|
|
time: time[0],
|
|
|
|
previousfilename: prev
|
2017-10-09 01:57:58 +01:00
|
|
|
}
|
|
|
|
}
|
2017-10-06 23:06:04 +01:00
|
|
|
}
|
|
|
|
}
|
2017-10-09 01:57:58 +01:00
|
|
|
console.log(this.episode)
|
2017-10-06 23:06:04 +01:00
|
|
|
})
|
|
|
|
}
|
|
|
|
}
|
2017-10-06 21:24:05 +01:00
|
|
|
}
|
2017-10-06 20:49:11 +01:00
|
|
|
|
2017-10-06 21:24:05 +01:00
|
|
|
const customcss = {
|
2017-10-28 02:39:29 +01:00
|
|
|
template: `<div>
|
2017-11-21 18:38:58 +00:00
|
|
|
<h3>Theme</h3>
|
2017-10-28 02:39:29 +01:00
|
|
|
<form action="/admin/css" method="post" enctype="multipart/form-data">
|
2017-11-21 18:38:58 +00:00
|
|
|
<textarea spellcheck="false" name="css" id="css" cols="120" rows="20" class="css">{{ css }}</textarea>
|
|
|
|
<br /><br />
|
|
|
|
<input type="submit" class="button" value="Submit" class="button">
|
2017-10-28 02:39:29 +01:00
|
|
|
</form>
|
|
|
|
</div>`,
|
2017-10-06 21:24:05 +01:00
|
|
|
data() {
|
|
|
|
return {
|
|
|
|
loading: false,
|
|
|
|
css: null,
|
|
|
|
error: null
|
|
|
|
}
|
|
|
|
},
|
|
|
|
created() {
|
|
|
|
// fetch the data when the view is created and the data is
|
|
|
|
// already being observed
|
|
|
|
this.fetchData()
|
|
|
|
},
|
|
|
|
watch: {
|
|
|
|
// call again the method if the route changes
|
|
|
|
'$route': 'fetchData'
|
|
|
|
},
|
|
|
|
methods: {
|
|
|
|
fetchData() {
|
|
|
|
this.error = this.css = null
|
|
|
|
this.loading = true
|
2017-10-06 20:49:11 +01:00
|
|
|
|
2017-10-28 02:39:29 +01:00
|
|
|
get("/admin/css", (err, css) => {
|
2017-10-06 21:24:05 +01:00
|
|
|
this.loading = false
|
2017-11-29 21:23:54 +00:00
|
|
|
if (css == "{}") {
|
|
|
|
this.css = "You aren't allowed to edit this CSS!"
|
2017-10-06 21:24:05 +01:00
|
|
|
} else {
|
2017-11-29 21:23:54 +00:00
|
|
|
if (err) {
|
|
|
|
this.error = err.toString()
|
|
|
|
} else {
|
|
|
|
this.css = css
|
|
|
|
}
|
2017-10-06 21:24:05 +01:00
|
|
|
}
|
|
|
|
})
|
|
|
|
}
|
|
|
|
}
|
|
|
|
}
|
|
|
|
|
|
|
|
const routes = [
|
2017-11-21 18:38:58 +00:00
|
|
|
{path: '/', redirect: '/publish'},
|
2017-10-06 21:24:05 +01:00
|
|
|
{ path: '/publish', component: episodepublishform },
|
2017-10-06 23:06:04 +01:00
|
|
|
{ path: '/manage', component: episodemanagement },
|
2017-10-08 18:54:48 +01:00
|
|
|
{ path: '/theme', component: customcss },
|
2017-10-28 03:04:11 +01:00
|
|
|
{ path: '/edit/:id', component: episodeedit },
|
|
|
|
{ path: '/users/', component: userlist },
|
2017-11-19 19:11:46 +00:00
|
|
|
{ path: '/msg/:message', component: message },
|
|
|
|
{ path: '/user/:id', component: useredit },
|
|
|
|
{ path: '/users/new', component: usernew }
|
2017-10-06 21:24:05 +01:00
|
|
|
]
|
|
|
|
|
|
|
|
const router = new VueRouter({
|
|
|
|
routes
|
2017-10-06 20:49:11 +01:00
|
|
|
})
|
|
|
|
|
2017-10-06 21:24:05 +01:00
|
|
|
const app = new Vue({
|
|
|
|
router,
|
|
|
|
data: {
|
|
|
|
header: 'Pogo Admin',
|
|
|
|
}
|
|
|
|
}).$mount('#app')
|
2017-10-06 20:49:11 +01:00
|
|
|
|
2017-10-28 02:39:29 +01:00
|
|
|
function get(url,callback) {
|
2017-10-06 23:06:04 +01:00
|
|
|
var xmlHttp = new XMLHttpRequest();
|
|
|
|
xmlHttp.onreadystatechange = function() {
|
2017-11-29 21:23:54 +00:00
|
|
|
if (xmlHttp.readyState == 4 && xmlHttp.status == 200) {
|
|
|
|
if (xmlHttp.responseText == "Unauthorized") {
|
|
|
|
callback(null, "{}")
|
|
|
|
} else {
|
|
|
|
callback(null, xmlHttp.responseText)
|
|
|
|
}
|
|
|
|
}
|
2017-10-06 23:06:04 +01:00
|
|
|
}
|
2017-10-28 02:39:29 +01:00
|
|
|
xmlHttp.open("GET", url, true);
|
2017-10-06 23:06:04 +01:00
|
|
|
xmlHttp.send(null);
|
2017-10-06 20:49:11 +01:00
|
|
|
}
|