f/kartograph-maps
1
0
Fork 0
Code Issues Pull requests Projects Releases Wiki Activity

UI touches and javascript stuff

Browse source
This commit is contained in:
Aaron Fischer 2021-03-23 15:18:23 +01:00
parent 1a5fc52bc2
commit 8f331b3ff1
7 changed files with 77 additions and 20 deletions
Show stats Download patch file Download diff file Expand all files Collapse all files

2
pkg/generator/world.go
View file

@ -102,6 +102,8 @@ func New(size int, numWastelands int, numMountains int, numRuins int, seed strin
Seed: seed, Seed: seed,
} }
// TODO: Return error wenn kein Platz mehr da ist
// All empty for start // All empty for start
for i := 0; i < w.Size*w.Size; i++ { for i := 0; i < w.Size*w.Size; i++ {
w.World = append(w.World, Tile{Territory: EmptyTerritory}) w.World = append(w.World, Tile{Territory: EmptyTerritory})

31
pkg/web/service.go
View file

@ -21,6 +21,7 @@ func Start(address string, port int) {
http.Handle("/static/", http.FileServer(http.FS(staticFiles))) http.Handle("/static/", http.FileServer(http.FS(staticFiles)))
http.HandleFunc("/", indexHandler) http.HandleFunc("/", indexHandler)
http.HandleFunc("/map.svg", mapHandler) http.HandleFunc("/map.svg", mapHandler)
http.HandleFunc("/print", printHandler)
addr := address + ":" + strconv.Itoa(port) addr := address + ":" + strconv.Itoa(port)
@ -32,7 +33,7 @@ func Start(address string, port int) {
} }
} }
func mapHandler(w http.ResponseWriter, req *http.Request) { func worldFromRequest(req *http.Request) generator.World {
size, err := strconv.Atoi(req.URL.Query().Get("s")) size, err := strconv.Atoi(req.URL.Query().Get("s"))
if err != nil { if err != nil {
size = 11 size = 11
@ -54,21 +55,35 @@ func mapHandler(w http.ResponseWriter, req *http.Request) {
ruins = 6 ruins = 6
} }
world := generator.New(size, wastelands, mountains, ruins, seed) return generator.New(size, wastelands, mountains, ruins, seed)
}
func mapHandler(w http.ResponseWriter, req *http.Request) {
world := worldFromRequest(req)
log.Printf("GET /map.svg?%v (%v)", req.URL.Query().Encode(), req.RemoteAddr) log.Printf("GET /map.svg?%v (%v)", req.URL.Query().Encode(), req.RemoteAddr)
w.Header().Set("Content-Type", "image/svg+xml") w.Header().Set("Content-Type", "image/svg+xml")
w.Header().Set("Content-Length", strconv.Itoa(len(world.SVG()))) w.Header().Set("Content-Length", strconv.Itoa(len(world.SVG())))
io.WriteString(w, world.SVG()) io.WriteString(w, world.SVG())
} }
func indexHandler(w http.ResponseWriter, req *http.Request) { func printHandler(w http.ResponseWriter, req *http.Request) {
seed := generator.RandomSeed() world := worldFromRequest(req)
world := generator.New(11, 7, 5, 6, seed) log.Printf("GET /print?%v (%v)", req.URL.Query().Encode(), req.RemoteAddr)
tpl, err := template.ParseFS(templateFiles, "templates/print.tpl.html")
if err != nil {
log.Fatal(err)
}
tpl.Execute(w, world)
}
func indexHandler(w http.ResponseWriter, req *http.Request) {
seed := generator.RandomSeed()
world := generator.New(11, 7, 5, 6, seed)
log.Printf("GET / (%v) Seed: %v", req.RemoteAddr, seed)
tpl, err := template.ParseFS(templateFiles, "templates/index.tpl.html")
log.Printf("GET / (%v) Seed: %v", req.RemoteAddr, seed)
tpl, err := template.ParseFS(templateFiles, "templates/index.tpl.html")
if err != nil { if err != nil {
log.Fatal(err) log.Fatal(err)
} }

8
pkg/web/static/generator.js
View file

@ -16,6 +16,14 @@ document.addEventListener('DOMContentLoaded', function() {
document.querySelector('#map-link').setAttribute('href', newMapUrl); document.querySelector('#map-link').setAttribute('href', newMapUrl);
}; };
let actionButtons = document.querySelectorAll('button[class="action"]');
Array.prototype.forEach.call(actionButtons, function(action, i) {
action.addEventListener('click', function(e) {
console.log("adsf");
document.location.href = e.target.getAttribute('data-target');
});
});
let buttons = document.querySelectorAll('input[type="button"]') let buttons = document.querySelectorAll('input[type="button"]')
Array.prototype.forEach.call(buttons, function(button, i) { Array.prototype.forEach.call(buttons, function(button, i) {
button.addEventListener('click', function(e) { button.addEventListener('click', function(e) {

9
pkg/web/static/print.css Normal file
View file

@ -0,0 +1,9 @@
img {
margin: 10px;
width: 420px;
}
p {
font-family: Courier new;
font-size: 18px;
}

8
pkg/web/static/styles.css
View file

@ -31,6 +31,14 @@ input[type="text"] {
input[name="seed"] { input[name="seed"] {
width: 250px; width: 250px;
} }
input[name="refresh"] {
margin-right: 8px;
float: left;
}
a.action {
display: inline-block;
margin: 5px 8px;
}
fieldset { fieldset {
width: 370px; width: 370px;

24
pkg/web/templates/index.tpl.html
View file

@ -3,23 +3,20 @@
<head> <head>
<meta charset="utf-8"> <meta charset="utf-8">
<meta http-equiv="x-ua-compatible" content="ie=edge"> <meta http-equiv="x-ua-compatible" content="ie=edge">
<title>Map Generator für "Der Kartograph"</title> <title>Der Kartograph -- Map Generator</title>
<meta name="description" content="">
<meta name="viewport" content="width=device-width, initial-scale=1"> <meta name="viewport" content="width=device-width, initial-scale=1">
<link href="/static/styles.css" rel="stylesheet" type="text/css" media="all"> <link href="/static/styles.css" rel="stylesheet" type="text/css" media="all">
<script src="/static/generator.js"></script> <script src="/static/generator.js"></script>
</head> </head>
<body> <body>
<h1>Map Generator für "Der Kartograph"</h1> <h1>Der Kartograph — Map Generator</h1>
<a id="map-link" href="/map.svg?seed={{ .Seed }}&s={{ .Size }}&w={{ .Wastelands }}&r={{ .Ruins }}&m={{ .Mountains }}"><img src="/map.svg?seed={{ .Seed }}&s={{ .Size }}&w={{ .Wastelands }}&r={{ .Ruins }}&m={{ .Mountains }}" class="map"></a> <a id="map-link" href="/map.svg?seed={{ .Seed }}&s={{ .Size }}&w={{ .Wastelands }}&r={{ .Ruins }}&m={{ .Mountains }}"><img src="/map.svg?seed={{ .Seed }}&s={{ .Size }}&w={{ .Wastelands }}&r={{ .Ruins }}&m={{ .Mountains }}" class="map"></a>
<p><img src="/static/images/logo.jpg"> <p><img src="/static/images/logo.jpg">
Wem der beigelegte Block zu eintönig wird oder schon leergespielt hat, kann sich Wem der beigelegte Spielblock des Spiels <a href="https://pegasusshop.de/sortiment/spiele/kennerspiele/9791/der-kartograph-nominiert-kennerspiel-des-jahres-2020">Der Kartograph</a>
entweder die Mini-Erweiterung kaufen, in dem ein weiterer Block enthalten ist, des <a href="https://pegasus.de/">PEGASUS SPIELE Verlags</a> zu eintönig wird oder ihn schon leergespielt hat,
oder aber diesen Generator nutzen, um sich zufällige Maps generieren zu lassen. hat hier die Möglichkeit, neue Karten zu generieren. Die Standardwerte
Die generierten Karten entsprechen den erweiterten Regeln, können aber für etwas sind der <a href="https://pegasusshop.de/media/pdf/e4/06/e0/Kartograph_Minivariante_Tabula_Rasa.pdf">Minivariante
mehr Spaß angepasst werden.</p> "Tabula Rasa"</a> entnommen.
{{ with . }}
<form> <form>
<fieldset> <fieldset>
<legend>Seed</legend> <legend>Seed</legend>
@ -50,8 +47,11 @@
</fieldset> </fieldset>
<input type="button" name="refresh" value="Neu generieren"> <input type="button" name="refresh" value="Neu generieren">
<input type="button" name="print" value="Drucken">
</form> </form>
{{ end }}
<button class="action" data-target="/print?seed={{ .Seed }}&s={{ .Size }}&w={{ .Wastelands }}&r={{ .Ruins }}&m={{ .Mountains }}">Drucken</button>
<button class="action" data-target="/map.svg?seed={{ .Seed }}&s={{ .Size }}&w={{ .Wastelands }}&r={{ .Ruins }}&m={{ .Mountains }}">Direktlink</button>
<p>2011 <a href="https://aaron-fischer.net/">Aaron Fischer</a></p>
</body> </body>
</html> </html>

15
pkg/web/templates/print.tpl.html Normal file
View file

@ -0,0 +1,15 @@
<!doctype html>
<html class="no-js" lang="">
<head>
<meta charset="utf-8">
<meta http-equiv="x-ua-compatible" content="ie=edge">
<title>Der Kartograph -- Map Generator</title>
<meta name="viewport" content="width=device-width, initial-scale=1">
<link href="/static/print.css" rel="stylesheet" type="text/css" media="all">
</head>
<body onload="window.print();">
<p>{{ .Seed }}</p>
<img src="/map.svg?seed={{ .Seed }}&s={{ .Size }}&w={{ .Wastelands }}&r={{ .Ruins }}&m={{ .Mountains }}" class="map">
<img src="/map.svg?seed={{ .Seed }}&s={{ .Size }}&w={{ .Wastelands }}&r={{ .Ruins }}&m={{ .Mountains }}" class="map">
</body>
</html>