fix(frontend): align post thumbnail display with reference
This commit is contained in:
1 parent
542daca457
commit
4cdde50695
11 files changed
+201
-104
No files matched your search
+1
-40
@@ -1,5 +1,5 @@
|
||||
/**
|
||||
* AKSRT Misc — related swiper, slide covers, hidden content
|
||||
* AKSRT Misc — image gradients and hidden content
|
||||
*/
|
||||
(function () {
|
||||
"use strict";
|
||||
@@ -44,46 +44,7 @@
|
||||
renderGradientBackground(event.target.closest(".gradient-bg"));
|
||||
}, true);
|
||||
|
||||
function initPostThumbMedia(root) {
|
||||
var scope = root || document;
|
||||
|
||||
scope.querySelectorAll("[data-post-thumb-video]").forEach(function (box) {
|
||||
if (box.dataset.aksrtThumbVideoBound === "1") return;
|
||||
box.dataset.aksrtThumbVideoBound = "1";
|
||||
var video = box.querySelector("video");
|
||||
if (!video) return;
|
||||
|
||||
function loadVideo() {
|
||||
if (!video.getAttribute("src") && video.dataset.src) {
|
||||
video.setAttribute("src", video.dataset.src);
|
||||
video.load();
|
||||
}
|
||||
}
|
||||
|
||||
function playVideo() {
|
||||
loadVideo();
|
||||
var result = video.play();
|
||||
var postItem = box.closest(".posts-item");
|
||||
if (postItem) postItem.classList.add("thumb-dplayer-playing");
|
||||
if (result && typeof result.catch === "function") result.catch(function () {});
|
||||
}
|
||||
|
||||
function pauseVideo() {
|
||||
video.pause();
|
||||
var postItem = box.closest(".posts-item");
|
||||
if (postItem) postItem.classList.remove("thumb-dplayer-playing");
|
||||
}
|
||||
|
||||
var item = box.closest(".item-thumbnail") || box;
|
||||
item.addEventListener("mouseenter", playVideo);
|
||||
item.addEventListener("mouseleave", pauseVideo);
|
||||
item.addEventListener("focusin", playVideo);
|
||||
item.addEventListener("focusout", pauseVideo);
|
||||
});
|
||||
}
|
||||
|
||||
function init(root) {
|
||||
initPostThumbMedia(root);
|
||||
initGradientBackgrounds(root);
|
||||
}
|
||||
|
||||
|
||||
Reference in new issue
Block a user