Is the window active?

hotcut posted this at 12:24 — 16th November 2001.

Joined: Sep 2000

Hi,

I am working on a system which works with a timeout.
The page should enable some buttons after 15 seconds, and do something each second.

Thats not the problem.

What I need to do however is to stop the counter temporarily when the person is not looking at the page; if its minimized or blurred etc..

I have found a way to do it, but it aint sufficient; it doesn't work well enough.

I am currently using the onBlur and onFocus to set a variable to 1 or 0 depeding on what happens.

What I need is a reliable way to see if the person is wathcing at the page, and not something else. The method explained above works, but it often stops anyway; it is not very bullet proof.

I hope someone know a such syntaxt, as this is bothering me.

Thanks in advance
Casper Bang

Vincent Puglia posted this at 23:19 — 16th November 2001.

They have: 634 posts

Joined: Dec 1999

Hi hotcut,

Other than hooking a webcam into the viewer's monitor and using retina id...

I presume you are doing something like:

if (windowNameOrThis.blur) ...execute some code

if so, I don't know that you can do anything. Nor, since I don't know why you need to know when the user is 'watching' can I supply any alternatives.

Vinny

Where the world once stood
the blades of grass cut me still

detox posted this at 14:19 — 17th November 2001.

They have: 571 posts

Joined: Feb 2001

tough question.

How are you coding your solution to this?
why don't you post it, we will have a look at it....

hotcut posted this at 14:24 — 17th November 2001.

They have: 133 posts

Joined: Sep 2000

Ok, I guess I need to explain some more.

What I am making is some commercials which will come up once in a while, when people are at my site.
Sponsors will be paying for it, so in order to make it as attractive as posible, I need to make sure that they are wathcing. They have to stay at the page for 15 seconds, and the moment they go away from the page (at another window), the counter should stop.

Right now I am using the onBlur and onFocus in the body tag, to make sure what happens. However it often fails.

The suggestion you gave seems good, but I don't really know how to make it work.
I am not making a popup, so it should check if itself is in focus.

Can you help me with that?

Thanks in advance.

***********************************

I posted this the wrong place earlier

My current coding solution is this:

function blurr() {  out = 1  }

function unblurr() {  out = 0  }

&lt;/script&gt;
</head>
<body marginheight="0" marginwidth="0" topmargin="0" leftmargin="0" rightmargin="0" background="bg.gif" onLoad="startrunning()" onBlur="blurr()" onFocus = "unblurr()">

and if out=1 I know the person aint watching...
Its working, but could have been working better.

Does anyone know a better solution?

Vincent Puglia posted this at 01:06 — 21st November 2001.

They have: 634 posts

Joined: Dec 1999

Hi hotcut,

Tell the truth, I'm not very thrilled with the application I try to avoid commercials on tv and generally 'x' the popups whenever I find myself at sites that use them.

Insofar as your specific problem, this is as far as I go:

1) you need to use setTimeout to call a function for 15 secs
2) check focus; if false, clear the timeout

study the following functions & properties at:
http://devedge.netscape.com/docs/manuals/js/client/jsref/index.htm

focus, blur, setTimeout, clearTimeout

note I said properties, not event handlers.

You would never get 15 seconds time with me (unless my back was turned)

Vinny

Where the world once stood
the blades of grass cut me still

hotcut posted this at 14:24 — 21st November 2001.

They have: 133 posts

Joined: Sep 2000

Don't worry about people leaving; the commercials only come every 100 pages a single person views; my average visitor views 500 pages or so. We draw a lot of scripts and databases, so it takes a huge amount of money and reosurces to keep my site alive.

Anyway, I would like to show you how my commercials are as we speak.
As said, it works but sometimes it doesn't do the job very well, and stops counting when the person aint there etc...

I will give you the page as it is now, but I know its a lot of code. But please take a look trough my javascript, and see if you have a place where I could optimize it

