Fast Stuff - YTVE Edition
About this app
Fast Stuff YTVE Edition is a dynamic web app to track and achieve your fasts efficiently. Engage in a lively interface that motivates you to complete your fasting goals.
Fast Stuff - YTVE Edition Fast Stuff - YTVE Edition 00:00:00 Click Start to Begin Fasting. Start Fasting Stop Fasting Reset
Related apps
Put this on your site
Source
<html>
<head>
<meta charset="utf-8">
<meta http-equiv="X-UA-Compatible" content="IE=edge">
<meta name="viewport" content="width=device-width,initial-scale=1">
<title>Fast Stuff - YTVE Edition</title>
<meta name="description" content="Fast Stuff YTVE Edition is a dynamic web app to track and achieve your fasts efficiently. Engage in a lively interface that motivates you to complete your fasting goals.">
<meta name="keywords" content="Fasting, Fast Tracker, Health, Nutrition, YTVE Edition, Timer, App">
<script src="https://ajax.googleapis.com/ajax/libs/jquery/3.6.0/jquery.min.js" crossorigin="anonymous"></script>
<link rel="stylesheet" href="https://cdn.jsdelivr.net/npm/bootstrap@5.3.3/dist/css/bootstrap.min.css" crossorigin="anonymous">
<script src="https://cdn.jsdelivr.net/npm/bootstrap@5.3.3/dist/js/bootstrap.min.js" crossorigin="anonymous"></script>
<link rel="stylesheet" href="https://cdn.jsdelivr.net/npm/@fortawesome/fontawesome-free@6.6.0/css/fontawesome.min.css" crossorigin="anonymous">
<script type="text/javascript">
try {
let timer;
let totalTime = 0;
let isFasting = false;
document.addEventListener("DOMContentLoaded", function() {
document.getElementById('startButton').addEventListener('click', startFasting);
document.getElementById('stopButton').addEventListener('click', stopFasting);
document.getElementById('resetButton').addEventListener('click', resetFasting);
});
function startFasting() {
if (!isFasting) {
isFasting = true;
document.getElementById('status').textContent = "Fasting Started!";
document.getElementById('status').style.color = "green";
runTimer();
}
}
function runTimer() {
timer = setInterval(() => {
totalTime++;
document.getElementById('timer').textContent = formatTime(totalTime);
}, 1000);
}
function stopFasting() {
if (isFasting) {
isFasting = false;
clearInterval(timer);
document.getElementById('status').textContent = "Fasting Stopped.";
document.getElementById('status').style.color = "red";
}
}
function resetFasting() {
isFasting = false;
clearInterval(timer);
totalTime = 0;
document.getElementById('timer').textContent = "00:00:00";
document.getElementById('status').textContent = "Click Start to Begin Fasting.";
document.getElementById('status').style.color = "black";
}
function formatTime(seconds) {
const hours = Math.floor(seconds / 3600);
const minutes = Math.floor((seconds % 3600) / 60);
const secs = seconds % 60;
return (hours < 10 ? '0' + hours : hours) + ':' +
(minutes < 10 ? '0' + minutes : minutes) + ':' +
(secs < 10 ? '0' + secs : secs);
}
} catch (error) {
throw error;
}
</script>
<style>
body {
background: linear-gradient(135deg, #f6d275 10%, #fda085 100%);
color: #333;
font-family: 'Arial', sans-serif;
}
#main-container {
text-align: center;
margin-top: 50px;
}
h1 {
font-weight: bold;
color: #3a2a2a;
}
.btn-custom {
background-color: #007bff;
color: #fff;
}
.btn-custom:hover {
background-color: #0056b3;
}
#timer {
font-size: 2em;
margin-top: 20px;
color: #007bff;
text-shadow: 2px 2px #fff;
}
</style>
</head>
<body>
<div id="main-container" class="container">
<h1>Fast Stuff - YTVE Edition</h1>
<div id="timer">00:00:00</div>
<p id="status">Click Start to Begin Fasting.</p>
<div>
<button id="startButton" class="btn btn-custom">Start Fasting</button>
<button id="stopButton" class="btn btn-custom">Stop Fasting</button>
<button id="resetButton" class="btn btn-custom">Reset</button>
</div>
</div>
</body>
</html>
NEW APPS
These are apps made by the community!