Display tx summary in explorer

server/public.go

@@ -89,11 +89,19 @@ func NewPublicServer(binding string, certFiles string, db *db.RocksDB, chain bch
 	// default handler
 	serveMux.HandleFunc(path, s.index)
 
-	s.txTpl = template.Must(template.New("tx").ParseFiles("./static/templates/tx.html", "./static/templates/base.html"))
+	templateFuncMap := template.FuncMap{
+		"formatUnixTime": formatUnixTime,
+	}
+
+	s.txTpl = template.Must(template.New("tx").Funcs(templateFuncMap).ParseFiles("./static/templates/tx.html", "./static/templates/txdetail.html", "./static/templates/base.html"))
 
 	return s, nil
 }
 
+func formatUnixTime(ut int64) string {
+	return time.Unix(ut, 0).Format(time.RFC1123)
+}
+
 // Run starts the server
 func (s *PublicServer) Run() error {
 	if s.certFiles == "" {
@@ -170,9 +178,13 @@ func (s *PublicServer) explorerTx(w http.ResponseWriter, r *http.Request) {
 		}
 	}
 	w.Header().Set("Content-Type", "text/html; charset=utf-8")
+
 	// temporarily reread the template on each request
 	// to reflect changes during development
-	txTpl := template.Must(template.New("tx").ParseFiles("./static/templates/tx.html", "./static/templates/base.html"))
+	templateFuncMap := template.FuncMap{
+		"formatUnixTime": formatUnixTime,
+	}
+	txTpl := template.Must(template.New("tx").Funcs(templateFuncMap).ParseFiles("./static/templates/tx.html", "./static/templates/txdetail.html", "./static/templates/base.html"))
 
 	data := struct {
 		CoinName string

static/css/main.css

@@ -3,7 +3,6 @@ html, body {
 }
 
 body {
-    display: inline-block;
     width: 100%;
     min-width: 727px;
     min-height: 100%;
@@ -64,12 +63,16 @@ body {
     min-height: 100%;
     height: auto;
     padding: 75px 0;
-    margin: 0 auto -51px;
+    margin: 0 auto -53px;
 }
 
 #footer {
     background-color: #212121;
     color: #fff;
-    height: 51px;
+    height: 53px;
     overflow: hidden;
+}
+
+.value-group {
+    margin: 20px 0;
 }

static/templates/base.html

@@ -50,7 +50,7 @@
     <main id="wrap">
         <div class="container">
             {{template "specific" .Specific}}
-        </div>
+         </div>
     </main>
     <footer id="footer" class="footer">
         <div class="container">

static/templates/tx.html

@@ -1,3 +1,27 @@
-{{define "tx"}}
-{{.Txid}}
-{{end}}
+{{define "specific"}}
+<h1>Transaction</h1>
+<div class="alert alert-secondary">
+    <strong>
+        <span>Transaction</span>
+    </strong>
+    <span class="text-muted">{{.Txid}}</span>
+</div>
+<h2>Summary</h2>
+<div class="value-group">
+    <div class="row">
+        <div class="col-md-4">Mined Time</div>
+        <div class="col-md-8 text-muted">{{formatUnixTime .Blocktime}}</div>
+    </div>
+    <div class="row">
+        <div class="col-md-4">In Block</div>
+        <div class="col-md-8 text-muted">{{.Blockhash}}</div>
+    </div>
+    <div class="row">
+            <div class="col-md-4">In Block Height</div>
+            <div class="col-md-8 text-muted">{{.Blockheight}}</div>
+        </div>
+    </div>
+<h2>Details</h2>
+<div class="value-group">
+        {{template "txdetail" .}} {{end}}
+</div>

static/templates/txdetail.html

@@ -0,0 +1,3 @@
+{{define "txdetail"}}
+{{.Txid}}
+{{end}}