-
-
Notifications
You must be signed in to change notification settings - Fork 135
Commit
This commit does not belong to any branch on this repository, and may belong to a fork outside of the repository.
Merge pull request #369 from KUKHUA/main
add css framework, add cookie opt out form, add tv
- Loading branch information
Showing
9 changed files
with
815 additions
and
0 deletions.
There are no files selected for viewing
Large diffs are not rendered by default.
Oops, something went wrong.
This file contains bidirectional Unicode text that may be interpreted or compiled differently than what appears below. To review, open the file in an editor that reveals hidden Unicode characters.
Learn more about bidirectional Unicode characters
Original file line number | Diff line number | Diff line change |
---|---|---|
@@ -0,0 +1,156 @@ | ||
<!DOCTYPE html> | ||
<html lang="en"> | ||
<head> | ||
<meta charset="UTF-8"> | ||
<meta name="viewport" content="width=device-width, initial-scale=1.0"> | ||
<title>Opt-Out Form</title> | ||
<link rel="stylesheet" href="../../assets/css/bulma.min.css"> | ||
<style> | ||
.question { | ||
margin-bottom: 20px; | ||
} | ||
.question label { | ||
font-weight: bold; | ||
} | ||
.question input { | ||
margin-top: 10px; | ||
} | ||
</style> | ||
</head> | ||
<body> | ||
<section class="section"> | ||
<div class="container"> | ||
<h1 class="title has-text-centered">Opt-Out Form</h1> | ||
<form id="optOutForm"> | ||
<div class="field" id="questionContainer"> | ||
<!-- Questions will be added here --> | ||
</div> | ||
<div class="control has-text-centered"> | ||
<button class="button is-primary is-large" type="button" id="nextQuestionButton" onclick="addQuestion()">Next Question</button> | ||
</div> | ||
<div class="control has-text-centered" style="margin-top: 20px;"> | ||
<button class="button is-danger is-large" type="submit" id="submitButton" disabled>Submit</button> | ||
</div> | ||
<p class="has-text-centered" id="statusMessage"></p> | ||
</form> | ||
</div> | ||
</section> | ||
|
||
<script> | ||
const questions = [ | ||
"Why do you want to opt-out of cookies?", | ||
"Do you understand the benefits of cookies?", | ||
"Have you experienced any issues with cookies on our site?", | ||
"Do you prefer a more personalized browsing experience?", | ||
"Are you concerned about your privacy online?", | ||
"How often do you clear your browser cookies?", | ||
"Do you use any browser extensions to manage cookies?", | ||
"Have you read our cookie policy?", | ||
"Do you know how cookies help improve website performance?", | ||
"Are you aware of the different types of cookies (e.g., session, persistent, third-party)?", | ||
"Do you think cookies are essential for website functionality?", | ||
"Would you like to receive fewer targeted ads?", | ||
"Do you use multiple devices to access our website?", | ||
"Have you opted out of cookies on other websites?", | ||
"Do you feel informed about how cookies are used on our site?", | ||
"Would you like to learn more about cookies and their benefits?", | ||
"Do you think our website should offer more control over cookie settings?", | ||
"Have you ever had a negative experience due to cookies?", | ||
"Do you think cookies impact your online security?", | ||
"Would you recommend opting out of cookies to others?", | ||
"Do you think cookies affect your browsing speed?", | ||
"Have you noticed any changes in website functionality after opting out of cookies?", | ||
"Do you think cookies are necessary for online shopping?", | ||
"Are you aware of how cookies are used in online advertising?", | ||
"Do you think cookies help in providing a better user experience?", | ||
"Have you ever contacted customer support regarding cookie issues?", | ||
"Do you think our website provides enough information about cookies?", | ||
"Would you like to see more transparency about cookie usage?", | ||
"Do you think cookies should be regulated more strictly?", | ||
"Have you ever changed your cookie settings on our website?", | ||
"Do you believe cookies have a soul?", | ||
"If cookies could talk, what do you think they would say?", | ||
"Have you ever dreamt about cookies?", | ||
"Do you think cookies have a secret society?", | ||
"What is the most embarrassing thing you've done while eating a cookie?", | ||
"If you were a cookie, what kind would you be and why?", | ||
"Do you think cookies judge you?", | ||
"Have you ever tried to have a conversation with a cookie?", | ||
"Do you believe in cookie magic?", | ||
"What is the most outrageous thing you've heard about cookies?", | ||
"Do you think cookies have a sense of humor?", | ||
"Have you ever had a cookie that tasted suspiciously like another food?", | ||
"Do you think cookies are aware of their deliciousness?", | ||
"If you could have a superpower related to cookies, what would it be?", | ||
"Do you think cookies have a preference for certain types of milk?", | ||
"Have you ever felt a deep emotional connection to a cookie?", | ||
"Do you think cookies can predict the future?", | ||
"What is the most unusual place you've ever eaten a cookie?", | ||
"Have you ever had a cookie that changed your life?", | ||
"Do you think cookies are sentient beings?", | ||
"If cookies could travel, where do you think they would go?", | ||
"Do you think cookies have a secret language?", | ||
"Have you ever tried to teach a cookie a trick?", | ||
"Do you think cookies have a favorite holiday?", | ||
"What is the most disturbing thing you can imagine happening to a cookie?", | ||
"Do you think cookies have a sense of humor?", | ||
"Have you ever had a cookie that tasted suspiciously like another food?", | ||
"Do you think cookies are aware of their deliciousness?", | ||
"If you could have a superpower related to cookies, what would it be?", | ||
"Do you think cookies have a preference for certain types of milk?", | ||
"Have you ever felt a deep emotional connection to a cookie?", | ||
"Do you think cookies can predict the future?", | ||
"What is the most unusual place you've ever eaten a cookie?", | ||
"Have you ever had a cookie that changed your life?", | ||
"Do you think cookies are sentient beings?", | ||
"If cookies could travel, where do you think they would go?", | ||
"Do you think cookies have a secret language?", | ||
"Have you ever tried to teach a cookie a trick?", | ||
"Do you think cookies have a favorite holiday?", | ||
"What is the most disturbing thing you can imagine happening to a cookie?" | ||
]; | ||
|
||
let questionCount = 0; | ||
|
||
function getRandomQuestion() { | ||
const randomIndex = Math.floor(Math.random() * questions.length); | ||
return questions[randomIndex]; | ||
} | ||
|
||
function addQuestion() { | ||
if (questionCount < 10) { | ||
const questionContainer = document.getElementById('questionContainer'); | ||
const newQuestion = document.createElement('div'); | ||
newQuestion.className = 'field question'; | ||
newQuestion.innerHTML = ` | ||
<label class="label">${getRandomQuestion()}</label> | ||
<div class="control"> | ||
<input class="input" type="text" name="answer"> | ||
</div> | ||
`; | ||
questionContainer.appendChild(newQuestion); | ||
questionCount++; | ||
|
||
if (questionCount === 10) { | ||
document.getElementById('submitButton').disabled = true; | ||
document.getElementById('statusMessage').innerText = "You are currently in the wait queue for cookie opt-out form submissions, you are " + getRandomNumber(1, 100) + "th in line. We estimate it will take " + getRandomNumber(1, 30) + " more minutes."; | ||
setInterval(updateQueueStatus, 30000); | ||
} else { | ||
document.getElementById('statusMessage').innerText = (10 - questionCount) + " more questions left."; | ||
} | ||
} | ||
} | ||
|
||
function getRandomNumber(min, max) { | ||
return Math.floor(Math.random() * (max - min + 1)) + min; | ||
} | ||
|
||
function updateQueueStatus() { | ||
document.getElementById('statusMessage').innerText = "You are currently in the wait queue for cookie opt-out form submissions, you are " + getRandomNumber(1, 100) + "th in line. We estimate it will take " + getRandomNumber(1, 30) + " more minutes."; | ||
} | ||
|
||
// Add the first question when the page loads | ||
window.onload = addQuestion; | ||
</script> | ||
</body> | ||
</html> |
This file contains bidirectional Unicode text that may be interpreted or compiled differently than what appears below. To review, open the file in an editor that reveals hidden Unicode characters.
Learn more about bidirectional Unicode characters
Large diffs are not rendered by default.
Oops, something went wrong.
This file contains bidirectional Unicode text that may be interpreted or compiled differently than what appears below. To review, open the file in an editor that reveals hidden Unicode characters.
Learn more about bidirectional Unicode characters
Original file line number | Diff line number | Diff line change |
---|---|---|
@@ -0,0 +1,42 @@ | ||
<!DOCTYPE html> | ||
<html lang="en"> | ||
<head> | ||
<meta charset="UTF-8"> | ||
<meta name="viewport" content="width=device-width, initial-scale=1.0"> | ||
<title>SLOPTV</title> | ||
<link rel="stylesheet" href="tv_style.css"> | ||
<script src="tv_script.js"></script> | ||
<script src="tv_menu.js"></script> | ||
<script src="hls.min.js"></script> | ||
</head> | ||
<body> | ||
<main class="scanlines"> | ||
<div class="screen" id="screen"> | ||
<canvas id="canvas" class="picture"></canvas> | ||
<div class="overlay"> | ||
<div class="text" id="corner-text"> | ||
<span>SLOPTV</span> | ||
</div> | ||
<div id="menu" class="menu"> | ||
<header> | ||
CHANNEL: | ||
</header> | ||
<ul> | ||
<li class="inactive"><a href="https://adultswim-vodlive.cdn.turner.com/live/rick-and-morty/stream.m3u8"> | ||
Rick and Morty</a></li> | ||
<li class="inactive"><a href="https://english-livebkali.cgtn.com/live/doccgtn.m3u8"> | ||
Chinese Propaganda</a></li> | ||
<li class="inactive"><a href="https://lotus.stingray.com/manifest/classica-cla008-montreal/samsungtvplus/master.m3u8"> | ||
Classical Music</a></li> | ||
<li class="inactive"><a href="https://247preview.foxnews.com/hls/live/2020027/fncv3preview/primary.m3u8"> | ||
Anime Girls 24/7</a></li> | ||
</ul> | ||
<footer> | ||
<span onclick="toggleMenu();" style="font-size: 22px;">ESC Hide, Enter Select, Arrows Move</span> | ||
</footer> | ||
</div> | ||
</div> | ||
</div> | ||
</main> | ||
</body> | ||
</html> |
Binary file added
BIN
+419 KB
LIVE/tv/tv_audio/546047__grcekh__analog-crt-tv-electronic-static-noise.m4a
Binary file not shown.
This file contains bidirectional Unicode text that may be interpreted or compiled differently than what appears below. To review, open the file in an editor that reveals hidden Unicode characters.
Learn more about bidirectional Unicode characters
Original file line number | Diff line number | Diff line change |
---|---|---|
@@ -0,0 +1,102 @@ | ||
async function startChannel(url) { | ||
// Remove all existing video elements | ||
var video = document.getElementById('video'); | ||
if (video) | ||
video.parentNode.removeChild(video); | ||
// Use hls.js to play the video | ||
// Make sure the video has crt effect and is affected by css | ||
if (Hls.isSupported()) { | ||
var video = document.createElement('video'); | ||
video.autoplay = true; | ||
video.controls = true; | ||
video.id = 'video'; | ||
video.classList.add('picture'); | ||
document.getElementById('screen').appendChild(video); | ||
|
||
var hls = new Hls(); | ||
hls.loadSource(url); | ||
hls.attachMedia(video); | ||
|
||
await video.play(); | ||
|
||
// Apply bad audio quality effect | ||
var audioContext = new (window.AudioContext || window.webkitAudioContext)(); | ||
var source = audioContext.createMediaElementSource(video); | ||
var biquadFilter = audioContext.createBiquadFilter(); | ||
var distortion = audioContext.createWaveShaper(); | ||
var gainNode = audioContext.createGain(); | ||
var noiseGainNode = audioContext.createGain(); | ||
|
||
// Set biquad filter to a low-pass filter to reduce audio quality | ||
biquadFilter.type = 'lowpass'; | ||
biquadFilter.frequency.value = 1000; // Adjust frequency to make it sound worse | ||
|
||
// Add distortion | ||
distortion.curve = new Float32Array([-1, 1]); | ||
distortion.oversample = '4x'; | ||
|
||
// Create white noise | ||
var bufferSize = 2 * audioContext.sampleRate; | ||
var noiseBuffer = audioContext.createBuffer(1, bufferSize, audioContext.sampleRate); | ||
var output = noiseBuffer.getChannelData(0); | ||
for (var i = 0; i < bufferSize; i++) { | ||
output[i] = Math.random() * 2 - 1; | ||
} | ||
var whiteNoise = audioContext.createBufferSource(); | ||
whiteNoise.buffer = noiseBuffer; | ||
whiteNoise.loop = true; | ||
|
||
// Set gain for noise | ||
noiseGainNode.gain.value = 0.01; // Adjust volume of static noise | ||
|
||
// Connect nodes | ||
source.connect(biquadFilter); | ||
biquadFilter.connect(gainNode); | ||
gainNode.connect(distortion); | ||
distortion.connect(audioContext.destination); | ||
|
||
whiteNoise.connect(noiseGainNode); | ||
noiseGainNode.connect(audioContext.destination); | ||
whiteNoise.start(0); | ||
|
||
// Add CRT whine audio | ||
let crtWhine = new Audio("tv_audio/546047__grcekh__analog-crt-tv-electronic-static-noise.m4a"); | ||
crtWhine.loop = true; | ||
crtWhine.play(); | ||
} | ||
} | ||
|
||
function toggleMenu() { | ||
var menu = document.getElementById('menu'); | ||
menu.style.display = menu.style.display === 'block' ? 'none' : 'block'; | ||
} | ||
|
||
document.addEventListener('keydown', function(e) { | ||
(async () => { | ||
if(e.ctrlKey || e.key == 'Escape'){ | ||
// hide video | ||
var video = document.getElementById('video'); | ||
|
||
if(video) | ||
video.style.display = 'none'; | ||
|
||
toggleMenu(); | ||
|
||
if(video) | ||
video.style.display = 'block'; | ||
} | ||
|
||
if(e.key === 'Enter'){ | ||
var url = document.querySelector('.active a').href; | ||
await startChannel(url); | ||
} | ||
|
||
if(e.key === ' '){ | ||
let video = document.getElementById('video'); | ||
let cornerText = document.getElementById('corner-text'); | ||
if(video) | ||
video.paused ? video.play() : video.pause(); | ||
video.paused ? cornerText.textContent = 'PAUSED' : cornerText.textContent = 'SLOPTV'; | ||
} | ||
})(); | ||
}); |
Oops, something went wrong.