Skip to content

Commit

Permalink
Merge pull request #369 from KUKHUA/main
Browse files Browse the repository at this point in the history
add css framework, add cookie opt out form, add tv
  • Loading branch information
Dishpit authored Jan 5, 2025
2 parents 15e5c4d + 6eda016 commit 4279978
Show file tree
Hide file tree
Showing 9 changed files with 815 additions and 0 deletions.
3 changes: 3 additions & 0 deletions LIVE/assets/css/bulma.min.css

Large diffs are not rendered by default.

156 changes: 156 additions & 0 deletions LIVE/cookie/opt-out/index.html
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>
45 changes: 45 additions & 0 deletions LIVE/index.html
Original file line number Diff line number Diff line change
Expand Up @@ -2,6 +2,8 @@
<html lang="en">

<head>
<title>Slopify</title>
<link rel="stylesheet" href="assets/css/bulma.min.css"><link>
<meta charset="UTF-8">
<meta name="viewport" content="width=device-width, initial-scale=1.0">
<script src="src/static/js/speech.js"></script>
Expand All @@ -16,6 +18,48 @@
</head>

<body>
<nav class="navbar" role="navigation" aria-label="main navigation">
<div class="navbar-brand">
<a class="navbar-item" href="#">
<h1 class="title">Slopify - S1</h1>
</a>
<a role="button" class="navbar-burger" aria-label="menu" aria-expanded="false" data-target="navbarBasicExample">
<span aria-hidden="true"></span>
<span aria-hidden="true"></span>
<span aria-hidden="true"></span>
</a>
</div>

<div id="navbarBasicExample" class="navbar-menu">
<div class="navbar-start">
<a class="navbar-item" href="#">
Home
</a>
<a class="navbar-item" href="tv/">
SlopTV
</a>
</div>

<div class="navbar-end">
<div class="navbar-item">
<div class="buttons">
<a class="button is-primary" href="#">
<strong>Sign up</strong>
</a>
<a class="button is-light" href="#">
Log in
</a>
</div>
</div>
</div>
</div>
</nav>

<div class="notification is-warning">
Hey there! Just so you know, we use cookies. Not the delicious kind, but the ones that track your every move. Enjoy!
You can opt out by clicking <a href="cookie/opt-out">here.</a>
</div>

<a href="https://sleepie.dev/femboy-not-gay" target="_blank">Why its not gay to like femboys</a>
<header>
<h1>Welcome to slopify.dev season 1 LIVE AND DIRECT</h1>
Expand All @@ -42,6 +86,7 @@ <h3>Haiku of the day:</h3>
});
}
});

<iframe width="560" height="315" src="https://www.youtube.com/embed/mFfYORTqzog?si=i3uW4a8OnDXaAKEI" title="YouTube video player" allow="accelerometer; autoplay; clipboard-write; encrypted-media; gyroscope; picture-in-picture; web-share" referrerpolicy="strict-origin-when-cross-origin" allowfullscreen></iframe>
<img src="https://sleepie.dev/i/dumbass.gif">
</body>
Expand Down
2 changes: 2 additions & 0 deletions LIVE/tv/hls.min.js

Large diffs are not rendered by default.

42 changes: 42 additions & 0 deletions LIVE/tv/index.html
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 not shown.
102 changes: 102 additions & 0 deletions LIVE/tv/tv_menu.js
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';
}
})();
});
Loading

0 comments on commit 4279978

Please sign in to comment.