Caricamento ajax della tabella
This commit is contained in:
parent
5ec47fba06
commit
c19a47c592
3 changed files with 61 additions and 39 deletions
27
html.go
27
html.go
|
@ -5,22 +5,27 @@ import (
|
||||||
"net/http"
|
"net/http"
|
||||||
)
|
)
|
||||||
|
|
||||||
|
var varmap map[string]interface{}
|
||||||
|
|
||||||
// ServiHTML fa partire il server html
|
// ServiHTML fa partire il server html
|
||||||
func ServiHTML() {
|
func ServiHTML() {
|
||||||
http.HandleFunc("/", handlerRoot)
|
varmap = map[string]interface{}{
|
||||||
http.ListenAndServe(":3000", nil)
|
|
||||||
}
|
|
||||||
|
|
||||||
func handlerRoot(w http.ResponseWriter, r *http.Request) {
|
|
||||||
templ, err := template.ParseFiles("template/Interfaccia.html")
|
|
||||||
if err != nil {
|
|
||||||
panic(err.Error())
|
|
||||||
}
|
|
||||||
varmap := map[string]interface{}{
|
|
||||||
"matrice": Matrix,
|
"matrice": Matrix,
|
||||||
"tempoAggiorna": Clock,
|
"tempoAggiorna": Clock,
|
||||||
"larghezza": Larghezza,
|
"larghezza": Larghezza,
|
||||||
"altezza": Altezza,
|
"altezza": Altezza,
|
||||||
}
|
}
|
||||||
templ.Execute(w, varmap)
|
http.HandleFunc("/tabella", handlerRoot("template/tabella.html"))
|
||||||
|
http.HandleFunc("/", handlerRoot("template/Interfaccia.html"))
|
||||||
|
http.ListenAndServe(":3000", nil)
|
||||||
|
}
|
||||||
|
|
||||||
|
func handlerRoot(path string) func(w http.ResponseWriter, r *http.Request) {
|
||||||
|
return func(w http.ResponseWriter, r *http.Request) {
|
||||||
|
templ, err := template.ParseFiles(path)
|
||||||
|
if err != nil {
|
||||||
|
panic(err.Error())
|
||||||
|
}
|
||||||
|
templ.Execute(w, varmap)
|
||||||
|
}
|
||||||
}
|
}
|
||||||
|
|
|
@ -1,7 +1,6 @@
|
||||||
<html>
|
<html>
|
||||||
<head>
|
<head>
|
||||||
<title>GoBug</title>
|
<title>GoBug</title>
|
||||||
<!--meta http-equiv="refresh" content="{{ .tempoAggiorna }}"-->
|
|
||||||
<meta charset="UTF-8">
|
<meta charset="UTF-8">
|
||||||
<link href="https://fonts.googleapis.com/css?family=Hammersmith+One" rel="stylesheet">
|
<link href="https://fonts.googleapis.com/css?family=Hammersmith+One" rel="stylesheet">
|
||||||
<style type="text/css">
|
<style type="text/css">
|
||||||
|
@ -75,38 +74,39 @@
|
||||||
width: calc((100vw / {{.larghezza}}) - 3px);
|
width: calc((100vw / {{.larghezza}}) - 3px);
|
||||||
}
|
}
|
||||||
}
|
}
|
||||||
|
div.colorsample {
|
||||||
|
width: 1em;
|
||||||
|
height: 1em;
|
||||||
|
display: inline-block;
|
||||||
|
}
|
||||||
</style>
|
</style>
|
||||||
|
<script>
|
||||||
|
reload = function() {
|
||||||
|
var xhr = new XMLHttpRequest()
|
||||||
|
xhr.open('GET', '/tabella')
|
||||||
|
xhr.send(null)
|
||||||
|
xhr.onreadystatechange = function () {
|
||||||
|
var DONE = 4, OK = 200
|
||||||
|
if (xhr.readyState === DONE) {
|
||||||
|
if (xhr.status === OK)
|
||||||
|
document.getElementById("tb").innerHTML = xhr.responseText
|
||||||
|
else console.log('Error: ' + xhr.status)
|
||||||
|
}
|
||||||
|
}
|
||||||
|
}
|
||||||
|
window.setInterval(reload, 1000 * {{ .tempoAggiorna }})
|
||||||
|
reload()
|
||||||
|
</script>
|
||||||
</head>
|
</head>
|
||||||
<body>
|
<body>
|
||||||
<h1>Go bug</h1>
|
<h1>Go bug</h1>
|
||||||
<main class="clearfix">
|
<main class="clearfix">
|
||||||
<div class="tabella">
|
<div id="tb" class="tabella"></div>
|
||||||
<table>
|
|
||||||
{{range $riga := .matrice}}
|
|
||||||
<tr>
|
|
||||||
{{range $cella := $riga}}
|
|
||||||
<td {{ if not $cella }}
|
|
||||||
class="vuoto"> </td>
|
|
||||||
{{ else }}
|
|
||||||
{{ if $cella.IsFood }}
|
|
||||||
class="cibo"
|
|
||||||
{{ else }}
|
|
||||||
class="razza1"
|
|
||||||
{{ end }}>{{ $cella.Health }}</td>
|
|
||||||
{{ end }}
|
|
||||||
{{ end }}
|
|
||||||
</tr>
|
|
||||||
{{ end }}
|
|
||||||
</table>
|
|
||||||
</div>
|
|
||||||
<div class="legenda">
|
<div class="legenda">
|
||||||
<h1>legenda</h1>
|
<h1>legenda</h1>
|
||||||
<div style="float:left; display:block; width:30%; height:19%; background-color:#FFFF33;"></div>
|
<div class="colorsample" style="background-color:#FFFF33"></div> Cibo<br>
|
||||||
<div style="float:right; display:block; width:65%; height:20%; ">Cibo</div>
|
<div class="colorsample" style="background-color:#00ff00"></div> Razza 1<br>
|
||||||
<div style="float:left; display:block; width:30%; height:20%; background-color:#00ff00;"></div>
|
<div class="colorsample" style="background-color:#F00"></div> Razza 2
|
||||||
<div style="float:right; display:block; width:65%; height:20%; ">Razza1</div>
|
|
||||||
<div style="float:left; display:block; width:30%; height:20%; background-color:#F00;"></div>
|
|
||||||
<div style="float:right; display:block; width:65%; height:19%; ">Razza2</div>
|
|
||||||
</div>
|
</div>
|
||||||
</main>
|
</main>
|
||||||
</body>
|
</body>
|
||||||
|
|
17
template/tabella.html
Normal file
17
template/tabella.html
Normal file
|
@ -0,0 +1,17 @@
|
||||||
|
<table>
|
||||||
|
{{range $riga := .matrice}}
|
||||||
|
<tr>
|
||||||
|
{{range $cella := $riga}}
|
||||||
|
<td {{ if not $cella }}
|
||||||
|
class="vuoto"> </td>
|
||||||
|
{{ else }}
|
||||||
|
{{ if $cella.IsFood }}
|
||||||
|
class="cibo"
|
||||||
|
{{ else }}
|
||||||
|
class="razza1"
|
||||||
|
{{ end }}>{{ $cella.Health }}</td>
|
||||||
|
{{ end }}
|
||||||
|
{{ end }}
|
||||||
|
</tr>
|
||||||
|
{{ end }}
|
||||||
|
</table>
|
Reference in a new issue