/************************************************************************** * * Description: Javascript implementation of a scrolling tickertape of messages * * Project: WS Atkins - Environment Agency web site home page * * Author: Gordon Irving * * Initiated: 18th February 2002 * * Synopsis: * Displays a continuous left-to-right ticker of individual messages. * Each message can have a hyperlink or not. * Ticker pauses as each message completes. * * Usage: * MS IE: * create an HTML SPAN element 'tickerElementIE' * (onMouseOver and onMouseOut handlers are set up automatically) * Netscape: * create a layer 'tickerElementNS', * with onMouseOver='tickerHold()' and onMouseOut='tickerRelease()' * set the 'top' and 'left' properties as appropriate * * Both browsers: * call tickerItemsClear() to initialise the message store * call tickerAddItem(text,hyperlink) once for each message * call tickertape() to start the ticker (e.g. in BODY onLoad handler) * * Configuration: * Maximum displayed message length: 'maxLen' (default 70 chars) * Scrolling speed (delay): 'scrollSpeed' (default 30 milliseconds) * Pause speed (delay) at left boundary: 'holdScrollSpeed' (default 2000 milliseconds) * * Dependencies: * Constructed ticker text [in 'scrollTicker()'] includes class="hd7n" [for EA] * * Known issues: * Ticker stops in Netscape if page resized (page is reloaded) * * Change history: * 2002-02-20 GI First demo version ready for Environment Agency evaluation & approval * 2002-02-25 GI Second version - l2r ticker, no scrolling, no mouseOver pause * **************************************************************************/ /* configuration variables ... */ var maxLen = 70; var scrollSpeed = 50; var holdScrollSpeed = 2000; /* declarations of 'global' variables ... */ var hasTicker = 1; var tickerMsgs = new Array(); var tickerHyperlinks = new Array(); var tickerBuffer = new String(); var tickerMsgOffset; var tickerHeld = 0; var maxMsgNum = 0; var msgNum; var msg = new String(); var showChar = 0; var G_href; var nullVar; var textNode; var hrefNode; function showDOMTicker( newMsg ) { var tickerNode = document.getElementById('tickerDOM'); if ( ! tickerNode ) return; if ( textNode ) { var nodeList = tickerNode.childNodes; if ( hrefNode ) { hrefNode = nodeList.item(0); nodeList = hrefNode.childNodes; hrefNode.removeChild(textNode); textNode = nullVar; tickerNode.removeChild(hrefNode); hrefNode = nullVar; } else { tickerNode.removeChild(textNode); } } if ( G_href ) { hrefNode = document.createElement("a"); hrefNode.setAttribute("href", G_href); // hrefNode.setAttribute("id", "tickerHref"); tickerNode.appendChild(hrefNode); textNode = document.createTextNode(newMsg); hrefNode.appendChild(textNode); } else { textNode = document.createTextNode(newMsg); tickerNode.appendChild(textNode); } } /* present the ticker text in the dynamic HTML element ... */ function showTicker(messageText) { /* Start - Edited: D.johns 30.04.04 */ /* messageText = '> ' + messageText; */ messageText /* End - Edited: D.johns 30.04.04 */ if (document.all) { /* if ( G_href ) { document.all.tickerLink.href = G_href; } else { document.all.tickerLink.href = ''; } */ tickerElementIE.innerHTML = messageText; } else if (document.getElementById != null) { showDOMTicker( messageText ); } else if (document.layers) { var s_start = ''; var s_end = ''; var newHTML = ( G_href ) ? s_start + '' + messageText + '' + s_end : messageText; //alert("writing HTML: "+newHTML); document.tickerElementNS.document.visibility='show'; document.tickerElementNS.document.write(newHTML); document.tickerElementNS.document.close(); } } function setHyperlink( newLink ) { if (document.all) { document.all.tickerLink.href = (newLink) ? newLink : ''; } else if (document.getElementById != null) { G_href = newLink; } else if (document.layers) { G_href = newLink; } } /* construct the ticker text for display ... */ function scrollTicker( flag ){ if ( tickerHeld == 1 ) { return; } if ( maxMsgNum == 0 ) { return; } if ( (tickerMsgOffset > msg.length) || (tickerMsgOffset > maxLen) ) { // reached the end of this item - set up the next one ... tickerMsgOffset = 0; setTimeout("scrollTicker(1)",holdScrollSpeed); } else { if ( flag == 1 ) { if ( msgNum == maxMsgNum-1 ) { msgNum=0; } else { msgNum++; } setHyperlink( tickerHyperlinks[msgNum] ); msg = tickerMsgs[msgNum]; showChar = 0; } tickerBuffer = msg.substring(0,tickerMsgOffset); var tickerDelay = scrollSpeed; var delayTrailer = ""; if ( tickerMsgOffset == (maxLen) ) { tickerDelay = holdScrollSpeed; if ( tickerMsgs[msgNum].length >= maxLen ) { delayTrailer = "..."; } } else { if ( showChar == 2 ) { showChar = 0; } else if ( showChar == 1 ) { showChar++; if ( tickerMsgOffset < msg.length) {tickerBuffer += '_';} } else { showChar++; if ( tickerMsgOffset < msg.length) {tickerBuffer += '-';} } } var outputHTML; outputHTML = tickerBuffer + delayTrailer; showTicker(outputHTML); tickerMsgOffset++; setTimeout("scrollTicker(0)",tickerDelay); } } /* event handlers for mouseOver and mouseOut ... */ function tickerHold() { tickerHeld = 1; } function tickerRelease() { tickerHeld = 0; scrollTicker(0); } /******************/ /* "external API" */ /******************/ function tickerItemsClear() { tickerMsgs.length = 0; tickerHyperlinks.length = 0; maxMsgNum = 0; } function tickerAddItem(text,hyperlink) { if ( ! hasTicker ) { return; } var idx = tickerMsgs.length; tickerMsgs.length++; tickerHyperlinks.length++; tickerMsgs[idx] = text; tickerHyperlinks[idx] = hyperlink; maxMsgNum++; } function tickertape() { if ( ! hasTicker ) { return; } msgNum = 0; setHyperlink( tickerHyperlinks[msgNum] ); msg = tickerMsgs[msgNum]; tickerMsgOffset = 0; tickerRelease(); }