Add primitive loader

cmd/txqr-tester/app/app.go

@@ -24,8 +24,9 @@ type App struct {
 
 	connected bool
 
-	testData    []byte
-	animatingQR []byte
+	testData     []byte
+	animatingQR  []byte
+	generatingQR bool
 }
 
 // NewApp creates and inits new app page.
@@ -105,6 +106,9 @@ func (a *App) SetConnected(val bool) {
 
 // ShowNext handles request to show next animated QR.
 func (a *App) ShowNext() {
+	a.generatingQR = true
+	vecty.Rerender(a)
+	time.Sleep(100 * time.Millisecond) // wait till JS thread pickup rerender before running heavy computaiton. withoit this delay it'll never rerender
 	setup, _ := a.session.StartNext()
 	log.Println("Creating animated gif for", setup)
 	now := time.Now()
@@ -112,11 +116,13 @@ func (a *App) ShowNext() {
 	if err != nil {
 		log.Println("[ERROR] Can't generate gif: %v", err)
 		// TODO: session abort
+		a.generatingQR = false
 		return
 	}
 	log.Println("Took time:", time.Since(now))
 	a.animatingQR = gif
 	a.session.SetState(StateAnimating)
+	a.generatingQR = false
 	vecty.Rerender(a)
 }
 

cmd/txqr-tester/app/loader.go

@@ -0,0 +1,17 @@
+package main
+
+import (
+	"github.com/gopherjs/vecty"
+	"github.com/gopherjs/vecty/elem"
+)
+
+func loader() *vecty.HTML {
+	return elem.Div(
+		vecty.Markup(
+			vecty.Class("title", "has-text-weight-light"),
+		),
+		elem.Heading1(
+			vecty.Text("Generating..."),
+		),
+	)
+}

cmd/txqr-tester/app/qr.go

@@ -2,6 +2,7 @@ package main
 
 import (
 	"fmt"
+	"log"
 
 	"github.com/divan/txqr/qr"
 	"github.com/gopherjs/vecty"
@@ -75,6 +76,12 @@ func (a *App) startQR() vecty.ComponentOrHTML {
 
 func (a *App) mainQR() vecty.ComponentOrHTML {
 	state := a.session.State()
+
+	log.Println("MainQR: generatingQR", a.generatingQR)
+	if a.generatingQR {
+		return loader()
+	}
+
 	if state == StateAnimating {
 		return renderGIF(a.animatingQR)
 	} else if state == StateStarted || state == StateWaitingNext || state == StateNew {