// -------------------------------------------------------------------
// DHTML Window Widget- By Dynamic Drive, available at: http://www.dynamicdrive.com
// DHTML Modal window- By Dynamic Drive, available at: http://www.dynamicdrive.com
// -------------------------------------------------------------------
var winpopup = {
imagefiles: ['/images/iconminx.gif', '/images/iconclosex.gif', '/images/iconrestorex.gif', '/images/iconresizex.gif'], //Path to 4 images used by script, in that order
ajaxbustcache: true, //Bust caching when fetching a file via Ajax?
ajaxloadinghtml: 'Loading Page. Please wait...', //HTML to show while window fetches Ajax Content?
minimizeorder: 0,
zIndexvalue: 100,
tobjects: [], //object to contain references to dhtml window divs, for cleanup purposes
lastactivet: {}, //reference to last active DHTML window
veilstack: 0,
veilopacity: 0,
init: function (t) {
var domwindow = document.createElement("div"); //create dhtml window div
domwindow.id = t;
domwindow.className = "winpopup";
var domwindowdata = '';
domwindowdata = '
';
domwindowdata += 'DHTML Window
';
domwindowdata += '
';
domwindowdata += '';
domwindowdata += '
';
domwindowdata += '';
domwindow.innerHTML = domwindowdata;
document.getElementById("winpopupholder").appendChild(domwindow);
//this.zIndexvalue=(this.zIndexvalue)? this.zIndexvalue+1 : 100 //z-index value for DHTML window: starts at 0, increments whenever a window has focus
var t = document.getElementById(t);
var divs = t.getElementsByTagName("div");
for (var i = 0; i < divs.length; i++) { //go through divs inside dhtml window and extract all those with class="drag-" prefix
if (/drag-/.test(divs[i].className))
t[divs[i].className.replace(/drag-/, "")] = divs[i]; //take out the "drag-" prefix for shorter access by name
}
//t.style.zIndex=this.zIndexvalue //set z-index of this dhtml window
t.handle._parent = t; //store back reference to dhtml window
t.resizearea._parent = t; //same
t.controls._parent = t; //same
t.onclose = function () { return true }; //custom event handler "onclose"
t.onmousedown = function () { winpopup.setfocus(this); } //Increase z-index of window when focus is on it
t.handle.onmousedown = winpopup.setupdrag; //set up drag behavior when mouse down on handle div
t.resizearea.onmousedown = winpopup.setupdrag; //set up drag behavior when mouse down on resize div
t.controls.onclick = winpopup.enablecontrols;
t.show = function () { winpopup.show(this); } //public function for showing dhtml window
t.hide = function () { winpopup.hide(this); } //public function for hiding dhtml window
t.close = function () { winpopup.close(this); } //public function for closing dhtml window (also empties DHTML window content)
t.setSize = function (w, h) { winpopup.setSize(this, w, h); } //public function for setting window dimensions
t.moveTo = function (x, y) { winpopup.moveTo(this, x, y); } //public function for moving dhtml window (relative to viewpoint)
t.isResize = function (bol) { winpopup.isResize(this, bol); } //public function for specifying if window is resizable
t.isScrolling = function (bol) { winpopup.isScrolling(this, bol); } //public function for specifying if window content contains scrollbars
t.load = function (contenttype, contentsource, title, isScrolling) { winpopup.load(this, contenttype, contentsource, title, isScrolling); } //public function for loading content into window
this.tobjects[this.tobjects.length] = t;
return t; //return reference to dhtml window div
},
openmodal: function (t, contenttype, contentsource, title, attr, recalonload) {
var d = winpopup; //reference winpopup object
function getValue(Name) {
var config = new RegExp(Name + "=([^,]+)", "i"); //get name/value config pair (ie: width=400px,)
return (config.test(attr)) ? parseInt(RegExp.$1) : 0; //return value portion (int), or 0 (false) if none found
}
this.interVeil = document.getElementById("interVeil"); //Reference "veil" div
this.veilopacity = getValue("opacity"); //Get the opacity for the veil
this.veilstack++; //var to keep track of how many modal windows are open right now
this.loadveil();
if (recalonload == "recal" && d.scroll_top == 0)
d.addEvent(window, function () { d.adjustveil() }, "load");
var t = d.open(t, contenttype, contentsource, title, attr, recalonload);
t.controls.firstChild.style.display = "none"; //Disable "minimize" button
t.controls.onclick = function () { d.closemodal(this._parent); } //OVERWRITE default control action with new one
t.close = function () { d.closemodal(this); } //OVERWRITE default t.close() method with new one
t.show = function () { d.showmodal(this); } //OVERWRITE default t.show() method with new one
t.hide = function () { d.closemodal(this); } //OVERWRITE default t.hide() method with new one
return t;
},
open: function (t, contenttype, contentsource, title, attr, recalonload) {
var d = winpopup; //reference dhtml window object
function getValue(Name) {
var config = new RegExp(Name + "=([^,]+)", "i"); //get name/value config pair (ie: width=400px,)
return (config.test(attr)) ? parseInt(RegExp.$1) : 0; //return value portion (int), or 0 (false) if none found
}
if (document.getElementById(t) == null) //if window doesn't exist yet, create it
t = this.init(t); //return reference to dhtml window div
else
t = document.getElementById(t);
this.setfocus(t);
t.setSize(getValue(("width")), (getValue("height"))); //Set dimensions of window
var xpos = getValue("center") ? "middle" : getValue("left"); //Get x coord of window
var ypos = getValue("center") ? "middle" : getValue("top"); //Get y coord of window
//t.moveTo(xpos, ypos) //Position window
if (typeof recalonload != "undefined" && recalonload == "recal" && this.scroll_top == 0) { //reposition window when page fully loads with updated window viewpoints?
if (window.attachEvent && !window.opera) //In IE, add another 400 milisecs on page load (viewpoint properties may return 0 b4 then)
this.addEvent(window, function () { setTimeout(function () { t.moveTo(xpos, ypos) }, 400) }, "load");
else
this.addEvent(window, function () { t.moveTo(xpos, ypos); }, "load");
}
t.isResize(getValue("resize")); //Set whether window is resizable
t.isScrolling(getValue("scrolling")); //Set whether window should contain scrollbars
t.style.visibility = "visible";
if (getValue("hide"))
t.style.display = "none";
else
t.style.display = "block";
t.contentarea.style.display = "block";
t.moveTo(xpos, ypos); //Position window
t.load(contenttype, contentsource, title, getValue("scrolling"));
if (t.state == "minimized" && t.controls.firstChild.title == "Restore") { //If window exists and is currently minimized?
t.controls.firstChild.setAttribute("src", winpopup.imagefiles[0]); //Change "restore" icon within window interface to "minimize" icon
t.controls.firstChild.setAttribute("title", "Minimize");
t.state = "fullview"; //indicate the state of the window as being "fullview"
}
if ((!getValue("minimize")) && (t.controls.firstChild.title == "Minimize")) {
t.controls.firstChild.style.display = "none";
}
return t;
},
setSize: function (t, w, h) { //set window size (min is 150px wide by 100px tall)
t.style.width = Math.max(parseInt(w), 150) + "px";
t.contentarea.style.height = Math.max(parseInt(h), 100) + "px";
},
moveTo: function (t, x, y) { //move window. Position includes current viewpoint of document
this.getviewpoint(); //Get current viewpoint numbers
t.style.left = (x == "middle") ? this.scroll_left + (this.docwidth - t.offsetWidth) / 2 + "px" : this.scroll_left + parseInt(x) + "px";
t.style.top = (y == "middle") ? this.scroll_top + (this.docheight - t.offsetHeight) / 2 + "px" : this.scroll_top + parseInt(y) + "px";
},
isResize: function (t, bol) { //show or hide resize inteface (part of the status bar)
t.statusarea.style.display = (bol) ? "block" : "none";
t.resizeBool = (bol) ? 1 : 0;
},
isScrolling: function (t, bol) { //set whether loaded content contains scrollbars
t.contentarea.style.overflow = (bol) ? "auto" : "hidden";
},
load: function (t, contenttype, contentsource, title, isScrolling) { //loads content into window plus set its title (3 content types: "inline", "iframe", or "ajax")
var scroll = (isScrolling) ? "auto" : "no";
if (t.isClosed) {
alert("DHTML Window has been closed, so no window to load contents into. Open/Create the window again.");
return;
}
var contenttype = contenttype.toLowerCase(); //convert string to lower case
if (typeof title != "undefined")
t.handle.firstChild.nodeValue = title;
if (contenttype == "inline")
t.contentarea.innerHTML = contentsource;
else if (contenttype == "div") {
var inlinedivref = document.getElementById(contentsource);
t.contentarea.innerHTML = (inlinedivref.defaultHTML || inlinedivref.innerHTML); //Populate window with contents of inline div on page
if (!inlinedivref.defaultHTML)
inlinedivref.defaultHTML = inlinedivref.innerHTML; //save HTML within inline DIV
inlinedivref.innerHTML = ""; //then, remove HTML within inline DIV (to prevent duplicate IDs, NAME attributes etc in contents of DHTML window
inlinedivref.style.display = "none"; //hide that div
}
else if (contenttype == "iframe") {
t.contentarea.style.overflow = "hidden"; //disable window scrollbars, as iframe already contains scrollbars
if (!t.contentarea.firstChild || t.contentarea.firstChild.tagName != "IFRAME") { //If iframe tag doesn't exist already, create it first
t.contentarea.innerHTML = '';
if (window.top.frames.frmHead.CustomerTimeOut) bindActiveWindow($(t.contentarea).find("iframe"));
}
window.frames["_iframe-" + t.id].location.replace(contentsource); //set location of iframe window to specified URL
}
else if (contenttype == "ajax") {
this.ajax_connect(contentsource, t); //populate window with external contents fetched via Ajax
}
t.contentarea.datatype = contenttype; //store contenttype of current window for future reference
},
setupdrag: function (e) {
var d = winpopup; //reference dhtml window object
var t = this._parent; //reference dhtml window div
d.etarget = this; //remember div mouse is currently held down on ("handle" or "resize" div)
var e = window.event || e;
d.initmousex = e.clientX; //store x position of mouse onmousedown
d.initmousey = e.clientY;
d.initx = parseInt(t.offsetLeft); //store offset x of window div onmousedown
d.inity = parseInt(t.offsetTop);
d.width = parseInt(t.offsetWidth); //store width of window div
d.contentheight = parseInt(t.contentarea.offsetHeight); //store height of window div's content div
if (t.contentarea.datatype == "iframe") { //if content of this window div is "iframe"
t.style.backgroundColor = "#F8F8F8"; //colorize and hide content div (while window is being dragged)
t.contentarea.style.visibility = "hidden";
}
document.onmousemove = d.getdistance; //get distance travelled by mouse as it moves
document.onmouseup = function () {
if (t.contentarea.datatype == "iframe") { //restore color and visibility of content div onmouseup
t.contentarea.style.backgroundColor = "white";
t.contentarea.style.visibility = "visible";
}
d.stop();
}
return false;
},
getdistance: function (e) {
var d = winpopup;
var etarget = d.etarget;
var e = window.event || e;
d.distancex = e.clientX - d.initmousex; //horizontal distance travelled relative to starting point
d.distancey = e.clientY - d.initmousey;
if (etarget.className == "drag-handle") //if target element is "handle" div
d.move(etarget._parent, e);
else if (etarget.className == "drag-resizearea") //if target element is "resize" div
d.resize(etarget._parent, e);
return false; //cancel default dragging behavior
},
getviewpoint: function () { //get window viewpoint numbers
var ie = document.all && !window.opera;
var domclientWidth = document.documentElement && parseInt(document.documentElement.clientWidth) || 100000; //Preliminary doc width in non IE browsers
this.standardbody = (document.compatMode == "CSS1Compat") ? document.documentElement : document.body; //create reference to common "body" across doctypes
this.scroll_top = (ie) ? this.standardbody.scrollTop : window.pageYOffset;
this.scroll_left = (ie) ? this.standardbody.scrollLeft : window.pageXOffset;
this.docwidth = (ie) ? this.standardbody.clientWidth : (/Safari/i.test(navigator.userAgent)) ? window.innerWidth : Math.min(domclientWidth, window.innerWidth - 16);
this.docheight = (ie) ? this.standardbody.clientHeight : window.innerHeight;
},
rememberattrs: function (t) { //remember certain attributes of the window when it's minimized or closed, such as dimensions, position on page
this.getviewpoint(); //Get current window viewpoint numbers
t.lastx = parseInt((t.style.left || t.offsetLeft)) - winpopup.scroll_left; //store last known x coord of window just before minimizing
t.lasty = parseInt((t.style.top || t.offsetTop)) - winpopup.scroll_top;
t.lastwidth = parseInt(t.style.width); //store last known width of window just before minimizing/ closing
},
move: function (t, e) {
t.style.left = winpopup.distancex + winpopup.initx + "px";
t.style.top = winpopup.distancey + winpopup.inity + "px";
},
resize: function (t, e) {
t.style.width = Math.max(winpopup.width + winpopup.distancex, 150) + "px";
t.contentarea.style.height = Math.max(winpopup.contentheight + winpopup.distancey, 100) + "px";
},
enablecontrols: function (e) {
var d = winpopup;
var sourceobj = window.event ? window.event.srcElement : e.target; //Get element within "handle" div mouse is currently on (the controls)
if (/Minimize/i.test(sourceobj.getAttribute("title"))) //if this is the "minimize" control
d.minimize(sourceobj, this._parent);
else if (/Restore/i.test(sourceobj.getAttribute("title"))) //if this is the "restore" control
d.restore(sourceobj, this._parent);
else if (/Close/i.test(sourceobj.getAttribute("title"))) //if this is the "close" control
d.close(this._parent);
return false;
},
minimize: function (button, t) {
winpopup.rememberattrs(t);
button.setAttribute("src", winpopup.imagefiles[2]);
button.setAttribute("title", "Restore");
t.state = "minimized"; //indicate the state of the window as being "minimized"
t.contentarea.style.display = "none";
t.statusarea.style.display = "none";
if (typeof t.minimizeorder == "undefined") { //stack order of minmized window on screen relative to any other minimized windows
winpopup.minimizeorder++; //increment order
t.minimizeorder = winpopup.minimizeorder;
}
t.style.left = "10px"; //left coord of minmized window
t.style.width = "200px";
var windowspacing = t.minimizeorder * 10; //spacing (gap) between each minmized window(s)
t.style.top = winpopup.scroll_top + winpopup.docheight - (t.handle.offsetHeight * t.minimizeorder) - windowspacing + "px";
},
restore: function (button, t) {
winpopup.getviewpoint();
button.setAttribute("src", winpopup.imagefiles[0]);
button.setAttribute("title", "Minimize");
t.state = "fullview"; //indicate the state of the window as being "fullview"
t.style.display = "block";
t.contentarea.style.display = "block";
if (t.resizeBool) //if this window is resizable, enable the resize icon
t.statusarea.style.display = "block";
t.style.left = parseInt(t.lastx) + winpopup.scroll_left + "px"; //position window to last known x coord just before minimizing
t.style.top = parseInt(t.lasty) + winpopup.scroll_top + "px";
t.style.width = parseInt(t.lastwidth) + "px";
},
closemodal: function (t) { //DHTML modal close function
if (winpopup.close(t)) //if close() returns true
this.closeveil();
},
close: function (t) {
t.contentDoc = (t.contentarea.datatype == "iframe") ? window.frames["_iframe-" + t.id].document : t.contentarea; //return reference to window DIV (or document object in the case of iframe)
try {
var closewinbol = t.onclose();
}
catch (err) { //In non IE browsers, all errors are caught, so just run the below
var closewinbol = true;
}
finally { //In IE, not all errors are caught, so check if variable isn't defined in IE in those cases
if (typeof closewinbol == "undefined") {
alert("An error has occured somwhere inside your \"onclose\" event handler");
var closewinbol = true;
}
}
if (closewinbol) { //if custom event handler function returns true
if (t.state != "minimized") //if this window isn't currently minimized
winpopup.rememberattrs(t); //remember window's dimensions/position on the page before closing
if (window.frames["_iframe-" + t.id]) //if this is an IFRAME DHTML window
window.frames["_iframe-" + t.id].location.replace("about:blank");
else
t.contentarea.innerHTML = "";
t.style.display = "none";
t.isClosed = true; //tell script this window is closed (for detection in t.show())
}
return closewinbol;
},
setopacity: function (targetobject, value) { //Sets the opacity of targetobject based on the passed in value setting (0 to 1 and in between)
if (!targetobject)
return;
if (targetobject.filters && targetobject.filters[0]) { //IE syntax
if (typeof targetobject.filters[0].opacity == "number") //IE6
targetobject.filters[0].opacity = value * 100;
else //IE 5.5
targetobject.style.filter = "alpha(opacity=" + value * 100 + ")";
}
else if (typeof targetobject.style.MozOpacity != "undefined") //Old Mozilla syntax
targetobject.style.MozOpacity = value;
else if (typeof targetobject.style.opacity != "undefined") //Standard opacity syntax
targetobject.style.opacity = value;
},
setfocus: function (t) { //Sets focus to the currently active window
if (t != this.lastactivet) {
this.zIndexvalue++
var mxZ = maxZ();
if (this.zIndexvalue < mxZ) this.zIndexvalue = mxZ + 2;
t.style.zIndex = this.zIndexvalue;
this.setopacity(this.lastactivet.handle, 0.5); //unfocus last active window
this.setopacity(t.handle, 1); //focus currently active window
this.lastactivet = t; //remember last active window
}
t.isClosed = false; //tell script this window isn't closed (for detection in t.show())
},
showmodal: function (t) {
winpopup.veilstack++;
winpopup.loadveil();
winpopup.show(t);
},
show: function (t) {
if (t.isClosed) {
alert("DHTML Window has been closed, so nothing to show. Open/Create the window again.");
return;
}
if (t.lastx) //If there exists previously stored information such as last x position on window attributes (meaning it's been minimized or closed)
winpopup.restore(t.controls.firstChild, t); //restore the window using that info
else
t.style.display = "block";
this.setfocus(t);
t.state = "fullview"; //indicate the state of the window as being "fullview"
},
hide: function (t) {
t.style.display = "none";
},
loadveil: function () {
var d = winpopup;
d.getviewpoint();
var mxZ = maxZ();
this.docheightcomplete = (d.standardbody.offsetHeight > d.standardbody.scrollHeight) ? d.standardbody.offsetHeight : d.standardbody.scrollHeight;
this.interVeil.style.width = d.docwidth + "px"; //set up veil over page
this.interVeil.style.height = this.docheightcomplete + "px"; //set up veil over page
this.interVeil.style.left = 0; //Position veil over page
this.interVeil.style.top = 0; //Position veil over page
this.interVeil.style.visibility = "visible"; //Show veil over page
this.interVeil.style.display = "block"; //Show veil over page
this.interVeil.style.filter = "progid:DXImageTransform.Microsoft.Alpha(opacity=" + this.veilopacity + ")";
this.interVeil.style.zIndex = (mxZ + 1); //alert("loadveil");
},
adjustveil: function () { //function to adjust veil when window is resized
if (this.interVeil && this.interVeil.style.display == "block") //If veil is currently visible on the screen
this.loadveil(); //readjust veil
},
closeveil: function () { //function to close veil
this.veilstack--;
if (this.veilstack == 0) { //if this is the only modal window visible on the screen, and being closed
this.interVeil.style.display = "none";
this.interVeil.style.zIndex = 100;
}
},
ajax_connect: function (url, t) {
var page_request = false;
var bustcacheparameter = "";
if (window.XMLHttpRequest) // if Mozilla, IE7, Safari etc
page_request = new XMLHttpRequest();
else if (window.ActiveXObject) { // if IE6 or below
try {
page_request = new ActiveXObject("Msxml2.XMLHTTP");
}
catch (e) {
try {
page_request = new ActiveXObject("Microsoft.XMLHTTP");
}
catch (e) { }
}
}
else
return false;
t.contentarea.innerHTML = this.ajaxloadinghtml;
page_request.onreadystatechange = function () { winpopup.ajax_loadpage(page_request, t) }
if (this.ajaxbustcache) //if bust caching of external page
bustcacheparameter = (url.indexOf("?") != -1) ? "&" + new Date().getTime() : "?" + new Date().getTime();
page_request.open('GET', url + bustcacheparameter, true);
page_request.send(null);
},
ajax_loadpage: function (page_request, t) {
if (page_request.readyState == 4 && (page_request.status == 200 || window.location.href.indexOf("http") == -1)) {
t.contentarea.innerHTML = page_request.responseText;
}
},
stop: function () {
winpopup.etarget = null //clean up
document.onmousemove = null;
document.onmouseup = null;
},
addEvent: function (target, functionref, tasktype) { //assign a function to execute to an event handler (ie: onunload)
var tasktype = (window.addEventListener) ? tasktype : "on" + tasktype
if (target.addEventListener)
target.addEventListener(tasktype, functionref, false);
else if (target.attachEvent)
target.attachEvent(tasktype, functionref);
},
cleanup: function () {
for (var i = 0; i < winpopup.tobjects.length; i++) {
winpopup.tobjects[i].handle._parent = winpopup.tobjects[i].resizearea._parent = winpopup.tobjects[i].controls._parent = null;
}
window.onload = null;
}
} //End winpopup object
document.write(''); //container that holds all dhtml modal window divs on page
winpopup.addEvent(window, function () { if (typeof winpopup != "undefined") winpopup.adjustveil() }, "resize");
document.write('