Fire Javascript alert when counter reaches 10 minutes - javascript

I have a page that updates whenever another entry is added to the database. It displays the timestamp, and then starts counting up using jQuery, along with moment.js to help with time formatting. This is the code for that:
$(function () {
var austDay = new Date('".$array['dateAdded']."');
$('#since".$array['id']."').countdown({since: austDay, significant: 1, layout: '{d<}{dn} {dl} {d>}{h<}{hn} {hl} {h>}{m<}{mn} {ml} {m>}{s<}{sn} {sl}{s>}'});
});
I need to be able to fire an alert whenever a given entry is 10 minutes past the timestamp date and time. I assume the script would need to continually check to see if that's the case. Any help would be greatly appreciated.

This is the solution I came up with for this problem, using a mix of Javascript and PHP.
$now = date("Y-m-d h:i:s");
$plusTen = date("Y-m-d, h:i:s", strtotime("+10 minutes", strtotime($array['dateAdded'])));
$difference = strtotime($plusTen) - strtotime($now);
$difference = round($difference,2) * 1000;
if($difference > 0){
echo '<script type="text/javascript">
setTimeout(function(){staleAlert();}, '.$difference.')
</script>';
}

Related

See if user completed an order in the last 10 seconds (woocommerce)?

Basically I can't get a redirect to work for a number of reasons the way I'd like to so I'm wanting to add a function that will run on the /my-account/ page to see if the current user ordered product A or B in the last 10 seconds (would have completed status, using autocomplete order plugin) and if so redirect them to a custom thank you page specified in the function.
I'm finding alot of functions to pull recent orders, but I'm not sure if I'm going in the right direction. How in 3.0 do I get the timestamp and product id of the users most recent order? Is there a hook to tie this to the /my-account/ page or will I need to hack a javascript/php work around?
How about to run the code directly after the purchase?
You check which product it was (and more checks if you need) and then redirect to the custom thankyou page.
add_action( 'woocommerce_thankyou', 'my_custom_code' );
function my_custom_code( $order_id ) {
// Lets grab the order
$order = wc_get_order( $order_id );
// do stuff
}
Here's what I ended up doing:
added a custom column to the 'Orders' table of the 'My Account' page
that included order ID (used filter to add the column - SKU - and
then updated the logic in the orders.php page to add the product ID
to the SKU column.
function new_orders_columns( $columns = array() ) {
$columns['product-name'] = __( 'SKU', 'Text Domain' );
return $columns;
}
add_filter( 'woocommerce_account_orders_columns', 'new_orders_columns' );
added a jQuery script (echoed with php via shortcode added to the 'My
Account' page) that would pull the current date, the datetime
attribute from the date column and the product ID text from the SKU
column from the first row - ie most recent order
used Javascript to find the difference between the current time and
the order time and convert that number to seconds
added a conditional redirect based on the value of that time
difference being less than 10 (seconds) and that product id was a
specific id
function mycustomorder_redirect() {
if (is_user_logged_in()) {
date_default_timezone_set('America/New_York');
$time_now = date( 'c' );
echo '<script>jQuery("document").ready(function() {
//
//Get most recent order datetime
var lastorder_td = jQuery("td.woocommerce-orders-table__cell-order-date:eq(0) time").attr("datetime");
//
//Get most recent order product id
var product_check = jQuery("td.woocommerce-orders-table__cell-product-name:eq(0)").text();
//
//Remove whitespace
product_check = product_check.replace(/(^\s+|\s+$)/g,"");
//
//Get current datetime
var current_wrap = "' . $time_now . '";
//
//Remove +00:00 or -00:00
lastorder_td = lastorder_td.substring(0, lastorder_td.length - 6);
current_wrap = current_wrap.substring(0, current_wrap.length - 6);
//
//Convert to javascript date
var column_a = new Date(current_wrap);
var column_b = new Date(lastorder_td);
//
//Find time difference
var dif = column_a - column_b;
//
//Convert to seconds
var seconds_toredirect = dif / 1000;
//
//Add redirect
if (seconds_toredirect < 10 && (product_check == 1 || product_check == 2)) {
window.location.replace("https://exampleurl.com/page/");
}
});
</script>';
}
}
add_shortcode( 'order-custom', 'mycustomorder_redirect' );

