Penny Auction Timer Update after Database fetch - javascript

So i am implementing this feature in a penny auction website. Using countdown.js as the library to run a countdown.
the countdown works in a way that:
<div class="countdown cf content_item-countdown" style="width: 100%;" data-countdown="<?php echo date('M d, Y H:i:s O', strtotime($item['end_date']));?>"></div>
the end_date here, is from database, it is the date on which the timer will stop (and bidding will end)
the countdown function:
$('.countdown').each(function(){
var count = $(this), time = $(this).data('countdown'), format = $(this).data('format');
var Otime = new Date(time), o = {
serverSync: serverTime,
until:Otime,
// demo data set to reset timer, when it's finished
// change zeroCallback to prefered callback
zeroCallback: function(options) {
}
};
if(format){
$.extend(o,{format:format});
}else{
$.extend(o,{layout: '{dn} {dl} {hnn}{sep}{mnn}{sep}{snn}'});
}
$(this).countdown(o);
});
now i am supposed to implement another feature,
if the end_time <15 seconds (means the time remaining to bid is less than 15 seconds), and some one places a bid, the timer should automatically reset to 15 seconds, and so on. like: http://www.quibids.com/en/
i do this by updating the end_date to a certain seconds.
and updating timer:
$(time_update).html( '<div class="countdown cf content_item-countdown" style="width: 100%;" data-countdown="">'+data[$i].end_date+'</div>');
i assumed since the countdown timer is getting end_date it should automatically reset it.
But it doesn't, instead it prints the end date and reverts back to the old countdown.
the timer updates fine whenever i REFRESH the page, but i want it to refresh on the go, i assume it requires an AJAX call, any help?

the best way was to destroy the countdown widget and then display it using the updated end_date from database

Related

How can set wait time in MySQL

Currently, I have a problem like this:
I add a new user to a table "users" with status set to "new". Then after 5 - 15 minutes the status is changed to "Em". It's dependent on how large the data is.
I would like to make a wait time in mySQL to get the status "Em".
how can I make a wait condition until it changes status, maybe in 5 minutes it has changed status already. how can I count those waits and get the status in every minute of waiting
You can guild me by Javascript it's okay.
Thank you so much
I am not entirely clear what your request is. But here I can provide you with some insight. If we need to trace the elapsed time since the creation of a new user and calculate how long it still needs for the new user to reach the em status, we can use a view. And if we want MySQL to update the status automatically when the time is right, we can use an event scheduler to check periodically.
-- Here is the view supposing it takes 600 seconds to reach em since creation
drop view if exists testview;
create view testview as select user_id,user_status,
concat(time_to_sec(now()) - time_to_sec(ts),' seconds have passed since adding the user.') as since_creation,
concat(time_to_sec(date_add(ts, interval + 600 second)) - time_to_sec(now()),' seconds more to reach em status.') as wait_time
from users
where user_status='new';
-- Here is the event scheduler which checks every 10 seconds
set global event_scheduler=on ;
delimiter //
drop event if exists periodic_check //
create event periodic_check on schedule every 10 second starts now() do
BEGIN
update users set user_status='em' where user_status='new'
and time_to_sec(date_add(ts, interval + 600 second)) - time_to_sec(now()) <=0;
END//

How to make a global countdown?

Ok so I am using http://keith-wood.name/ countdown plugin and am using one of the functions for for unix timestamps but need some help.
I will have multiple countdowns around the site but the way I have got it working I have to declare each timer as follows.
var crimeTime = new Date();
crimeTime.setTime(<?php echo $crime_time * 1000; ?>);
$('#Crimes').countdown({until: crimeTime, compact: true, format: 'HMS'});
and have to repeat the line for each countdown is there a way of making a timer global so for instance...
<div class="countdown"><?php echo $unixtimestamp;?></div>
I have looked around and tried many but they either do not work at all or do not work with unix timestamp's properly.
another issue is how to get timer to auto start counting down on a submit?
for instance can only do an activity once every 1min the timer displays 00:00:00 once click submit on an activity it stays 00:00:00 it doesn't change to 00:01:00 unless the page is refreshed after submit.
Thanks.
You can go in PHP/HTML this way:
<div class="countdown" data-time="<?=$unixtimestamp;?>"></div>
And in jQuery you do:
$('.countdown').each(function(i) {
var thisCounter = $(this);
var thisTime = thisCounter.data('time');
var crimeTime = new Date();
crimeTime.setTime(thisTime);
thisCounter.countdown({until: crimeTime, compact: true, format: 'HMS'});
});
If you simply need a time counter (to get time in realtime) you can make a global one and simply reference to it:
timer = new Date().getTime(); // time in miliseconds
timerHolder = setInterval(
() => {
timer+= 1000;
}, 1000
);
Then to read the time you can do:
new Date(timer)

