// // Popup script for the talks database // Ivan Herman $Date: 2006/05/02 09:16:39 $ (with lots of help from Dave Raggett) // // This is an ugly but effective trick from Dave Raggett. The issue: // the mechamism is based on using the javascript to 'move' the abstract content out of the way // however, the onload event is dispatched once the inital document is rendered. That means // that there is an ugly flash on the screen with the abstract texts. The trick below adds // an extra style entry to do this when the javascript is used. (That means that if there is no // javascript then everything is fine and displayed, as it should be) // document.write(""); // I took this from Dave Raggett, too var ns_pos = (typeof window.pageYOffset!='undefined'); var currentPopup = null; // Name tells it all... var abstracts = new Array(); // All the abstracts are collected at the beginning to speed this up var buttons = new Array(); // The dismiss buttons on the abstract popups. Used to set the focus window.onload = init; // // Initialization: // collect all abstracts into and array // set the positioning of each abstract as 'absolute' // (the reason not to have that as part of the css styling is that it would be // disruptive for a non-javascript based environment) // function init() { // handle all possible abstracts and related tags... _init(document.getElementsByTagName("span")); _init(document.getElementsByTagName("div")); _init(document.getElementsByTagName("cite")); } function _init(dds) { // IE getAttribute requires "class" to be "className" :-( var name = ns_pos ? "class" : "className"; for( var i=0; i < dds.length; i++ ) { dd = dds[i]; cl = dd.getAttribute(name); // if( hasClass(dd,"abstract") ) { if( hasClass(dd,"abstract") ) { dd.style.position = "absolute"; dd.style.left = "-10000px"; dd.style.width = "35em"; dd.style.borderWidth = "thin"; dd.style.borderColor = "black"; dd.style.borderStyle = "solid"; dd.style.background = "rgb(240, 240, 200)"; dd.style.display = "block"; dd.style.padding = "0.5em"; // adding this button is Dave's idea, that ensures usability on // keyboard only environments. The extra trick is when the button is // displayed, it also gets the focus.... var button = document.createElement("button"); button.onclick = dismiss; button.innerHTML = "Dismiss"; dd.appendChild(button); // store both the button and the abstract for later processing abstracts.push(dd); buttons.push(button); } else if( hasClass(dd,"abstractTitle") ) { dd.style.backgroundImage = "url(/2004/08/TalkFiles/close.png)"; dd.style.cursor = "pointer"; dd.style.display = "block"; dd.style.paddingBottom = "0.1em"; } else if( hasClass(dd,"abstractContent") ) { dd.style.display = "block"; dd.style.padding = "0.5em"; } else if( hasClass(dd,"abstractClick") ) { dd.style.display = "inline"; } } } // // Switch the a popup down by setting its display to 'none' // function dismiss() { if( currentPopup != null ) { currentPopup.style.left = "-10000px"; currentPopup = null; } } // // see if an element has a particular class, regardless of whether that is the only class // or part of a list of classes function hasClass(element, name) { // this is one of the many uglinesses of IE :-( if (typeof window.pageYOffset =='undefined') var cls = element.getAttribute("className"); else cls = element.getAttribute("class"); var regString = "(^| )" + name + "( |$)\W*"; var regExpression = new RegExp(regString); if (regExpression.test(cls)) return true; else return false; } // // Callback to switch an abstract on, by using its 'id'. It also switches off any other // popup on the screen // // Caveat: the positioning of the popup should be improved... // function switchOn(id) { if( currentPopup != null ) { dismiss(); } for( var i=0; i < abstracts.length; i++ ) { dd = abstracts[i]; if( dd.getAttribute("id") == id ) { dd.style.left = "10em"; buttons[i].focus(); currentPopup = dd; return; } } } // // Callback to switch an abstract off // function switchOff(id,e) { dismiss() } // // $Log: popup.js,v $ // Revision 1.5 2006/05/02 09:16:39 ivan // Some small stylistic tweaks suggested by Dave R // // Revision 1.4 2006/04/20 08:00:55 ivan // - added an (adapted) version of hasClass from Dave (an extra space was // necessary in the regular expression) // - added a focus on the button for the popup (which necessitated the storage // of the buttons in a separate array) // - function interfaces simplified (the event is not necessary any more, // because the popup's position is not dependent on the event any more) // // Revision 1.3 2006/04/19 15:30:56 ivan // Added an extra 'dismiss' button to the abstract popup (with proper styling) // // Revision 1.2 2006/04/19 13:39:44 ivan // Added the popup related changes to css, and the right URI for the close image into the script // // //