set default today date and time from server in datetimepicker addon

Need to set default date and time from server in datetime picker.I can choose a setDate but i need to set today highlighted date from server,and click now button it should shows the server date and time.please suggest some solution.
http://trentrichardson.com/examples/timepicker/
https://github.com/trentrichardson/jQuery-Timepicker-Addon
var dt = new Date("2015 10 12,10:00:00");
$('#basic_example_1').datetimepicker();
$("#basic_example_1").datetimepicker('setDate', dt);
DEMO
frame your code like this
<script type="text/javascript">
var dt = new Date("<?php echo date('Y m d,H:i:s'); ?>");
$('#basic_example_1').datetimepicker();
$("#basic_example_1").datetimepicker('setDate', dt);
</script>

PHP Countdown distribution

I am writing a randomized countdown that show number of products left in promotion alongside a timer. Number of products left is stored in the database, so all users see the same number. I am using simple php/ajax/javascript solution. My problem is with distributing the random sales so all fit within limited timer and are nicely distributed.
Here is code I have so far:
function start() {
$date= new DateTime();
$prod_left = getval("SELECT * FROM counter LIMIT 1");
if ( $prod_left == 20 ) {
$fp = fopen("../index.html", "r+");
while($buf = fgets($fp)){
if(preg_match("/<!--(.|\s)*?-->/", $buf)){
fputs($fp, '<script type="text/javascript">$(document).ready(function() {$(".countdown").circularCountdown({startDate:"' . $date->format('Y/m/d H:i:s') . '",endDate:"' . $date->modify("+5minutes")->format('Y/m/d H:i:s') . '",timeZone:+2});});</script></body></html>');
}
}
fclose($fp);
sleep(30);
while ($prod_left > 0) {
if (rand(0,4) > 2) {
$prod_left--;
sleep(rand(1,13));
updateval($prod_left);
}
}
} else {
echo 'Promocja w trakcie lub zakończona, zresetuj zegar, jeżeli chcesz rozpocząć ponownie';
}
exit;
}
My assumption here is: 50% of time decrease timer and wait on average 6.5 seconds, which should on average give me 260 seconds for full sale. Unfortunately its very unevenly distributed. My goal is to have the sale completed not later than 270seconds after start. Will you be able to help?
Implementation doesnt need to be in any particular programing language, im just looking for a clue/concept I can follow to achieve this.
What is the strangest, the $prod_left value not always goes to 0, on sime iterations it just sits at 3 or 5.
Please help!

how to set timer in pagination php

I want to use time in pagination.In my script when click on next the timer restarts..i think session will help me.but i don't understand how to collect correct time in session and display that in another page in pagination.This is my javascript code:
var myTime = "20";
function countDown() {
document.form.seconds.value = myTime;
if (myTime == 0)
{
location.href="abc.php";
}
else if (myTime > 0)
{
myTime--;
setTimeout("countDown()",2000);
}
}
and this is how i set the time in my php file:
<form name="form">
Time Left: <input type="text" name="seconds" size="3">
</form>
Using session is really very simple. Just include: session_start(); at the beginning of every PHP file of your script.
Then, in order to set a time variable, use this: $_SESSION['theTime'] = $currentDateTime;
where $currentDateTime = date('m/d/Y h:i:s a', time());
Now, this $_SESSION['theTime'] variable will be passed on to every PHP file if you include session_start(); at the beginning of each. To find out difference between two times, refer this: php: datetime() difference between 2 datetime with 2 variables

Is it possible to change a Javascript Variable from an Ajax Response?

