Add support for dlsrv streaming

5 files changed, 89 insertions, 55 deletions

diff --git a/grimtube.go b/grimtube.go
index bd700fb..385be92 100644
--- a/grimtube.go
+++ b/grimtube.go
@@ -143,7 +143,17 @@ func embed(w http.ResponseWriter, r *http.Request) {
 	case "GET":
 		query := r.URL.Query()
 		id := query.Get("id")
-		serve(w, "templates/embed.html", id)
+		url := query.Get("url")
+		data := struct {
+			Id string
+			Url string
+			Dlsrv string
+		}{
+			id,
+			url,
+			dlsrv,
+		}
+		serve(w, "templates/embed.html", data)
 	default:
 	}
 }
diff --git a/static/dark.css b/static/dark.css
index f204117..fd89ec2 100644
--- a/static/dark.css
+++ b/static/dark.css
@@ -1,9 +1,11 @@
 a {
-	color: orange;
+	/*color: orange;*/
+	color: slategray;
 }
 
 a:hover {
-	color: darkorange;
+	/*color: darkorange;*/
+	color: darkslategray;
 }
 
 p {
@@ -15,6 +17,11 @@ li {
 }
 
 body {
+	background-color: #111;
+	margin: 0;
+}
+
+div.content {
 	margin: 0 auto;
 	margin-top: 10px;
 	max-width: 80ex;
@@ -71,3 +78,9 @@ select#lang {
 select#order {
 	width: calc(20% - 10px);
 }
+
+video {
+	/*max-width: 100vh;*/
+	height: 100vh;
+	/*max-height: 100vh;*/
+}
diff --git a/static/style.css b/static/style.css
index 420e9c2..45ca754 100644
--- a/static/style.css
+++ b/static/style.css
@@ -1,3 +1,3 @@
-@import "light.css" screen;
+@import "dark.css" screen;
 
-@import "dark.css" screen and (prefers-color-scheme: dark);
+/*@import "dark.css" screen and (prefers-color-scheme: dark);*/
diff --git a/templates/embed.html b/templates/embed.html
index ff372ab..a9d9d68 100644
--- a/templates/embed.html
+++ b/templates/embed.html
@@ -1,4 +1,13 @@
 {{define "title"}}Index{{end}}
 {{define "content"}}
-	<iframe width="100%" height="100%" src="https://www.youtube-nocookie.com/embed/{{.}}" frameborder="0" allow="accelerometer; autoplay; clipboard-write; encrypted-media; gyroscope; picture-in-picture" allowfullscreen></iframe>
+	{{if ne .Dlsrv ""}}
+		<div>
+			<video width="100%" controls>
+				<source src="{{.Dlsrv}}{{.Url}}">
+				No support for html5 video
+			</video>
+		</div>
+	{{else}}
+		<iframe width="100%" height="100%" src="https://www.youtube-nocookie.com/embed/{{.Id}}" frameborder="0" allow="accelerometer; autoplay; clipboard-write; encrypted-media; gyroscope; picture-in-picture" allowfullscreen></iframe>
+	{{end}}
 {{end}}
diff --git a/templates/search.html b/templates/search.html
index e5cff9a..6a9ce28 100644
--- a/templates/search.html
+++ b/templates/search.html
@@ -1,56 +1,58 @@
 {{define "title"}}Search{{end}}
 {{define "content"}}
-	<form action="/search" method="get">
-		<input id="term" name="term" type="search" placeholder="search" value="{{.Term}}" autocomplete="on" required>
-		<select id="lang" name="lang">
-			{{range .Langs}}
-				{{if eq . $.Lang}}
-					<option selected>{{.}}</option>
-				{{else}}
-					<option>{{.}}</option>
+	<div class="content">
+		<form action="/search" method="get">
+			<input id="term" name="term" type="search" placeholder="search" value="{{.Term}}" autocomplete="on" required>
+			<select id="lang" name="lang">
+				{{range .Langs}}
+					{{if eq . $.Lang}}
+						<option selected>{{.}}</option>
+					{{else}}
+						<option>{{.}}</option>
+					{{end}}
 				{{end}}
-			{{end}}
-		</select>
-		<select id="order" name="order">
-			{{range .Orders}}
-				{{if eq . $.Order}}
-					<option selected>{{.}}</option>
-				{{else}}
-					<option>{{.}}</option>
+			</select>
+			<select id="order" name="order">
+				{{range .Orders}}
+					{{if eq . $.Order}}
+						<option selected>{{.}}</option>
+					{{else}}
+						<option>{{.}}</option>
+					{{end}}
 				{{end}}
-			{{end}}
-		</select>
-	</form>
-	<table>
-	{{range .Items}}
-		<tr>
-			<td>
-				<a href="/embed?id={{.Id}}"><img width=240 src="{{.ThumbUrl}}"></a>
-			</td>
-			<td>
-				<a href="/embed?id={{.Id}}">{{.Title}}</a>
-				<br/>
-				<a href="{{.ChannelUrl}}">{{.ChannelTitle}}</a> | <a href="{{.AtomUrl}}">Atom feed</a>
-				<br/>
-				<a href="{{.Url}}">Comments</a>
-				<br/>
-				{{.ViewCount}}
-				<br/>
-				{{.Published}}
-			</td>
-			<td>
-				{{.LengthText}}
-			</td>
-			{{if ne $.Dlsrv ""}}
+			</select>
+		</form>
+		<table>
+		{{range .Items}}
+			<tr>
 				<td>
-					<a href="{{$.Dlsrv}}{{.Url}}">Download</a>
+					<a href="/embed?id={{.Id}}&url={{.Url}}"><img width=240 src="{{.ThumbUrl}}"></a>
 				</td>
-			{{end}}
-		</tr>
-	{{end}}
-	</table>
-	{{if ge .Page 0 }}
-		<a href="/search?term={{.Term}}&page={{dec .Page}}&lang={{.Lang}}">Prev Page</a> |
-		<a href="/search?term={{.Term}}&page={{inc .Page}}&lang={{.Lang}}">Next Page</a>
-	{{end}}
+				<td>
+					<a href="/embed?id={{.Id}}&url={{.Url}}">{{.Title}}</a>
+					<br/>
+					<a href="{{.ChannelUrl}}">{{.ChannelTitle}}</a> | <a href="{{.AtomUrl}}">Atom feed</a>
+					<br/>
+					<a href="{{.Url}}">Comments</a>
+					<br/>
+					{{.ViewCount}}
+					<br/>
+					{{.Published}}
+				</td>
+				<td>
+					{{.LengthText}}
+				</td>
+				{{if ne $.Dlsrv ""}}
+					<td>
+						<a href="{{$.Dlsrv}}{{.Url}}">Download</a>
+					</td>
+				{{end}}
+			</tr>
+		{{end}}
+		</table>
+		{{if ge .Page 0 }}
+			<a href="/search?term={{.Term}}&page={{dec .Page}}&lang={{.Lang}}">Prev Page</a> |
+			<a href="/search?term={{.Term}}&page={{inc .Page}}&lang={{.Lang}}">Next Page</a>
+		{{end}}
+	</div>
 {{end}}