Merge pull request #12 from gmemstr/docker-fix

Docker fix
This commit is contained in:
Gabriel Simmer 2017-10-08 13:09:28 -07:00 committed by GitHub
commit 791457be81
4 changed files with 116 additions and 52 deletions

View file

@ -25,6 +25,6 @@ matrix:
script:
- docker build -t gmemstr/pogo .
- docker run -d --name pogo -p 3000:3000 gmemstr/pogo
- docker run -d --rm --name pogo -p 3000:3000 gmemstr/pogo
- sleep 10
- docker ps -a | grep gmemstr/pogo
- docker ps | grep gmemstr/pogo

View file

@ -31,4 +31,4 @@ RUN ls -al && go get github.com/tools/godep && \
EXPOSE 3000
CMD ./go/src/github.com/gmemstr/pogoapp
CMD ./pogoapp

View file

@ -9,22 +9,16 @@
<body>
<div class="container">
<div id="app">
<a href="#publish">Publish</a>
<a href="#customcss">Theme</a>
<router-link to="/publish">Publish</router-link> <router-link to="/theme">Theme</router-link> <router-link to="/manage">Manage</router-link>
<h1>{{ header }}</h1>
<h3>{{ current_page }}</h3>
<div v-if="page == 'publish'">
<episode-publish-form></episode-publish-form>
</div>
<div v-if="page == 'customcss'">
<custom-css></custom-css>
</div>
<router-view></router-view>
</div>
<footer>
<p>Pogo licensed under the GPLv3</p>
</footer>
</div>
<script src="/assets/vue.js"></script>
<script src="https://unpkg.com/vue-router@2.7.0/dist/vue-router.js"></script>
<script src="/assets/app.js"></script>
</body>
</html>

View file

@ -1,47 +1,117 @@
Vue.component('episode-publish-form', {
template: '<form enctype="multipart/form-data" action="/admin/publish" method="post"><label for="title">Episode Title</label><input type="text" id="title" name="title"><label for="description">Episode Description</label><textarea name="description" id="description" cols="100" rows="20" style="resize: none;"></textarea><label for="file">Media File</label><input type="file" id="file" name="file"><label for="date">Publish Date</label><input type="date" id="date" name="date"><input type="submit" value="Publish"></form>'
})
Vue.component('custom-css', {
template: '<form action="/admin/css" method="post" enctype="multipart/form-data"><label for="css">Custom CSS</label><textarea name="css" id="css" cols="120" rows="20"></textarea><br /><input type="submit" value="Submit"></form>'
})
var app = new Vue({
el: '#app',
data: {
header: 'Pogo Admin',
current_page: "Page Title",
page: false,
}
})
window.onhashchange = setpagecontents
window.onload = setpagecontents
// I know I'm probably not using
// vue.js properly here but it's the
// best I can do right now
function setpagecontents(){
page = window.location.href.split('#')[1]
app.page = page
if (page == "publish") {
app.current_page = "Publish Episode"
}
else if (page == "customcss") {
app.current_page = "Edit Theme"
getcss()
}
else {
app.current_page = "404 Not found"
}
const episodepublishform = {
template: '<div><h3>Publish Episode</h3><form enctype="multipart/form-data" action="/admin/publish" method="post"><label for="title">Episode Title</label><input type="text" id="title" name="title"><label for="description">Episode Description</label><textarea name="description" id="description" cols="100" rows="20" style="resize: none;"></textarea><label for="file">Media File</label><input type="file" id="file" name="file"><label for="date">Publish Date</label><input type="date" id="date" name="date"><input type="submit" value="Publish"></form></div>'
}
function getcss(){
var xmlHttp = new XMLHttpRequest();
xmlHttp.onreadystatechange = function() {
const episodemanagement = {
template: '<div><table style="width:100%"><tr><th>Title</th><th>URL</th><th>Actions</th></tr><tr v-for="item in items"><td>{{ item.title }}</td><td>{{ item.url }}</td><td>Remove Edit</td></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
getEpisodes((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--) {
this.items.push({
title: t[i].title,
url: t[i].url
})
}
}
console.log(this.items)
})
}
}
}
const customcss = {
template: '<div><h3>Edit CSS</h3><form action="/admin/css" method="post" enctype="multipart/form-data"><label for="css">Custom CSS</label><textarea name="css" id="css" cols="120" rows="20">{{ css }}</textarea><br /><input type="submit" value="Submit"></form></div>',
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
getCss((err, css) => {
this.loading = false
if (err) {
this.error = err.toString()
} else {
this.css = css
}
})
}
}
}
const routes = [
{ path: '/publish', component: episodepublishform },
{ path: '/manage', component: episodemanagement },
{ path: '/theme', component: customcss }
]
const router = new VueRouter({
routes
})
const app = new Vue({
router,
data: {
header: 'Pogo Admin',
}
}).$mount('#app')
function getCss(callback) {
var xmlHttp = new XMLHttpRequest();
xmlHttp.onreadystatechange = function() {
if (xmlHttp.readyState == 4 && xmlHttp.status == 200)
document.getElementById("css").innerHTML=xmlHttp.responseText;
callback(null, xmlHttp.responseText)
}
xmlHttp.open("GET", "/admin/css", true);
xmlHttp.send(null);
}
function getEpisodes(callback) {
var xmlHttp = new XMLHttpRequest();
xmlHttp.onreadystatechange = function() {
if (xmlHttp.readyState == 4 && xmlHttp.status == 200)
callback(null, xmlHttp.responseText)
}
xmlHttp.open("GET", "/json", true);
xmlHttp.send(null);
}