diff --git a/html/poketube.ejs b/html/poketube.ejs index 7bf17ed5..5eb86113 100644 --- a/html/poketube.ejs +++ b/html/poketube.ejs @@ -174,6 +174,13 @@ color: #777777; margin-bottom: 0px; } + +a[data-onclick="jump_to_time"] { + background: linear-gradient(to right, #8a2387, #e94057, #f27121); + -webkit-background-clip: text; + -webkit-text-fill-color: transparent; +} + .comments-area .btn-reply { background-color: var(--text-color); @@ -1218,7 +1225,7 @@ Recommended Videos <% } %> <% if (optout) { %> - <%- x.duration || "LIVE"%> + <%- x.duration || "LIVE"%> <% } %>
@@ -1227,7 +1234,7 @@ Recommended Videos <%= x.Title %> <% } %> <% if (optout) { %> - <%= x.Title %> + <%= x.Title %> <% } %>
<%=x.Channel.Name %> @@ -1249,7 +1256,7 @@ Recommended Videos <% } %> <% if (optout) { %> - <%=x.duration %> + <%=x.duration %> <% } %>
@@ -1257,7 +1264,7 @@ Recommended Videos <%= x.Title %> <% } %> <% if (optout) { %> - <%= x.Title %> + <%= x.Title %> <% } %>
<%=video.Channel.Name %> @@ -1308,7 +1315,7 @@ Recommended Videos
- + Opt out of Metrics (Wut?)
@@ -1483,8 +1490,8 @@ document.addEventListener('fullscreenchange', () => { setInterval(fadeInElements, 500); -// Get all anchor links on the page -const links = document.querySelectorAll('a'); +// Get all anchor links on the page except for links with "jump_to_time" onclick attribute +const links = document.querySelectorAll('a:not([data-onclick="jump_to_time"])'); // Add a click event listener to each link links.forEach(link => { @@ -1512,6 +1519,45 @@ links.forEach(link => { } }); }); + + +const a = document.querySelectorAll('a[data-onclick="jump_to_time"]'); + +function jumpToTime(e) { + e.preventDefault(); + + const link = e.target; + const video = document.getElementById('video'); + const time = link.dataset.jumpTime; + + video.currentTime = time; + + window.location.hash = 'top'; // Add #video to the URL + + setTimeout(() => { + history.replaceState(null, null, ' '); // Remove #video after 1 second + }, 250); +} + +a.forEach(link => { + const href = link.getAttribute('href'); + if (link.dataset.jumpTime) { + link.removeAttribute('href'); + } + + if (href && href.includes('&t=')) { + const params = new URLSearchParams(href.split('?')[1]); + const time = params.get('t'); + + if (time) { + link.dataset.jumpTime = time; + link.addEventListener('click', jumpToTime); + link.removeAttribute('href'); + } + } +}); + + const urls = document.querySelectorAll('a[href*="/watch?v="]'); // get all links with "/watch?v=" in href attribute const spinner = document.createElement('div'); @@ -1545,6 +1591,7 @@ urls.forEach(link => { } console.log(`Fetched ${url.origin}`); fetchedCount++; + console.clear() if (fetchedCount === urls.length) { spinner.classList.add('hide'); @@ -1556,7 +1603,7 @@ urls.forEach(link => { .catch(error => { spinner.classList.add('hide'); text.classList.add('hide'); - + console.clear() // Ignore network errors if (!(error instanceof TypeError && error.message.includes('Failed to fetch'))) { console.error(`Error fetching ${url.origin}: ${error}`); @@ -2118,7 +2165,7 @@ More Epic options owo~ <% if (optout) { %> <% } %> <% if (!optout) { %> - • + • Opt out of Metrics (Wut?) <% } %> <% if (lyrics && !r) { %> @@ -2329,7 +2376,7 @@ More Epic options owo~ <% } %> <% if (optout) { %> - <%=x.duration %> + <%=x.duration %> <% } %>
@@ -2338,7 +2385,7 @@ More Epic options owo~ <%= x.Title %> <% } %> <% if (optout) { %> - <%= x.Title %> + <%= x.Title %> <% } %>
<%=x.Channel.Name %>
@@ -2360,7 +2407,7 @@ More Epic options owo~ <% } %> <% if (optout) { %> - <%=x.duration %> + <%=x.duration %> <% } %>
@@ -2368,7 +2415,7 @@ More Epic options owo~ <%= x.Title %> <% } %> <% if (optout) { %> - <%= x.Title %> + <%= x.Title %> <% } %>