Add database and logout tabs to admin page.

Buttons to logout and download DB backup are now moved into new tabs. Also the database size is displayed in the database tab.

database/ticket.go

@@ -271,6 +271,17 @@ func (vdb *VspDatabase) GetTicketByHash(ticketHash string) (Ticket, bool, error)
 	return ticket, found, err
 }
 
+// Size returns the current size of the database in bytes. Note that this may
+// not exactly match the size of the database file stored on disk.
+func (vdb *VspDatabase) Size() (uint64, error) {
+	var size uint64
+	err := vdb.db.View(func(tx *bolt.Tx) error {
+		size = uint64(tx.Size())
+		return nil
+	})
+	return size, err
+}
+
 // CountTickets returns the total number of voted, revoked, and currently voting
 // tickets. This func iterates over every ticket so should be used sparingly.
 func (vdb *VspDatabase) CountTickets() (int64, int64, int64, error) {

webapi/cache.go

@@ -13,6 +13,7 @@ import (
 	"github.com/decred/dcrd/chaincfg/v3"
 	"github.com/decred/vspd/database"
 	"github.com/decred/vspd/rpc"
+	"github.com/dustin/go-humanize"
 )
 
 // apiCache is used to cache values which are commonly used by the API, so
@@ -20,6 +21,7 @@ import (
 type apiCache struct {
 	UpdateTime        string
 	PubKey            string
+	DatabaseSize      string
 	Voting            int64
 	Voted             int64
 	Revoked           int64
@@ -54,6 +56,11 @@ func initCache() {
 func updateCache(ctx context.Context, db *database.VspDatabase,
 	dcrd rpc.DcrdConnect, netParams *chaincfg.Params) error {
 
+	dbSize, err := db.Size()
+	if err != nil {
+		return err
+	}
+
 	// Get latest counts of voting, voted and revoked tickets.
 	voting, voted, revoked, err := db.CountTickets()
 	if err != nil {
@@ -75,6 +82,7 @@ func updateCache(ctx context.Context, db *database.VspDatabase,
 	defer cacheMtx.Unlock()
 
 	cache.UpdateTime = dateTime(time.Now().Unix())
+	cache.DatabaseSize = humanize.Bytes(dbSize)
 	cache.Voting = voting
 	cache.Voted = voted
 	cache.Revoked = revoked

webapi/public/css/vspd.css

@@ -96,11 +96,6 @@ footer .code {
     border-color: transparent;
 }
 
-.btn-small {
-    padding: 6px 10px;
-    font-size: 13px;
-}
-
 .block__content h1 {
     color: #091440;
     font-size: 24px;
@@ -196,7 +191,7 @@ footer .code {
     list-style:none;
     display:flex;
     padding: 0;
-    margin: 0 0 30px;
+    margin: 0 0 25px;
 }
 
 .tabset > ul label {
@@ -239,7 +234,7 @@ footer .code {
     left:-999em;
 }
 .tabset > div > section {
-    padding: 0;
+    padding: 0 10px 10px 10px;
 }
 
 .tabset > input:nth-child(1):checked ~ div > section:nth-child(1),

webapi/templates/admin.html

@@ -4,17 +4,8 @@
     <div class="container">
 
         <div class="d-flex flex-wrap">
-            <h1 class="mr-auto text-nowrap">Admin Panel</h1>
-            
-            <div class="row">
-                <a class="m-2 btn btn-primary btn-small" href="/admin/backup" download>Backup</a>
-                
-                <form class="p-2" action="/admin/logout" method="post">
-                    <button type="submit" class="btn btn-primary btn-small">Logout</button>
-                </form>
+            <h1>Admin Panel</h1>
         </div>
-        </div>
-        
         
         {{ template "vsp-stats" . }}
 
@@ -33,7 +24,6 @@
                         name="tabset_1"
                         id="tabset_1_1"
                         hidden
-                        aria-hidden="true"
                         {{ with .SearchResult }}{{ else }}checked{{ end }}
                     >
                     <input
@@ -41,12 +31,25 @@
                         name="tabset_1"
                         id="tabset_1_2"
                         hidden
-                        aria-hidden="true"
                         {{ with .SearchResult }}checked{{ end }}
                     >
+                    <input
+                        type="radio"
+                        name="tabset_1"
+                        id="tabset_1_3"
+                        hidden
+                    >
+                    <input
+                        type="radio"
+                        name="tabset_1"
+                        id="tabset_1_4"
+                        hidden
+                    >
                     <ul>
                         <li><label for="tabset_1_1">Wallet Status</label></li>
                         <li><label for="tabset_1_2">Ticket Search</label></li>
+                        <li><label for="tabset_1_3">Database</label></li>
+                        <li><label for="tabset_1_4">Logout</label></li>
                     </ul>
                     
                     <div>
@@ -276,6 +279,17 @@
                             {{ end }}
                         </section>
 
+                        <section>
+                            <p>Database size: {{ .WebApiCache.DatabaseSize }}</p>
+                            <a class="btn btn-primary" href="/admin/backup" download>Download Backup</a>
+                        </section>
+
+                        <section>
+                            <form action="/admin/logout" method="post">
+                                <button type="submit" class="btn btn-primary">Logout</button>
+                            </form>
+                        </section>
+
                     </div>
                 </div>