This commit is contained in:
nin0dev 2024-08-02 10:37:28 -04:00
commit 0f26c1904b
2 changed files with 714 additions and 37 deletions

View file

@ -380,9 +380,6 @@ a[data-onclick="jump_to_time"] {
<link href="/css/poketube.css?v=948934774844" rel=stylesheet>
<!-- css files end -->
<link href="https://vjs.zencdn.net/7.17.0/video-js.css" rel="stylesheet" />
<script src="https://vjs.zencdn.net/7.17.0/video.min.js"></script>
<% if (k.Video.Channel.Name == "7clouds") { %>
<style>
@font-face {
@ -600,7 +597,98 @@ background-color: #0000;
top: 0;
}
#controls {
display: flex;
visibility: hidden;
position: absolute;
bottom: 0;
margin-bottom: 70px !important;
margin: 0 20px;
width: 100%;
align-items:flex-end;
}
video:hover~#controls, #controls:hover {
visibility: visible;
}
.control-button {
width: 40px;
border-radius: 5px;
margin-bottom: 6px;
padding: 3px
}
.video-player-container {
position: relative;
}
.control-button svg {
fill: #c59cd0;
width: 40px;
margin-bottom: -6px;
}
#seekbar {
display: flex;
margin-left: 20px;
margin-right: 20px;
width: 100%;
}
input[id*="-slider"] {
flex-grow: 1;
-webkit-appearance: none;
appearance: none;
background: #ffffff;
border: 1px solid #000000;
margin-bottom: 23px;
cursor: pointer;
width: 0.5rem;
height: 5px !important;
display: block;
border-radius: 50px;
}
input[type=range]::-webkit-slider-thumb {
-webkit-appearance: none;
border: 1px solid #000000;
height: 21px;
width: 21px;
border-radius: 20px;
background: var(--div-gradient);
cursor: pointer;
box-shadow: 1px 1px 1px #000000, 0px 0px 1px #0d0d0d;
}
input[type=range]::-moz-range-thumb {
border: 1px solid #000000;
height: 21px;
width: 21px;
border-radius: 20px;
background: var(--div-gradient);
cursor: pointer;
box-shadow: 1px 1px 1px #000000, 0px 0px 1px #0d0d0d;
}
#timestamps {
margin-right: 40px;
text-shadow: 1px 1px 2px black;
}
html:fullscreen video {
display: block !important;
position: fixed !important;
top: 0 !important;
left: 0 !important;
width: 100vw !important;
height: 100vh !important;
z-index: 999999 !important;
}
html:fullscreen *:not(html, video, body, ptd-app-ejs, .app, .watch-page, .primary, .video-player-container, #popupMenu, #popupMenu *) {
visibility: hidden !important;
}
.error-card {
background-color: #823434aa;
margin: 30px;
padding: 5px 20px;
border: 2px solid red;
border-radius: 10px;
}
#buffer-failed-warning {
display: none;
}
.rainbow-gradient {
background: linear-gradient(to right, red, orange, yellow, green, blue, indigo, violet);
-webkit-background-clip: text;
@ -616,9 +704,352 @@ background-color: #0000;
</style>
</noscript>
<script>
const qua = new URLSearchParams(new URL(window.location.href).search).get("quality") || "";
const playSVG = '<svg xmlns="http://www.w3.org/2000/svg" viewBox="0 0 24 24"><title>play-circle-outline</title><path d="M12,20C7.59,20 4,16.41 4,12C4,7.59 7.59,4 12,4C16.41,4 20,7.59 20,12C20,16.41 16.41,20 12,20M12,2A10,10 0 0,0 2,12A10,10 0 0,0 12,22A10,10 0 0,0 22,12A10,10 0 0,0 12,2M10,16.5L16,12L10,7.5V16.5Z" /></svg>'
const pauseSVG = '<svg xmlns="http://www.w3.org/2000/svg" viewBox="0 0 24 24"><title>pause-circle-outline</title><path d="M13,16V8H15V16H13M9,16V8H11V16H9M12,2A10,10 0 0,1 22,12A10,10 0 0,1 12,22A10,10 0 0,1 2,12A10,10 0 0,1 12,2M12,4A8,8 0 0,0 4,12A8,8 0 0,0 12,20A8,8 0 0,0 20,12A8,8 0 0,0 12,4Z" /></svg>'
function csts(seconds) {
var hours = Math.floor(seconds / 3600);
var minutes = Math.floor((seconds - (hours * 3600)) / 60);
var secs = Math.floor(seconds - (hours * 3600) - (minutes * 60));
if (hours === 0) {
var timeString = minutes.toString().padStart(2, '0') + ':' +
secs.toString().padStart(2, '0');
} else {
var timeString = hours.toString().padStart(2, '0') + ':' +
minutes.toString().padStart(2, '0') + ':' +
secs.toString().padStart(2, '0');
}
return timeString;
}
function cstsRemaining(totalTimeInSeconds, elapsedTimeInSeconds) {
var remainingSeconds = totalTimeInSeconds - elapsedTimeInSeconds;
var hours = Math.floor(remainingSeconds / 3600);
var minutes = Math.floor((remainingSeconds % 3600) / 60);
var secs = Math.floor(remainingSeconds % 60);
var timeString;
if (hours === 0) {
timeString = minutes.toString().padStart(2, '0') + ':' + secs.toString().padStart(2, '0');
} else {
timeString = hours.toString().padStart(2, '0') + ':' + minutes.toString().padStart(2, '0') + ':' + secs.toString().padStart(2, '0');
}
return '-' + timeString;
}
function showErrorCard(e) {
try {
switch (e.target.error.code) {
case e.target.error.MEDIA_ERR_ABORTED:
return;
break;
case e.target.error.MEDIA_ERR_NETWORK:
document.querySelector("div p span").innerText = "(Network error)"
break;
case e.target.error.MEDIA_ERR_DECODE:
document.querySelector("div p span").innerText = "(Decode error/lack of browser support)"
break;
case e.target.error.MEDIA_ERR_SRC_NOT_SUPPORTED:
document.querySelector("div p span").innerText = "(Network error or format not supported)"
break;
default:
document.querySelector("div p span").innerText = "(Unknown error)"
break;
}
}
catch {
document.querySelector("div p span").innerText = "(Network error)"
}
document.getElementById("buffer-failed-warning").style.display = "block";
}
let canPlayPause = true;
let didFirstTimePlay = false;
document.addEventListener("DOMContentLoaded", () => {
setInterval(()=>{
if(!document.getElementById("video").paused) {
document.getElementById("play-pause").innerHTML = pauseSVG;
}
else {
aud.pause()
document.getElementById("play-pause").innerHTML = playSVG;
}
}, 100);
//FIXME: saved playback intentionally overwritten
localStorage.setItem(`progress-${new URLSearchParams(window.location.search).get('v')}`, 0);
// Controls and high-res playback
//TODO - a
let setTime = false
const seekbar = document.getElementById("duration-slider")
const video = document.getElementById("video");
let shouldUseRemaining = false;
const timestamps = document.getElementById("timestamps");
video.addEventListener("timeupdate", (event) => {
seekbar.value = event.target.currentTime;
timestamps.innerText = shouldUseRemaining ? `${cstsRemaining(video.duration, video.currentTime)}/${csts(video.duration)}` : `${csts(video.currentTime)}/${csts(video.duration)}`;
});
timestamps.addEventListener("mouseover", () => {
shouldUseRemaining = true;
timestamps.innerText = `${cstsRemaining(video.duration, video.currentTime)}/${csts(video.duration)}`;
});
timestamps.addEventListener("mouseout", () => {
shouldUseRemaining = false;
timestamps.innerText = `${csts(video.currentTime)}/${csts(video.duration)}`;
});
// test
seekbar.addEventListener("input", (event) => {
video.pause()
canPlayPause = false;
if(qua != "medium") {
aud.pause()
aud.currentTime = event.target.value
}
video.currentTime = event.target.value
canPlayPause = true;
setTimeout(()=>{
video.play();
aud.play();
}, 200)
});
// Play/Pause
const playPauseButton = document.getElementById("play-pause");
playPauseButton.innerHTML = pauseSVG;
function toggleVideo() {
if(!canPlayPause) return;
if(document.getElementById("popupMenu").style.display == "none") {
if(!document.fullscreen) {
if(!video.paused) {
video.pause(); if(qua != "medium") { aud.pause(); } playPauseButton.innerHTML = playSVG;
}
else {
video.play(); if(qua != "medium") { aud.play(); } playPauseButton.innerHTML = pauseSVG;
}
}
}
else {
document.getElementById("popupMenu").style.display = "none"
}
}
playPauseButton.addEventListener("click", () => {
toggleVideo()
});
video.addEventListener("pause", ()=>{if(qua != "medium") {aud.pause()}});
video.addEventListener("play", ()=>{if(qua != "medium") {aud.play()}})
video.addEventListener("click", toggleVideo);
video.addEventListener("dblclick", () => {
document.documentElement.requestFullscreen();
});
function handleVolumeChange(element) {
switch (element.volume) {
case 1:
element.volume = 0;
document.querySelector("#muteOption #new").innerText = "25%"
document.querySelector("#muteOption #current").innerText = "0%"
break;
case 0:
element.volume = 0.25;
document.querySelector("#muteOption #new").innerText = "50%"
document.querySelector("#muteOption #current").innerText = "25%"
break;
case 0.25:
element.volume = 0.5;
document.querySelector("#muteOption #new").innerText = "75%"
document.querySelector("#muteOption #current").innerText = "50%"
break;
case 0.5:
element.volume = 0.75;
document.querySelector("#muteOption #new").innerText = "100%"
document.querySelector("#muteOption #current").innerText = "75%"
break;
case 0.75:
element.volume = 1;
document.querySelector("#muteOption #new").innerText = "0%"
document.querySelector("#muteOption #current").innerText = "100%"
break;
default:
element.volume = 1;
document.querySelector("#muteOption #new").innerText = "0%"
document.querySelector("#muteOption #current").innerText = "100%"
break;
}
}
document.getElementById("muteOption").addEventListener("click", () => {
if(qua != "medium") {
handleVolumeChange(aud)
}
else {
handleVolumeChange(video)
}
});
document.getElementById("syncOption").addEventListener("click", () => {
aud.pause(); video.pause(); playPauseButton.innerHTML = playSVG;
video.currentTime > aud.currentTime ? aud.currentTime = video.currentTime : video.currentTime = aud.currentTime;
playPauseButton.innerHTML = pauseSVG;
});
setTimeout(()=>{
if(!didFirstTimePlay) {
video.addEventListener("seeked", (event) => {
setTimeout(()=>{
canPlayPause = true;
if(video.currentTime==0||aud.currentTime==0) return;
video.pause(); aud.pause(); playPauseButton.innerHTML = playSVG;
},1)
});
aud.addEventListener("seeked", (event) => {
setTimeout(()=>{
if(video.currentTime==0||aud.currentTime==0) return;
video.pause(); aud.pause(); playPauseButton.innerHTML = playSVG;
},1)
});
didFirstTimePlay = true;
}
},100)
document.addEventListener("fullscreenchange", function() {
if(document.fullscreen) {
video.controlsList = "noplaybackrate nodownload"
window.onscroll = function () { window.scrollTo(0, 0); };
document.documentElement.style.overflow = "hidden"
video.controls = true;
}
if(!document.fullscreen) {
video.controlsList = ""
window.onscroll = null;
document.documentElement.style.overflow = null
video.controls = false;
}
});
video.addEventListener("fullscreenchange", () => {
video.fullscreen = false;
document.exitFullscreen();
});
video.addEventListener("contextmenu", (event) => {
if(document.fullscreen) {
event.preventDefault()
const popupMenu = document.getElementById('popupMenu');
if (popupMenu) {
const xPosition = event.clientX + window.pageXOffset;
const yPosition = event.clientY + window.pageYOffset;
popupMenu.style.left = `${xPosition}px`;
popupMenu.style.top = `${yPosition}px`;
}
popupMenu.style.display = "block"
}
});
function startPlayback() {
// Final prepare
seekbar.max = video.duration
const timestamps = document.getElementById("timestamps");
timestamps.innerText = `${csts(video.currentTime)}/${csts(video.duration)}`;
// Show controls
try {
playPauseButton.innerHTML = pauseSVG;
vid.play();
aud.play();
didFirstTimePlay = true;
}
catch {}
if(!setTime) {
//FIXME: saved playback intentionally overwritten
aud.currentTime = 0
vid.currentTime = 0
seekbar.value = 0
setTime = true
}
setTimeout(()=>{
video.addEventListener("seeking", (event) => {
if(!didFirstTimePlay) return;
if(qua != "medium") {
video.pause()
canPlayPause = false;
aud.pause()
aud.currentTime = event.target.currentTime
}
});
}, 500)
}
const aud = document.getElementById("aud");
const vid = document.getElementById("video");
function shouldPlay() {
if(vid.readyState === HTMLMediaElement.HAVE_ENOUGH_DATA) {
startPlayback();
}
}
aud.addEventListener("canplaythrough", shouldPlay);
vid.addEventListener("canplaythrough", shouldPlay);
})
</script>
<% if(shortsui) { %>
<script>
// Function to apply styles after DOM has loaded
function applyStyles() {
const styles = `
.player {
width: fit-content;
margin-left: auto;
margin-right: auto;
height: fit-content;
}
.video-player-container {
max-width: fit-content;
min-width: fit-content;
margin-left: auto;
margin-right: auto;
aspect-ratio: var(--ptd-watch-width-ratio) / var(--ptd-watch-height-ratio);
}
`;
// Create a style element and set its content
const styleElement = document.createElement('style');
styleElement.innerHTML = styles;
// Append the style element to the document head
document.head.appendChild(styleElement);
}
// Event listener to call applyStyles after DOM has loaded
window.onload = applyStyles;
</script>
<% } %>
<% if (inv_vid.author.endsWith(' - Topic')) { %>
<script>
// Function to apply styles after DOM has loaded
function applyStyles() {
const styles = `
.player {
width: fit-content;
margin-left: auto;
margin-right: auto;
height: fit-content;
}
.video-player-container {
max-width: fit-content;
min-width: fit-content;
margin-left: auto;
margin-right: auto;
aspect-ratio: var(--ptd-watch-width-ratio) / var(--ptd-watch-height-ratio);
}
`;
// Create a style element and set its content
const styleElement = document.createElement('style');
styleElement.innerHTML = styles;
// Append the style element to the document head
document.head.appendChild(styleElement);
}
// Event listener to call applyStyles after DOM has loaded
window.onload = applyStyles;
</script>
<% } %>
<% if(dm) { %>
@ -700,28 +1131,16 @@ background-color: #0000;
</script>
<ptd-app-iconfixer>
<script>
document.addEventListener('DOMContentLoaded', function() {
var player = videojs('video');
// Preload the icon image
var iconImage = new Image();
iconImage.src = "/css/yt-ukraine.svg";
<% if (!qua) { //TODO - a %>
<%
let itag = '136'; // Default itag
inv_vid.adaptiveFormats.forEach(format => {
if (format.itag == '298') {
itag = '298';
}
});
%>
player.src([
{ type: "video/mp4", src: "<%=u%>/latest_version?id=<%=inv_vid.videoId%>&itag=<%=itag%>&local=true" },
{ type: "audio/mp3", src: "<%=u%>/latest_version?id=<%=inv_vid.videoId%>&itag=140&local=true" }
]);
<% } else { %>
<% } %>
});
// Wait for the icon image to load before showing it
iconImage.onload = function() {
var iconElement = document.querySelector('link[rel="icon"]');
iconElement.href = iconImage.src;
iconElement.type = "image/svg+xml";
};
</script>
</ptd-app-iconfixer>
<ptd-app-ejs>
@ -843,7 +1262,7 @@ if your domain matches this code you are probably in poketube.fun owo:3
<div class="video-title" style="color:var(--text-color);font-family:var(--text-font-primary);;font-weight:var(--text-header-weight);font-stretch: extra-expanded;margin-top: 0px;margin-bottom: -3px;font-size: larger;line-height: 20.7px;text-align: center;">Options</div>
<a href="/customize" style="text-decoration: none;" class="dropdown__item">
<i class="fa-light fa-brush"></i>
Customize Poke
Customize PokeTube
</a>
<a href="/account-create" style="text-decoration: none;" class="dropdown__item">
@ -994,7 +1413,13 @@ Offical Discord Server! :3
<div id="<%=sha384(inv_vid.videoId)%>" class="video-player-container">
<% if (!qua) { //TODO - a %>
<audio id="aud" preload>
<source src="<%=u%>/latest_version?id=<%=inv_vid.videoId%>&itag=140&local=true" type="video/mp4" onerror="showErrorCard(event)"/>
</audio>
<% } else { %>
<audio id="aud"></audio>
<% } %>
<noscript>
<% if (!qua) { %>
<div id="nojs-high-res-warning" class="error-card">
@ -1002,14 +1427,27 @@ Offical Discord Server! :3
</div>
<% } %>
</noscript>
<video class="video-js player video-ambient-container" id="video" style="border-radius: 16px; box-sizing: border-box; min-width: 100%; display: block;" autoplay controls>
<div id="buffer-failed-warning" class="error-card">
<p>
Oh no, the video couldn't be loaded :(
<br/>
You can try refreshing the page!
<br/>
<span></span>
</p>
</div>
<video class="player video-ambient-container" id="video" style="border-radius: 16px; box-sizing: border-box; min-width: 100%; display: block;" autoplay preload onerror="showErrorCard(event)">
<% if (isvidious) { %>
<% if (!qua) { %>
<source id="my-spanish-audio-track" src="https://eu-proxy.poketube.fun/latest_version?id=<%=inv_vid.videoId%>&itag=18&local=true" type="audio/ogg">
<%
let itag = '136'; // Default itag
inv_vid.adaptiveFormats.forEach(format => {
if (format.itag == '298') {
itag = '298';
}
});
%>
<source src="<%=u%>/latest_version?id=<%=inv_vid.videoId%>&itag=<%=itag%>&local=true" type="video/mp4; codecs=&quot;avc1.64001F, mp4a.40.2&quot;" label="hd720" selected="true" onerror="showErrorCard(event)">
<% } %>
<% if (qua === "medium") { %>
<source src="<%=u%>/latest_version?id=<%=inv_vid.videoId%>&itag=18&local=true" type="video/mp4; codecs=&quot;avc1.64001F, mp4a.40.2&quot;" label="sd360" selected="true" onerror="showErrorCard(event)">
@ -1046,8 +1484,23 @@ Offical Discord Server! :3
<track src="/api/subtitles?v=<%=inv_vid.videoId%>&h=<%= %>" label="<%= video.Subtitles.Subtitle.language.replace("United States","Simplified - USA") %>" kind="subtitles">
<% } %>
</video>
<div id="controls"> <!-- TODO: CONTROLS -->
<button id="play-pause" class="control-button">
<svg xmlns="http://www.w3.org/2000/svg" viewBox="0 0 24 24"><title>play-circle-outline</title><path d="M12,20C7.59,20 4,16.41 4,12C4,7.59 7.59,4 12,4C16.41,4 20,7.59 20,12C20,16.41 16.41,20 12,20M12,2A10,10 0 0,0 2,12A10,10 0 0,0 12,22A10,10 0 0,0 22,12A10,10 0 0,0 12,2M10,16.5L16,12L10,7.5V16.5Z" /></svg>
</button>
<div id="seekbar">
<input type="range" min="0" step="any" value="0" id="duration-slider">
</div>
<p id="timestamps">...</p>
<!--
<div>
<span>volume</span>
<input type="range" min="0" max="1" step="any" value="1" id="volume-slider">
</div>
-->
</div>
<% if (!a) { %>
<canvas width="12" height="6" class="ambient-canvas" id="ambient-canvas-1"></canvas>
<canvas width="12" height="6" class="ambient-canvas" id="ambient-canvas-2"></canvas>
@ -2397,7 +2850,7 @@ a {
<source src="https://eu-proxy.poketube.fun/latest_version?id=<%=inv_vid.videoId%>&itag=136&local=true" type="video/mp4; codecs=&quot;avc1.64001F, mp4a.40.2&quot;" label="hd720" selected="true">
<source src="https://eu-proxy.poketube.fun/latest_version?id=<%=inv_vid.videoId%>&itag=18&local=true" type="video/mp4; codecs=&quot;avc1.64001F, mp4a.40.2&quot;" label="hd720" selected="true">
<% } %>

View file

@ -541,6 +541,230 @@ font-weight: 1000;">You are not alone</h2>
</p>
</div>
<% } %>
<%
const fakeNewsSources = {
"InfoWars": {
category: "conspiracy",
reason: "InfoWars has been widely criticized for promoting conspiracy theories and false information, such as falsely claiming that the Sandy Hook Elementary School shooting was a hoax.",
search: "Is it true that InfoWars promotes conspiracy theories and false information?"
},
"Breitbart": {
category: "conservative",
reason: "Breitbart is known for its extreme political bias and spreading misleading information, including downplaying the severity of COVID-19.",
search: "Is it true that Breitbart spreads misleading information about COVID-19?"
},
"Daily Mail": {
category: "tabloid",
reason: "The Daily Mail is frequently criticized for sensationalism and misinformation, such as publishing misleading health and science stories.",
search: "Is it true that the Daily Mail publishes misleading health and science stories?"
},
"Natural News": {
category: "pseudoscience",
reason: "Natural News promotes pseudoscience and conspiracy theories, including false vaccine claims and unverified health information.",
search: "Is it true that Natural News promotes pseudoscience and false vaccine claims?"
},
"RT news": {
category: "state-sponsored",
reason: "RT is a state-funded media outlet known for promoting Russian government perspectives and biased reporting on international issues.",
search: "Is it true that RT promotes Russian government perspectives and biased reporting?"
},
"Sputnik": {
category: "state-sponsored",
reason: "Sputnik spreads Russian state propaganda and publishes misleading information about Western countries.",
search: "Is it true that Sputnik spreads Russian state propaganda?"
},
"Before It's News": {
category: "conspiracy",
reason: "Before It's News is known for spreading conspiracy theories and fake news, including fabricated stories about global events.",
search: "Is it true that Before It's News spreads conspiracy theories and fake news?"
},
"Your News Wire": {
category: "conspiracy",
reason: "Your News Wire publishes false information and conspiracy theories, including fabricated reports on various topics.",
search: "Is it true that Your News Wire publishes false information and conspiracy theories?"
},
"WorldTruth.TV": {
category: "conspiracy",
reason: "WorldTruth.TV spreads conspiracy theories and pseudoscience, including false health information and other dubious claims.",
search: "Is it true that WorldTruth.TV spreads conspiracy theories and pseudoscience?"
},
"NewsPunch": {
category: "conspiracy",
reason: "NewsPunch publishes false information and conspiracy theories, including unsubstantiated claims about political figures.",
search: "Is it true that NewsPunch publishes false information and conspiracy theories?"
},
"Civic Tribune": {
category: "fake-news",
reason: "Civic Tribune is known for hoaxes and misinformation, including fabricated stories about political events.",
search: "Is it true that Civic Tribune is known for hoaxes and misinformation?"
},
"The Daily Stormer": {
category: "extremist",
reason: "The Daily Stormer promotes hate speech and extremist views, including anti-Semitic and other hateful content.",
search: "Is it true that The Daily Stormer promotes hate speech and extremist views?"
},
"Times of Israel": {
category: "state-sponsored",
reason: "Times of Israel has faced criticism for biased reporting and spreading propaganda, especially regarding the Israel-Palestine conflict.",
search: "Is it true that Times of Israel has biased reporting on the Israel-Palestine conflict?"
},
"Zero Hedge": {
category: "conspiracy",
reason: "Zero Hedge promotes conspiracy theories and financial misinformation, including false claims about market events.",
search: "Is it true that Zero Hedge promotes conspiracy theories and financial misinformation?"
},
"Pravda": {
category: "state-sponsored",
reason: "Pravda is a state-run media outlet known for spreading Russian government propaganda with a history of biased reporting on international events.",
search: "Is it true that Pravda spreads Russian government propaganda?"
},
"Press TV": {
category: "state-sponsored",
reason: "Press TV promotes Iranian government propaganda and often spreads biased information about Western countries.",
search: "Is it true that Press TV promotes Iranian government propaganda?"
},
"Fox News": {
category: "conservative",
reason: "Fox News is often criticized for extreme political bias and misinformation, such as its reporting on the 2020 US election.",
search: "Is it true that Fox News has extreme political bias and misinformation?"
},
"The Blaze": {
category: "conservative",
reason: "The Blaze promotes right-wing viewpoints and sometimes misleading information, including false claims about political figures.",
search: "Is it true that The Blaze promotes misleading information?"
},
"OANN": {
category: "conservative",
reason: "OANN spreads far-right viewpoints and conspiracy theories, including false claims about election fraud.",
search: "Is it true that OANN spreads far-right viewpoints and conspiracy theories?"
},
"Newsmax": {
category: "conservative",
reason: "Newsmax promotes extreme right-wing perspectives and misinformation, including false claims about the COVID-19 pandemic.",
search: "Is it true that Newsmax promotes extreme right-wing perspectives and misinformation?"
},
"Al Jazeera": {
category: "state-sponsored",
reason: "Al Jazeera, a Qatar state-funded media outlet, has a history of promoting government viewpoints and biased reporting on Middle Eastern conflicts.",
search: "Is it true that Al Jazeera promotes government viewpoints and biased reporting?"
},
"The Sun": {
category: "tabloid",
reason: "The Sun is known for sensationalism and often publishes exaggerated or false stories, particularly about celebrities and high-profile topics.",
search: "Is it true that The Sun publishes exaggerated or false stories?"
}
};
const normalizedQuery = q.toLowerCase().replace(/\s+/g, '');
const matchedSource = Object.keys(fakeNewsSources).find(source => normalizedQuery.includes(source.toLowerCase().replace(/\s+/g, '')));
if (q.includes('-debug-news')) {
%>
<div class="container">
<h2 class="debug-title">
<span class="debug-icon">🔍</span> Debug Info
</h2>
<p class="debug-intro">
Here are all the sources and their details:
</p>
<ul class="debug-list">
<% Object.keys(fakeNewsSources).forEach(source => { %>
<li class="debug-item">
<strong><%= source %></strong> - <%= fakeNewsSources[source].reason %> <br>
<a class="debug-link" href="https://www.google.com/search?q=<%= fakeNewsSources[source].search %>">Find more info</a>
</li>
<% }); %>
</ul>
</div>
<% } else if (matchedSource) { %>
<div class="container">
<h2 class="warning-title">
<span class="warning-icon">🚫</span>
<br> Be Cautious with This Source
</h2>
<p class="warning-intro">
Hai there! It looks like you might be looking at info from <strong><%= matchedSource %></strong>, which is known for spreading fake news or propaganda.
</p>
<p class="warning-tips">
Here are some quick tips to check if what you're reading is legit:
</p>
<ul class="tips-list">
<li class="tips-item"><strong>Check the source's rep:</strong> Reliable sites usually have a good track record for being accurate and fair.</li>
<li class="tips-item"><strong>See if other reputable sites are reporting the same news:</strong> If it's just one place, be cautious.</li>
<li class="tips-item"><strong>Use fact-checking sites:</strong> Try <a href="https://www.snopes.com/" class="fact-check-link">Snopes</a> or <a href="https://www.factcheck.org/" class="fact-check-link">FactCheck.org</a>.</li>
<li class="tips-item"><strong>Look at the publication date:</strong> Make sure it's current and not out of context.</li>
<li class="tips-item"><strong>Check for links and citations:</strong> Good articles usually back up their claims with evidence.</li>
</ul>
<p class="warning-info">
For more info on why <strong><%= matchedSource %></strong> might not be reliable, check out a search for:
</p>
<ul class="warning-links">
<li><a class="warning-link" href="https://www.google.com/search?q=<%= fakeNewsSources[matchedSource].search %>"><%= fakeNewsSources[matchedSource].reason %></a></li>
</ul>
<p>wrong filter? <a href="https://codeberg.org/ashley/poke/issues/new">Report :3</p>
</div>
<% } %>
<style>
.container {
max-width: 800px;
margin: 20px auto;
padding: 20px;
border-radius: 8px;
background: #1a1a1a;
box-shadow: 0 2px 4px rgba(0,0,0,0.1);
}
.debug-title, .warning-title {
font-family: 'PokeTube Flex';
font-size: large;
text-align: left;
font-stretch: ultra-expanded;
font-weight: 1000;
}
.debug-icon, .warning-icon {
font-size: 7em;
}
.debug-intro, .warning-intro, .warning-tips, .warning-info {
font-size: 16px;
color: #fff;
margin: 10px 0;
}
.debug-list, .tips-list, .warning-links {
padding: 0;
margin: 0;
list-style: none;
}
.debug-item, .tips-item, .warning-link {
margin-bottom: 10px;
}
.debug-link, .fact-check-link, .warning-link {
color: #007bff;
text-decoration: none;
}
.debug-link:hover, .fact-check-link:hover, .warning-link:hover {
text-decoration: underline;
}
.tips-list {
background-color: #111;
border: 1px solid #ddd;
border-radius: 5px;
padding: 15px;
}
</style>