Skip to content

Commit

Permalink
Update pierre.html
Browse files Browse the repository at this point in the history
  • Loading branch information
hcr5 authored Aug 17, 2024
1 parent 79b95e0 commit beedf13
Showing 1 changed file with 62 additions and 111 deletions.
173 changes: 62 additions & 111 deletions pierre.html
Original file line number Diff line number Diff line change
Expand Up @@ -11,10 +11,9 @@
display: flex;
align-items: center;
justify-content: center;
font-family: 'Arial', sans-serif;
font-family: Arial, sans-serif;
background-color: #ffffff;
}

.container {
max-width: 600px;
width: 100%;
Expand All @@ -23,27 +22,22 @@
border: 3px solid #4682b4;
box-shadow: 0 4px 8px rgba(0, 0, 0, 0.2);
text-align: center;
position: relative;
overflow: hidden;
}

p {
font-size: 18px;
color: #333;
margin: 10px 0;
}

input[type="number"] {
font-size: 16px;
padding: 8px;
border: 2px solid #4682b4;
transition: transform 0.2s ease;
}

input[type="number"]:focus {
transform: scale(1.05) rotate(2deg);
}

button {
font-size: 20px;
padding: 10px 20px;
Expand All @@ -52,49 +46,27 @@
border: 2px solid #228b22;
cursor: pointer;
transition: background-color 0.3s ease, transform 0.2s ease;
animation: shake 0.5s infinite;
}

button:hover {
background-color: #228b22;
}

button:active {
transform: scale(0.95);
}

h1 {
font-size: 48px;
color: #ff4500;
margin-top: 20px;
animation: jitter 1s infinite;
}

hr {
border: 2px solid #4682b4;
width: 70%;
margin: 20px auto;
}

@keyframes shake {
0%, 100% {
transform: rotate(-2deg);
}
50% {
transform: rotate(2deg);
}
}

@keyframes jitter {
0% {
transform: translateX(-2px);
}
50% {
transform: translateX(2px);
}
100% {
transform: translateX(-2px);
}
0%, 100% { transform: translateX(-2px); }
50% { transform: translateX(2px); }
}
</style>
</head>
Expand All @@ -110,106 +82,55 @@
</form>
<hr>
<button onclick="daargaanwe()">Start!</button>
<button onclick="stopTimer()">Stop</button>
<h1 id="klok"></h1>
<audio hidden id="tik" src="tick.mp3"></audio>
<p id="count">Training 0/0</p>
<audio hidden id="win" src="win.mp3"></audio>
<script>
let timer;
let stopRequested = false;

const aanmoedigingen = [
"jullie kunnen het",
"ik geloof in je",
"nog even!",
"denk aan iets leuks!",
"houd vol!",
"je bent bijna daar!",
"je doet het geweldig!",
"blijf doorgaan!",
"je bent sterk!",
"je hebt dit!",
"je hebt het in je!",
"je kunt het aan!",
"ik ben trots op je!",
"blijf positief!",
"je bent bijna bij je doel!",
"je hebt al veel bereikt!",
"je kunt het voor elkaar krijgen!",
"zet door!",
"je bent een winnaar!",
"je bent op de goede weg!",
"houd je focus!",
"je doet je best!",
"je kunt dit aan!",
"ik sta achter je!",
"je bent fantastisch!",
"je verdient dit!",
"je kunt meer dan je denkt!",
"je hebt de kracht!",
"je maakt vooruitgang!",
"je bent een doorzetter!",
"je hebt dit onder controle!",
"je bent onvermoeibaar!",
"je bent een inspiratie!",
"je doet het prima!",
"je hebt een geweldige houding!",
"je bent op de goede weg!",
"je gaat het halen!",
"je bent een topper!",
"je hebt alles wat je nodig hebt!",
"je bent echt geweldig!",
"je blijft indrukwekkend!",
"je bent bijna bij het eind!",
"je kunt het!",
"ik geloof in je talent!",
"je bent een toffe gozer!",
"smook veep",
"poep konsump",
"wie geht es?",
"konzumtione von puup",
"wo is der toilette",
"puup",
"fart",
"fartje",
"eepking",
"deze website is mede mogelijk gemaakt door aftrotek ink"
"jullie kunnen het", "ik geloof in je", "nog even!", "denk aan iets leuks!",
"houd vol!", "je bent bijna daar!", "je doet het geweldig!", "blijf doorgaan!",
"je bent sterk!", "je hebt dit!", "je hebt het in je!", "je kunt het aan!",
"ik ben trots op je!", "blijf positief!", "je bent bijna bij je doel!", "je hebt al veel bereikt!",
"je kunt het voor elkaar krijgen!", "zet door!", "je bent een winnaar!", "je bent op de goede weg!",
"houd je focus!", "je doet je best!", "je kunt dit aan!", "ik sta achter je!",
"je bent fantastisch!", "je verdient dit!", "je kunt meer dan je denkt!", "je hebt de kracht!",
"je maakt vooruitgang!", "je bent een doorzetter!", "je hebt dit onder controle!",
"je bent onvermoeibaar!", "je bent een inspiratie!", "je doet het prima!", "je hebt een geweldige houding!",
"je bent op de goede weg!", "je gaat het halen!", "je bent een topper!", "je hebt alles wat je nodig hebt!",
"je bent echt geweldig!", "je blijft indrukwekkend!", "je bent bijna bij het eind!", "je kunt het!",
"ik geloof in je talent!", "je bent een toffe gozer!"
];

