var pi_isIE = document.all;

function getdoc(){
	var obj_pi_container;
	if(obj_pi_container = document.getElementById('pi_imageviewer')){
		return (obj_pi_container.PI && obj_pi_container.PI.obj_window)?obj_pi_container.PI.obj_window.document:document;
	} else {
		return (PI && PI.obj_window)?PI.obj_window.document:document;
	}
}

function GetDocSize(){
	var docwidth=0, docheight=0;

	if (window.innerWidth || window.innerHeight){ 
		docwidth = window.innerWidth; 
		docheight = window.innerHeight; 
	} 
	if (getdoc().body.clientWidth || getdoc().body.clientHeight){ 
		docwidth = getdoc().body.scrollWidth; 
		docheight = getdoc().body.scrollHeight; 
	}

	return {'w':docwidth, 'h':docheight }
}

/* ******************************************************************* */
/*   EVENT FUNCTIONS                                                   */
/* ******************************************************************* */

var Event = (function(){
	var ev = {};
	
	// Resolve an event using IE's window.event if necessary
	// --------------------------------------------------------------------
	ev.resolve = function(e) {
		if (!defined(e) && defined(window.event)) {
			e = window.event;
		}
		return e;
	};
	
	// Add an event handler to a function
	// Note: Don't use 'this' within functions added using this method, since
	// the attachEvent and addEventListener models differ.
	// --------------------------------------------------------------------
	ev.add = function( obj, type, fn, capture ) {
		if (obj.addEventListener) {
			obj.addEventListener( type, fn, capture );
			return true;
		}
		else if (obj.attachEvent) {
			obj.attachEvent( "on"+type, fn );
			return true;
		}
		return false;
	};

	// Get the mouse position of an event
	// --------------------------------------------------------------------
	// PageX/Y, where they exist, are more reliable than ClientX/Y because 
	// of some browser bugs in Opera/Safari
	ev.getMouseX = function(e) {
		e = ev.resolve(e);
		if (defined(e.pageX)) {
			return e.pageX;
		}
		if (defined(e.clientX)) {
			return e.clientX+Screen.getScrollLeft();
		}
		return null;
	};
	ev.getMouseY = function(e) {
		e = ev.resolve(e);
		if (defined(e.pageY)) {
			return e.pageY;
		}
		if (defined(e.clientY)) {
			return e.clientY+Screen.getScrollTop();
		}
		return null;
	};

	// Stop the event from bubbling up to parent elements.
	// Two method names map to the same function
	// --------------------------------------------------------------------
	ev.cancelBubble = function(e) {
		e = ev.resolve(e);
		if (typeof(e.stopPropagation)=="function") { e.stopPropagation(); } 
		if (defined(e.cancelBubble)) { e.cancelBubble = true; }
	};
	ev.stopPropagation = ev.cancelBubble;

	// Prevent the default handling of the event to occur
	// --------------------------------------------------------------------
	ev.preventDefault = function(e) {
		e = ev.resolve(e);
		if (typeof(e.preventDefault)=="function") { e.preventDefault(); } 
		if (defined(e.returnValue)) { e.returnValue = false; }
	};
	
	return ev;
})();

function popupImage(mode_popup) {
	this.obj_window = null;
	if(mode_popup) {
		this.obj_window = window.open('', 'show_image', 'left=20,top=20,toolbar=0,location=0,directories=0,status=0,menubar=0,resizable=1,width=965,height=700');
	}
	this.obj_main = null;
	this.top = 0;
	this.left = 0;
	this.height = 200;
	this.width = 200;
	this.obj_screen    = null;				//popup modal object
	this.obj_screen_if = null;				//popup modal object
	this.col_count = 7;

	this.init();

	this.obj_images = null;
	this.obj_images_org = null;
	this.obj_img_index = -1;
}

popupImage.prototype.screenOpacity=.3;
popupImage.prototype.screenColor="#000000";

