Adds proper styling I don't have to be embarassed about

This commit is contained in:
A. Svensson 2017-08-22 21:24:19 +02:00
parent 160b773641
commit 51685c55d9
3 changed files with 75 additions and 23 deletions

View File

@ -19,22 +19,20 @@ func (a *App) pageIndex(w http.ResponseWriter, r *http.Request, vars handlerVars
break break
} }
} }
var hub ServerEntry
if index > -1 { if index > -1 {
hub = servers[index]
servers = append(servers[:index], servers[index+1:]...) servers = append(servers[:index], servers[index+1:]...)
} }
return a.templates["index"].Execute(w, map[string]interface{}{ return a.templates["index"].Execute(w, map[string]interface{}{
"Servers": servers, "Servers": servers,
"Hub": hub, "Hub": a.hub,
"TotalServers": len(servers),
}) })
} }
func (a *App) pageNews(w http.ResponseWriter, r *http.Request, vars handlerVars) error { func (a *App) pageNews(w http.ResponseWriter, r *http.Request, vars handlerVars) error {
return a.templates["news"].Execute(w, map[string]interface{}{ return a.templates["news"].Execute(w, map[string]interface{}{
"Reddit": a.news, "Reddit": a.news,
"Hub": a.hub,
}) })
} }
@ -55,6 +53,7 @@ func (a *App) pageServer(w http.ResponseWriter, r *http.Request, vars handlerVar
return a.templates["server"].Execute(w, map[string]interface{}{ return a.templates["server"].Execute(w, map[string]interface{}{
"Server": server, "Server": server,
"Hub": a.hub,
}) })
} }

View File

@ -36,6 +36,7 @@ type App struct {
store Storage store Storage
templates map[string]*template.Template templates map[string]*template.Template
news []*rss.Item news []*rss.Item
hub ServerEntry // TODO: probably needs to be protected with a lock
} }
func New(c Conf) (*App, error) { func New(c Conf) (*App, error) {
@ -174,7 +175,7 @@ func (a *App) makeHubEntry(t time.Time, servers []ServerEntry) ServerEntry {
totalPlayers += s.Players totalPlayers += s.Players
} }
return ServerEntry{ a.hub = ServerEntry{
ID: makeID(internalServerTitle), ID: makeID(internalServerTitle),
Title: internalServerTitle, Title: internalServerTitle,
SiteURL: "", SiteURL: "",
@ -182,4 +183,5 @@ func (a *App) makeHubEntry(t time.Time, servers []ServerEntry) ServerEntry {
Time: t, Time: t,
Players: totalPlayers, Players: totalPlayers,
} }
return a.hub
} }

View File

