Optional CONTACT_PHONE

main.go

@@ -4,10 +4,12 @@ import (
 	"bytes"
 	"encoding/json"
 	"fmt"
+	"html/template"
 	"io"
 	"log"
 	"net/http"
 	"os"
+	"strings"
 )
 
 type PDAlert struct {
@@ -23,15 +25,26 @@ type PDPayload struct {
 }
 
 type PHandler struct {
+	tmpl       *template.Template
 	routingKey string
-	next http.Handler
 }
 
-func NewPHandler(routingKey string, next http.Handler) *PHandler {
-	return &PHandler{
-		routingKey: routingKey,
-		next: next,
+func NewPHandler(routingKey string) (*PHandler, error) {
+	tmpl := template.New("index.html")
+
+	tmpl.Funcs(template.FuncMap{
+		"replaceAll": func(o, n, s string) string { return strings.ReplaceAll(s, o, n) },
+	})
+
+	tmpl, err := tmpl.ParseFiles("static/index.html")
+	if err != nil {
+		return nil, fmt.Errorf("static/index.html: %w", err)
 	}
+
+	return &PHandler{
+		tmpl:       tmpl,
+		routingKey: routingKey,
+	}, nil
 }
 
 func (ph *PHandler) ServeHTTP(w http.ResponseWriter, r *http.Request) {
@@ -45,7 +58,12 @@ func (ph *PHandler) ServeHTTP(w http.ResponseWriter, r *http.Request) {
 
 	msg := r.Form.Get("msg")
 	if msg == "" {
-		ph.next.ServeHTTP(w, r)
+		err = ph.tmpl.Execute(w, ph.envs())
+		if err != nil {
+			http.Error(w, fmt.Sprintf("execute %s: %s\n", ph.tmpl.Name(), err), http.StatusBadRequest)
+			return
+		}
+
 		return
 	}
 
@@ -76,7 +94,7 @@ func (ph *PHandler) ServeHTTP(w http.ResponseWriter, r *http.Request) {
 
 	if err != nil {
 		http.Error(w, fmt.Sprintf("error from PD: %s\n", err), http.StatusBadRequest)
-    	return
+		return
 	}
 
 	body, _ := io.ReadAll(res.Body)
@@ -84,19 +102,41 @@ func (ph *PHandler) ServeHTTP(w http.ResponseWriter, r *http.Request) {
 
 	if res.StatusCode != 202 {
 		http.Error(w, fmt.Sprintf("error from PD: %s", string(body)), http.StatusBadRequest)
-    	return
+		return
 	}
-	
+
 	w.Write([]byte("page sent\n"))
 }
 
+var allowedEnvs = []string{
+	"CONTACT_PHONE",
+}
+
+func (ph *PHandler) envs() map[string]string {
+	envs := map[string]string{}
+
+	for _, k := range allowedEnvs {
+		v := os.Getenv(k)
+		if v != "" {
+			envs[k] = v
+		}
+	}
+
+	return envs
+}
+
 func main() {
 	routingKey := os.Getenv("PD_ROUTING_KEY")
 	if routingKey == "" {
 		log.Fatalf("please set PD_ROUTING_KEY")
 	}
 
-	http.Handle("/", NewPHandler(routingKey, http.FileServer(http.Dir("./static"))))
+	ph, err := NewPHandler(routingKey)
+	if err != nil {
+		log.Fatalf("NewPHandler: %s", err)
+	}
+
+	http.Handle("/", ph)
 
 	port := os.Getenv("PORT")
 	if port == "" {

static/index.html

@@ -5,13 +5,19 @@
 :not(:defined) {
   visibility: hidden;
 }
+
 body {
-	margin: 30px;
+	margin: 20px;
 	font: 12px var(--sl-font-sans);
 	display: flex;
 	flex-direction: column;
 	align-items: center;
 }
+
+a {
+	color: inherit;
+	text-decoration: none;
+}
 		</style>
 		<title>Page Ian</title>
 		<link rel="icon" type="image/svg+xml" href="data:image/svg+xml;base64,PD94bWwgdmVyc2lvbj0iMS4wIiBlbmNvZGluZz0iVVRGLTgiPz4KPCFET0NUWVBFIHN2ZyBQVUJMSUMgIi0vL1czQy8vRFREIFNWRyAxLjEvL0VOIiAiaHR0cDovL3d3dy53My5vcmcvR3JhcGhpY3MvU1ZHLzEuMS9EVEQvc3ZnMTEuZHRkIj4KPHN2ZyB2ZXJzaW9uPSIxLjEiIHhtbG5zPSJodHRwOi8vd3d3LnczLm9yZy8yMDAwL3N2ZyIgeG1sbnM6eGxpbms9Imh0dHA6Ly93d3cudzMub3JnLzE5OTkveGxpbmsiIHZpZXdCb3g9IjAgMCAxMDIuMzQ0IDkzLjMxMDUiPgogPGc+CiAgPHJlY3QgaGVpZ2h0PSI5My4zMTA1IiBvcGFjaXR5PSIwIiB3aWR0aD0iMTAyLjM0NCIgeD0iMCIgeT0iMCIvPgogIDxwYXRoIGQ9Ik0xMy4zMzAxIDkyLjc3MzRMODkuMDEzNyA5Mi43NzM0Qzk3LjMxNDUgOTIuNzczNCAxMDIuMzQ0IDg3LjAxMTcgMTAyLjM0NCA3OS41NDFDMTAyLjM0NCA3Ny4yNDYxIDEwMS42NiA3NC44NTM1IDEwMC40MzkgNzIuNzA1MUw2Mi41NDg4IDYuNjg5NDVDNjAuMDA5OCAyLjI0NjA5IDU1LjY2NDEgMCA1MS4xNzE5IDBDNDYuNjc5NyAwIDQyLjI4NTIgMi4yNDYwOSAzOS43OTQ5IDYuNjg5NDVMMS45MDQzIDcyLjcwNTFDMC41ODU5MzggNzQuOTAyMyAwIDc3LjI0NjEgMCA3OS41NDFDMCA4Ny4wMTE3IDUuMDI5MyA5Mi43NzM0IDEzLjMzMDEgOTIuNzczNFoiIGZpbGw9IiNmZjQ1M2EiLz4KICA8cGF0aCBkPSJNNTEuMjIwNyA2MC4xNTYyQzQ4LjY4MTYgNjAuMTU2MiA0Ny4yNjU2IDU4LjY5MTQgNDcuMjE2OCA1Ni4xMDM1TDQ2LjU4MiAyOS41NDFDNDYuNTMzMiAyNi45NTMxIDQ4LjQzNzUgMjUuMDk3NyA1MS4xNzE5IDI1LjA5NzdDNTMuODA4NiAyNS4wOTc3IDU1Ljg1OTQgMjcuMDAyIDU1LjgxMDUgMjkuNTg5OEw1NS4wNzgxIDU2LjEwMzVDNTUuMDI5MyA1OC43NDAyIDUzLjYxMzMgNjAuMTU2MiA1MS4yMjA3IDYwLjE1NjJaTTUxLjIyMDcgNzYuNTEzN0M0OC4yOTEgNzYuNTEzNyA0NS43NTIgNzQuMTY5OSA0NS43NTIgNzEuMjg5MUM0NS43NTIgNjguMzU5NCA0OC4yNDIyIDY2LjAxNTYgNTEuMjIwNyA2Ni4wMTU2QzU0LjE1MDQgNjYuMDE1NiA1Ni42NDA2IDY4LjMxMDUgNTYuNjQwNiA3MS4yODkxQzU2LjY0MDYgNzQuMjE4OCA1NC4xMDE2IDc2LjUxMzcgNTEuMjIwNyA3Ni41MTM3WiIgZmlsbD0iYmxhY2siLz4KIDwvZz4KPC9zdmc+Cg==" />
@@ -89,7 +95,17 @@ async function pageIan() {
 						<strong>Page sent</strong>
 					</sl-alert>
 				</sl-tab-panel>
-				<sl-tab-panel name="contact">This is the custom tab panel.</sl-tab-panel>
+				<sl-tab-panel name="contact" style="text-align: center">
+					<sl-card class="card-basic" style="font: 16px var(--sl-font-mono)">
+						{{if .CONTACT_PHONE}}
+						<div>
+							<a href="tel:{{.CONTACT_PHONE | replaceAll " " "" | replaceAll "-" ""}}">
+								<sl-icon name="telephone" style="padding-right: 10px"></sl-icon> {{.CONTACT_PHONE}}
+							</a>
+						</div>
+						{{end}}
+					</sl-card>
+				</sl-tab-panel>
 			</sl-tab-group>
 		</div>
 	</body>