/* Based upon work from Chris Campbell
* Website: http://particletree.com
* Inspired by the lightbox implementation found at http://www.huddletogether.com/projects/lightbox/
* and by Lokesh Dhakar - http://www.lokeshdhakar.com
*
* Adapted and extended for StepStone V5 by JOBV
*
* Requirements: prototype.js, version 1.6
*
**/
if (typeof(Prototype) == "undefined")
throw "Lightbox requires Prototype";
var Lightbox = Class.create({
yPos: 0,
xPos: 0,
initialize: function(options){
LiBo = this;
this.opt = Object.extend({
name: 'LightBox',
debug: debug, // false || debug (is general debug from lib.js)
ctrl: '', // the element that triggers the lightbox
content: '', // the content to show in the lightbox; separate webpage if "ajax" is used; text, HTML when "innerHTML" method is chosen etc.
handler: 'click', // event handler that triggers the lightbox
method: 'innerHTML', // "ajax" or "innerHTML"
useoverlay: true, // use the overlay div to obscure the normal site
closeonoverlayclick: true,
type: '', // What kind of lightbox: options are "default", "message", "wait", "loading", "alert", "confirm", "gallery", "video", "help", "overlayer", "splash"
position: '', // Where do you want the lightbox to be shown: "mouse", "center", "top center", "bottom center", "top left", "top right", "bottom left", "bottom right"
asynch: false, // If true and ajax method is used, script will load the ajax content at initialisation of lightbox / future enhancement
animate: false, // do 'animated' fade overlay
speed: 0.2, // set the speed in which the fade will occur
width: '400', // width of the lightbox
height: '300', // height of the lightbox
identifier: '', // CSS hook to add to the lightbox for specific styling
overlayColor: '#fff', // #FFF works best, leave this empty for transparent overlayer
overlayOpacity: 0.8, // control transparency of background: higher number = less transparent
root: '/5/resources/', // the root where we get our resources from
stylesheet: 'css/lightbox.css', // external stylesheet with specific CSS for the lightbox; required!
ajaxspinner: 'images/ajaxindicator.gif', // to show when we wait for ajax calls
dialog: '', // text to put in the dialog lightboxes
draggable: false, // lightbox can be dragged
yes: '',no: '',ok: '', // text strings
onConfirm: '',// function to perform on confirmation
onCancel: '', // function to perform on cancellation
setFocusOnAlert: true, // set the focus on the alert button when it activates
autoAttachEvents: true, // attach events to lightbox buttons
heightAuto: true, //set if height could be auto
timeout: false, // if time out is enabled
timeoutPeriod: 30000, // close LightBox after defined period of time [if timeout=true]
useHref: true,
submited:false,
ajaxParameters: '', // parameters used in AJAX lightbox method
onCloseAction : 'reset' // clean | reset
}, options ||
{});
this.name = this.opt.name;
this.ctrl = this.opt.ctrl;
this.setTimeoutVar;
// control debug output
this.thD = this.opt.debug;
//LiBo.log("NEW LIGHTBOX '" + this.name + "' start " + new Date());
// set lightbox options
this.setoptions();
// build the ol and lb
this.setup();
// register the elements after body is loaded (defer)
var ids = new Array(this.lightboxID, this.overlayID);
// anonymous function
(function(){
$A(ids).each(function(id){
LiBo[id] = $(id);
});
}).defer();
//LiBo.log("typeof this.ctrl : " + typeof this.ctrl);
// activate onclick on object
if (typeof this.ctrl === 'object' && this.handler === 'click') {
this.onclick(this.ctrl);
//LiBo.log("Handler '" + this.handler + "' on ctrl '" + this.ctrl + "' activates lightbox '" + this.lightboxID + "'");
};
},
log: function(msg){
if (typeof this == 'object' && this.thD && typeof dump == 'function' && typeof msg != 'undefined') {
if (typeof isIE6 != 'undefined' && isIE6) {
// disabled IE6 debug alerts
//alert(this.name + " : " + msg);
}
else {
dump(this.name + " : " + msg);
}
}
},
setoptions: function(){
// box types
var types = ["default", "loading", "wait", "alert", "confirm", "message", "gallery", "video", "help","messagewithclosebutton", "overlayer", "splash"];
// screen lightbox positioning
var positions = ["mouse", "center", "top center", "bottom center", "top left", "top right", "bottom left", "bottom right"];
// stretch overlay to fill page and fade in
if (typeof pageWidth == 'undefined' || typeof pageHeight == 'undefined') {
//LiBo.log("pageWidth,pageHeight: undefined");
this.page = this.getPageSize();
}
else {
//LiBo.log("pageWidth,pageHeight: " + pageWidth + "," + pageHeight);
this.page = [pageWidth, pageHeight];
}
// the lightbox should be the highest element
this.zindex = 99 * 99 * 99;
// object holding default text strings
t = Object.extend({
'default': 'Welcome to StepStone!',
'load': 'Loading...',
'yes': 'Yes',
'no': 'No',
'ok': 'OK',
'wait': 'Please wait...',
'icon': 'Click OK to continue...',
'qcon': 'Do you want to continue?',
'next': 'next',
'previous': 'previous',
'close': 'close'
});
// set the type of the lightbox
this.type = (types.find(function(s){
return s === LiBo.opt.type
})) ? this.opt.type : 'default';
this.root = this.opt.root;
this.ajaxspinner = this.opt.ajaxspinner;
// used by ajax
this.cache = null;
// where on the screen do we want to place the lightbox?
this.position = (positions.find(function(s){
return s === LiBo.opt.position
})) ? this.opt.position : 'center';
this.handler = this.opt.handler;
this.method = this.opt.method;
this.useoverlay = this.opt.useoverlay;
this.animate = this.opt.animate;
this.stylesheet = this.root + this.opt.stylesheet;
this.overlayOpacity = this.opt.overlayOpacity;
this.width = this.opt.width;
this.height = this.opt.height;
this.overlayBackgroundColor = this.opt.overlayColor;
this.setFocusOnAlert = this.opt.setFocusOnAlert;
this.identifier = this.opt.identifier;
this.asynch = this.opt.asynch;
this.opened = false;
this.drag = this.opt.draggable;
this.timeout = this.opt.timeout;
this.timeoutPeriod = this.opt.timeoutPeriod;
// start draggable lightbox
if (this.drag) {
if(typeof Draggable === 'undefined'){
this.drag = false;
}else{
//LiBo.log("Lightbox will be draggable");
this.overlayBackgroundColor = 'transparent';
}
}
// default names
this.overlayID = "lightbox_overlay";
this.lightboxID = "lightbox";
// Set the ID's of the containers for the CSS hook
if (this.identifier) {
this.overlayID = "lightbox_overlay_" + this.identifier;
this.lightboxID = "lightbox_" + this.identifier;
}
// if a name was given, use it as the hook
if (this.name != 'LightBox') {
this.overlayID = "lightbox_overlay_" + this.name;
this.lightboxID = "lightbox_" + this.name;
}
if (this.overlayBackgroundColor == '' || this.overlayBackgroundColor == false || this.overlayBackgroundColor.length == 0) {
this.overlayBackgroundColor = "transparent";
}
// shadow fade in/out duration
this.overlayDuration = this.animate ? this.opt.speed : 0;
// confirm action
this.onConfirm = (this.opt.onConfirm == '') ? null : (typeof this.opt.onConfirm === 'function') ? this.opt.onConfirm : this.opt.onConfirm + "()";
// cancel action
this.onCancel = (this.opt.onCancel == '') ? null : (typeof this.opt.onCancel === 'function') ? this.opt.onCancel : this.opt.onCancel + "()";
// here we check if the given content is actual a function and not null
this.content = (typeof this.opt.content === 'function') ? this.opt.content() : (typeof this.opt.content === 'object') ? this.opt.content : (this.opt.content != null) ? this.opt.content : null;
// did we specify text to show in the dialogboxes
this.dialogtext = (this.opt.dialog != '') ? this.opt.dialog : null;
//LiBo.log("ctrl: " + this.ctrl + " / identifier: " + this.opt.identifier + " / overlay: " + this.overlayID + " / lightbox: " + this.lightboxID + " / method: " + this.opt.method + " / type: " + this.type);
},
setup: function(){
//LiBo.log("setup");
// we're going to create our own content for the lightbox
if (this.opt.method == 'innerHTML') {
//LiBo.log("method innerHTML: content: " + this.content);
// basic dialogbox style
var thePosText = (this.opt.yes != '') ? this.opt.yes : t['yes'];
var theNegText = (this.opt.no != '') ? this.opt.no : t['no'];
var theConfirmText = (this.opt.ok != '') ? this.opt.ok : t['ok'];
var theAction = "closeit";
var theButtonStyle = "UIButton Button_Blue ";
var ajaxbuttonsize = 'width="70" height="10"';
var theText = (!this.dialogtext) ? t['default'] : this.dialogtext;
var theImage = '';
var theHref = 'href="#"';
if(!this.opt.useHref){
theHref = "";
}
var theButton = '' + theConfirmText + '';
var theCloseButton = '
';
break;
case "splash":
this.width = "980"; // default size for an splashpage
this.height = "800"; // 780 - giving a bit of room for the close button
//this.timeout = true; // default time-out
this.content = theCloseButton + '
' + this.opt.content + '
';
this.position = "top center";
// change HTML style to not allow scroll bars
$$("html")[0].addClassName("noscroll");
break;
case "overlayer":
this.width = "500"; // default size for an overlayer
this.height = "400";
this.timeout = true; // default time-out
this.content = theCloseButton + '
' + theText + '
';
break;
case "message":
this.content = '
' + theText + '
';
break;
case "video":
// check if this.content ends with a file extension
// todo!
var str = this.content.substr(this.content.lastIndexOf('.') + 1).toLowerCase();
//LiBo.log("Video Content file type is :" + str);
switch (str) {
case 'jpg':
case 'gif':
case 'png':
this.media = 'image';
break;
case 'swf':
this.media = 'flash';
break;
case 'flv':
this.media = 'flashVideo';
break;
case 'mov':
this.media = 'quicktime';
break;
case 'wmv':
this.media = 'windowsMedia';
break;
case 'rv':
case 'rm':
case 'rmvb':
this.media = 'real';
break;
case 'mp3':
this.media = 'flashMp3';
break;
default:
this.media = 'iframe';
break;
}
this.content = theCloseButton + '
';
break;
} // switch
// wrap the content in the dialog container
this.content = '
' + this.content + '
';
} else { // no innerHTML, using ajax
// check if the ctrl has a href, if it does, use it as url for the ajax
if (typeof this.ctrl != 'undefined') {
// for ajax this.content will be used, if this.ctrl is a link
//LiBo.log("method ajax: this.ctrl.tagName: " + this.ctrl.tagName);
// set the content to the href attribute of our element; we'll fetch the content of the url with ajax
if (this.ctrl.tagName === 'a' && (this.ctrl.href && this.ctrl.href != '#')) {
//LiBo.log("method ajax: ctrl is a link, using the href attribute for the ajax url");
this.content = this.ctrl.href;
}
// load the ajax content now
if (this.asynch) {
//LiBo.log("method ajax: loading asynch");
this.loadInfo();
}
}
else {
// no ctrl no content...
this.content = 'lightbox ERROR: no content : typeof this.ctrl : ' + typeof this.ctrl;
}
//LiBo.log("method ajax: " + this.ctrl + " : content: " + this.content);
}
//LiBo.log("createCSS");
// check if the CSS link does not already exist...
var s = $$("link[href*=lightbox]");
if (s.length == 0) {
var link = new Element('link', {
type: 'text/css',
rel: 'stylesheet',
href: this.stylesheet,
media: 'screen'
});
Element.insert(document.getElementsByTagName('head')[0], link);
}
//LiBo.log("createHTML");
if (this.useoverlay) {
if ($(this.overlayID) == null) {
//LiBo.log("Creating ol");
var ol = new Element('div', {
id: this.overlayID,
className: 'overlay'
});
Element.insert(document.body, ol);
}
//else {
//LiBo.log("Reusing existing ol " + this.overlayID);
//}
}
else {
//LiBo.log("No overlayer : this.useoverlay = " + this.useoverlay);
this.ol = null; // reset the object => boolean, check if it's an object later!
}
//LiBo.log("Creating lb");
// check for existing, active lightbox
if ($(this.lightboxID) != null) {
//LiBo.log("Found existing lb with id " + this.lightboxID + ", had to remove it first");
$(this.lightboxID).remove();
}
var lb = new Element('div', {
id: this.lightboxID,
className: 'lightbox loading'
});
// loader
lb.update('
');
Element.insert(document.body, lb);
//LiBo.log("registering lightbox");
this.lb = $(this.lightboxID);
//LiBo.log("lightbox: " + this.lb.id);
// set dragging on lightbox
if (this.drag) {
new Draggable(this.lightboxID, {
scroll: window
});
}
if (this.useoverlay) {
//LiBo.log("registering overlayer");
this.ol = $(this.overlayID);
//LiBo.log("overlay: " + this.ol.id);
// css position is absolute for IE
var theposition = (document.all) ? "absolute" : "fixed";
//LiBo.log("position: " + theposition);
// if we can't use Effects to set the opacity, set it using CSS
if (typeof Effects != 'undefined') {
//LiBo.log("using Effects, yeah!");
overlayStyle = {
position: theposition,
top: 0,
left: 0,
zIndex: this.zindex,
backgroundColor: this.overlayBackgroundColor,
width: this.page[0] + 'px',
height: this.page[1] + 'px'
};
} else {
//LiBo.log("no Effects");
var overlayOpacity = this.overlayOpacity * 10;
overlayStyle = {
position: theposition,
filter: 'alpha(opacity=' + overlayOpacity + ')',
mozOpacity: this.overlayOpacity,
opacity: this.overlayOpacity,
top: 0,
left: 0,
zIndex: this.zindex,
backgroundColor: this.overlayBackgroundColor,
width: this.page[0] + 'px',
height: this.page[1] + 'px'
};
}
//LiBo.log("set the overlay style and then hide it until we activate it");
this.ol.setStyle(overlayStyle).hide();
// clicks on overlay should close the lightbox
if(this.opt.closeonoverlayclick){
//LiBo.log("binding click event on this.ol");
Event.observe(this.ol, 'click', this.closeit.bindAsEventListener(this));
};
// fix in resizing window and opacity
Event.observe(window, "resize", this.onResize.bindAsEventListener(this,LiBo));
} // this.useoverlay
// lightbox default styles
this.lb.s = {
width: this.width + 'px',
height: this.height + 'px',
top: 'auto',
bottom: 'auto',
left: 'auto',
right: 'auto',
textAlign: 'left',
margin: '2%'
}
//LiBo.log("Setting position: " + this.position);
switch (this.position) {
case "mouse":
// activate mouse setcords
//LiBo.log("Open on mouse click position");
Event.observe(this.ctrl, 'click', this.setCords);
this.lb.s.margin = "-" + Math.floor(this.height / 2) + "px 0 0 -" + Math.floor(this.width / 2) + "px";
break;
case "center":
default:
this.lb.s.top = '50%';
this.lb.s.left = '50%';
this.lb.s.margin = "-" + Math.floor(this.height / 2) + "px 0 0 -" + Math.floor(this.width / 2) + "px";
break;
case "top left":
this.lb.s.top = 0;
this.lb.s.left = 0;
break;
case "top right":
this.lb.s.top = 0;
this.lb.s.right = 0;
break;
case "bottom left":
this.lb.s.bottom = 0;
this.lb.s.left = 0;
break;
case "bottom right":
this.lb.s.bottom = 0;
this.lb.s.right = 0;
break;
case "top center":
this.lb.s.top = 0;
this.lb.s.left = '50%';
this.lb.s.margin = "1% 0 0 -" + Math.ceil(this.width / 2) + "px";
break;
case "bottom center":
this.lb.s.bottom = 0;
this.lb.s.left = '50%';
this.lb.s.margin = "1% 0 0 -" + Math.ceil(this.width / 2) + "px";
break;
} // switch
if(this.opt.heightAuto){
this.lb.s.height = 'auto';
}
// set lightbox styles
var lightboxStyle = {
position: theposition,
textAlign: this.lb.s.textAlign,
zIndex: (this.zindex + 1),
top: this.lb.s.top,
left: this.lb.s.left,
right: this.lb.s.right,
bottom: this.lb.s.bottom,
width: this.lb.s.width,
height: this.lb.s.height,
overflowy: 'auto',
margin: this.lb.s.margin
};
if (this.drag) {
lightboxStyle.cursor = 'move';
}
//LiBo.log("lb setStyle and hide");
this.lb.setStyle(lightboxStyle).hide();
if (this.identifier) {
// reset class name
this.lb.className = "lightbox loading";
// CSS hook
this.lb.addClassName(this.identifier);
}
},
onResize: function(ev,obj){
obj.page = obj.getPageSize();
obj.ol.setStyle({width: obj.page[0] + 'px', height: obj.page[1] + 'px'});
},
// default action
onclick: function(ctrl){
//LiBo.log("activate onclick: " + ctrl);
Event.observe(ctrl, 'click', this.activate.bindAsEventListener(this), false);
ctrl.onclick = function(){
return false;
};
},
// Turn everything on - mainly the IE fixes
activate: function(){
if (typeof this.lb != 'object')
throw ("LB " + this.name + " '" + this.identifier + "' is not an object");
//LiBo.log("activate lb: " + this.lb.id);
// stuff for IE
if (document.all) {
this.getScroll();
this.prepareIE('100%', 'hidden');
this.setScroll(0, 0); // makes sure that the lightbox is always in the center of the window
// hide selectes on the page because they would show through the layer
this.hideSelects('hidden');
}
// appear or just show the box
if (this.ol != null) {
if (typeof Effect != 'undefined' && this.animate) {
//LiBo.log("activate: Effect");
new Effect.Appear(this.ol, {
duration: this.overlayDuration,
from: 0.0,
to: this.overlayOpacity
});
}
else {
//LiBo.log("activate: show : " + typeof this.ol);
if (typeof this.ol === 'object')
this.ol.show();
}
}
// Insert content into lightbox
// default ajax method
if (this.method === 'ajax') {
//LiBo.log("activate: ajax : asynch " + this.asynch);
if (!this.asynch) { // load the ajax content
this.loadInfo(); // calls processinfo which does the ajax call
}
}
else {
//LiBo.log("activate: innerHTML");
if (this.content) {
//LiBo.log("activate: this.content");
this.update(); // update this.content and makes it the current content
}
}
// activate the lightbox
this.lb.show();
if (this.setFocusOnAlert == true && this.type == "alert") {
//LiBo.log("activate: setFocusOnAlert");
var focuslink = $(this.type + 'Focus');
if (focuslink)
focuslink.focus();
}
if (this.timeout) {
this.setTimeoutVar = setTimeout("LiBo.closeit();", this.timeoutPeriod);
}
this.opened = true;
},
// Ie requires height to 100% and overflow hidden or else you can scroll down past the overlayer
prepareIE: function(height, overflow){
//LiBo.log("prepareIE");
var bod = $$('body')[0];
bod.style.height = height;
var htm = $$('html')[0];
htm.style.height = height;
htm.style.overflow = overflow;
},
// tidy up the background noise and prevent elements showing through
hideSelects: function(visibility){
//LiBo.log("hideSelects");
$$('select', 'object', 'embed').each(function(node){
node.style.visibility = visibility
});
},
// Taken from lightbox implementation found at http://www.huddletogether.com/projects/lightbox/
getScroll: function(){
//LiBo.log("getScroll");
if (self.pageYOffset) {
this.yPos = self.pageYOffset;
}
else
if (document.documentElement && document.documentElement.scrollTop) {
this.yPos = document.documentElement.scrollTop;
}
else
if (document.body) {
this.yPos = document.body.scrollTop;
}
},
setScroll: function(x, y){
//LiBo.log("setScroll");
window.scrollTo(x, y);
},
// switches the display style of the elements
displayLightbox: function(display){
//LiBo.log("displayLightbox: " + display);
if (this.ol != null)
this.ol.style.display = display;
if (this.lb != null)
this.lb.style.display = display;
if (display != 'none') {
if (this.method == 'ajax') {
this.loadInfo();
}
}
},
// Begin Ajax request
loadInfo: function(){
var url = this.content; // this.content should be the ajax url
//LiBo.log("loadInfo: " + url);
var myAjax = new Ajax.Request(url, {
method: 'post',
parameters: LiBo.opt.ajaxParameters,
onComplete: this.processInfo.bindAsEventListener(this),
onSuccess: function(){
//LiBo.log("loadInfo success!");
},
onFailure: function(){
//LiBo.log("Error: loadInfo: Ajax Failure");
}
});
},
// Display Ajax response
processInfo: function(response){
//LiBo.log("processInfo: creating lbContent_" + this.name);
var c = '
' + response.responseText + '
';
this.lb.update(c).removeClassName('loading').addClassName('done');
//LiBo.log("processInfo: hiding lbLoadMessage_" + this.name);
if ($('lbLoadMessage_' + this.name) != null) {
$('lbLoadMessage_' + this.name).hide();
}
if (this.opt.autoAttachEvents)
this.actions();
},
// public
update: function(content){
if (content != undefined) {
this.content = content;
}
//LiBo.log("update: creating lbContent_" + this.name + " : content: " + this.content);
var c = '
' + this.content + '
';
this.lb.update(c).removeClassName('loading').addClassName('done');
if(typeof this.opt.content === 'object' && this.opt.type == "overlayer"){
//console.log("this.opt.content = object");
var contentholder = new Element('div');
Element.insert(contentholder,this.opt.content);
$('overlayer_content').update(contentholder);
Element.writeAttribute($$("#adServerOverlayer div")[0],"style",""); // remove all styles
}
if (this.opt.autoAttachEvents)
this.actions();
},
// Search through new links within the lightbox, and attach click event
actions: function(){
//LiBo.log("actions");
//It caused problems in IE
//lbActions = document.getElementsByClassName('lbAction');
//prototyped version
var lbActions = $$('.lbAction');
for (i = 0; i < lbActions.length; i++) {
Event.observe(lbActions[i], 'click', this[lbActions[i].rel].bindAsEventListener(this), false);
if (this.type != 'confirm' && this.type != 'alert') {
// remove default handler
lbActions[i].onclick = function(){
return false;
};
}
}
},
clean: function(){
//LiBo.log("clean: emptying the contents of the active lightbox");
if ($(this.lightboxID) != null)
$(this.lightboxID).update("");
//LiBo.log("clear: setTimeoutVar");
if (typeof this.setTimeoutVar != 'undefined') {
clearTimeout(this.setTimeoutVar);
}
},
reset: function(){
//LiBo.log("reset: removing both lb and ol");
if ($(this.lightboxID) != null)
$(this.lightboxID).remove();
if ($(this.overlayID) != null)
$(this.overlayID).remove();
},
// Example of creating your own functionality once lightbox is initiated
insert: function(e){
//LiBo.log("insert");
link = Event.element(e).parentNode;
//Element.remove($('lbContent_'+LiBo.name));
var myAjax = new Ajax.Request(link.href, {
method: 'post',
parameters: "",
onComplete: this.processInfo.bindAsEventListener(this),
onFailure: function(){
//LiBo.log("Error: insert: Ajax Failure");
}
});
},
// Close the lightbox
deactivate: function(){
//LiBo.log("deactivate");
//if (browser == "Internet Explorer"){
if (document.all) {
this.setScroll(0, this.yPos);
this.prepareIE("auto", "auto");
}
this.hideSelects("visible");
this.displayLightbox("none");
this.opened = false;
},
closeit: function(){
//LiBo.log("closeit: will hide and clean the active lightbox");
if (document.all) {
this.setScroll(0, this.yPos);
this.prepareIE("auto", "auto");
}
this.hideSelects("visible");
if (typeof Effect != 'undefined' && this.animate) {
this.lb.hide();
if (this.ol != null)
new Effect.Fade(this.ol, {
duration: this.overlayDuration
});
}
else {
this.displayLightbox("none");
}
// reset contents of lb
this[this.opt.onCloseAction]();
this.opened = false;
},
setCords: function(e){
var el = LiBo;
el.mouseX = Event.pointerX(e);
el.mouseY = Event.pointerY(e);
//LiBo.log("setCords: this.mouseX: " + el.mouseX + "px / this.mouseY " + el.mouseY + "px");
el.lb.setStyle({
position: 'absolute',
top: el.mouseY + 'px',
left: el.mouseX + 'px',
right: 'auto'
});
},
// getPageSize()
getPageSize: function(){
var xScroll, yScroll;
if (window.innerHeight && window.scrollMaxY) {
xScroll = window.innerWidth + window.scrollMaxX;
yScroll = window.innerHeight + window.scrollMaxY;
}
else
if (document.body.scrollHeight > document.body.offsetHeight) { // all but Explorer Mac
xScroll = document.body.scrollWidth;
yScroll = document.body.scrollHeight;
}
else { // Explorer Mac...would also work in Explorer 6 Strict, Mozilla and Safari
xScroll = document.body.offsetWidth;
yScroll = document.body.offsetHeight;
}
var windowWidth, windowHeight;
if (self.innerHeight) { // all except Explorer
if (document.documentElement.clientWidth) {
windowWidth = document.documentElement.clientWidth;
}
else {
windowWidth = self.innerWidth;
}
windowHeight = self.innerHeight;
}
else
if (document.documentElement && document.documentElement.clientHeight) { // Explorer 6 Strict Mode
windowWidth = document.documentElement.clientWidth;
windowHeight = document.documentElement.clientHeight;
}
else
if (document.body) { // other Explorers
windowWidth = document.body.clientWidth;
windowHeight = document.body.clientHeight;
}
// for small pages with total height less then height of the viewport
if (yScroll < windowHeight) {
pageHeight = windowHeight;
}
else {
pageHeight = yScroll;
}
// for small pages with total width less then width of the viewport
if (xScroll < windowWidth) {
pageWidth = xScroll;
}
else {
pageWidth = windowWidth;
}
//LiBo.log("getPageSize: " + pageWidth + "," + pageHeight);
return [pageWidth, pageHeight];
}
});
/**
* Activates the splash banner
* @return
*/
function closesplashbanner(adlay,adlaylb){
$$("body div").each(function(index,key){
$(index).setStyle({visibility:'visible'});
});
adlay.hide();
adlaylb.closeit();
}
/**
* Makes the regular overlayer visible
*/
function show_lightbox_adServerOverlayer(){
if ($("lightbox_adServerOverlayer") != null) {
//alert("showing lightbox_adServerOverlayer");
$('lightbox_overlay_adServerOverlayer').show();
$("lightbox_adServerOverlayer").show();
}
}
function hideEverything() {
try{
$$("body div").each(function(index,key){
$(index).setStyle({visibility:'hidden'});
});
}catch(error){
}
}
/**
* Initializes the splash banner
*/
function loadsplashbanner() {
// Find the first .bannersplashpage
var adlay = $('adServerOverlayerSplash');
var timedout = 5200; // time before it is hidden
var SetZindex = 999999; // Make sure the ad is on top of overlayer
var SplashBannerPageName = 'adServerOverlayerSplash';
//alert("loadsplashbanner: " + typeof adlay);
if(adlay != null){
//adlay.hide();
hideEverything();
// check if there's already an overlayer active
if ($("lightbox_adServerOverlayer") != null) {
//alert("hiding lightbox_adServerOverlayer");
$("lightbox_overlay_adServerOverlayer").setStyle({display:"none"});
$("lightbox_adServerOverlayer").setStyle({display:"none"});
}
// creating a lightbox instance
adlaylbSplash = new Lightbox({
name: SplashBannerPageName,
type: 'splash',
timeout: false, // disabled, because will activate automatic closing of the lightbox through the current function
content: "", // no content, just create the overlay
identifier: 'openx_overlayer',
overlayOpacity: 1,
animate: true,
speed: 1, // fadeout speed
heightAuto: false,
useoverlay: true
});
// activate the lightbox
adlaylbSplash.activate();
// make sure the original splash banner is on top of the lightbox
//adlay.setStyle({zIndex: SetZindex});
// the splash container
$('adServerOverlayerSplash').setStyle({zIndex: SetZindex, top: "2%", visibility: "visible", display: "block", zoom: 1});
// the banner container
$$('#adServerOverlayerSplash > div')[0].setStyle({zIndex: parseInt(SetZindex)+1, visibility: "visible", zoom: 1});
// the flash container
$$('#adServerOverlayerSplash > div div')[0].setStyle({zIndex: parseInt(SetZindex)+2, visibility: "visible", display:"block", zoom: 1});
// the flash object/embed itself
var swf = $$('#adServerOverlayerSplash #Advertisement')[0];
if(swf != null){
$$('#adServerOverlayerSplash #Advertisement')[0].setStyle({zIndex: parseInt(SetZindex)+3, zoom: 1, position: "relative", visibility: "visible", display:"block" });
}
$('lightbox_overlay_adServerOverlayerSplash').setStyle({visibility:"visible"});
$$("#lightbox_adServerOverlayerSplash .lbCloseButton")[0].setStyle({visibility:"visible"});
// make it possible to close the banner
$('lightbox_overlay_adServerOverlayerSplash').observe('click',function(element){
closesplashbanner(adlay,adlaylbSplash);
show_lightbox_adServerOverlayer();
$('adServerOverlayerSplash').hide();
});
$$('#lightbox_adServerOverlayerSplash div.lbCloseButton').each(function(element){
element.observe('click',function(element){
closesplashbanner(adlay,adlaylbSplash);
show_lightbox_adServerOverlayer();
$('adServerOverlayerSplash').hide();
});
});
// clear after x secs
if (timedout > 0) {
thetimeout = setTimeout(function(){
closesplashbanner(adlay, adlaylbSplash);
show_lightbox_adServerOverlayer();
$('adServerOverlayerSplash').hide();
}, timedout);
}
}else{
dump("triggering adServerOverlayerSplash : adlay " + typeof adlay);
return false;
}
}