Add initial web app

rsierra · Jan 25, 2020 · 8ff8c3f · 8ff8c3f
commit 8ff8c3f
Show file tree

Hide file tree

Showing 5 changed files with 138 additions and 0 deletions.
diff --git a/server.go b/server.go
@@ -0,0 +1,66 @@
+/*
+Serve is a very simple static file server in go
+Usage:
+	-p="8100": port to serve on
+	-d=".":    the directory of static files to host
+Navigating to http://localhost:8100 will display the index.html or directory
+listing file.
+*/
+package main
+
+import (
+	"flag"
+	"html/template"
+	"log"
+	"net/http"
+	"path/filepath"
+	"os"
+)
+
+var port = flag.String("p", "8100", "port to serve on")
+var directory = flag.String("d", ".", "the directory of files to host")
+
+func main() {
+	flag.Parse()
+
+	fs := http.FileServer(http.Dir(*directory))
+	http.Handle("/files/", http.StripPrefix("/files/", fs))
+
+	ss := http.FileServer(http.Dir("statics"))
+	http.Handle("/statics/", http.StripPrefix("/statics/", ss))
+
+	http.HandleFunc("/", serveTemplate)
+
+	log.Printf("Serving %s on HTTP port: %s\n", *directory, *port)
+	log.Fatal(http.ListenAndServe(":"+*port, nil))
+}
+
+func serveTemplate(w http.ResponseWriter, r *http.Request) {
+	var template_name string
+	if template_name = filepath.Clean(r.URL.Path); template_name == "/" {
+		template_name = "/index.html"
+	}
+
+	lp := filepath.Join("templates", "layout.html")
+	fp := filepath.Join("templates", template_name)
+
+	files, err := filePathWalkDir(*directory)
+	if err != nil {
+		log.Fatal(err)
+	}
+
+	log.Printf("Template %s\n", template_name)
+	tmpl, _ := template.ParseFiles(lp, fp)
+	tmpl.ExecuteTemplate(w, "layout", files)
+}
+
+func filePathWalkDir(root string) ([]string, error) {
+	var files []string
+	err := filepath.Walk(root, func(path string, info os.FileInfo, err error) error {
+		if !info.IsDir() {
+			files = append(files, path)
+		}
+		return nil
+	})
+	return files, err
+}
diff --git a/statics/css/app.css b/statics/css/app.css
@@ -0,0 +1,12 @@
+body, html{
+  height: 100%;
+}
+#qr-code{
+  position: absolute;
+  background: white;
+  padding: 10px;
+  border: 1px solid #ddd;
+}
+#qr-code canvas{
+  display: block;
+}
diff --git a/statics/js/app.js b/statics/js/app.js
@@ -0,0 +1,28 @@
+$(document).ready(function () {
+  var $view = $("<div id='qr-code'></div>");
+  $("body").append($view);
+  $view.hide();
+});
+
+$("body").click(function (e) {
+  var QRVisibe = $(e.target).is(".qr-link")
+
+  // if there is click event outside IMG then close the qr-view box
+  if (!QRVisibe)
+    $('#qr-code').fadeOut();
+});
+
+$("a.qr-link").click(function (e) {
+  // prevent default click behaviour
+  e.preventDefault();
+
+  // get full link url
+  var href = $(this).prop('href');
+
+  // set its location and do show
+  $("#qr-code").css("top", (e.pageY) + "px").css("left", (e.pageX) + "px");
+  $("#qr-code").fadeIn();
+
+  // set qr-code content
+  $("#qr-code").empty().qrcode(href);
+});
diff --git a/templates/index.html b/templates/index.html
@@ -0,0 +1,10 @@
+{{define "title"}}Files list{{end}}
+
+{{define "body"}}
+<h1>Files list</h1>
+<ul>
+  {{range .}}
+  <li><a href="/{{.}}" class="qr-link">{{.}}</a></li>
+  {{end}}
+</ul>
+{{end}}
diff --git a/templates/layout.html b/templates/layout.html
@@ -0,0 +1,22 @@
+{{define "layout"}}
+<!doctype html>
+<html>
+
+<head>
+  <link rel="stylesheet" type="text/css" href="statics/css/app.css">
+  <link
+    href="data:image/x-icon;base64,AAABAAEAEBAAAAEAIABoBAAAFgAAACgAAAAQAAAAIAAAAAEAIAAAAAAAAAQAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAP8AAAD/AAAA/wAAAP8AAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAA/wAAAP/ExMT/xMTE/8TExP/ExMT/AAAA/wAAAP8AAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAA////////////////////////////xMTE/8TExP/ExMT/AAAA/wAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAP////////////////8AAAD/AAAA/8TExP/ExMT/xMTE/wAAAP8AAAAAAAAAAAAAAAAAAAAAAAAAAAAAAP//////AAAA/wAAAP8AAAD/xMTE/8TExP8AAAD/AAAA/wAAAP/ExMT/AAAA/wAAAAAAAAAAAAAAAAAAAAAAAAD/AAAA/wAA//8AAP//AAAA///////ExMT/AAAA/ysrvf8rK73/AAAA/wAAAP8AAAAAAAAAAAAAAAAAAAAAAAAA/wAA//8AAP//AAD//wAA//8AAAD/AAAA/ysrvf8rK73/Kyu9/ysrvf8AAAD/AAAAAAAAAAAAAAAAAAAAAAAAAP8AAP//AAD//wAA//8AAP+uAAD//wAA//8AAP//Kyu9/ysrvf8rK73/AAAA/wAAAAAAAAAAAAAAAAAAAAAAAAAAAAAA/wAA//8AAP+u/////wAA/64AAP//AAD//ysrvf8rK73/AAAA/wAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAP8AAP//AAD//wAA/64AAP//Kyu9/ysrvf8rK73/Kyu9/wAAAP8AAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAA/wAAAP8AAP//Kyu9/ysrvf8rK73/AAAA/wAAAP8AAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAA/wAAAP8AAAD/AAAA/wAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAA//8AAP//AAD8PwAA8A8AAOAHAADgBwAAwAMAAMADAADAAwAAwAMAAOAHAADgBwAA8A8AAPw/AAD//wAA//8AAA=="
+    rel="icon" type="image/x-icon" />
+  <meta charset="utf-8">
+  <title>{{template "title"}}</title>
+  <script src="https://cdn.jsdelivr.net/npm/jquery@3.4.1/dist/jquery.min.js"></script>
+  <script src="https://cdn.jsdelivr.net/npm/jquery.qrcode@1.0.3/jquery.qrcode.min.js"></script>
+</head>
+
+<body>
+  {{template "body" .}}
+  <script type='text/javascript' src="statics/js/app.js"></script>
+</body>
+
+</html>
+{{end}}