Pet Feeding Tracker - no apps, no download, just use this webpage

Pet Feeding Tracker - no apps, no download, just use this webpage



ah, I searched the internet for a simple and efficient way to create a feeding tracker for my pet and the results I got was go and download an app.  I was thinking which this is so complicated where I need to go to any app store and then download, register and share all my details to get a pet feeding tracker.  


Also, there was thought on why not we create something in excel or google sheet so that it can do the task, again then had the challenges that someone needs to open the file and enter all the details.  This webpage is very simple, enter your pet's name, select the start and end time along with the time interval and the quantity and click the button to have your simplified feeding schedule for your pet. No data is stores or it ask for any login and download.  If you have a fixed schedule download the pdf and paste it at a convenient location for reference.  All your job done.  If you have more idea or suggestion, then let me know through the contact us page and we will work on the improvement.  


This pet feeding schedule tracker has helped our family to make sure one or the other looks at the schedule and then feed our wonderful pet. When I am at home alone, I keep this page open so that I get the pop-up on the page which is really helpful.  Try using it and see how it goes and will lookout for your suggestion. 

...

Pet Feeding Schedule Tracker

Pet Feeding Schedule Tracker

Feeding Schedule

Time Status Quantity (g)
document.getElementById('feeding-form').addEventListener('submit', function(event) { event.preventDefault(); const petName = document.getElementById('pet-name').value; const startTime = document.getElementById('start-time').value; const endTime = document.getElementById('end-time').value; const interval = parseInt(document.getElementById('interval').value); const quantity = document.getElementById('quantity').value; if (petName && startTime && endTime && interval && quantity) { generateSchedule(petName, startTime, endTime, interval, quantity); disableInputs(); updateTitle(petName); document.getElementById('download-pdf').style.display = 'block'; } }); function generateSchedule(petName, startTime, endTime, interval, quantity) { const scheduleBody = document.getElementById('schedule-body'); scheduleBody.innerHTML = ''; // Clear existing schedule let start = new Date(`1970-01-01T${startTime}:00`); const end = new Date(`1970-01-01T${endTime}:00`); while (start <= end) { const row = document.createElement('tr'); const timeCell = document.createElement('td'); const statusCell = document.createElement('td'); const quantityCell = document.createElement('td'); timeCell.textContent = start.toTimeString().slice(0, 5); statusCell.textContent = 'Pending'; statusCell.className = 'status'; quantityCell.textContent = quantity; row.appendChild(timeCell); row.appendChild(statusCell); row.appendChild(quantityCell); scheduleBody.appendChild(row); start.setMinutes(start.getMinutes() + interval); } checkSchedule(petName); setInterval(() => checkSchedule(petName), 60000); // Check every minute } function checkSchedule(petName) { const rows = document.querySelectorAll('#schedule-body tr'); const now = new Date(); const currentTime = `${pad(now.getHours())}:${pad(now.getMinutes())}`; rows.forEach(row => { const timeCell = row.cells[0]; const statusCell = row.cells[1]; const scheduledTime = timeCell.textContent; if (scheduledTime === currentTime) { showPopup(`It's time to feed your pet ${petName}!`); statusCell.textContent = 'Completed'; } else if (scheduledTime < currentTime) { statusCell.textContent = 'Completed'; } else { statusCell.textContent = 'Pending'; } }); } function pad(number) { return number < 10 ? '0' + number : number; } function showPopup(message) { const popup = document.getElementById('popup'); const popupMessage = document.getElementById('popup-message'); const closeBtn = document.querySelector('.close-btn'); popupMessage.textContent = message; popup.style.display = 'block'; closeBtn.onclick = function() { popup.style.display = 'none'; }; window.onclick = function(event) { if (event.target === popup) { popup.style.display = 'none'; } }; } function disableInputs() { const inputs = document.querySelectorAll('#feeding-form input'); inputs.forEach(input => { input.disabled = true; }); } function updateTitle(petName) { const mainTitle = document.getElementById('main-title'); const scheduleTitle = document.getElementById('schedule-title'); mainTitle.textContent = `Feeding Schedule for ${petName}`; scheduleTitle.textContent = `Feeding Schedule for ${petName}`; } document.getElementById('download-pdf').addEventListener('click', function() { const { jsPDF } = window.jspdf; const doc = new jsPDF(); const petName = document.getElementById('pet-name').value; doc.text(`Feeding Schedule for ${petName}`, 10, 10); const rows = document.querySelectorAll('#schedule-body tr'); let y = 20; rows.forEach(row => { const time = row.cells[0].textContent; const status = row.cells[1].textContent; const quantity = row.cells[2].textContent; doc.text(`${time} - ${status} - ${quantity}g`, 10, y); y += 10; }); doc.save(`Feeding_Schedule_for_${petName}.pdf`); }); ]]>

Subscribe to receive free email updates:

Related Posts :

0 Response to "Pet Feeding Tracker - no apps, no download, just use this webpage"

Post a Comment