I'm trying to update a Javascript variable that controls a scrolling script based upon some Ajax code. The Ajax code is supposed to add to the JS Var when conditions are true in the Ajax script. Is there any way to trigger this?
Thanks!
edit: I'm not sure how to change the value of the variable. I've tried changing it via the Ajax but it doesn't get parsed. I've also tried using PHP inside of JS to check a condition, but doing that only works once.
JS Code
function speedUp()
{
actualheight = actualheight + 50;
}
function slowDown()
{
actualheight = actualheight - 50;
}
function ajaxFunction()
{
var xmlhttp = createRequestObject();
xmlhttp.onreadystatechange=function()
{
if(xmlhttp.readyState==4)
{
document.getElementById('iemarquee').innerHTML=xmlhttp.responseText;
document.getElementById('iemarquee2').innerHTML=xmlhttp.responseText;
}
}
xmlhttp.open("GET","saleCallTest.php",true);
xmlhttp.send(null);
}
/*
Cross browser Marquee II- © Dynamic Drive (www.dynamicdrive.com)
For full source code, 100's more DHTML scripts, and TOS, visit http://www.dynamicdrive.com
Modified by jscheuer1 for continuous content. Credit MUST stay intact for use
*/
//Specify the marquee's width (in pixels)
var marqueewidth="500px"
//Specify the marquee's height
var marqueeheight="500px"
//Specify the marquee's marquee speed (larger is faster 1-10)
var marqueespeed=1
//Specify initial pause before scrolling in milliseconds
var initPause=1000
//Specify start with Full(1)or Empty(0) Marquee
var full=1
//Pause marquee onMousever (0=no. 1=yes)?
var pauseit=0
//Specify Break characters for IE as the two iterations
//of the marquee, if text, will be too close together in IE
var iebreak='<p></p>'
//Specify the marquee's content
//Keep all content on ONE line, and backslash any single quotations (ie: that\'s great):
var marqueecontent='<?php for($i=0;$i<=count($saleItems);$i++)
{
if ($saleItems[$i]['stateOfItem'] =="Sold" || $saleItems[$i]['stateOfItem'] =="Unsold")
{
$_SESSION['countItems']++;
echo $saleItems[$i]['itemNumber'];
echo $saleItems[$i]['stateOfItem'] . '<br />';
}};
?>'
////NO NEED TO EDIT BELOW THIS LINE////////////
var copyspeed=marqueespeed
var pausespeed=(pauseit==0)? copyspeed: 0
var iedom=document.all||document.getElementById
var actualheight=''
var cross_marquee, cross_marquee2, ns_marquee
function populate(){
if (iedom){
var lb=document.getElementById&&!document.all? '' : iebreak
cross_marquee=document.getElementById? document.getElementById("iemarquee") : document.all.iemarquee
cross_marquee2=document.getElementById? document.getElementById("iemarquee2") : document.all.iemarquee2
cross_marquee.style.top=(full==1)? '8px' : parseInt(marqueeheight)+8+"px"
cross_marquee2.innerHTML=cross_marquee.innerHTML=marqueecontent+lb
actualheight=cross_marquee.offsetHeight
cross_marquee2.style.top=(parseInt(cross_marquee.style.top)+actualheight+8)+"px" //indicates following #1
}
else if (document.layers){
ns_marquee=document.ns_marquee.document.ns_marquee2
ns_marquee.top=parseInt(marqueeheight)+8
ns_marquee.document.write(marqueecontent)
ns_marquee.document.close()
actualheight=ns_marquee.document.height
}
setTimeout('lefttime=setInterval("scrollmarquee()",20)',initPause)
}
window.onload=populate
function scrollmarquee(){
if (iedom){
if (parseInt(cross_marquee.style.top)<(actualheight*(-1)+8))
cross_marquee.style.top=(parseInt(cross_marquee2.style.top)+actualheight+8)+"px"
if (parseInt(cross_marquee2.style.top)<(actualheight*(-1)+8))
cross_marquee2.style.top=(parseInt(cross_marquee.style.top)+actualheight+8)+"px"
cross_marquee2.style.top=parseInt(cross_marquee2.style.top)-copyspeed+"px"
cross_marquee.style.top=parseInt(cross_marquee.style.top)-copyspeed+"px"
}
else if (document.layers){
if (ns_marquee.top>(actualheight*(-1)+8))
ns_marquee.top-=copyspeed
else
ns_marquee.top=parseInt(marqueeheight)+8
}
}
if (iedom||document.layers){
with (document){
if (iedom){
write('<div style="position:relative;width:'+marqueewidth+';height:'+marqueeheight+';overflow:hidden" onMouseover="copyspeed=pausespeed" onMouseout="copyspeed=marqueespeed">')
write('<div id="iemarquee" style="position:absolute;left:0px;top:0px;width:100%;background:black;color:white;font-size:30pt;">')
write('</div><div id="iemarquee2" style="position:absolute;left:0px;top:0px;width:100%;z-index:100;background:black;color:white;font-size:30pt;">')
write('</div></div>')
}
else if (document.layers){
write('<ilayer width='+marqueewidth+' height='+marqueeheight+' name="ns_marquee">')
write('<layer name="ns_marquee2" width='+marqueewidth+' height='+marqueeheight+' left=0 top=0 onMouseover="copyspeed=pausespeed" onMouseout="copyspeed=marqueespeed"></layer>')
write('</ilayer>')
}
}
}
</script>
AJAX->PHP CODE
<?php
session_start();
//NuSoap Library
require_once('./lib/nusoap.php');
$_SESSION['countTotal'] = 0;
//Creating a Client
$client = new nusoap_client('http://xx.xx.x.xxx:xxxx/WSSERVICE/services/SERVICE?WSDL');
$saleItems= $client->call("getItems", array("Sale" => '001'));
$_SESSION['countNew'] = 0;
$countPresale = count($saleItems);
$timer = $countPresale * 3.15;
for($i=0;$i<=count($saleItems);$i++)
{
if ($saleItems[$i]['stateOfItem'] =="Sold" || $saleItems[$i]['stateOfItem'] =="Unsold")
{
$_SESSION['countNew']++;
echo $saleItems[$i]['itemNumber'];
echo $saleItems[$i]['stateOfItem'] . '<br />';
}};
if($_SESSION['countNew'] < $_SESSION['countVehicles'])
{
$_SESSION['countTotal']--;
}
if($_SESSION['countNew'] > $_SESSION['countVehicles'])
{
$_SESSION['countTotal']++;
}
if($_SESSION['countTotal'] < 0)
{
$opx = 3 * ($_SESSION['countItems'] - $_SESSION['countNew']);
echo 'actualheight = parseInt(actualheight) + parseInt(' . $opx . ');';
$_SESSION['countVehicles'] = $_SESSION['countNew'];
}
if($_SESSION['countTotal'] > 0)
{
$opx = 3 * ($_SESSION['countItems'] + ($_SESSION['countNew'] - $_SESSION['countNew']));
echo 'actualheight = parseInt(actualheight) - parseInt(' . $opx . ');';
$_SESSION['countItems'] = $_SESSION['countNew'];
}
?>
Assuming that the variable is not locked away in a different namespace with no interface made available, then of course.
"Ajax" just means "Fetch some data from the server using JS without leaving the page, then run some JS".
There is nothing special that adds extra limitations to what that JS can do.
I ran into some issues with this as well. Probably namespace problems like another answer here suggests.
Rather than figure out the what/when/why, I just used <input name="blah" type=hidden> and then update that and read that with Javascript:
Then, to write the variable:document.getElementById('blah').value='some new value';
To read the variable: somevar=document.getElementById('blah').value;
That has worked every time. Actually figuring out the correct namespace would be a better option, but this works.
EDIT: Are you using any Javascript libraries to do your ajax for you, or just coding it from scratch? I've used xajax, Prototype, and Jquery for things like this. Jquery is my new baby, but 5 years ago already this was dead simple in xajax.
I'm not sure I want to steer you down that path but for a php programmer, xajax is a pretty simple method to learn. Jquery is more powerful and extensible though in my opinion.
EDIT2: Far as I can tell you are returning both HTML and javascript to be executed in the same response. Including a javascript in your response doesn't make it get executed. Perhaps you should be serializing your return with JSON so you can eval your javascript to be executed, and assign your innerHTML separately.
Just for reference, the same thing you could do in xajax with just:
$objResponse->addAssign("idhere","innerHTML", "some html");
$objResponse->addScript("somvar = somevar + someothervar");

Categories

Resources