function sleep(ms) {
return new Promise(resolve => setTimeout(resolve, ms));
}

const geluid = document.getElementById("tik");
geluid.volume = 0.5;

const win = document.getElementById("win");

function playBeep() {
const audioContext = new (window.AudioContext || window.webkitAudioContext)();
const oscillator = audioContext.createOscillator();
const gainNode = audioContext.createGain();

oscillator.type = 'sine';
oscillator.frequency.setValueAtTime(1500, audioContext.currentTime);
oscillator.connect(gainNode);
gainNode.connect(audioContext.destination);
gainNode.gain.setValueAtTime(0.2, audioContext.currentTime);

oscillator.connect(audioContext.destination);
oscillator.start();
setTimeout(() => oscillator.stop(), 100);
}

async function playAanmoediging() {
const randomIndex = Math.floor(Math.random() * aanmoedigingen.length);
const aanmoediging = aanmoedigingen[randomIndex];
const response = await fetch(`https://synthesis-service.scratch.mit.edu/synth?locale=nl-NL&gender=male&text=${encodeURIComponent(aanmoediging)}`);
const response = await fetch(`https://synthesis-service.scratch.mit.edu/synth?locale=nl-NL&gender=male&text=${encodeURIComponent(aanmoedigingen[randomIndex])}`);
const audioBlob = await response.blob();
const audioUrl = URL.createObjectURL(audioBlob);
const audio = new Audio(audioUrl);
const audio = new Audio(URL.createObjectURL(audioBlob));
audio.play();
}

async function check(number) {
if (number <= 3) {
playBeep();
}
function updateCount(trainingNumber, totalRepetitions) {
document.getElementById("count").textContent = `Training ${trainingNumber}/${totalRepetitions}`;
}

async function daargaanwe() {
Expand All @@ -218,24 +139,54 @@ <h1 id="klok"></h1>
const pauseTime = parseInt(document.getElementById("pause_time").value);
const repetitions = parseInt(document.getElementById("wieviel").value);

let completed = 0;

for (let j = repetitions; j >= 1; j--) {
if (stopRequested) break;
updateCount(completed + 1, repetitions);
for (let i = pauseTime; i >= 1; i--) {
if (stopRequested) break;
klok.textContent = i;
check(i);
if (i <= 3) playBeep();
await sleep(1000);
}
if (stopRequested) break;
for (let i = trainTime; i >= 1; i--) {
if (stopRequested) break;
if (i <= 3) playBeep();
klok.textContent = i;
check(i);
if (Math.random() < 1 / 4) {
playAanmoediging();
}
if (i % 4 === 0) await playAanmoediging();
await sleep(1000);
}
completed++;
}

if (!stopRequested) {
updateCount(completed, repetitions);
klok.textContent = "KLAAR! 👺";
win.play();
}
stopRequested = false; // Reset the stop flag
}

function stopTimer() {
stopRequested = true;
}

function init() {
function updateInitialCount() {
const trainTime = parseInt(document.getElementById("train_time").value) || 0;
const pauseTime = parseInt(document.getElementById("pause_time").value) || 0;
const repetitions = parseInt(document.getElementById("wieviel").value) || 0;
updateCount(0, repetitions);
}
klok.textContent = "KLAAR! 👺";
win.play();

document.getElementById("train_time").addEventListener("input", updateInitialCount);
document.getElementById("pause_time").addEventListener("input", updateInitialCount);
document.getElementById("wieviel").addEventListener("input", updateInitialCount);
}

init();
</script>
</div>
</body>
Expand Down

0 comments on commit beedf13

Please sign in to comment.