Keep track on time spent on each page when a particular user visit a page and keep a record in database

I am stuck with the an issue in which I have to track a time spend by user on particular page and save data in database using mongodb.
I have seen one answer about the same but I am confused where to add that piece of code as I am using angularjs. Do I have to keep this code in controller of that particular page or to the index where I am rendering all code using ui-view.
Code from How to measure a time spent on a page?
var start;
$(document).ready(function() {
start = Date.getTime();
$(window).unload(function() {
end = Date.getTime();
$.ajax({
url: "log.php",
data: {'timeSpent': end - start}
})
});
});
thnx in advance.
One simple way I can think of to do this is to calculate the total amount of time in seconds spent by the user on a particular page by using the $interval service of angularjs.
First, initialise a $scope variable for the total seconds spent,
$scope.TotalSeconds = 0;
Then, a function to increment the variable,
var IncrementTotalSeconds = function()
{
$scope.TotalSeconds += 1;
}
After that, use the $interval to increment the variable at every second.
$interval(IncrementTotalSeconds,1000);
Now you have the total seconds spent by the user on that particular page.
You can use the $scope.TotalSeconds to post the total time spent (in seconds) to the database.
Note: You can divide the Total Seconds if you want the time to be Minutes or Hours.

Checking if date has changed with React/Redux + Moment.JS

I have a React+Redux application, and I display the date in it using Moment.js. I want a function to run when the date changes.
Right now I have a function to check the date:
checkDate(local) {
if (local === null) {
localStorage.setItem('date', moment().format('MM-DD-YYYY'));
} else if (moment(local).isBefore(moment().format('MM-DD-YYYY'))) {
this.props.resetAll(); // This calls an action.
}
}
And if I call it manually, or refresh the page when the date changes, it works just fine. But, I want to be able to have my application run that this.props.resetAll() line on its own without my having to refresh the page. What would the best way be to go about it? Should it be something that happens on the Redux side of things in an action or reducer? Should I have checkDate() be called every X seconds or so somewhere in the component lifecycle (if so, where)?
Thanks in advance for any help!
I would set a timeout until 24:00 which then calls the update function:
moment() is defined as the current date/time, to get the difference to a specific time, you can use the .diff() function. So for example if you want the milliseconds till the start of the next day:
var msTillEndOfDay = moment().endOf('day').add(1, 'seconds').diff(moment(), 'milliseconds');
.endOf('day') would be 23:59:59 so you just add 1 seconds to have the next day.
You then simply set the Timeout with the specific update function or dispatch the right action:
setTimeout( () => {
this.props.dispatch({type: 'UPDATE_DATE'})
}, msTillEndOfDay);

Increasing value in database after interval of time

i am working on a codeigniter project in which i am making a counter of every movie that is being clicked. Now i want if the user clicks the movie link the user is directed to the movie page and after 30 seconds the counter will be increased to 1. Currently the counter is increased on every click. Any Help???
Here is my view code
Watch in HD
Here is my controller code
public function watch_movie()
{
//$id = $_REQUEST['id'];
$id = $this->input->get('id');
$this->movie_counter->add_counter($id);
//$data['comment'] = $this->site_upload->fetch_comments($id);
//redirect ('site/play_movie', $result);
$this->load->view('Play_movie', $result);
}
Create a Queue!
Every click you insert into the queue, and another job (cronjob) insert every minute (smallest interval) the data from the queue in the correct table.
counter will be increased even every refresh too in this scenario, whateva you are saying for 30 sec interval ( you can use ajax request with a 30 sec timeout) but this seems like a buggy code what if some one closes it before 30 sec (browser) and you don't get any increment....
if you want to setup unique (views) use browser/ip/time based (for generic setup you can make it advance) and every time you get the request of counter addition check your db if you have same ip/browser and less duration as you say(30 sec or 1 min) then don't add other wise add 1 to script.

Categories