popupImage.prototype.show_image = function(nPicIndex) { 
	if (this.obj_img_index==nPicIndex) return;

	if (this.obj_img_index!=-1) getdoc().getElementById('iva_' + this.obj_img_index).className = ''; 
	this.obj_img_index = nPicIndex;

	if (this.obj_images.length>1 && nPicIndex < this.obj_images.length) {
		var obj_caption = null;
		if(obj_caption =getdoc().getElementById('img_pos_caption')){
			obj_caption.innerHTML = 'images ' + (nPicIndex + 1) + ' of ' + this.obj_images.length;
		}
	}

	if (this.obj_images_org[nPicIndex].src.length==0){
		this.obj_images_org[nPicIndex].src = this.obj_images[nPicIndex].getAttribute('org_src');
	}

	if (!this.obj_images_org[nPicIndex].complete){
		getdoc().getElementById('img_preview_wrapper').style.display = 'none';
		getdoc().getElementById('img_preview').style.display = 'none';
		getdoc().getElementById('img_loading').style.display = 'block';
	}

	getdoc().getElementById('iva_' + nPicIndex).className = 'imgview_sumnail_active';
	getdoc().getElementById('img_preview').src = this.obj_images[nPicIndex].getAttribute('org_src') + '&mw=480';
}

popupImage.prototype.analyze = function(sContainerID, sSrcImage) {
	if (popupImage.defined(sContainerID) && sContainerID.length > 0) {
		var obj_container = document.getElementById(sContainerID);
		this.obj_images = obj_container.getElementsByTagName("img");
		obj_container = null;
		for (var i = 0; i < this.obj_images.length; i++){
			if (sSrcImage == popupImage.GetImageName(this.obj_images[i].getAttribute('org_src'))) break;
			//if (sSrcImage == popupImage.GetImageName(this.obj_images[i].src)) break;
		}
		return i;
	}
}

popupImage.prototype.createDiv = function() {
	if (document.createElement) {
		var d = getdoc().createElement("DIV");
		d.style.position="absolute";
		//d.style.display="none";
		d.style.visibility="hidden";
		//d.id="pi_imageviewer";
		popupImage.appendToBody(d);
		return d;
	}
	alert("ERROR: Couldn't create DIV element in Popup.prototype.createDiv()");
	return null;
};

popupImage.prototype.createIframe = function() {
	if (document.createElement) {
		var i= getdoc().createElement("IFRAME");
		i.style.position="absolute";
		i.style.display="none";
		//i.style.visibility="hidden";
		i.style.background="none";
		popupImage.appendToBody(i);
		return i;
	}
	else {
		alert("ERROR: Couldn't create IFRAME object in Popup.prototype.createIframe()");
	}
};

popupImage.prototype.addScreen = function() {
	//var lastZindex = this.baseZindex;
	var doc_size = GetDocSize();

	if (this.obj_screen==null) {
		this.obj_screen=this.createDiv();
		this.obj_screen.style.top="0px";
		this.obj_screen.style.left="0px";
		this.obj_screen.style.backgroundColor = this.screenColor;
		//this.obj_screen.className=Popup.screenClass;;
		popupImage.setStyle(this.obj_screen,"opacity",this.screenOpacity);
		this.obj_screen.onclick = function(e) { Event.cancelBubble(Event.resolve(e)); }
	}
	if (this.obj_screen_if==null) {
		this.obj_screen_if = this.createIframe();
		this.obj_screen_if.style.top="0px";
		this.obj_screen_if.style.left="0px";
		//this.obj_screen_if.className=Popup.screenIframeClass;
		popupImage.setStyle(this.obj_screen_if,"opacity",0);
	}
	this.obj_screen.style.width = doc_size.w+"px";
	this.obj_screen.style.height = doc_size.h+"px";
	this.obj_screen_if.style.width = doc_size.w+"px";
	this.obj_screen_if.style.height = doc_size.h+"px";
	//this.obj_screen_if.style.zIndex = lastZindex++;
	this.obj_screen_if.style.visibility="visible";
	this.obj_screen_if.style.display="block";
	//this.obj_screen.style.zIndex = lastZindex++;
	this.obj_screen.style.visibility="visible";
	this.obj_screen.style.display="block";
	
	//return lastZindex;
};

