mirror of https://github.com/jlelse/GoBlog
(Experimental) external video integration using hls.js
This commit is contained in:
parent
fd04bed9f6
commit
2b1346e8d5
|
@ -9,6 +9,7 @@ ADD pkgs/ /app/pkgs/
|
||||||
ADD testdata/ /app/testdata/
|
ADD testdata/ /app/testdata/
|
||||||
ADD templates/ /app/templates/
|
ADD templates/ /app/templates/
|
||||||
ADD leaflet/ /app/leaflet/
|
ADD leaflet/ /app/leaflet/
|
||||||
|
ADD hlsjs/ /app/hlsjs/
|
||||||
ADD dbmigrations/ /app/dbmigrations/
|
ADD dbmigrations/ /app/dbmigrations/
|
||||||
ADD strings/ /app/strings/
|
ADD strings/ /app/strings/
|
||||||
|
|
||||||
|
|
|
@ -0,0 +1,12 @@
|
||||||
|
package main
|
||||||
|
|
||||||
|
import "embed"
|
||||||
|
|
||||||
|
const videoPlaylistParam = "videoplaylist"
|
||||||
|
|
||||||
|
//go:embed hlsjs/*
|
||||||
|
var hlsjsFiles embed.FS
|
||||||
|
|
||||||
|
func (p *post) hasVideoPlaylist() bool {
|
||||||
|
return p.firstParameter(videoPlaylistParam) != ""
|
||||||
|
}
|
File diff suppressed because one or more lines are too long
|
@ -59,7 +59,7 @@ func (a *goBlog) securityHeaders(next http.Handler) http.Handler {
|
||||||
w.Header().Set("X-Content-Type-Options", "nosniff")
|
w.Header().Set("X-Content-Type-Options", "nosniff")
|
||||||
w.Header().Set("X-Frame-Options", "SAMEORIGIN")
|
w.Header().Set("X-Frame-Options", "SAMEORIGIN")
|
||||||
w.Header().Set("X-Xss-Protection", "1; mode=block")
|
w.Header().Set("X-Xss-Protection", "1; mode=block")
|
||||||
w.Header().Set("Content-Security-Policy", "default-src 'self'"+cspDomains+"; img-src 'self' "+cspDomains+" data:")
|
w.Header().Set("Content-Security-Policy", "default-src 'self' blob:"+cspDomains+"; img-src 'self'"+cspDomains+" data:")
|
||||||
next.ServeHTTP(w, r)
|
next.ServeHTTP(w, r)
|
||||||
})
|
})
|
||||||
}
|
}
|
||||||
|
|
|
@ -104,6 +104,9 @@ func (a *goBlog) otherRoutesRouter(r chi.Router) {
|
||||||
r.With(noIndexHeader).Get("/tiles/{s}/{z}/{x}/{y}.png", a.proxyTiles())
|
r.With(noIndexHeader).Get("/tiles/{s}/{z}/{x}/{y}.png", a.proxyTiles())
|
||||||
r.With(cacheLoggedIn, a.cacheMiddleware, noIndexHeader).HandleFunc("/leaflet/*", a.serveFs(leafletFiles, "/-/"))
|
r.With(cacheLoggedIn, a.cacheMiddleware, noIndexHeader).HandleFunc("/leaflet/*", a.serveFs(leafletFiles, "/-/"))
|
||||||
|
|
||||||
|
// Hlsjs
|
||||||
|
r.With(cacheLoggedIn, a.cacheMiddleware, noIndexHeader).HandleFunc("/hlsjs/*", a.serveFs(hlsjsFiles, "/-/"))
|
||||||
|
|
||||||
// Reactions
|
// Reactions
|
||||||
if a.reactionsEnabled() {
|
if a.reactionsEnabled() {
|
||||||
r.Get("/reactions", a.getReactions)
|
r.Get("/reactions", a.getReactions)
|
||||||
|
|
|
@ -0,0 +1,32 @@
|
||||||
|
(function () {
|
||||||
|
function loadVideo() {
|
||||||
|
// Get video div element
|
||||||
|
let videoDivEl = document.getElementById('video')
|
||||||
|
|
||||||
|
// External Video URL
|
||||||
|
let videoUrl = videoDivEl.dataset.url
|
||||||
|
|
||||||
|
// Create video element
|
||||||
|
let videoEl = document.createElement('video')
|
||||||
|
videoEl.controls = true
|
||||||
|
videoEl.classList.add('fw')
|
||||||
|
|
||||||
|
// Load video
|
||||||
|
if (Hls.isSupported()) {
|
||||||
|
let hls = new Hls()
|
||||||
|
hls.loadSource(videoUrl)
|
||||||
|
hls.attachMedia(videoEl)
|
||||||
|
} else if (videoEl.canPlayType('application/vnd.apple.mpegurl')) {
|
||||||
|
videoEl.src = videoUrl
|
||||||
|
}
|
||||||
|
|
||||||
|
// Add video element
|
||||||
|
videoDivEl.appendChild(videoEl)
|
||||||
|
}
|
||||||
|
|
||||||
|
// JS
|
||||||
|
let script = document.createElement('script')
|
||||||
|
script.src = '/-/hlsjs/hls.js?v=1.1.5'
|
||||||
|
script.onload = loadVideo
|
||||||
|
document.head.appendChild(script)
|
||||||
|
})()
|
2
ui.go
2
ui.go
|
@ -906,6 +906,8 @@ func (a *goBlog) renderPost(hb *htmlBuilder, rd *renderData) {
|
||||||
a.postHtmlToWriter(hb, p, false)
|
a.postHtmlToWriter(hb, p, false)
|
||||||
hb.writeElementClose("div")
|
hb.writeElementClose("div")
|
||||||
}
|
}
|
||||||
|
// External Videp
|
||||||
|
a.renderPostVideo(hb, p)
|
||||||
// GPS Track
|
// GPS Track
|
||||||
a.renderPostGPX(hb, p, rd.Blog)
|
a.renderPostGPX(hb, p, rd.Blog)
|
||||||
// Taxonomies
|
// Taxonomies
|
||||||
|
|
|
@ -481,3 +481,13 @@ func (a *goBlog) renderPostReactions(hb *htmlBuilder, p *post) {
|
||||||
hb.writeElementOpen("script", "defer", "", "src", a.assetFileName("js/reactions.js"))
|
hb.writeElementOpen("script", "defer", "", "src", a.assetFileName("js/reactions.js"))
|
||||||
hb.writeElementClose("script")
|
hb.writeElementClose("script")
|
||||||
}
|
}
|
||||||
|
|
||||||
|
func (a *goBlog) renderPostVideo(hb *htmlBuilder, p *post) {
|
||||||
|
if !p.hasVideoPlaylist() {
|
||||||
|
return
|
||||||
|
}
|
||||||
|
hb.writeElementOpen("div", "id", "video", "data-url", p.firstParameter(videoPlaylistParam))
|
||||||
|
hb.writeElementClose("div")
|
||||||
|
hb.writeElementOpen("script", "defer", "", "src", a.assetFileName("js/video.js"))
|
||||||
|
hb.writeElementClose("script")
|
||||||
|
}
|
||||||
|
|
Loading…
Reference in New Issue