Enhance video thumbnail focus handling and update video retrieval logic
This commit is contained in:
parent
cc00e58561
commit
9998a0ab36
@ -55,7 +55,6 @@
|
|||||||
.current-video {
|
.current-video {
|
||||||
width: 50vw;
|
width: 50vw;
|
||||||
z-index: 2;
|
z-index: 2;
|
||||||
box-shadow: 0 0 200px -10px #444;
|
|
||||||
}
|
}
|
||||||
|
|
||||||
.side-video {
|
.side-video {
|
||||||
@ -158,12 +157,17 @@
|
|||||||
}
|
}
|
||||||
|
|
||||||
/* Styles for TV remote focus indication */
|
/* Styles for TV remote focus indication */
|
||||||
.video-thumbnail:focus,
|
|
||||||
#back-button:focus {
|
#back-button:focus {
|
||||||
outline: 3px solid #3498db !important; /* A clear blue outline */
|
outline: 3px solid #3498db !important; /* A clear blue outline */
|
||||||
box-shadow: 0 0 15px #3498db; /* A glow effect */
|
box-shadow: 0 0 15px #3498db; /* A glow effect */
|
||||||
}
|
}
|
||||||
|
|
||||||
|
.video-thumbnail:focus {
|
||||||
|
/*outline: 3px solid #444;*/
|
||||||
|
outline: 3px solid #557; /* Remove focus outline for elements with nofocus class */
|
||||||
|
box-shadow: 0 0 400px -10px #446
|
||||||
|
}
|
||||||
|
|
||||||
.nofocus:focus {
|
.nofocus:focus {
|
||||||
outline: none !important; /* Remove focus outline for elements with nofocus class */
|
outline: none !important; /* Remove focus outline for elements with nofocus class */
|
||||||
}
|
}
|
||||||
@ -311,15 +315,17 @@
|
|||||||
|
|
||||||
$.getJSON("/api/homepage", function(data) {
|
$.getJSON("/api/homepage", function(data) {
|
||||||
currentVideo = data.currentVideo;
|
currentVideo = data.currentVideo;
|
||||||
|
nextVideo = data.nextVideo;
|
||||||
$("#current-thumb").attr("src", currentVideo.thumbnail);
|
$("#current-thumb").attr("src", currentVideo.thumbnail);
|
||||||
|
$("#current-thumb").attr("src", nextVideo.thumbnail);
|
||||||
// Consider populating prev-thumb and next-thumb here if data provides them
|
// Consider populating prev-thumb and next-thumb here if data provides them
|
||||||
|
|
||||||
hideSpinner();
|
hideSpinner();
|
||||||
showVideoContainer();
|
showVideoContainer();
|
||||||
|
|
||||||
// FOCUS: Set initial focus on the main screen
|
// FOCUS: Set initial focus on the main screen
|
||||||
if ($(".video-container").is(":visible") && $('#play-button').length) {
|
if ($(".video-container").is(":visible")) {
|
||||||
$('#play-button').focus();
|
$('#current-thumb').focus();
|
||||||
}
|
}
|
||||||
}).fail(function(jqXHR, textStatus, errorThrown) {
|
}).fail(function(jqXHR, textStatus, errorThrown) {
|
||||||
console.error("Failed to load homepage data:", textStatus, errorThrown);
|
console.error("Failed to load homepage data:", textStatus, errorThrown);
|
||||||
@ -410,7 +416,7 @@
|
|||||||
overlayContainer.on('mousemove.inactivityControls', showControlsAndResetTimer);
|
overlayContainer.on('mousemove.inactivityControls', showControlsAndResetTimer);
|
||||||
|
|
||||||
// --- TV Remote/Keyboard Navigation ---
|
// --- TV Remote/Keyboard Navigation ---
|
||||||
const mainViewFocusable = [$('#prev-thumb'), $('#play-button'), $('#next-thumb')].filter(el => el && el.length > 0);
|
const mainViewFocusable = [$('#prev-thumb'), $('#current-thumb'), $('#next-thumb')].filter(el => el && el.length > 0);
|
||||||
const getOverlayViewFocusableElements = () => [backButton, playPauseButton, seekBar].filter(el => el && el.length > 0 && el.is(':visible'));
|
const getOverlayViewFocusableElements = () => [backButton, playPauseButton, seekBar].filter(el => el && el.length > 0 && el.is(':visible'));
|
||||||
|
|
||||||
$(document).on('keydown', function(e) {
|
$(document).on('keydown', function(e) {
|
||||||
|
16
webview.go
16
webview.go
@ -1,6 +1,7 @@
|
|||||||
package main
|
package main
|
||||||
|
|
||||||
import (
|
import (
|
||||||
|
"cmp"
|
||||||
"fmt"
|
"fmt"
|
||||||
"gitea.seeseepuff.be/seeseemelk/mysqlite"
|
"gitea.seeseepuff.be/seeseemelk/mysqlite"
|
||||||
"github.com/donseba/go-htmx"
|
"github.com/donseba/go-htmx"
|
||||||
@ -58,20 +59,27 @@ type VideoModel struct {
|
|||||||
|
|
||||||
type HomePageModel struct {
|
type HomePageModel struct {
|
||||||
CurrentVideo VideoModel `json:"currentVideo"`
|
CurrentVideo VideoModel `json:"currentVideo"`
|
||||||
|
NextVideo VideoModel `json:"nextVideo"`
|
||||||
}
|
}
|
||||||
|
|
||||||
func (a *App) homePage(c *gin.Context) {
|
func (a *App) homePage(c *gin.Context) {
|
||||||
model := HomePageModel{}
|
model := HomePageModel{}
|
||||||
err := a.db.Query("SELECT id, thumbnail FROM videos WHERE (watch_state IS NULL OR watch_state != 'watched') ORDER BY upload_date, episode LIMIT 1").
|
errCurrent := a.db.Query("SELECT id, thumbnail FROM videos WHERE (watch_state IS NULL OR watch_state != 'watched') ORDER BY upload_date, episode LIMIT 1").
|
||||||
ScanSingle(&model.CurrentVideo.ID, &model.CurrentVideo.Thumbnail)
|
ScanSingle(&model.CurrentVideo.ID, &model.CurrentVideo.Thumbnail)
|
||||||
if err != nil {
|
errNext := a.db.Query("SELECT id, thumbnail FROM videos WHERE (watch_state IS NULL OR watch_state != 'watched') ORDER BY upload_date, episode LIMIT 1 OFFSET 1").
|
||||||
log.Printf("Failed to fetch current video: %v", err)
|
ScanSingle(&model.NextVideo.ID, &model.NextVideo.Thumbnail)
|
||||||
c.JSON(500, gin.H{"error": "Failed to fetch current video"})
|
if err := cmp.Or(errCurrent, errNext); err != nil {
|
||||||
|
log.Printf("Failed to retrieve videos: %v", err)
|
||||||
|
c.JSON(http.StatusInternalServerError, gin.H{"error": "Failed to retrieve videos"})
|
||||||
return
|
return
|
||||||
}
|
}
|
||||||
|
|
||||||
model.CurrentVideo.Thumbnail = "https://imgproxy.fourthwall.com/GHX1MSukwJHMQeiqcJLZL906v2--re7qQbQIlHgy5jY/rs:fill:607:342:0/q:90/sm:1/enc/NDJiMWM5YzU3ODJh/MzgzZXFIti10srar/EYcgeYXIe6MXrQge/VBPZVk3b6DCE53dq/VGponLkc45F9743G/4la9S4IjbcNxs4lF/WnLXCMzFhaSUaZnL/Og4de_FSYxQOtzCC/0pfkgH1g4FJfajde/KrZfes95EWXzg9sP/kvEwcqro2EM.webp"
|
model.CurrentVideo.Thumbnail = "https://imgproxy.fourthwall.com/GHX1MSukwJHMQeiqcJLZL906v2--re7qQbQIlHgy5jY/rs:fill:607:342:0/q:90/sm:1/enc/NDJiMWM5YzU3ODJh/MzgzZXFIti10srar/EYcgeYXIe6MXrQge/VBPZVk3b6DCE53dq/VGponLkc45F9743G/4la9S4IjbcNxs4lF/WnLXCMzFhaSUaZnL/Og4de_FSYxQOtzCC/0pfkgH1g4FJfajde/KrZfes95EWXzg9sP/kvEwcqro2EM.webp"
|
||||||
model.CurrentVideo.URL = fmt.Sprintf("/stream/%d", model.CurrentVideo.ID)
|
model.CurrentVideo.URL = fmt.Sprintf("/stream/%d", model.CurrentVideo.ID)
|
||||||
|
|
||||||
|
model.NextVideo.Thumbnail = "https://imgproxy.fourthwall.com/GHX1MSukwJHMQeiqcJLZL906v2--re7qQbQIlHgy5jY/rs:fill:607:342:0/q:90/sm:1/enc/NDJiMWM5YzU3ODJh/MzgzZXFIti10srar/EYcgeYXIe6MXrQge/VBPZVk3b6DCE53dq/VGponLkc45F9743G/4la9S4IjbcNxs4lF/WnLXCMzFhaSUaZnL/Og4de_FSYxQOtzCC/0pfkgH1g4FJfajde/KrZfes95EWXzg9sP/kvEwcqro2EM.webp"
|
||||||
|
model.NextVideo.URL = fmt.Sprintf("/stream/%d", model.CurrentVideo.ID)
|
||||||
|
|
||||||
c.JSON(200, model)
|
c.JSON(200, model)
|
||||||
}
|
}
|
||||||
|
|
||||||
|
Loading…
x
Reference in New Issue
Block a user