popupImage.setStyle = function(o, property, value) {
	if (o==null || !popupImage.defined(o.style) || !popupImage.defined(property) || property==null || !popupImage.defined(value)) { return false; }
	if (property=="float") {
		o.style["cssFloat"] = value;
		o.style["styleFloat"] = value;
	}
	else if (property=="opacity") {
		o.style['-moz-opacity'] = value;
		o.style['-khtml-opacity'] = value;
		o.style.opacity = value;
		if (popupImage.defined(o.style.filter)) {
			o.style.filter = "alpha(opacity=" + value*100 + ")";
		}
	}
	else {
		o.style[css.hyphen2camel(property)] = value;
	}
	return true;
};


popupImage.prototype.go_prev = function() {
	if (this.obj_img_index)
		this.show_image(this.obj_img_index-1);
}

popupImage.prototype.go_next = function() {
	if (this.obj_img_index < this.obj_images.length -1 )
		this.show_image(this.obj_img_index+1);
}


popupImage.prototype.hide = function() {
	//this.obj_main.style.display='none';
	if(this.obj_window){
		this.obj_window.close();
		this.obj_window = null;
		this.obj_main = null;
		PI=null;
	} else {
		this.obj_main.style.visibility='hidden';
		this.obj_screen.style.visibility='hidden';
		this.obj_screen_if.style.visibility='hidden';
	}
}


popupImage.prototype.show = function(sCaption, sSrcImage, sContainerID) {
	var sImagePos = '';
	var sImageList = '';
	var i = 0;
	var sPreloadImages = '';

	var nPicIndex = this.analyze(sContainerID, sSrcImage);
	var sHTML = '<table cellpading="0" cellspacing="0" class="imgview_sumnail"  align="center">';

	this.obj_images_org = new Array();

	while (i < this.obj_images.length){
		sHTML += '<tr>';
		for (var j = 0; j < this.col_count; j++){
			if(i < this.obj_images.length){
				sHTML += '<td'+ (j?'':' class="col_first"') +'>';
				sHTML += '<div class="Div8BoxFB">'
					+'<div class="Div8BoxFB_l1" style="height:100%; width:100%;">'
					+'<div class="Div8BoxFB_l2" style="height:100%; width:100%;">'
					+'<div class="Div8BoxFB_l3" style="height:100%; width:100%;">'
					+'<div class="Div8BoxFB_l4" style="height:100%; width:100%;">'
					+'<div class="Div8BoxFB_l5" style="height:100%; width:100%;">'
					+'<div class="Div8BoxFB_l6" style="height:100%; width:100%;">'
					+'<div class="Div8BoxFB_l7" style="height:100%; width:100%;">'
					+'<div class="Div8BoxFB_l8" style="height:100%; width:100%;">';
				sHTML += '<a id="iva_' + i + '" href="javascript:document.getElementById(\'pi_imageviewer\').PI.show_image(' + i + ');">'
					+ '<img src="' + this.obj_images[i].getAttribute('sumnail_src') + '"></a>';
				sHTML += '</div></div></div></div></div></div></div></div></div>';
				sHTML += '</td>';
				this.obj_images_org[i] = new Image; 
				//this.obj_images_org[i].src = this.obj_images[i].getAttribute('org_src');
			} else {
				sHTML += '<td></td>';
			}
			i++;
		}
		sHTML += '</tr>';
	}
	sHTML += '</table>';

	//this.obj_main.style.display='block';
	//+ '<thead><tr><td><div id="img_pos_caption">' + sImagePos + '</div><div id="sumnail_id_caption">' + escape(sCaption) + '</div><img id="sumnamil_btn_close" src="image/btn_close.gif" onclick="document.getElementById(\'pi_imageviewer\').PI.hide();"></tr></thead>' 
	this.obj_main.innerHTML='<img src="/image/ani_spin2.gif" style="display:none;">'
		+ '<table cellpading="0" cellspacing="0" class="tbl_imgview">'
		+ '<tbody><tr><td class="sumnail_list"><div style="width:100%; height:100%;">' + sHTML + '</div></td></tr>' 
		+ '<tr><td ondblclick="PI.hide();" class="view_detail" align="center">'
		+ '<div class="Div8BoxFB" id="img_preview_wrapper" style="display:none; min-width:100px;">'
		+ '<div class="Div8BoxFB_l1" style="height:100%; width:100%;">'
		+ '<div class="Div8BoxFB_l2" style="height:100%; width:100%;">'
		+ '<div class="Div8BoxFB_l3" style="height:100%; width:100%;">'
		+ '<div class="Div8BoxFB_l4" style="height:100%; width:100%;">'
		+ '<div class="Div8BoxFB_l5" style="height:100%; width:100%;">'
		+ '<div class="Div8BoxFB_l6" style="height:100%; width:100%;">'
		+ '<div class="Div8BoxFB_l7" style="height:100%; width:100%;">'
		+ '<div class="Div8BoxFB_l8" style="height:100%; width:100%;">'
		+ '<img id="img_preview" style="display:none;" onload="document.getElementById(\'pi_imageviewer\').PI.show_now();" src="' + sSrcImage + '&mw=480" />'
		+ '</div></div></div></div></div></div></div></div></div>'
		+ '</td></tr></tbody>'
		+ '<tfoot><tr><td >'
		+ '&#X25c4; <a href="javascript:document.getElementById(\'pi_imageviewer\').PI.go_prev();">PREVIOUS</a> &nbsp; &nbsp; &nbsp; &nbsp; ' 
		+ '<a href="javascript:document.getElementById(\'pi_imageviewer\').PI.go_next();">NEXT</a> &#X25ba;'
		+ '</td></tr></tfoot>'
		+ '</table>' + '<img id="img_loading" src="/image/ani_spin2.gif" style="position:absolute; top:48%; left:48%;">';

	this.show_image(nPicIndex);

	if(!this.obj_window){
		this.placeIt(965,710);
		this.obj_screen.style.visibility='visible';
		this.obj_screen_if.style.visibility='visible';
	}
}