@ -28,6 +28,8 @@ func parseTemplate(src ...string) (*template.Template, error) {
return t, nil return t, nil
} }
// Using the awesome style from http://bettermotherfuckingwebsite.com/
const tmplBase string = `<!DOCTYPE html> const tmplBase string = `<!DOCTYPE html>
<html> <html>
<head> <head>
@ -36,24 +38,76 @@ const tmplBase string = `<!DOCTYPE html>
{{block "title" .}}NO TITLE{{end}} | ss13.se {{block "title" .}}NO TITLE{{end}} | ss13.se
</title> </title>
<style type="text/css"> <style type="text/css">
html, body, p, h1, h2, img, ul, li, table {
padding: 0px;
margin: 0px;
}
body {
margin: 0px auto;
max-width: 1024px;
font-size: 18px;
padding: 0 10px;
line-height: 1.6;
color: #444;
background-color: #fff;
}
h1, h2 {
text-align: center;
}
a, a:hover, a:visited {
color: #444;
text-decoration: underline;
}
img { img {
display: block; display: block;
margin: auto; margin: auto;
} }
header {
margin-bottom: 40px;
padding: 10px 20px;
color: #fff;
background-color: #444;
border-bottom-left-radius: 5px;
border-bottom-right-radius: 5px;
}
header a, header a:hover, header a:visited {
color: #fff;
text-decoration: none;
display: inline;
padding-right: 40px;
}
footer { footer {
margin-top: 40px;
padding: 10px;
text-align: center; text-align: center;
} }
.button a {
background-color: #444;
color: #fff;
border-radius: 5px;
padding: 5px 10px;
text-decoration: none;
}
.button a:hover {
background-color: #888;
}
.left { .left {
float: left; float: left;
} }
.right { .right {
float: right; float: right;
} }
.hide td, .hide a {
color: #bbb;
}
</style> </style>
</head> </head>
<body> <body>
<header> <header>
<h2><a href="/">SS13.se</a></h2> <a href="/">ss13.se</a>
<a href="/server/{{.Hub.ID}}">Global stats</a>
<a href="/news">Latest news</a>
<p class="right">Last updated: {{.Hub.LastUpdated}}</p>
</header> </header>
<section id="body"> <section id="body">
@ -71,7 +125,7 @@ const tmplBase string = `<!DOCTYPE html>
Copyright © 2017 A. Svensson Copyright © 2017 A. Svensson
<span class="right"> <span class="right">
Using raw data from Raw data from
<a href="http://www.byond.com/games/exadv1/spacestation13">Byond</a> <a href="http://www.byond.com/games/exadv1/spacestation13">Byond</a>
</span> </span>
</p> </p>
@ -82,12 +136,7 @@ const tmplBase string = `<!DOCTYPE html>
var tmplList = map[string]string{ var tmplList = map[string]string{
"index": `{{define "title"}}Index{{end}} "index": `{{define "title"}}Index{{end}}
{{define "body"}} {{define "body"}}
<p>Last updated: {{.Hub.LastUpdated}}</p> <h1>Servers</h1>
<p>Current # of servers: {{.TotalServers}}</p>
<p>Current # of players: {{.Hub.Players}}</p>
<a href="/server/{{.Hub.ID}}">Global stats</a><br />
<a href="/news">Latest news</a><br />
<br />
<table> <table>
<thead><tr> <thead><tr>
<td>Players</td> <td>Players</td>
@ -96,7 +145,7 @@ var tmplList = map[string]string{
<tbody> <tbody>
{{range .Servers}} {{range .Servers}}
<tr> <tr {{if lt .Players 1}}class="hide"{{end}}>
<td>{{.Players}}</td> <td>{{.Players}}</td>
<td><a href="/server/{{.ID}}">{{.Title}}</a></td> <td><a href="/server/{{.ID}}">{{.Title}}</a></td>
</tr> </tr>
@ -121,20 +170,22 @@ var tmplList = map[string]string{
{{define "body"}} {{define "body"}}
<h1>{{.Server.Title}}</h1> <h1>{{.Server.Title}}</h1>
<p>Last updated: {{.Server.LastUpdated}}</p>
<p>Current players: {{.Server.Players}}</p>
{{if .Server.SiteURL}} {{if .Server.SiteURL}}
<a href="{{.Server.SiteURL}}">Web site</a><br /> <span class="button"><a href="{{.Server.SiteURL}}">Website</a></span>
{{end}} {{end}}
{{if .Server.ByondURL}} {{if .Server.ByondURL}}
<a href="{{.Server.ByondURL}}">Join game</a><br /> <span class="button"><a href="{{.Server.ByondURL}}">Join game</a></span>
{{end}} {{end}}
<br /> <p>Current players: {{.Server.Players}}</p>
<img src="/server/{{.Server.ID}}/daily" alt="Daily history"><br />
<img src="/server/{{.Server.ID}}/weekly" alt="Weekly history"><br /> <h2>Daily History</h2>
<img src="/server/{{.Server.ID}}/average" alt="Average per day"><br /> <img src="/server/{{.Server.ID}}/daily" alt="Unable to show a pretty graph">
<h2>Weekly History</h2>
<img src="/server/{{.Server.ID}}/weekly" alt="Unable to show a pretty graph">
<h2>Average per day</h2>
<img src="/server/{{.Server.ID}}/average" alt="Unable to show a pretty graph">
{{end}} {{end}}
`, `,
} }