/** * submodal v1.6 * used for displaying dhtml only popups instead of using buggy modal windows. * * by subimage llc * http://www.subimage.com * * contributions by: * eric angel - tab index code * scott - hiding/showing selects for ie users * todd huss - inserting modal dynamically and anchor classes * * up to date code can be found at http://submodal.googlecode.com */ // popup code var gpopupmask = null; var gpopupcontainer = null; var gpopframe = null; var greturnfunc; var gpopupisshown = false; var gdefaultpage = ""; var ghideselects = false; var greturnval = null; var gtabindexes = new array(); // pre-defined list of tags we want to disable/enable tabbing into var gtabbabletags = new array("a","button","textarea","input","iframe"); // if using mozilla or firefox, use tab-key trap. if (!document.all) { document.onkeypress = keydownhandler; } /** * initializes popup code on load. */ function initpopup() { // add the html to the body thebody = document.getelementsbytagname('body')[0]; popmask = document.createelement('div'); popmask.id = 'popupmask'; popcont = document.createelement('div'); popcont.id = 'popupcontainer'; popcont.innerhtml = '' + '
' + '
' + '
' + '
' + '' + '
' + '
' + '' + '
'; thebody.appendchild(popmask); thebody.appendchild(popcont); gpopupmask = document.getelementbyid("popupmask"); gpopupcontainer = document.getelementbyid("popupcontainer"); gpopframe = document.getelementbyid("popupframe"); // check to see if this is ie version 6 or lower. hide select boxes if so // maybe they'll fix this in version 7? var brsversion = parseint(window.navigator.appversion.charat(0), 10); if (brsversion <= 6 && window.navigator.useragent.indexof("msie") > -1) { ghideselects = true; } // add onclick handlers to 'a' elements of class submodal or submodal-width-height var elms = document.getelementsbytagname('a'); for (i = 0; i < elms.length; i++) { if (elms[i].classname.indexof("submodal") == 0) { // var onclick = 'function (){showpopwin(\''+elms[i].href+'\','+width+', '+height+', null);return false;};'; // elms[i].onclick = eval(onclick); elms[i].onclick = function(){ // default width and height var width = 830; var height = 500; // parse out optional width and height from classname params = this.classname.split('-'); if (params.length == 3) { width = parseint(params[1]); height = parseint(params[2]); } showpopwin(this.href,width,height,null); return false; } } } } addevent(window, "load", initpopup); /** * @argument width - int in pixels * @argument height - int in pixels * @argument url - url to display * @argument returnfunc - function to call when returning true from the window. * @argument showclosebox - show the close box - default true */ function showpopwin(url, width, height, returnfunc, showclosebox) { // show or hide the window close widget if (showclosebox == null || showclosebox == true) { document.getelementbyid("popclosebox1").style.display = "block"; } else { document.getelementbyid("popclosebox1").style.display = "none"; } gpopupisshown = true; disabletabindexes(); gpopupmask.style.display = "block"; gpopupcontainer.style.display = "block"; // calculate where to place the window on screen centerpopwin(width, height); var titlebarheight = parseint(document.getelementbyid("popuptitlebar").offsetheight, 10); gpopupcontainer.style.width = width + "px"; gpopupcontainer.style.height = (height+titlebarheight) + "px"; setmasksize(); // need to set the width of the iframe to the title bar width because of the dropshadow // some oddness was occuring and causing the frame to poke outside the border in ie6 gpopframe.style.width = parseint(document.getelementbyid("popuptitlebar").offsetwidth, 10) + "px"; gpopframe.style.height = (height) + "px"; // set the url gpopframe.src = url; greturnfunc = returnfunc; // for ie if (ghideselects == true) { hideselectboxes(); } window.settimeout("setpoptitle();", 600); } // var gi = 0; function centerpopwin(width, height) { if (gpopupisshown == true) { if (width == null || isnan(width)) { width = gpopupcontainer.offsetwidth; } if (height == null) { height = gpopupcontainer.offsetheight; } //var thebody = document.documentelement; var thebody = document.getelementsbytagname("body")[0]; //thebody.style.overflow = "hidden"; var sctop = parseint(getscrolltop(),10); var scleft = parseint(thebody.scrollleft,10); setmasksize(); //window.status = gpopupmask.style.top + " " + gpopupmask.style.left + " " + gi++; var titlebarheight = parseint(document.getelementbyid("popuptitlebar").offsetheight, 10); var fullheight = getviewportheight(); var fullwidth = getviewportwidth(); gpopupcontainer.style.top = (sctop + ((fullheight - (height+titlebarheight)) / 2)) + "px"; gpopupcontainer.style.left = (scleft + ((fullwidth - width) / 2)) + "px"; //alert(fullwidth + " " + width + " " + gpopupcontainer.style.left); } } addevent(window, "resize", centerpopwin); addevent(window, "scroll", centerpopwin); window.onscroll = centerpopwin; /** * sets the size of the popup mask. * */ function setmasksize() { var thebody = document.getelementsbytagname("body")[0]; var fullheight = getviewportheight(); var fullwidth = getviewportwidth(); // determine what's bigger, scrollheight or fullheight / width if (fullheight > thebody.scrollheight) { popheight = fullheight; } else { popheight = thebody.scrollheight; } if (fullwidth > thebody.scrollwidth) { popwidth = fullwidth; } else { popwidth = thebody.scrollwidth; } gpopupmask.style.height = popheight + "px"; gpopupmask.style.width = popwidth + "px"; } /** * @argument callreturnfunc - bool - determines if we call the return function specified * @argument returnval - anything - return value */ function hidepopwin(callreturnfunc) { gpopupisshown = false; var thebody = document.getelementsbytagname("body")[0]; thebody.style.overflow = ""; restoretabindexes(); if (gpopupmask == null) { return; } gpopupmask.style.display = "none"; gpopupcontainer.style.display = "none"; if (callreturnfunc == true && greturnfunc != null) { // set the return code to run in a timeout. // was having issues using with an ajax.request(); greturnval = window.frames["popupframe"].returnval; window.settimeout('greturnfunc(greturnval);', 1); } gpopframe.src = gdefaultpage; // display all select boxes if (ghideselects == true) { displayselectboxes(); } } /** * sets the popup title based on the title of the html document it contains. * uses a timeout to keep checking until the title is valid. */ function setpoptitle() { return; if (window.frames["popupframe"].document.title == null) { window.settimeout("setpoptitle();", 10); } else { document.getelementbyid("popuptitle").innerhtml = window.frames["popupframe"].document.title; } } // tab key trap. iff popup is shown and key was [tab], suppress it. // @argument e - event - keyboard event that caused this function to be called. function keydownhandler(e) { if (gpopupisshown && e.keycode == 9) return false; } // for ie. go through predefined tags and disable tabbing into them. function disabletabindexes() { if (document.all) { var i = 0; for (var j = 0; j < gtabbabletags.length; j++) { var tagelements = document.getelementsbytagname(gtabbabletags[j]); for (var k = 0 ; k < tagelements.length; k++) { gtabindexes[i] = tagelements[k].tabindex; tagelements[k].tabindex="-1"; i++; } } } } // for ie. restore tab-indexes. function restoretabindexes() { if (document.all) { var i = 0; for (var j = 0; j < gtabbabletags.length; j++) { var tagelements = document.getelementsbytagname(gtabbabletags[j]); for (var k = 0 ; k < tagelements.length; k++) { tagelements[k].tabindex = gtabindexes[i]; tagelements[k].tabenabled = true; i++; } } } } /** * hides all drop down form select boxes on the screen so they do not appear above the mask layer. * ie has a problem with wanted select form tags to always be the topmost z-index or layer * * thanks for the code scott! */ function hideselectboxes() { var x = document.getelementsbytagname("select"); for (i=0;x && i < x.length; i++) { x[i].style.visibility = "hidden"; } } /** * makes all drop down form select boxes on the screen visible so they do not * reappear after the dialog is closed. * * ie has a problem with wanting select form tags to always be the * topmost z-index or layer. */ function displayselectboxes() { var x = document.getelementsbytagname("select"); for (i=0;x && i < x.length; i++){ x[i].style.visibility = "visible"; } }