mirror of https://github.com/jlelse/GoBlog
(Experimental) external video integration using hls.js
parent
fd04bed9f6
commit
2b1346e8d5
|
@ -9,6 +9,7 @@ ADD pkgs/ /app/pkgs/
|
|||
ADD testdata/ /app/testdata/
|
||||
ADD templates/ /app/templates/
|
||||
ADD leaflet/ /app/leaflet/
|
||||
ADD hlsjs/ /app/hlsjs/
|
||||
ADD dbmigrations/ /app/dbmigrations/
|
||||
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-Frame-Options", "SAMEORIGIN")
|
||||
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)
|
||||
})
|
||||
}
|
||||
|
|
|
@ -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(cacheLoggedIn, a.cacheMiddleware, noIndexHeader).HandleFunc("/leaflet/*", a.serveFs(leafletFiles, "/-/"))
|
||||
|
||||
// Hlsjs
|
||||
r.With(cacheLoggedIn, a.cacheMiddleware, noIndexHeader).HandleFunc("/hlsjs/*", a.serveFs(hlsjsFiles, "/-/"))
|
||||
|
||||
// Reactions
|
||||
if a.reactionsEnabled() {
|
||||
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)
|
||||
hb.writeElementClose("div")
|
||||
}
|
||||
// External Videp
|
||||
a.renderPostVideo(hb, p)
|
||||
// GPS Track
|
||||
a.renderPostGPX(hb, p, rd.Blog)
|
||||
// Taxonomies
|
||||
|
|
|
@ -481,3 +481,13 @@ func (a *goBlog) renderPostReactions(hb *htmlBuilder, p *post) {
|
|||
hb.writeElementOpen("script", "defer", "", "src", a.assetFileName("js/reactions.js"))
|
||||
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