<html>
<head>
<title>Commercial Break</title>
&lt;script language="javascript"&gt;
// name - name of the cookie
// value - value of the cookie
// [expires] - expiration date of the cookie (defaults to end of current session)
// [path] - path for which the cookie is valid (defaults to path of calling document)
// [domain] - domain for which the cookie is valid (defaults to domain of calling document)
// [secure] - Boolean value indicating if the cookie transmission requires a secure transmission
// * an argument defaults when it is assigned null as a placeholder
// * a null placeholder is not required for trailing omitted arguments
function setCookie(name, value, expires, path, domain, secure) {
var curCookie = name + "=" + escape(value) +
((expires) ? "; expires=" + expires.toGMTString() : "") +
((path) ? "; path=" + path : "") +
((domain) ? "; domain=" + domain : "") +
((secure) ? "; secure" : "")
document.cookie = curCookie
}





var out = 0
var secleft = 15
var timeout


function startrunning() {timeout = setTimeout('commercials_countdown()',1000);}

function restartcounting() {
clearTimeout(timeout);
out = 0;
timeout = setTimeout('commercials_countdown()',1000);
}

function commercials_continue() {
	if (secleft <= 0){history.back(-1)}
	if (secleft > 0) {document.all.bb.disabled = false}
out = 0
window.cleartimeout(timeout)
timeout = setTimeout('commercials_countdown()',1000);
}

function commercials_info() {
window.open('http://www.spedia.net/cgi-bin/tz.cgi?run=show_svc&fl=8&vid=1820555')
secleft = 0
document.forms.commercials.commercials_countdown.value = secleft
}

function commercials_countdown() {
if (secleft > 0){
		timeout = setTimeout('commercials_countdown()',1000);
		if (out == 0) {
				secleft --
				document.forms.commercials.commercials_countdown.value = secleft
		}
	}
	
	if (secleft == 0) {	document.all.b1b.disabled = false;document.all.b2b.disabled = false;
						setCookie("commercials", 0)
					  }
}

function blurr() {  out = 1  }

function unblurr() {  out = 0  }

&lt;/script&gt;
</head>
<body marginheight="0" marginwidth="0" topmargin="0" leftmargin="0" rightmargin="0" background="bg.gif" onLoad="startrunning()" onBlur="blurr()" onFocus = "unblurr()">

<form name="commercials">
We would like to interrupt the game with a few words from our sponsors.<br>
You will be able to go on playing SOW in <input type="text" name="commercials_countdown" size="1" value="15" onBlur="out = 0"> seconds, or to read on about what our sponsor has to offer.<br>
<small><small><a href="javascript:void(0)" onclick="restartcounting()">If the counter stops, click here to start it again</a></small></small>
<br><br>

<table width=100% border=5 bgcolor="#FFFFFF">
<tr>
<td valign="top" width=10% rowspan = 3>
<table height = 100% bgcolor="#FFFFFF"><tr height=10%><td width="100%" height="100%" valign = "top"><input type="button" value="Continue Playing" onClick = "commercials_continue()" name="b1b" disabled></td></tr><tr height=80%><td width="100%" height="100%"></td></tr><tr height=10%><td width="100%" height="100%" valign = "button"><input type="button" value="Continue Playing" onClick = "commercials_continue()" name="b2b" disabled></td></tr></table>
</td>
<td width="80%" bgcolor="#FFFFFF">




<a href="http://www.spedia.net/cgi-bin/tz.cgi?run=show_svc&fl=8&vid=1820555"><img src="http://www.spedia.net/imgs/spb.gif" border=0 ></a>


</td>
<td valign="top" width=10% rowspan = 3>
<table height = 100% bgcolor="#FFFFFF"><tr height=10%><td width="100%" height="100%" valign = "top">

<input type="button" value="Learn More" onClick = "commercials_info()"></td></tr><tr height=80%>

<td width="100%" height="100%"></td></tr><tr height=10%><td width="100%" height="100%" valign = "button"><input type="button" value="Learn More" onClick = "commercials_info()"></td></tr></table>
</tr>
<tr>
<td width=80% bgcolor="#FFFFFF">

Main Commercial
</td>
</tr>
<tr>
<td width=80% bgcolor="#FFFFFF">

<font color="green" size=+1>Sign up and join the adventure!<br>Its free, and its worth it!</font>

</td>
</tr>
</table>
</form>
<a href="commercials_learnmore.asp">Click here to get your own commercial!</a>

</body>
</html>

Sorry to post all this, but it should give you a preety good picture of what I am using now There is alot of HTML in it, but you wont have to look through that; the most important is the javascript, and perhaps the two buttons shown.

Thank you very much in advance
~Casper Bang