/* $snafu: snafu.js,v 1.2 2007/06/07 06:52:11 marc Exp $ */
var popup = null;
var infowin = null;
var imgwin = null;
var imgwin_maxwd = 1000;
var imgwin_maxht = 700;
/* pop-up code still used by some of Michelle's pages */
function pic(url, wid, ht) {
var names = url.split("/");
var winwid = (wid > imgwin_maxwd ? imgwin_maxwd : wid) + 20;
var winht = (ht > imgwin_maxht ? imgwin_maxht : ht) + 20;
if ((popup == null) || popup.closed) {
props = "scrollbars=yes";
props += ",resizable=yes";
props += ",width=" + winwid;
props += ",height=" + winht;
popup = window.open("", "pic", props);
} else
popup.resizeTo(winwid, winht);
popup.document.open("text/html", "replace");
popup.document.write('\n');
popup.document.write('\n');
popup.document.write('' + names[names.length-1] + '\n');
popup.document.write('\n');
popup.document.write('\n');
popup.document.write(' ![' + names[names.length-1] + '](' + url + ' "' + names[names.length-1] + '")
\n');
popup.document.write('
\n');
popup.document.write('\n');
popup.document.close();
popup.focus();
return false;
}
function close_win() {
if (popup != null) {
if (!popup.closed)
popup.close();
popup = null;
}
}
/* open an info window () */
function infowin_open(e) {
/* Accommodate IE's non-standard event handling. */
if (!e) var e = window.event;
var a = e.target ? e.target : e.srcElement;
/* Open a new window with the link's href. */
infowin = window.open(a.href, "info", "width=400,height=400");
/* The thought is that if the new window didn't
(popups blocked or whatever) we want to return
true so the link is follow normally. Not sure
if this works, but it doesn't seem to hinder. */
return !infowin;
}
function infowin_close() {
if (infowin && !infowin.closed)
infowin.close();
else if (this.name == "info")
this.close();
}
/*
* close windows named "img"
*/
function imgwin_close() {
if (imgwin && !imgwin.closed)
imgwin.close();
else if (this.name == "img")
this.close();
}
/*
* Popups cause crashes on some older MS browsers so don't bother
* registering an onclick handler in that case.
*/
function init() {
var links = document.getElementsByTagName('a');
if ((navigator.appName.indexOf("Microsoft") == -1) ||
(navigator.userAgent.indexOf("MSIE 7") != -1)) {
for (var i = links.length; i != 0; i--) {
var a = links[i-1];
if (a.href && a.className) {
if (a.className.indexOf('info') != -1)
a.onclick = infowin_open;
}
}
}
}
/* Things to do when a page is unloaded */
function done() {
infowin_close();
imgwin_close();
}
onload = init;
onunload = done;
/*
* Lightbox JS: Fullsize Image Overlays
* by Lokesh Dhakar - http://www.huddletogether.com
*
* For more information on this script, visit:
* http://huddletogether.com/projects/lightbox/
*
* Licensed under the Creative Commons Attribution 2.5 License
*
*
* (basically, do anything you want, just leave my name and link)
*
* Table of Contents
* -----------------
* Configuration
*
* Functions
* - getPageScroll()
* - getPageSize()
* - pause()
* - getKey()
* - listenKey()
* - showLightbox()
* - hideLightbox()
* - initLightbox()
* - addLoadEvent()
*
* Function Calls
* - addLoadEvent(initLightbox)
*
*/
/*
* Configuration
*
* If you would like to use a custom loading image or close button reference
* them in the next two lines.
*/
var loadingImage = '/loading.gif';
var closeButton = '/close.gif';
/*
* getPageScroll()
* Returns array with x,y page scroll values.
* Core code from - quirksmode.org
*/
function getPageScroll() {
var yScroll;
if (self.pageYOffset) {
yScroll = self.pageYOffset;
} else if (document.documentElement &&
document.documentElement.scrollTop) { // Explorer 6 Strict
yScroll = document.documentElement.scrollTop;
} else if (document.body) { // all other Explorers
yScroll = document.body.scrollTop;
}
arrayPageScroll = new Array('', yScroll)
return arrayPageScroll;
}
/*
* getPageSize()
* Returns array with page width, height and window width, height
* Core code from - quirksmode.org
* Edit for Firefox by pHaez
*/
function getPageSize() {
var xScroll, yScroll;
if (window.innerHeight && window.scrollMaxY) {
xScroll = document.body.scrollWidth;
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
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 = windowWidth;
else
pageWidth = xScroll;
arrayPageSize = new Array(pageWidth, pageHeight,
windowWidth,windowHeight)
return arrayPageSize;
}
/*
* pause(numberMillis)
* Pauses code execution for specified time. Uses busy code, not good.
* Code from http://www.faqts.com/knowledge_base/view.phtml/aid/1602
*/
function pause(numberMillis) {
var now = new Date();
var exitTime = now.getTime() + numberMillis;
while (true) {
now = new Date();
if (now.getTime() > exitTime)
return;
}
}
/*
* getKey(key)
* Gets keycode. If 'x' is pressed then it hides the lightbox.
*/
function getKey(e) {
if (e == null)
keycode = event.keyCode; // ie
else
keycode = e.which; // mozilla
key = String.fromCharCode(keycode).toLowerCase();
if (key == 'x')
hideLightbox();
}
/*
* listenKey()
*/
function listenKey () {
document.onkeypress = getKey;
}
/*
* showLightbox()
* Preloads images. Pleaces new image in lightbox then centers and displays.
*/
function showLightbox(objLink)
{
// prep objects
var objOverlay = document.getElementById('overlay');
var objLightbox = document.getElementById('lightbox');
var objCaption = document.getElementById('lightboxCaption');
var objImage = document.getElementById('lightboxImage');
var objLoadingImage = document.getElementById('loadingImage');
var objLightboxDetails = document.getElementById('lightboxDetails');
var arrayPageSize = getPageSize();
var arrayPageScroll = getPageScroll();
// center loadingImage if it exists
if (objLoadingImage) {
objLoadingImage.style.top =
(arrayPageScroll[1] +
((arrayPageSize[3] - 35 - objLoadingImage.height) / 2) +
'px');
objLoadingImage.style.left =
(((arrayPageSize[0] - 20 - objLoadingImage.width) / 2) +
'px');
objLoadingImage.style.display = 'block';
}
// set height of Overlay to take up whole page and show
objOverlay.style.height = (arrayPageSize[1] + 'px');
objOverlay.style.display = 'block';
// preload image
imgPreload = new Image();
imgPreload.onload=function() {
objImage.src = objLink.href;
/*
* center lightbox and make sure that the top and left
* values are not negative and the image placed outside the
* viewport
*/
var lightboxTop = arrayPageScroll[1] +
((arrayPageSize[3] - 35 - imgPreload.height) / 2);
var lightboxLeft =
((arrayPageSize[0] - 20 - imgPreload.width) / 2);
objLightbox.style.top =
(lightboxTop < 0) ? "0px" : lightboxTop + "px";
objLightbox.style.left =
(lightboxLeft < 0) ? "0px" : lightboxLeft + "px";
objLightboxDetails.style.width = imgPreload.width + 'px';
if (objLink.getAttribute('title')) {
objCaption.style.display = 'block';
//objCaption.style.width = imgPreload.width + 'px';
objCaption.innerHTML = objLink.getAttribute('title');
} else
objCaption.style.display = 'none';
/*
* A small pause between the image loading and displaying is
* required with IE, this prevents the previous image
* displaying for a short burst causing flicker.
*/
if (navigator.appVersion.indexOf("MSIE") !=-1 )
pause(250);
if (objLoadingImage)
objLoadingImage.style.display = 'none';
// Hide select boxes as they will 'peek' through the image in IE
selects = document.getElementsByTagName("select");
for (i = 0; i != selects.length; i++)
selects[i].style.visibility = "hidden";
objLightbox.style.display = 'block';
/*
* After image is loaded, update the overlay height as the
* new image might have increased the overall page height.
*/
arrayPageSize = getPageSize();
objOverlay.style.height = (arrayPageSize[1] + 'px');
// Check for 'x' keypress
listenKey();
return false;
}
imgPreload.src = objLink.href;
}
/*
* hideLightbox()
*/
function hideLightbox()
{
// get objects
objOverlay = document.getElementById('overlay');
objLightbox = document.getElementById('lightbox');
// hide lightbox and overlay
objOverlay.style.display = 'none';
objLightbox.style.display = 'none';
// make select boxes visible
selects = document.getElementsByTagName("select");
for (i = 0; i != selects.length; i++)
selects[i].style.visibility = "visible";
// disable keypress listener
document.onkeypress = '';
}
/*
* initLightbox()
*
* Function runs on window load, going through link tags looking for
* rel="lightbox". These links receive onclick events that enable the
* lightbox display for their targets. The function also inserts html markup
* at the top of the page which will be used as a container for the overlay
* pattern and the inline image.
*/
function initLightbox()
{
if (!document.getElementsByTagName)
return;
var anchors = document.getElementsByTagName("a");
// loop through all anchor tags
for (var i=0; i < anchors.length; i++) {
var anchor = anchors[i];
if (anchor.getAttribute("href") &&
(anchor.getAttribute("rel") == "lightbox"))
anchor.onclick =
function() {
showLightbox(this);
return false;
}
}
/*
* the rest of this code inserts html at the top of the page that
* looks like this:
*
*
*
* ![]()
*