popupImage.prototype.show_now = function(){
	var obj_img = getdoc().getElementById('img_preview');
	with(getdoc().getElementById('img_preview_wrapper').style){
		//height = '100px';
		width = (obj_img.width+22) + 'px';
		display = 'block';
	}
	obj_img.style.display = 'block';
	//obj_img.style.display = '-moz-inline-box';
	getdoc().getElementById('img_loading').style.display = 'none';
}

popupImage.GetImageName = function(sPath) {
	var iPos = sPath.indexOf('//');
	if (iPos) 
		iPos+=1;
	else 
		iPos = 0;

	//var iPos = sPath.indexOf('/', iPos);
	if (iPos)
		return sPath.substr(iPos);
	else
		return sPath;
}

popupImage.prototype.placeIt = function(nWidth, nHeight) {
	var nSize = 0;
	var view_top = 0, view_left=0;
	var screen_height = popupImage.getViewportHeight();
	var screen_width  = popupImage.getViewportWidth();
	var view_width = nWidth || this.obj_main.offsetWidth;
	var view_height = nHeight || this.obj_main.offsetHeight;

	if (!popupImage.defined(pi_isIE)) {
		if (popupImage.defined(nWidth)) view_width = nWidth + 20; 
		if (popupImage.defined(nHeight)) view_height = nHeight + 56; 
	}

	if(nWidth)
		this.obj_main.style.visibility='visible';

	if (screen_height < view_height) {
		view_top=0;
	} else {
		nSize = (screen_height-view_height)/2
		view_top = popupImage.getScrollTop() + (screen_height - (screen_height-nSize));
	}

	if (screen_width < view_width) {
		view_left=0;
	} else {
		nSize = (screen_width-view_width)/2
		view_left = popupImage.getScrollLeft() + (screen_width - (screen_width-nSize));
	}

	this.obj_main.style.top = view_top + "px";
	this.obj_main.style.left = view_left + "px";
}

