<!--// 
function addEvent(object, type, handler) 
{ 
 if (object.addEventListener) { 
 object.addEventListener(type, handler, false); 
 } else if (object.attachEvent) { 
 object.attachEvent(['on',type].join(''),handler); 
 } else { 
 object[['on',type].join('')] = handler; 
 } 
} 
function WindowSize() 
{ // window size object 
 this.w = 0; 
 this.h = 0; 
 return this.update(); 
} 
WindowSize.prototype.update = function() 
{ 
 var d = document; 
 this.w =  
 (window.innerWidth) ? window.innerWidth 
 : (d.documentElement && d.documentElement.clientWidth) ? d.documentElement.clientWidth 
 : d.body.clientWidth; 
 this.h =  
 (window.innerHeight) ? window.innerHeight 
 : (d.documentElement && d.documentElement.clientHeight) ? d.documentElement.clientHeight 
 : d.body.clientHeight; 
 return this; 
}; 
function PageSize() 
{ // page size object 
 this.win = new WindowSize(); 
 this.w = 0; 
 this.h = 0; 
 return this.update(); 
} 
PageSize.prototype.update = function() 
{ 
 var d = document; 
 this.w =  
 (window.innerWidth && window.scrollMaxX) ? window.innerWidth + window.scrollMaxX 
 : (d.body.scrollWidth > d.body.offsetWidth) ? d.body.scrollWidth 
 : d.body.offsetWidt; 
 this.h =  
 (window.innerHeight && window.scrollMaxY) ? window.innerHeight + window.scrollMaxY 
 : (d.body.scrollHeight > d.body.offsetHeight) ? d.body.scrollHeight 
 : d.body.offsetHeight; 
 this.win.update(); 
 if (this.w < this.win.w) this.w = this.win.w; 
 if (this.h < this.win.h) this.h = this.win.h; 
 return this; 
}; 
function PagePos() 
{ // page position object 
 this.x = 0; 
 this.y = 0; 
 return this.update(); 
} 
PagePos.prototype.update = function() 
{ 
 var d = document; 
 this.x = 
 (window.pageXOffset) ? window.pageXOffset 
 : (d.documentElement && d.documentElement.scrollLeft) ? d.documentElement.scrollLeft 
 : (d.body) ? d.body.scrollLeft 
 : 0; 
 this.y = 
 (window.pageYOffset) ? window.pageYOffset 
 : (d.documentElement && d.documentElement.scrollTop) ? d.documentElement.scrollTop 
 : (d.body) ? d.body.scrollTop 
 : 0; 
 return this; 
}; 
function UserAgent() 
{ // user agent information 
 var ua = navigator.userAgent; 
 this.isWinIE = this.isMacIE = false; 
 this.isGecko = ua.match(/Gecko\//); 
 this.isSafari = ua.match(/AppleWebKit/); 
 this.isOpera = window.opera; 
 if (document.all && !this.isGecko && !this.isSafari && !this.isOpera) { 
 this.isWinIE = ua.match(/Win/); 
 this.isMacIE = ua.match(/Mac/); 
 this.isNewIE = (ua.match(/MSIE 5\.5/) || ua.match(/MSIE 6\.0/)); 
 } 
 return this; 
} 
// === lightbox === 
function LightBox(option) 
{ 
 var self = this; 
 self._imgs = new Array(); 
 self._wrap = null; 
 self._box = null; 
 self._open = -1; 
 self._page = new PageSize(); 
 self._pos = new PagePos(); 
 self._ua = new UserAgent(); 
 self._expandable = false; 
 self._expanded = false; 
 self._expand = option.expandimg; 
 self._shrink = option.shrinkimg; 
 return self._init(option); 
} 
LightBox.prototype = { 
 _init : function(option) 
 { 
 var self = this; 
 var d = document; 
 if (!d.getElementsByTagName) return; 
 var links = d.getElementsByTagName("a"); 
 for (var i=0;i<links.length;i++) { 
 var anchor = links[i]; 
 var num = self._imgs.length; 
 if (!anchor.getAttribute("href") 
 || anchor.getAttribute("rel") != "lightbox") continue; 
 // initialize item 
 self._imgs[num] = {src:anchor.getAttribute("href"),w:-1,h:-1,title:'',cls:anchor.className}; 
 if (anchor.getAttribute("title")) 
 self._imgs[num].title = anchor.getAttribute("title"); 
 else if (anchor.firstChild && anchor.firstChild.getAttribute && anchor.firstChild.getAttribute("title")) 
 self._imgs[num].title = anchor.firstChild.getAttribute("title"); 
 anchor.onclick = self._genOpener(num); // set closure to onclick event 
 } 
 var body = d.getElementsByTagName("body")[0]; 
 self._wrap = self._createWrapOn(body,option.loadingimg); 
 self._box = self._createBoxOn(body,option); 
 return self; 
 }, 
 _genOpener : function(num) 
 { 
 var self = this; 
 return function() { self._show(num); return false; } 
 }, 
 _createWrapOn : function(obj,imagePath) 
 { 
 var self = this; 
 if (!obj) return null; 
 // create wrapper object, translucent background 
 var wrap = document.createElement('div'); 
 wrap.id = 'overlay'; 
 with (wrap.style) { 
 display = 'none'; 
 position = 'fixed'; 
 top = '0px'; 
 left = '0px'; 
 zIndex = '50'; 
 width = '100%'; 
 height = '100%'; 
 } 
 if (self._ua.isWinIE) wrap.style.position = 'absolute'; 
 addEvent(wrap,"click",function() { self._close(); }); 
 obj.appendChild(wrap); 
 // create loading image, animated image 
 var imag = new Image; 
 imag.onload = function() { 
 var spin = document.createElement('img'); 
 spin.id = 'loadingImage'; 
 spin.src = imag.src; 
 spin.style.position = 'relative'; 
 self._set_cursor(spin); 
 addEvent(spin,'click',function() { self._close(); }); 
 wrap.appendChild(spin); 
 imag.onload = function(){}; 
 }; 
 if (imagePath != '') imag.src = imagePath; 
 return wrap; 
 }, 
 _createBoxOn : function(obj,option) 
 { 
 var self = this; 
 if (!obj) return null; 
 // create lightbox object, frame rectangle 
 var box = document.createElement('div'); 
 box.id = 'lightbox'; 
 with (box.style) { 
 display = 'none'; 
 position = 'absolute'; 
 zIndex = '60'; 
 } 
 obj.appendChild(box); 
 // create image object to display a target image 
 var img = document.createElement('img'); 
 img.id = 'lightboxImage'; 
 self._set_cursor(img); 
 addEvent(img,'click',function(){ self._close(); }); 
 addEvent(img,'mouseover',function(){ self._show_action(); }); 
 addEvent(img,'mouseout',function(){ self._hide_action(); }); 
 box.appendChild(img); 
 var zoom = document.createElement('img'); 
 zoom.id = 'actionImage'; 
 with (zoom.style) { 
 display = 'none'; 
 position = 'absolute'; 
 top = '15px'; 
 left = '15px'; 
 zIndex = '70'; 
 } 
 self._set_cursor(zoom); 
 zoom.src = self._expand; 
 addEvent(zoom,'mouseover',function(){ self._show_action(); }); 
 addEvent(zoom,'click', function() { self._zoom(); }); 
 box.appendChild(zoom); 
 addEvent(window,'resize',function(){ self._set_size(true); }); 
 // close button 
 if (option.closeimg) { 
 var btn = document.createElement('img'); 
 btn.id = 'closeButton'; 
 with (btn.style) { 
 display = 'inline'; 
 position = 'absolute'; 
 right = '10px'; 
 top = '10px'; 
 width = '15px'; 
 height = '15px'; 
 zIndex = '80'; 
 } 
 btn.src = option.closeimg; 
 self._set_cursor(btn); 
 addEvent(btn,'click',function(){ self._close(); }); 
 box.appendChild(btn); 
 } 
 // caption text 
 var caption = document.createElement('span'); 
 caption.id = 'lightboxCaption'; 
 with (caption.style) { 
 display = 'none'; 
 position = 'absolute'; 
 zIndex = '80'; 
 } 
 box.appendChild(caption); 
 // create effect image 
 if (!option.effectpos) option.effectpos = {x:0,y:0}; 
 else { 
 if (option.effectpos.x == '') option.effectpos.x = 0; 
 if (option.effectpos.y == '') option.effectpos.y = 0; 
 } 
 var effect = new Image; 
 effect.onload = function() { 
 var effectImg = document.createElement('img'); 
 effectImg.id = 'effectImage'; 
 effectImg.src = effect.src; 
 if (option.effectclass) effectImg.className = option.effectclass; 
 with (effectImg.style) { 
 position = 'absolute'; 
 display = 'none'; 
 left = [option.effectpos.x,'px'].join('');; 
 top = [option.effectpos.y,'px'].join(''); 
 zIndex = '90'; 
 } 
 self._set_cursor(effectImg); 
 addEvent(effectImg,'click',function() { effectImg.style.display = 'none'; }); 
 box.appendChild(effectImg); 
 }; 

 if (option.effectimg != '') effect.src = option.effectimg; 
 return box; 
 }, 
 _set_photo_size : function() 
 { 
 var self = this; 
 if (self._open == -1) return; 
 var imag = self._box.firstChild; 
 var targ = { w:self._page.win.w - 30, h:self._page.win.h - 30 }; 
 var orig = { w:self._imgs[self._open].w, h:self._imgs[self._open].h }; 
 // shrink image with the same aspect 
 var ratio = 1.0; 
 if ((orig.w >= targ.w || orig.h >= targ.h) && orig.h && orig.w) 
 ratio = ((targ.w / orig.w) < (targ.h / orig.h)) ? targ.w / orig.w : targ.h / orig.h; 
 imag.width = Math.floor(orig.w * ratio); 
 imag.height = Math.floor(orig.h * ratio); 
 self._expandable = (ratio < 1.0) ? true : false; 
 if (self._ua.isWinIE) self._box.style.display = "block"; 
 self._box.style.top = [self._pos.y + (self._page.win.h - imag.height - 30) / 2,'px'].join(''); 
 self._box.style.left = [((self._page.win.w - imag.width - 30) / 2),'px'].join(''); 
 self._show_caption(true); 
 }, 
 _set_size : function(onResize) 
 { 
 var self = this; 
 if (self._open == -1) return; 
 self._page.update(); 
 self._pos.update(); 
 var spin = self._wrap.firstChild; 
 if (spin) { 
 var top = (self._page.win.h - spin.height) / 2; 
 if (self._wrap.style.position == 'absolute') top += self._pos.y; 
 spin.style.top = [top,'px'].join(''); 
 spin.style.left = [(self._page.win.w - spin.width - 30) / 2,'px'].join(''); 
 } 
 if (self._ua.isWinIE) { 
 self._wrap.style.width = [self._page.win.w,'px'].join(''); 
 self._wrap.style.height = [self._page.h,'px'].join(''); 
 } 
 if (onResize) self._set_photo_size(); 
 }, 
 _show_action : function() 
 { 
 var self = this; 
 if (self._open == -1 || !self._expandable) return; 
 var obj = document.getElementById('actionImage'); 
 if (!obj) return; 
 obj.src = (self._expanded) ? self._shrink : self._expand; 
 obj.style.display = 'inline'; 
 }, 
 _hide_action : function() 
 { 
 var self = this; 
 var obj = document.getElementById('actionImage'); 
 if (obj) obj.style.display = 'none'; 
 }, 
 _zoom : function() 
 { 
 var self = this; 
 if (self._expanded) { 
 self._set_photo_size(); 
 self._expanded = false; 
 } else if (self._open > -1) { 
 var imag = self._box.firstChild; 
 self._box.style.top = [self._pos.y,'px'].join(''); 
 self._box.style.left = '0px'; 
 imag.width = self._imgs[self._open].w; 
 imag.height = self._imgs[self._open].h; 
 self._show_caption(false); 
 self._expanded = true; 
 } 
 self._show_action(); 
 }, 
 _show_caption : function(enable) 
 { 
 var self = this; 
 var caption = document.getElementById('lightboxCaption'); 
 if (!caption) return; 
 if (caption.innerHTML.length == 0 || !enable) { 
 caption.style.display = 'none'; 
 } else { // now display caption 
 var imag = self._box.firstChild; 
 with (caption.style) { 
 top = [imag.height + 10,'px'].join(''); // 10 is top margin of lightbox 
 left = '0px'; 
 width = [imag.width + 20,'px'].join(''); // 20 is total side margin of lightbox 
 height = '1.2em'; 
 display = 'block'; 
 } 
 } 
 }, 
 _show : function(num) 
 { 
 var self = this; 
 var imag = new Image; 
 if (num < 0 || num >= self._imgs.length) return; 
 var loading = document.getElementById('loadingImage'); 
 var caption = document.getElementById('lightboxCaption'); 
 var effect = document.getElementById('effectImage'); 
 self._open = num; // set opened image number 
 self._set_size(false); // calc and set wrapper size 
 self._wrap.style.display = "block"; 
 if (loading) loading.style.display = 'inline'; 
 imag.onload = function() { 
 if (self._imgs[self._open].w == -1) { 
 // store original image width and height 
 self._imgs[self._open].w = imag.width; 
 self._imgs[self._open].h = imag.height; 
 } 
 if (effect) { 
 effect.style.display = (!effect.className || self._imgs[self._open].cls == effect.className) 
 ? 'block' : 'none'; 
 } 
 if (caption) caption.innerHTML = self._imgs[self._open].title; 
 self._set_photo_size(); // calc and set lightbox size 
 self._hide_action(); 
 self._box.style.display = "block"; 
 self._box.firstChild.src = imag.src; 
 self._box.firstChild.setAttribute('title',self._imgs[self._open].title); 
 if (loading) loading.style.display = 'none'; 
 }; 
 self._expandable = false; 
 self._expanded = false; 
 imag.src = self._imgs[self._open].src; 
 }, 
 _set_cursor : function(obj) 
 { 
 var self = this; 
 if (self._ua.isWinIE && !self._ua.isNewIE) return; 
 obj.style.cursor = 'pointer'; 
 }, 
 _close : function() 
 { 
 var self = this; 
 self._open = -1; 
 self._hide_action(); 
 self._wrap.style.display = "none"; 
 self._box.style.display = "none"; 
 } 
}; 
// === main === 
addEvent(window,"load",function() { 
 var lightbox = new LightBox({ 
 loadingimg:'../about/images/loading.gif', 
 expandimg:'../about/images/expand.gif', 
 shrinkimg:'../about/images/shrink.gif', 
 effectimg:'images/zzoop.gif', 
 effectpos:{x:-40,y:-20}, 
 effectclass:'images/effectable', 
 closeimg:'../about/images/close.gif' 
 }); 
}); 
//-->