From 4e8aaafcc4e4851bf729f2f80de8801f905dd65a Mon Sep 17 00:00:00 2001
From: codeskyblue <codeskyblue@gmail.com>
Date: Sun, 24 Jul 2016 18:32:57 +0800
Subject: [PATCH] add bootstrap

---
 README.md                        |   2 +-
 httpstaticserver.go              |   2 +-
 res/favicon.png                  | Bin 0 -> 3240 bytes
 res/index.tmpl                   |  73 +++++++++++++++++++++++++++++--
 res/{ => js}/jquery-3.1.0.min.js |   0
 res/{ => js}/vue-1.0.min.js      |   0
 6 files changed, 71 insertions(+), 6 deletions(-)
 create mode 100644 res/favicon.png
 rename res/{ => js}/jquery-3.1.0.min.js (100%)
 rename res/{ => js}/vue-1.0.min.js (100%)

diff --git a/README.md b/README.md
index c274406..4dc32a4 100644
--- a/README.md
+++ b/README.md
@@ -50,6 +50,6 @@ go get -v github.com/tools/godep
 Reference Web sites
 
 * <https://vuejs.org.cn/>
-
+* Icon from <http://www.easyicon.net/558394-file_explorer_icon.html>
 ## LICENSE
 This project is under license [MIT](LICENSE)
diff --git a/httpstaticserver.go b/httpstaticserver.go
index fc74ee1..000325f 100644
--- a/httpstaticserver.go
+++ b/httpstaticserver.go
@@ -44,7 +44,7 @@ func (s *HTTPStaticServer) hIndex(w http.ResponseWriter, r *http.Request) {
 
 func (s *HTTPStaticServer) hAssets(w http.ResponseWriter, r *http.Request) {
 	path := mux.Vars(r)["path"]
-	w.Header().Set("Content-Type", "text/plain") // -_-! not working in chrome
+	// w.Header().Set("Content-Type", "text/plain") // -_-! not working in chrome
 	http.ServeFile(w, r, filepath.Join("./res", path))
 }
 
diff --git a/res/favicon.png b/res/favicon.png
new file mode 100644
index 0000000000000000000000000000000000000000..c38a7041bf4ca275dc4ee000e09437a23f1d70ed
GIT binary patch
literal 3240
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

literal 0
HcmV?d00001

diff --git a/res/index.tmpl b/res/index.tmpl
index 6d6c778..113c6ea 100644
--- a/res/index.tmpl
+++ b/res/index.tmpl
@@ -1,13 +1,78 @@
 <!DOCTYPE html>
 <html>
 	<head>
+		<meta charset="utf-8" />
+		<meta name="viewport" content="width=device-width, initial-scale=1">
 		<title>gohttp server</title>
+		<link rel="shortcut icon" type="image/png" href="/-/res/favicon.png" />
+		<link rel="stylesheet" type="text/css" href="/-/res/bootstrap-3.3.5/css/bootstrap.min.css">
 	</head>
 	<body id="app">
-		<h1>{{message}}</h1>
-		<p><a href="/-/raw/">Explore</a></p>
-		<script src="/-/res/jquery-3.1.0.min.js"></script>
-		<script src="/-/res/vue-1.0.min.js"></script>
+		<nav class="navbar navbar-inverse">
+			<div class="container">
+				<div class="container">
+					<div class="navbar-header">
+						<button type="button" class="navbar-toggle collapsed" data-toggle="collapse" data-target="#bs-example-navbar-collapse-2">
+						<span class="sr-only">Toggle navigation</span>
+						<span class="icon-bar"></span>
+						<span class="icon-bar"></span>
+						<span class="icon-bar"></span>
+						</button>
+						<a class="navbar-brand" href="/">Go HTTP File Server</a>
+					</div>
+					<div class="collapse navbar-collapse" id="bs-example-navbar-collapse-2">
+						<ul class="nav navbar-nav">
+							<li><a href="{{.dir}}">{{.dir}}</a></li>
+						</ul>
+						<form class="navbar-form navbar-right">
+							<div class="input-group">
+								<input type="text" class="form-control" placeholder="Not finished.">
+								<span class="input-group-btn">
+									<button class="btn btn-default" type="button">
+										<span class="glyphicon glyphicon-search"></span>
+									</button>
+								</span>
+							</div>
+						</form>
+						<ul id="nav-right-bar" class="nav navbar-nav navbar-right">
+						</ul>
+					</div>
+				</div>
+			</div>
+		</nav>
+		<div class="container">
+			<div class="col-md-12">
+				<table class="table">
+					<thead>
+						<th>Name</th>
+						<th>Size</th>
+						<th>Actions</th>
+					</thead>
+					<tbody>
+						<td>Foo.txt</td>
+						<td>10M</td>
+						<td>
+							<a href="#">Download</a>
+						</td>
+					</tbody>
+				</table>
+			</div>
+			<div class="col-md-12" id="content">
+				<!-- webpack content here -->
+				<h1>{{message}}</h1>
+				<p><a href="/-/raw/">Explore</a></p>
+			</div>
+			<div class="col-md-12">
+				<div id="footer" class="pull-right">
+					<a href="https://github.com/codeskyblue/gohttp-vue">gohttp-vue</a>,
+					written by <a href="https://github.com/codeskyblue">codeskyblue</a>. 2016. go 1.6
+				</div>
+			</div>
+		</div>
+		
+		<script src="/-/res/js/jquery-3.1.0.min.js"></script>
+		<script src="/-/res/js/vue-1.0.min.js"></script>
+		<script src="/-/res/bootstrap-3.3.5/js/bootstrap.min.js"></script>
 		<script>
 		$.getJSON("/-/json/hello", function(res) {
 			console.log(res);
diff --git a/res/jquery-3.1.0.min.js b/res/js/jquery-3.1.0.min.js
similarity index 100%
rename from res/jquery-3.1.0.min.js
rename to res/js/jquery-3.1.0.min.js
diff --git a/res/vue-1.0.min.js b/res/js/vue-1.0.min.js
similarity index 100%
rename from res/vue-1.0.min.js
rename to res/js/vue-1.0.min.js