popupImage.prototype.init = function() {
	if(this.obj_window){
		this.obj_window.document.open();
		this.obj_window.document.write('<html><base href="http://www.megasigninc.com/" /><link rel="stylesheet" href="css/main.css"><body style="margin:0px; padding:0px;" onunload="document.getElementById(\'pi_imageviewer\').PI.hide();"><div style="display:none;"><img src="/image/frameB_l.gif"/><img src="/image/frameB_r.gif"/><img src="/image/frameB_lt.gif"/><img src="/image/frameB_lb.gif"/><img src="/image/frameB_b.gif"/><img src="/image/frameB_t.gif"/><img src="/image/frameB_rt.gif"/><img src="/image/frameB_rb.gif"/></div><div id="pi_imageviewer"></div></body></html>');
		this.obj_window.document.close();
		this.obj_main = this.obj_window.document.getElementById('pi_imageviewer');
	} else {
		this.addScreen();
		
		this.obj_main=this.createDiv();
		this.obj_main.id = 'pi_imageviewer';
		this.obj_main.style.top=this.top + 'px';
		this.obj_main.style.left=this.left + 'px';
		this.obj_main.style.width=this.width + 'px';
		this.obj_main.style.height=this.height + 'px';
		this.obj_main.style.backgroundColor = this.screenColor;
	}
	this.obj_main.PI = this;
}

popupImage.getBody = function() {
	if (getdoc().body) {
		return getdoc().body;
	}
	if (getdoc().getElementsByTagName) {
		var bodies = getdoc().getElementsByTagName("BODY");
		if (bodies!=null && bodies.length>0) {
			return bodies[0];
		}
	}
	return null;
};

popupImage.appendToBody = function(o) {
	var body = popupImage.getBody();
	if (body && body.appendChild) {
		body.appendChild(o);
	}
};

popupImage.addEvent = function(obj, evType, fn){ 
	if (obj.addEventListener){ 
		obj.addEventListener(evType, fn, false); 
		return true; 
	} else if (obj.attachEvent){ 
		var r = obj.attachEvent("on"+evType, fn); 
		return r; 
	} else { 
		return false; 
	} 
}


popupImage.zero = function(n) {
	return (!popupImage.defined(n) || isNaN(n))?0:n;
};


popupImage.getViewportWidth = function() {
	if (getdoc().documentElement && (!getdoc().compatMode || getdoc().compatMode=="CSS1Compat")) {
		return getdoc().documentElement.clientWidth;
	}
	else if (getdoc().compatMode && getdoc().body) {
		return getdoc().body.clientWidth;
	}
	return screen.zero(self.innerWidth);
};



// Get the height of the viewport (viewable area) in the browser window
// --------------------------------------------------------------------
popupImage.getViewportHeight = function() {
	if (!getdoc().opera && getdoc().documentElement && (!getdoc().compatMode || getdoc().compatMode=="CSS1Compat")) {
		return getdoc().documentElement.clientHeight;
	}
	else if (getdoc().compatMode && !getdoc().opera && getdoc().body) {
		return getdoc().body.clientHeight;
	}
	return screen.zero(self.innerHeight);
};


popupImage.getScrollTop = function() {
	if (getdoc().documentElement && popupImage.defined(getdoc().documentElement.scrollTop) && getdoc().documentElement.scrollTop>0) {
		return getdoc().documentElement.scrollTop;
	}
	if (getdoc().body && popupImage.defined(getdoc().body.scrollTop)) {
		return getdoc().body.scrollTop;
	}
	return null;
};

// Get the amount that the main document has scrolled from left
// --------------------------------------------------------------------
popupImage.getScrollLeft = function() {
	if (getdoc().documentElement && popupImage.defined(getdoc().documentElement.scrollLeft) && getdoc().documentElement.scrollLeft>0) {
		return getdoc().documentElement.scrollLeft;
	}
	if (getdoc().body && popupImage.defined(getdoc().body.scrollLeft)) {
		return getdoc().body.scrollLeft;
	}
	return null;
};

popupImage.defined = function(o) {
	return (typeof(o)!="undefined");
};

var PI

function popupImage_init(mode_popup){
	if (PI==null)
		PI = new popupImage(mode_popup);
}

function show_image(scaption, id, id_imagelist, mode_popup) {
	popupImage_init(mode_popup);

	var id_imagelist = id_imagelist?id_imagelist:'imageList';

	//PI.show(scaption, '/sys/getfile.asp?id=' + id, 'imageList') ;
	PI.show(scaption, '/image/?id=' + id, id_imagelist) ;
	//window.open('/sys/getfile.asp?id=' + id, 'show_image', 'toolbar=0,location=0,directories=0,status=0,menubar=0,resizable=1,width=600,height=500');
}

//popupImage.addEvent(window, 'load', popupImage_init);