Menu
I am using the following test script to track the mouse position for a maximum of 30 seconds from the time the ‘Start’ button is clicked.
All is going fine for the test except I am not getting an X:Y entry for the very first second.
Can someone spot the logic I’m missing. Thanks for any ideas. ?
[code=php]
<html>
<head>
<SCRIPT TYPE=”text/javascript”>
// Description: Countdown timer (seconds) from ‘Start’ to “MaxSecs”
// NOTE: the month entered must be one less than current month. ie; 0=January, 11=December
// NOTE: the hour is in 24 hour format. 0=12am, 15=3pm etc
// format: Future = new Date(year,month-1,day,hour,min,sec)
// example: Future = new Date(2007,10,26,16,15,00) = Nov. 26, 2007 – 4:15:00 pm
var ShowCoords = false;
var MaxSecs = 30;
var ND = new Date();
var Future = new Date(ND.getFullYear(),ND.getMonth(),ND.getDate(),ND.getHours(),
(ND.getMinutes()+1),ND.getSeconds());
// Future = new Date(2007,10,4,19,58,0);
function SetCount(){
// if (ShowCoords == false) { return; } // bypass checks
ND = new Date();
Future = new Date(ND.getFullYear(),ND.getMonth(),ND.getDate(),ND.getHours(),
(ND.getMinutes()),(ND.getSeconds()+MaxSecs));
document.getElementById(‘testbox’).innerHTML=Future;
setTimeout(“GetCount()”, 1000);
}
function GetCount() {
if (ShowCoords == false) { return } // skip checks
Now = new Date(); //grab current date
amount = Future.getTime() – Now.getTime(); //calc milliseconds between dates
delete Now;
if(amount < 0){ // time is already past
document.getElementById(‘timeLeft’).innerHTML=”Now!”;
}
else{ // date is still good
days=0;hours=0;mins=0;secs=0;out=””;
amount = Math.floor(amount/1000);//kill the “milliseconds” so just secs
days=Math.floor(amount/86400);//days
amount=amount%86400;
hours=Math.floor(amount/3600);//hours
amount=amount%3600;
mins=Math.floor(amount/60);//minutes
amount=amount%60;
secs=Math.floor(amount);//seconds
if(days != 0){out += days +” day”+((days!=1)?”s”:””)+”, “;}
if(days != 0 || hours != 0){out += hours +” hour”+((hours!=1)?”s”:””)+”, “;}
if(days != 0 || hours != 0 || mins != 0){out += mins +” minute”+((mins!=1)?”s”:””)+”, “;}
out += secs;
// document.getElementById(‘timeLeft’).innerHTML=out+” seconds”;
document.getElementById(‘timeLeft’).innerHTML= out;
var tmp = ”;
var tleft = MaxSecs-secs;
// if (tleft != MaxSecs) {
tmp = document.getElementById(‘boxinfo’).innerHTML;
if (tleft % 5 == 0) { tmp += ‘<br />’; }
document.getElementById(‘boxinfo’).innerHTML
= tmp+tleft+’:’+document.getElementById(‘mousepos’).value+’| ‘;
// }
setTimeout(“GetCount()”, 1000);
}
}
// from: http://www.dynamic-tools.net/toolbox/getMousePosition/
function getMousePosition(e) {
return e.pageX ? {‘x’:e.pageX, ‘y’:e.pageY} :
{‘x’:e.clientX + document.documentElement.scrollLeft + document.body.scrollLeft,
‘y’:e.clientY + document.documentElement.scrollTop + document.body.scrollTop};
};
function showMousePos(e) {
if (ShowCoords == false) { return; } // skip checks
if (!e) e = event; // make sure we have a reference to the event
var input = document.getElementById(‘mousepos’);
var mp = getMousePosition(e);
input.value = ‘x:’ + mp.x + ‘:y:’ + mp.y;
};
function init() {
ShowCoords = false;
document.onmousemove = showMousePos;
};
window.onload = init;
</script>
</head>
<body>
<button onClick=”document.getElementById(‘boxinfo’).innerHTML=”;”>Clear</button>
<input type=”text” id=”mousepos” value=” size=”10″>
Counter:
<button onClick=”SetCount();GetCount();ShowCoords=true”>Start</button>
<button onClick=”ShowCoords=false”>Stop</button>
<br />
<div id=”testbox”></div>
<div id=”timeLeft”></div>
<div id=”boxinfo”></div>
</body>
</html>