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.

WebVoyáge 7 & 8 (Tomcat) Session Timeout Warning, version 3.1

Version 1.0, using popup windows, can be found here. Version 1.0 is not recommended because pop-up blockers will block the warning windows!
Version 2.2, for WebVoyage 6.x, can be found here.
Version 3, for WebVoyage 7.x without the seconds countdown, can be found here.

These scripts are meant to be used with the WebVoyage product by Ex Libris Ltd. WebVoyage has a session timeout feature which displays a JavaScript alert message by default. A JavaScript alert message takes over a browser and provides the user with no further instruction on how to proceed.

The scripts use DHTML (CSS + JavaScript). The new scripts, just like the old scripts, will not work in browsers with JavaScript disabled. Users without JavaScript will experience the default WebVoyage behavior.

The JavaScripts and stylesheets enclosed in tomcat_timeout_3_1.zip are meant to warn the user before the end of the session timeout, giving the user a chance to restart the timer by refreshing the page. If the user takes no action before the session timeout, the default behaviour occurs. Version 3.1 counts down the remaining seconds so the user knows how long they have left.

You can see these JavaScripts in action at http://library.tccd.edu/vwebv/searchBasic. Wait 13 minutes... ;-) or Click Here

Instructions

  1. {skin} refers to your current skin
  2. {xxxdb} refers to your database name
  3. Download the JavaScripts and stylesheet at tomcat_timeout_3_1.zip.

  4. Unzip tomcat_timeout_3_1.zip. Inside will be three files:
    • tcc_timeout_javascript.js
    • tcc_timeout_stylesheet.css
    • instructions.pdf

  5. Copy tcc_timeout_javascript.js to your jscripts folder usually located at
    /m1/voyager/{xxxdb}/tomcat/vwebv/context/vwebv/ui/{skin}/jscripts/.

  6. Copy tcc_timeout_stylesheet.css to your css folder usually located at
    /m1/voyager/{xxxdb}/tomcat/vwebv/context/vwebv/ui/{skin}/css/.

  7. Add the bold green code to
    m1/voyager/{xxxdb}/tomcat/vwebv/context/vwebv/ui/{skin}/xsl/pageFacets/footer.xsl between </xsl:for-each> and </xsl:template> (Look for the </xsl:for-each> and </xsl:template> just below the copyright notice):
    </xsl:for-each> 
       <!-- ######### Timeout ############ -->
          <div id='tcc_timeout_container'>
             <div id='tcc_timeout_title'>Session Timeout</div>
             <div id='tcc_timeout_message'></div>
             <div id='tcc_timeout_page_refresh'>
                <script type='text/javascript'>
                	document.write('<a href="' + window.location.href + '">Continue Session</a>');
                </script>
             </div>
             <div id='tcc_timeout_session_refresh'>
                <a href='/vwebv/exit.do'>New Session</a>
             </div>
          </div>
          <script type='text/javascript'>
             var dragBase = document.getElementById('tcc_timeout_container');
             var dragHandle = document.getElementById('tcc_timeout_title');
             tccDrag.init(dragBase, dragHandle, '400px', '250px');
          </script>
       <!-- ######### Timeout ############ -->
    </xsl:template>
    				
  8. Add the bold green code to
    /m1/voyager/xxxdb/tomcat/vwebv/context/vwebv/ui/{skin}/xsl/pageTools/frameWorks.xsl
    in the places indicated:
    <script type="text/javascript">
    var msg; 
    var timeOut;
    var seconds;
    function timedMsg(time, grace, txtMsg)
    {
    msg = txtMsg;
    timeOut = (time - grace) * 60000;
    seconds = grace * 60;
    <!--// setTimeout("alert(msg)", timeOut); //-->
    setTimeout("tcc_display_timeout(msg)",timeOut);
    }
    </script>
    
    ...more code here...
    
    <script type="text/javascript" src="{$jscript-loc}pageInputFocus.js"/>
    <script type="text/javascript" src="{$jscript-loc}tcc_timeout_javascript.js"/>
    
    ...more code here...
    
    WebVoyage 7.0.4 and previous
    <style type="text/css" media="screen,print">@import "<xsl:value-of select="$css-loc"/>tcc_timeout_stylesheet.css";</style>
    <xsl:comment><![CDATA[[if IE]>
       <style type="text/css" media="screen,print">@import "ui/en_US/css/ieFixes.css";</style>
    <![endif]]]></xsl:comment>
    
    WebVoyage 7.1 and later
    <style type="text/css" media="screen,print">@import "<xsl:value-of select="$css-loc"/>tcc_timeout_stylesheet.css";</style>
    <xsl:text disable-output-escaping = "yes"><!--[if lt IE 8]></xsl:text>
       <style type="text/css" media="screen,print">@import "<xsl:value-of select="$css-loc"/>ieFixes.css";</style>
    <xsl:text disable-output-escaping = "yes"><![endif]--></xsl:text>
    <xsl:text disable-output-escaping = "yes"><!--[if IE 8]></xsl:text>
       <style type="text/css" media="screen,print">@import "<xsl:value-of select="$css-loc"/>ie8Fixes.css";</style>
    <xsl:text disable-output-escaping = "yes"><![endif]--></xsl:text>
    
    WebVoyage 8
        <link href="{$css-loc}tcc_timeout_stylesheet.css" media="screen" type="text/css" rel="stylesheet"/>
    <xsl:text disable-output-escaping = "yes"><!--[if lt IE 8]></xsl:text>
        <link href="{$css-loc}ieFixes.css"   media="all" type="text/css" rel="stylesheet"/>
    <xsl:text disable-output-escaping = "yes"><![endif]--></xsl:text>
    				

Version History

    v3.1a (2011-07-25)
  • Updated instructions for WebVoyage 8 (Tomcat)
    v3.1 (2009-04-21)
  • Displays remaining seconds. Thanks to Alex Kustanovich at St. Francis College Library for reminding me that I still hadn't updated this page!
    v3.0 (2008-09-29)
  • Complete rewrite for WebVoyage 7.0.1 (Tomcat)
    v2.1 (2006-02-23)
  • Declared undeclared variables to prevent JavaScript Warnings
  • Test for document.warningForm and document.warningForm.timeRemaining in startTimer(). This prevents errors when accessing Endeavor™'s WebVoyage History because the History Page has an unterminated <form> tag. (<form> but no </form>).
  • Removed language='JavaScript' attribute from <script> tags in the instructions. The language attribute has been deprecated in favor of the type='text/javascript' attribute.
  • Corrected function call in which newLoginURL variable was not being used by the New Session Login button.
    v2.0 (2005-12-09)
  • In Voyager 5, for sorting a results list, Endeavor™ uses a JavaScript to call a function (doSubmit(f)) that submits the form. To call the function, the Endeavor™ script refers to 2 forms by number, the number being the order in which they load on the page. (That is document.forms[0] and document.forms[2]).
    Note: Properly done, these forms would be referred to by name (document.forms['querybox']), but since document.forms[0] and document.forms[2] have the same name (querybox), they should be referred to by ID. For example, document.getElementById('querybox1') and document.getElementById('querybox2').
  • In the original instructions for the timer scripts, the timer scripts were loaded and called at the top of the page. Because of this, the form for the script became document.forms[0] and subsequent forms received a number one higher than before. (that is, document.forms[1] and document.forms[3]).
  • To fix this problem, simply move the timer calls to getWarning() and initTimer() to the bottom of the page so they are called after the other forms are loaded.

Troubleshooting

Questions can be sent to Jim Robinson at Tarrant County College District

Some hints about debugging javascripts:

Session Timeout
New Session