mirror of https://github.com/velour/catbase.git
meme: add web interface
This commit is contained in:
parent
3ad15c5f3e
commit
8d775e95f2
|
@ -14,6 +14,7 @@ import (
|
|||
"github.com/rs/zerolog/log"
|
||||
|
||||
"github.com/jmoiron/sqlx"
|
||||
|
||||
"github.com/velour/catbase/bot"
|
||||
"github.com/velour/catbase/bot/msg"
|
||||
"github.com/velour/catbase/config"
|
||||
|
@ -47,6 +48,7 @@ var forbiddenKeys = map[string]bool{
|
|||
"twitch.clientid": true,
|
||||
"untappd.token": true,
|
||||
"slack.token": true,
|
||||
"meme.memes": true,
|
||||
}
|
||||
|
||||
// Message responds to the bot hook on recieving messages.
|
||||
|
|
|
@ -2,12 +2,15 @@ package meme
|
|||
|
||||
import (
|
||||
"bytes"
|
||||
"encoding/json"
|
||||
"fmt"
|
||||
"html/template"
|
||||
"image"
|
||||
"image/png"
|
||||
"net/http"
|
||||
"net/url"
|
||||
"path"
|
||||
"sort"
|
||||
"strings"
|
||||
"time"
|
||||
|
||||
|
@ -67,18 +70,110 @@ func (p *MemePlugin) message(c bot.Connector, kind bot.Kind, message msg.Message
|
|||
}
|
||||
|
||||
func (p *MemePlugin) help(c bot.Connector, kind bot.Kind, message msg.Message, args ...interface{}) bool {
|
||||
webRoot := p.c.Get("BaseURL", "https://catbase.velour.ninja")
|
||||
formats := p.c.GetMap("meme.memes", defaultFormats)
|
||||
msg := "Use `/meme [format] [text]` to create a meme.\nI know the following formats:"
|
||||
msg += "\n`[format]` can be a URL"
|
||||
for k := range formats {
|
||||
msg += "\n" + k
|
||||
}
|
||||
msg += fmt.Sprintf("\nHead over to %s/meme to add new meme formats", webRoot)
|
||||
p.bot.Send(c, bot.Message, message.Channel, msg)
|
||||
return true
|
||||
}
|
||||
|
||||
func (p *MemePlugin) registerWeb(c bot.Connector) {
|
||||
http.HandleFunc("/slash/meme", func(w http.ResponseWriter, r *http.Request) {
|
||||
http.HandleFunc("/slash/meme", p.slashMeme(c))
|
||||
http.HandleFunc("/meme/img/", p.img)
|
||||
http.HandleFunc("/meme/all", p.all)
|
||||
http.HandleFunc("/meme/add", p.addMeme)
|
||||
http.HandleFunc("/meme", p.webRoot)
|
||||
p.bot.RegisterWeb("/meme", "Memes")
|
||||
}
|
||||
|
||||
type webResp struct {
|
||||
Name string `json:"name"`
|
||||
URL string `json:"url"`
|
||||
}
|
||||
|
||||
type webResps []webResp
|
||||
|
||||
func (w webResps) Len() int { return len(w) }
|
||||
func (w webResps) Swap(i, j int) { w[i], w[j] = w[j], w[i] }
|
||||
|
||||
type ByName struct{ webResps }
|
||||
|
||||
func (s ByName) Less(i, j int) bool { return s.webResps[i].Name < s.webResps[j].Name }
|
||||
|
||||
func (p *MemePlugin) all(w http.ResponseWriter, r *http.Request) {
|
||||
memes := p.c.GetMap("meme.memes", defaultFormats)
|
||||
values := webResps{}
|
||||
for n, u := range memes {
|
||||
|
||||
realURL, err := url.Parse(u)
|
||||
if err != nil || realURL.Scheme == "" {
|
||||
realURL, _ = url.Parse("https://imgflip.com/s/meme/" + u)
|
||||
}
|
||||
sort.Sort(ByName{values})
|
||||
values = append(values, webResp{n, realURL.String()})
|
||||
}
|
||||
|
||||
out, err := json.Marshal(values)
|
||||
if err != nil {
|
||||
w.WriteHeader(500)
|
||||
log.Error().Err(err).Msgf("could not serve all memes route")
|
||||
return
|
||||
}
|
||||
w.Write(out)
|
||||
}
|
||||
|
||||
func (p *MemePlugin) addMeme(w http.ResponseWriter, r *http.Request) {
|
||||
if r.Method != http.MethodPost {
|
||||
w.WriteHeader(405)
|
||||
fmt.Fprintf(w, "Incorrect HTTP method")
|
||||
return
|
||||
}
|
||||
checkError := func(err error) bool {
|
||||
if err != nil {
|
||||
log.Error().Err(err).Msgf("addMeme failed")
|
||||
w.WriteHeader(500)
|
||||
e, _ := json.Marshal(err)
|
||||
w.Write(e)
|
||||
return true
|
||||
}
|
||||
return false
|
||||
}
|
||||
decoder := json.NewDecoder(r.Body)
|
||||
values := webResp{}
|
||||
err := decoder.Decode(&values)
|
||||
if checkError(err) {
|
||||
return
|
||||
}
|
||||
formats := p.c.GetMap("meme.memes", defaultFormats)
|
||||
formats[values.Name] = values.URL
|
||||
err = p.c.SetMap("meme.memes", formats)
|
||||
checkError(err)
|
||||
}
|
||||
|
||||
func (p *MemePlugin) webRoot(w http.ResponseWriter, r *http.Request) {
|
||||
var tpl = template.Must(template.New("factoidIndex").Parse(string(memeIndex)))
|
||||
tpl.Execute(w, struct{ Nav []bot.EndPoint }{p.bot.GetWebNavigation()})
|
||||
}
|
||||
|
||||
func (p *MemePlugin) img(w http.ResponseWriter, r *http.Request) {
|
||||
_, file := path.Split(r.URL.Path)
|
||||
id := file
|
||||
if img, ok := p.images[id]; ok {
|
||||
w.Write(img.repr)
|
||||
} else {
|
||||
w.WriteHeader(404)
|
||||
w.Write([]byte("not found"))
|
||||
}
|
||||
p.images.cleanup()
|
||||
}
|
||||
|
||||
func (p *MemePlugin) slashMeme(c bot.Connector) http.HandlerFunc {
|
||||
return func(w http.ResponseWriter, r *http.Request) {
|
||||
r.ParseForm()
|
||||
log.Debug().Msgf("Meme:\n%+v", r.PostForm.Get("text"))
|
||||
channel := r.PostForm.Get("channel_id")
|
||||
|
@ -137,19 +232,7 @@ func (p *MemePlugin) registerWeb(c bot.Connector) {
|
|||
|
||||
p.bot.Receive(c, bot.Message, m)
|
||||
}()
|
||||
})
|
||||
|
||||
http.HandleFunc("/meme/img/", func(w http.ResponseWriter, r *http.Request) {
|
||||
_, file := path.Split(r.URL.Path)
|
||||
id := file
|
||||
if img, ok := p.images[id]; ok {
|
||||
w.Write(img.repr)
|
||||
} else {
|
||||
w.WriteHeader(404)
|
||||
w.Write([]byte("not found"))
|
||||
}
|
||||
p.images.cleanup()
|
||||
})
|
||||
}
|
||||
}
|
||||
|
||||
func DownloadTemplate(u *url.URL) (image.Image, error) {
|
||||
|
|
|
@ -0,0 +1,120 @@
|
|||
package meme
|
||||
|
||||
var memeIndex = `
|
||||
<!DOCTYPE html>
|
||||
<html lang="en">
|
||||
<head>
|
||||
<!-- Load required Bootstrap and BootstrapVue CSS -->
|
||||
<link type="text/css" rel="stylesheet" href="//unpkg.com/bootstrap/dist/css/bootstrap.min.css" />
|
||||
<link type="text/css" rel="stylesheet" href="//unpkg.com/bootstrap-vue@latest/dist/bootstrap-vue.min.css" />
|
||||
|
||||
<!-- Load polyfills to support older browsers -->
|
||||
<script src="//polyfill.io/v3/polyfill.min.js?features=es2015%2CMutationObserver"></script>
|
||||
|
||||
<!-- Load Vue followed by BootstrapVue -->
|
||||
<script src="//unpkg.com/vue@latest/dist/vue.min.js"></script>
|
||||
<script src="//unpkg.com/bootstrap-vue@latest/dist/bootstrap-vue.min.js"></script>
|
||||
<script src="https://unpkg.com/vue-router"></script>
|
||||
<script src="https://unpkg.com/axios/dist/axios.min.js"></script>
|
||||
<meta charset="UTF-8">
|
||||
<title>Memes</title>
|
||||
</head>
|
||||
<body>
|
||||
|
||||
<div id="app">
|
||||
<b-navbar>
|
||||
<b-navbar-brand>Memes</b-navbar-brand>
|
||||
<b-navbar-nav>
|
||||
<b-nav-item v-for="item in nav" :href="item.URL" :active="item.Name === 'Meme'">{{ "{{ item.Name }}" }}</b-nav-item>
|
||||
</b-navbar-nav>
|
||||
</b-navbar>
|
||||
<b-alert
|
||||
dismissable
|
||||
variant="error"
|
||||
v-if="err"
|
||||
@dismissed="err = ''">
|
||||
{{ "{{ err }}" }}
|
||||
</b-alert>
|
||||
<b-form @submit="addMeme">
|
||||
<b-container>
|
||||
<b-row>
|
||||
<b-col cols="5">
|
||||
<b-input v-model="name"></b-input>
|
||||
</b-col>
|
||||
<b-col cols="5">
|
||||
<b-input v-model="url"></b-input>
|
||||
</b-col>
|
||||
<b-col cols="2">
|
||||
<b-button type="submit">Add Meme</b-button>
|
||||
</b-col>
|
||||
</b-row>
|
||||
<b-row>
|
||||
<b-col>
|
||||
<b-table
|
||||
fixed
|
||||
:items="results"
|
||||
:fields="fields">
|
||||
<template v-slot:cell(image)="data">
|
||||
<b-img :src="data.item.url" rounded block fluid />
|
||||
</template>
|
||||
</b-table>
|
||||
</b-col>
|
||||
</b-row>
|
||||
</b-container>
|
||||
</b-form>
|
||||
</div>
|
||||
|
||||
<script>
|
||||
var router = new VueRouter({
|
||||
mode: 'history',
|
||||
routes: []
|
||||
});
|
||||
var app = new Vue({
|
||||
el: '#app',
|
||||
router,
|
||||
data: {
|
||||
err: '',
|
||||
nav: {{ .Nav }},
|
||||
name: "",
|
||||
url: "",
|
||||
results: [],
|
||||
fields: [
|
||||
{ key: 'name', sortable: true },
|
||||
{ key: 'url', sortable: true },
|
||||
{ key: 'image' }
|
||||
]
|
||||
},
|
||||
mounted() {
|
||||
this.refresh();
|
||||
},
|
||||
computed: {
|
||||
},
|
||||
methods: {
|
||||
refresh: function() {
|
||||
axios.get('/meme/all')
|
||||
.catch(err => (this.err = err))
|
||||
.then(resp => {
|
||||
this.results = resp.data
|
||||
})
|
||||
},
|
||||
addMeme: function(evt) {
|
||||
if (evt) {
|
||||
evt.preventDefault();
|
||||
evt.stopPropagation()
|
||||
}
|
||||
if (this.name && this.url)
|
||||
axios.post('/meme/add', {Name: this.name, URL: this.url})
|
||||
.then(resp => {
|
||||
this.results = resp.data;
|
||||
this.name = "";
|
||||
this.url = "";
|
||||
this.refresh();
|
||||
})
|
||||
.catch(err => (this.err = err));
|
||||
}
|
||||
}
|
||||
})
|
||||
</script>
|
||||
</body>
|
||||
</html>
|
||||
`
|
Loading…
Reference in New Issue