Disclaimer
Instructions for implementing javascript timeout warning features for WebVoyage. Use at your own risk. TCC is not responsible for damage or problems caused by the use of these JavaScripts. No warranties or guarantees of any kind are implied or assumed.

WebVoyage Timeout Warning Windows, version 1.0
Version 2.x, using stylesheets instead of popup windows, can be found here. Version 1.0 (this page) is not recommended because popup blockers will block the warning windows!

These scripts are meant to be used with the WebVoyage product by Endeavor Systems, Inc.™ WebVoyage has a timeout "feature" in which the product, unbeknownst to the user, will log itself out after a certain amount of time. When the user attempts to use the product after the designated time, they are sent to an error page from which they must restart the product.

The javascripts and html enclosed in timeout.zip are meant to warn the user, via popup windows, before the end of the session timeout, giving the user a chance to restart the timer. If the user takes no action before the session timeout, the popup window informs the user, giving them a chance to begin a new search or to log in. If no action is taken, the page redirects to the home page after a predetermined amount of time. The session counts down in the status bar of the browser, so users can see how much time is left at any time (provided their status bar is active.)

Instructions
  1. Download the JavaScripts and popup html at timeout.zip.
  2. Add the folder called "js" to your html folder (located by default at /m1/voyager/xxxdb/webvoyage/html).
  3. The js directory contains three files:
    1. "timer.js" controls the initial countdown
    2. "timeout.js" controls the timeout warning popup window
    3. "timedout.js" controls the timed-out popup window
  4. Add the folder called "timeout" to your html folder (located by default at /m1/voyager/xxxdb/webvoyage/html).
  5. The timeout directory contains two files:
    1. "timeout.html" is the popup window that alerts users that time is almost up.
    2. "timedout.html" is the popup window that alerts users that time is up.
  6. Change the variables to suit your needs.
    • In the "timer.js" script:
      1. Change minutes to match your Webvoyage timeout time. (I set it a minute before the WebVoyage timeout because the image may load later depending on the connection.)
      2. Change remindTime to the number of seconds left in the countdown when the popup will appear.
      3. Change timeoutpath to the relative path of your timeout.html file. (/timeout/timeout.html)
      4. Change timedoutpath to the relative path of your timedout.html file. (/timeout/timeout.html)
    • In the "timeout.js" script: Nothing. It should be fine.
    • In the "timedout.js" script:
      1. Change minutesRemaining to the amount of time you want the timeout window to stay before the page returns to the home page.
      2. Change homepage to match the page you'd like to refresh to.
    • If using pages other than the default, you made need to change the following as well:
    • In the timeout.html page:
      1. Change newSearch('/webvoy.htm') to reflect your homepage.
    • In the timedout.html page:
      1. Change all instances of replacePage('/cgi-bin/Pwebrecon.cgi?DB=local&PAGE=First') to match your default search page.
      2. Change all instances of replacePage('/cgi-bin/Pwebrecon.cgi?PAGE=LOGON') to match your login page.
  7. Add code to your header.htm. (Located by default at /m1/voyager/xxxdb/etc/webvoyage/)
    • Add the following:
      1. <script language="JavaScript" type="text/javascript" src="/js/timer.js" />
      2. In the <img> tag add the line: onLoad="showtimeout();"
    The following is the default WebVoyage header.htm with the 2 changes above made to it:
    <!-- Start of HTML header portion -->
    <CENTER>
    <script language="JavaScript" type="text/javascript" src="/js/timer.js" />
    <A HREF="/webvoy.htm"><IMG ALIGN=TOP BORDER=0 ALT="Start Over" SRC="/images/banner.gif" onLoad="showtimeout();"></A>
    </CENTER>
    <!-- End of HTML header portion -->

How It Works

When the banner image in the header loads, the onLoad="showtimeout();" call is made. (I didn't have access to the <body> tag, which is why we call an onLoad() method in the banner image.)
The showtimeout() function is located in timer.js.
The showtimeout() function continues to call itself and to count down until the remindtime.
At that point, it calls openWindow(), also located in timer.js, which opens the popup window.

The popup window, called timeout.html, has its own javascripts, located in /js/timeout.js
When timeout.html loads, it calls two functions: onLoad="showTime();" and onBlur="window.focus();"
The showTime() functions takes the time that is already being counted down and displays it.
The window.focus() function is used to keep the popup window in the front.
If the user clicks the "Restart Session" button, the reloadParent() function is called.
The reloadParent() function refreshes the library page, which resets WebVoyage, and closes the popup window, restarting the whole process.
If the user clicks the "New Session" button, the newSearch() function is called.
The newSearch() function sends the library page to the designated URL and closes the popup window.

The popup window called timedout.html has its own javascripts in /js/timedout.js
When the time has run out and no action was taken, the popup window loads timedout.html.
The timedout.html file calls two functions: onLoad="showRestartTimeout();" and onBlur="window.focus();"
The showRestartTimeout() function counts down the time to when the page will reload on the homepage.
It continues to call itself until either the clock runs out or the user takes action.
The window.focus() function is used to keep the popup window in the front.

Troubleshooting

Questions can be sent to Jim Robinson at Tarrant County College (jim.robinson[spamkill]@tccd.edu)

Some hints about debugging javascripts:

  • If something isn't working, try putting an alert message in the function to see if the code is being reached. For example:
    function testFunction() {
       alert("here");
       other code...;
    }
  • If the code isn't being called, check the syntax, the path to the javascript source, and your objects. Don't be afraid to stick an object in an alert message to make sure it's an object!
  • Download an Opera browser (http://www.opera.com) and turn on "Report JavaScript Errors". Download a Firefox browser (http://www.mozilla.org) and open the JavaScript console under Tools.
  • Remember: browser detection is poor coding...object detection will serve you much better.
-03.27.03