Go Premium for a chance to win a PS4. Enter to Win

x
  • Status: Solved
  • Priority: Medium
  • Security: Public
  • Views: 2392
  • Last Modified:

onBlur / onFocus problem

I am writing a timed course script for my employer that will allow for certification in various different fields.  Everything is working peachy except for one problem...

Internet Explorer...

Here is my page (content and course-related scripts omitted):


----------------------------------------------------------------------------------------------------
<html >
<head>
<title>RF Training Demo</title>
<meta http-equiv="Content-Type" content="text/html; charset=iso-8859-1">
<link rel="stylesheet" href="../includes/blueborder.css" type="text/css">
<script language="JavaScript" src="../includes/scriptlib.js"></script>
</head>

<body onLoad="entering(); timer();" onBlur="stoptimer();" onFocus="if(!T){setTimeout('timer()',1000);}">
<div id="header"  onBlur="checkfocus();" onFocus="if(!T){setTimeout('timer()',1000);}"><div id="title" align="center">Training Module X</div>
</div>
<div id="content">Hi mom.
</div>
<div id="footer">
      
  <div id="buttons">
   Dude, stuff is like, happening here.
            
     
  </div>
  <div id="timer">  
  <form name="counter">
      <input name="timer" type="text" disabled size="7">
    </form>      
  </div>

</div>
</body>
</html>

-----------------------------------------------------------------------------------------------------------------
The timer function is just a clock that formats the seconds into a Digital Clock and sets the variable "T" to a setTimeout(...) function.

stoptimer() just calls a clearTimeout(T).  Everything works perfectly except for my focus problem.

Any time I click ANYWHERE on the page, the timer stops because the "body" loses focus.  This only happens in IE, not Mozilla, not Firefox, not Netscape, not Opera (I think).  

If it wasn't IE, I wouldn't care, but since 99% of our clients use IE, this presents a major hurdle.

I am at my wits' end.  Please help.

Demo: --> http://mcfrosty.kicks-ass.net/firetraining/
Click on "Blue Tech" template.

Thanks a ton if you can help me resolve this!!!
0
McFrosty
Asked:
McFrosty
  • 7
  • 6
1 Solution
 
justinbilligCommented:
<html>

<head>

<script language="javascript">
var g_objWindow = null;
function StopTimer( )
{
       // Does our window exist?
       if( (g_objWindow != null) && (!g_objWindow.close) )
       {
           // Yes
           g_objWindow.stoptimer( );
      }
}



<title>Untitled Document</title>
<meta http-equiv="Content-Type" content="text/html; charset=iso-8859-1">
<script src="includes/scriptlib.js"></script>
</head>
<body onfocus="StopTimer( );">
<script language="JavaScript">

var time = WM_readCookie('TimeOnPage');
if(time)
{
document.course.limit.value = time;
}
</script>
<h1>Web Course Sample</h1>
<p>If a value is already in the form field, a cookie has already been set for you.</p>
<form name="course">
Page time limit: <input name="limit" type="text"><br>
<input type="button" onClick="WM_setCookie('Timeout',document.course.limit.value);" value="Set Page Time in Secconds"><br>
<input type="button" onClick="document.location='page1.html';" value="View Objectives">
<input type="button" onClick="document.location='groundladders/index.html';" value="Start Course">
<input type="button" onClick="document.location='groundladders_rf/index.html';" value="RF Template Course">
<input type="button" onClick="g_objWindow  = window.open('BlueBorder/index.php','blueborder','width=600px,height=500px');" value="Blue-Tech Template">
</form>

</body>
</html>




try that in your main window... take the onblur event out of your opened window
0
 
McFrostyAuthor Commented:
Its nice to see that I'm at least on the right track.  I originally tried something similar to the above solution before I used the onBlur event.  The problem I was running into was that the timer wasn't stopping if I clicked anywhere besides the parent window...so unless there's some miracle "screen.notthiswindow.isfocused" property that I don't know about, I have to use the onBlur event.

