I need your help. I have an auction scenario. I wrote two functions in javascript code. In this way, two counts are made according to the beginning and end of the auction. I want it to be “arac_durum” → “Aktif” in my database when the first count is completed and “arac_durum” → “Pasif” when the second count is completed. I usually use PDO in query and transaction commands. How can I do it, can you help?
I’m a little weak on this. I would be very happy if you simply explain
Js Code;
<script>
function createCountDown(elementId, date, dateiki) {
var countDownDate = new Date(date).getTime();
var x = setInterval(function() {
var now = new Date().getTime();
var distance = countDownDate - now;
// Gün, Saat, Dakika, Saniye işlemleri yapılıyor
var days = Math.floor(distance / (1000 * 60 * 60 * 24));
var hours = Math.floor((distance % (1000 * 60 * 60 * 24)) / (1000 * 60 * 60));
var minutes = Math.floor((distance % (1000 * 60 * 60)) / (1000 * 60));
var seconds = Math.floor((distance % (1000 * 60)) / 1000);
document.getElementById(elementId).innerHTML = "Süre ►" + days + ": " + hours + ": " + minutes + ": " + seconds;
**//Here I would like the "arac_durum" data to be updated to "Aktif".**
if (distance < 0) {
clearInterval(x);
document.getElementById(elementId).innerHTML = "Başladı !";
var bitistarihi = new Date(dateiki).getTime();
var y = setInterval(function() {
var simdi = new Date().getTime();
var distance = bitistarihi - simdi;
var days = Math.floor(distance / (1000 * 60 * 60 * 24));
var hours = Math.floor((distance % (1000 * 60 * 60 * 24)) / (1000 * 60 * 60));
var minutes = Math.floor((distance % (1000 * 60 * 60)) / (1000 * 60));
var seconds = Math.floor((distance % (1000 * 60)) / 1000);
document.getElementById(elementId).innerHTML = "Süre ►" + days + ": " + hours + ": " + minutes + ": " + seconds;
if (distance < 0) {
clearInterval(y);
document.getElementById(elementId).innerHTML = "Bitti !";
**//Here I would like the "arac_durum" data to be updated to "Pasif".**
}
}, 1000);
}
}, 1000);
}
createCountDown("<?=$araccek['arac_id']?>", "<?=$araccek['arac_gerisayim']?>", "<?=$araccek['arac_tarih']?>")
</script>
I made a counter for the end of the Stay-at-Home order that is in place for the Coronavirus here in Michigan. (Original it was written for the start of the Detroit Tigers baseball season). So here’s is the javascript file and php file. Maybe this will help you out a little bit?
vanilla javascript file:
const getTimeRemaining = (endtime) => {
var t = Date.parse(endtime) - Date.parse(new Date());
var seconds = Math.floor((t / 1000) % 60);
var minutes = Math.floor((t / 1000 / 60) % 60);
var hours = Math.floor((t / (1000 * 60 * 60)) % 24);
var days = Math.floor(t / (1000 * 60 * 60 * 24));
return {
'total': t,
'days': days,
'hours': hours,
'minutes': minutes,
'seconds': seconds
};
};
const myClock = (id, endtime) => {
var clock = document.getElementById(id);
var daysSpan = clock.querySelector('.day');
var hoursSpan = clock.querySelector('.hour');
var minutesSpan = clock.querySelector('.minute');
var secondsSpan = clock.querySelector('.second');
function updateClock() {
var t = getTimeRemaining(endtime);
daysSpan.textContent = t.days;
hoursSpan.textContent = ('0' + t.hours).slice(-2);
minutesSpan.textContent = ('0' + t.minutes).slice(-2);
secondsSpan.textContent = ('0' + t.seconds).slice(-2);
if (t.total <= 0) {
clearInterval(timeinterval);
}
}
updateClock();
var timeinterval = setInterval(updateClock, 1000);
};
function ajaxRoutine() {
var grabDate = "myDate=endDate";
console.log(grabDate);
var xhr = new XMLHttpRequest();
xhr.onreadystatechange = function () {
//console.log('readyState: ' + xhr.readyState, 'xhr.status: ' + xhr.status);
if (xhr.readyState === 2) {
//console.log(xhr.status);
if (xhr.status === 410) {
gameover();
}
}
if (xhr.readyState === 4 && xhr.status === 200) {
var data = JSON.parse(xhr.responseText);
console.log('data', data);
var thedate = new Date(Date.parse(data.thedate));
var description = document.querySelector("#description");
description.textContent = data.description;
myClock("thedate", thedate);
}
}; // End of Ready State:
xhr.open('POST', 'covid19Json.php', true);
xhr.setRequestHeader('Content-type', 'application/x-www-form-urlencoded');
xhr.setRequestHeader('X-Requested-With', 'XMLHttpRequest');
xhr.send(grabDate);
}
ajaxRoutine();
PHP File
<?php
/* Makes it so we don't have to decode the json coming from javascript */
header('Content-type: application/json');
$endDate = filter_input(INPUT_POST, 'myDate');
if ($endDate === 'endDate') {
$data['description'] = "Covid-19 - Normalcy?";
$setDate = new DateTime('2020-05-28 00:00:00', new DateTimeZone("America/Detroit"));
$data['thedate'] = $setDate->format("Y/m/d H:i:s");
output($data);
}
function errorOutput($output, $code = 500) {
http_response_code($code);
echo json_encode($output);
}
/*
* If everything validates OK then send success message to Ajax / JavaScript
*/
function output($output) {
http_response_code(200);
echo json_encode($output);
}
Like I said this is just a simple countdown script that I wrote, but maybe it will help you with your problem?
Well, simply put, I wouldnt do this in MySQL this way, I would make your queries and/or query handlers smarter.
Store the start and end date; an active auction, then, is one WHERE NOW() BETWEEN startdate AND enddate; and ‘passive’ ones are ones WHERE NOW() > enddate.
If you’re selecting all your records and want to display if they’re active or passive, then your receiving language (PHP or Javascript) can do the same math to figure it out.
That way you’re not relying on someone’s browser being open to update the status - the math determines the state on the fly, rather than the state maybe-or-maybe-not being written.
Thank you for your answers. But my countdown timers are already running. I have no problems with them. When the countdown is complete, I want to update the “arac_durum” item in my database as “Pasif” and “Aktif” with AJAX. (“Aktif” when the first countdown is complete, “Pasif” when the second countdown is complete). I would be very happy if you can help with this.
