diff options
| -rw-r--r-- | grimtube.go | 12 | ||||
| -rw-r--r-- | static/dark.css | 17 | ||||
| -rw-r--r-- | static/style.css | 4 | ||||
| -rw-r--r-- | templates/embed.html | 11 | ||||
| -rw-r--r-- | templates/search.html | 100 |
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}} |