I tried getting around it by adding the same properties to the div tags themselves, but I was running into a problem where more than 1 fired at a time...

0
 
justinbilligCommented:
try this

if( (g_objWindow != null) && (!g_objWindow.close) && (!g_objWindow.focus) )
0
VIDEO: THE CONCERTO CLOUD FOR HEALTHCARE

Modern healthcare requires a modern cloud. View this brief video to understand how the Concerto Cloud for Healthcare can help your organization.

 
McFrostyAuthor Commented:
sigh...no onBlur = no stopped timer...I hate IE...

Maybe I'm going about this the wrong way...Is there ANY element in IE that won't take the focus away from the body/window?  

Or, is there a way I can set everything up in javascript...

window.onfocus
window.onblur

that will get fired every time?

I guess I'll try that out...

0
 
justinbilligCommented:
No, can you tell me the context in which this timer is used, maybe we can think of another way to do it, basically if that window loses focus you need it to stop? why is that?
0
 
McFrostyAuthor Commented:
Is there any way that you can check to see which element has the focus?  If I could do that, I'd be golden...

I tried the if(!document.element.focus)
but its not firing
0
 
McFrostyAuthor Commented:
Ok, the timer is used to make sure the course is viewed for the required time.  If the window loses focus, the timer has to stop b/c the user isn't looking at the page anymore (in theory)...If this cannot be done, then I have to scrap the whole project...without the timer and stopping and all, it won't get approved by the crediting committee.

Therefore, if someone loads the course up, the MUST be looking at it in order to continue.

 
0
 
justinbilligCommented:
Are there browser requirements, and do you have to offer them the option of looking at other pages. You could open it in a modal window.

http://msdn.microsoft.com/library/default.asp?url=/workshop/author/dhtml/reference/methods/showmodaldialog.asp

It's IE only, but what it does is it opens and it won't let you interact with the parent window until you close this window. You could then open this window start the timer, put a pause button on the window, when they hit pause it will close this window, pass the time left back to the main window. The main window will have the resume button, when you click it it will reopen the window with the time remaining.
0
 
justinbilligCommented:
oh wait you said already you need this to work for multiple browsers. I'll think more about it and see what i can come up with
0
 
justinbilligCommented:
we maybe can use a "modal" dialog, here is an article on how to make a cross browser modal dialog


http://www.devguru.com/features/knowledge_base/A100203.html
0
 
McFrostyAuthor Commented:
I can specify what browser to use, unfortunately, I don't want 90% of my clients downloading a browser just so they can take a course...

That would almost work except for the case where a student opens up the course, opens a new window and watches SpongeBob for the duration of the time...

I guess I'll have to try to not use the body at all and put all the timing stuff in the div tags themselves.

I hate IE...and its stupid elemental focusing...

I did read somewhere about MS's setMouseCapture.  I'm going to take a look into that and maybe it'll work like I need it to.
0
 
McFrostyAuthor Commented:
Well, it looks like I found a work around that will work for all (not really, but at least it's good enough for IE).

Using IE's proprietary stuff, (not modal or mouse capture, due to certain constraints), I found that this works very well when dealing with a window's focus:

<script for=document event=onfocusin>do your stuff</script>
<script for=document event=onfocusout>do your other stuff</script>

naturally, both the script tags and the events are ONLY for Internet Explorer...so I'll have to specify that our users only use IE 5.0 or greater...but since almost all of them will, it shouldn't be a problem.  

I plan to add in support for the other browsers in time, once we've got  a good client rate.

justinbilling, thanks for all your help in trying to get this resolved.

0

Featured Post

Hire Technology Freelancers with Gigs

Work with freelancers specializing in everything from database administration to programming, who have proven themselves as experts in their field. Hire the best, collaborate easily, pay securely, and get projects done right.

  • 7
  • 6
Tackle projects and never again get stuck behind a technical roadblock.
Join Now