function mindPopInit(containerId) {

	// dispose
	if ($('mpPop')!=undefined) {
		$('mpPop').set('html','');
		$('mpPop').dispose('');
	}
	
	// find the lightboxes
	if (containerId) {
		var mpLightboxes = $$('#' + containerId + ' .lightbox');
	} else {
		var mpLightboxes = $$('.lightbox');
	}
	var mpLightLength = mpLightboxes.length;
	
	//console.log('amount of image pop-ups found: ' +mpLightLength);
	
	// loop through
	for (i=0;i<mpLightLength;i++) {
	
		// onclick
		mpLightboxes[i].addEvent('click',function(event) {
			// stop the link off
			event.stop();
			
			// pop up image
			mindPopShow(this);
			
		
		})
		
	}

}


function mindPopShow(el) {

	// set up
	var mpImageTypes = new Array('jpg','jpeg','gif','png');
	
	// set up scrollbar compensation
	var mpScrollBars = 20;
	if (Browser.Platform.ipod) {
		mpScrollBars = 0;	// ipods/ipads don't have visible scrollbars so don't
	}

	// is this browser CSS transitions enabled
	mpCSSTrans = false;
	if (Browser.Engine.webkit && parseInt(Browser.Engine.version)>522) {
		mpCSSTrans = true;
	}
	
	// get the thumbnail
	imgPop = $(el).getFirst('img');
	
	// set the class of the thumbnail while we pop it
	imgPop.addClass('mpPopping');
	imgPop.setStyle('background','#000');
	
	// get the alt tag of the background
	imgTitle = imgPop.getProperty('alt');
	if (!imgTitle) {
		imgTitle = '';
	}
	imgCredit = imgPop.getProperty('rel');
	if (imgCredit) {
		imgCredit = ' <small>' + imgCredit + '</small>';
	} else {
		imgCredit = '';
	}
	if (imgTitle.length>0) {
		$('caption').set('html',imgTitle + imgCredit );
	}

	// viewport size
	var mpBodySize = window.getSize();
	var mpViewPortX = mpBodySize.x;
	var mpViewPortY = mpBodySize.y;

	// find the frames
	var BDframes = $$('.BD_scene');
	
	// find the thumbnail
	var mpTmb = el.getChildren('img');
	if (mpTmb[0]==undefined) {
		return;
	}
	mpTmb = mpTmb[0];
	
	// find width/height
	var mpThmW = parseInt(mpTmb.getStyle('width'));
	var mpThmH = parseInt(mpTmb.getStyle('height'));
	
	// find the position
	var mpThmX = parseInt(el.getParent().getStyle('left'));
	var mpThmY = parseInt(el.getParent().getStyle('top'));
	
	if (!isInt(mpThmX)) {
		var mpThmPos = el.getPosition();
		var mpThmX = mpThmPos.x;
		var mpThmY = mpThmPos.y;
	}
	
	// check for padding
	var mpTmbPadTop = parseInt(el.getFirst().getStyle('padding-top'));
	if (mpTmbPadTop>0) {
		mpThmY = mpThmY+mpTmbPadTop;
	}
	var mpTmbPadLeft = parseInt(el.getFirst().getStyle('padding-left'));
	if (mpTmbPadLeft>0) {
		mpThmX = mpThmX+mpTmbPadLeft;
	}
	
	//console.log('w:' + mpThmW + ' h:' + mpThmH + ' x:' + mpThmX + ' y:' + mpThmY);
	
	// fade the thumb down
	mpTmb.setStyle('opacity',0.4);
	
	// add in the spinner
	var mpSpin = new Element('div',{
		'id': 'mindPopSpinner',
		'styles': {
			'display': 'block',
			'position': 'absolute',
			'left' : mpThmX+(mpThmW/2)-8,
			'top' : mpThmY+(mpThmH/2)-8,
			'z-index': 300,
			'width':16,
			'height':16,
			'background':'transparent'
		},
		'html': '<img src="images/spinner.gif" width="16" height="16" border="0" />'
	});
	$$('body').grab(mpSpin);
	
	
	// what type of link is it?
	var mpLink = el.getProperty('href');
	var mpLinkExplode = mpLink.split('.');
	var mpLinkExt = mpLinkExplode[(mpLinkExplode.length-1)];
	mpLinkExt = mpLinkExt.toLowerCase();
	
	// the link is IMAGE
	if (mpImageTypes.contains(mpLinkExt)) {
	
		// is the mpPop container already created?
		if ($('mpPop')!=undefined) {
			$('mpPop').dispose();
		}
		if ($('mpPopImg')!=undefined) {
			$('mpPopImg').dispose();
		}
		if ($('mpMatte')!=undefined) {
			$('mpMatte').dispose();
		}
		
		// create the background matte
		var mpMatte = new Element('div',{
			'id': 'mpMatte',
			'styles': {
				'display': 'block',
				'position': 'absolute',
				'left' : 0,
				'top' : 0,
				'z-index': 499,
				'width':mpViewPortX,
				'height':mpViewPortY,
				'background':'#000',
				'opacity':0,
				'overflow': 'hidden',
				'-webkit-transition': '-webkit-transform 0.20s ease-in-out'
			},
			'events': {
				'click': function(){
					mindPopClose(el);
				}
			}
		});
		$$('body').grab(mpMatte);
	
		// create the pop-up item
		var mpPop = new Element('a',{
			'id': 'mpPop',
			'styles': {
				'display': 'block',
				'visibility': 'hidden',
				'position': 'absolute',
				'left' : 0,
				'top' : 0,
				'z-index': 500,
				'overflow': 'hidden',
				'-webkit-transition': '-webkit-transform 0.20s ease-in-out'
			}
		});
		$$('body').grab(mpPop);
		
		// create the pop-up close box
		var mpPopClose = new Element('span',{
			'id': 'mpPopClose',
			'class':'mp_pop_close',
			'html':'close',
			'styles': {
				'display': 'block',
				'position': 'absolute',
				'left' : 5,
				'top' : 5,
				'z-index': 100,
				'width' : 30,
				'height' : 30,
				'text-indent':-3000,
				'overflow': 'hidden'
			},
			'events': {
				'click': function(){
					mindPopClose(el);
				}
			}
		});
		mpPop.grab(mpPopClose);
		
		// load the image
		var mpPopImage = new Image();
		mpPopImage.onload = function() {
	
			if (!mpPopImage.width) {
				mpPopImage.dispose();
				return;
			}
	
			// calc the max size of the images
			var mpPopW = mpPopImage.width;
			var mpPopH = mpPopImage.height;
			
			//// fade the thumb back up
			$$('.mpPopping').setStyles({'opacity':1,'background':'#fff'});
			$$('.mpPopping').removeClass('mpPopping');
			$('mindPopSpinner').dispose();
			
			//console.log('popup image orig - w:' + mpPopW + ' h:' + mpPopH);
			
			// if the image is too big, resize (the 20px margin is to take into account the scrollbars)
			if (mpPopW>(mpViewPortX-mpScrollBars)) {
				mpPopH = Math.round((mpViewPortX-mpScrollBars)*mpPopH/mpPopW);
				mpPopW = (mpViewPortX-mpScrollBars);
			}
			if (mpPopH>(mpViewPortY-mpScrollBars)) {
				mpPopW = Math.round((mpViewPortY-mpScrollBars)*mpPopW/mpPopH);
				mpPopH = (mpViewPortY-mpScrollBars);
			}
			
			// calc the middle of the page
			var mpPopX = Math.round(((mpViewPortX-mpScrollBars)-mpPopW)/2);
			var mpPopY = Math.round(((mpViewPortY-mpScrollBars)-mpPopH)/2);
			
			//alert('popup image calc - w:' + mpPopW + ' h:' + mpPopH);
			
			// inject it into the container
			mpPopImageTag = new Element('img', {
			    'id': 'mpPopImg',
			    'src': mpPopImage.src,
			    'width':mpThmW,
			    'height':mpThmH,
			    'border':'none'
			});
			mpPopImageTag.inject($('mpPop'));
			
			// move it to the start point
			$('mpPop').setStyles({
				'visibility': 'visible',
				'left' : mpThmX,
				'top' : mpThmY
			});
			
			// fade it in
			//if (mpCSSTrans) {
			//	$('mpPop').setStyles({
			//		'-webkit-transform':'opacity(1)'
			//	});
			//} else {
				new Fx.Morph($('mpMatte'),{'duration':200}).start({'opacity':1}).chain(function() {
					new Fx.Morph($('mpPop'),{'duration':200}).start({ 
						'left':mpPopX,
						'top':mpPopY
					});
					new Fx.Morph(mpPopImageTag,{'duration':200}).start({ 
						'width':mpPopW,
						'height':mpPopH
					});
				});
			//}
			//console.log('move to - x:' + mpPopX + ' y:' + mpPopY);
						
			// fade the caption in
			new Fx.Morph($('caption')).start({ 'opacity':1 });
			
		}
		mpPopImage.src = mpLink;
		
	
	}	

}


function mindPopClose(el) {

	// set up
	var mpImageTypes = new Array('jpg','jpeg','gif','png');
	
	// is this browser CSS transitions enabled
	mpCSSTrans = false;
	if (Browser.Engine.webkit && parseInt(Browser.Engine.version)>522) {
		mpCSSTrans = true;
	}
	
	// find the thumbnail
	var mpTmb = el.getChildren('img');
	if (mpTmb[0]==undefined) {
		return;
	}
	mpTmb = mpTmb[0];
	
	// find width/height
	var mpThmW = parseInt(mpTmb.getStyle('width'));
	var mpThmH = parseInt(mpTmb.getStyle('height'));
	
	// find the position
	var mpThmX = parseInt(el.getParent().getStyle('left'));
	var mpThmY = parseInt(el.getParent().getStyle('top'));
		
	// kill the caption
	new Fx.Morph($('caption')).start({ 'opacity':0 })	
	
	//console.log('w:' + mpThmW + ' h:' + mpThmH + ' x:' + mpThmX + ' y:' + mpThmY);
		
	// fade it in
	//if (mpCSSTrans) {
	//	$('mpPop').setStyles({
	//		'-webkit-transform':'opacity(1)'
	//	});
	//} else {
		new Fx.Morph($('mpPop'),{'duration':200}).start({ 
			'opacity':0
		}).chain(function () {
			new Fx.Morph($('mpMatte'),{'duration':500}).start({ 
				'opacity':0
			}).chain(function () {			
				mindPopClear();
			})
		});
	//}
	
}



function mindPopResize() {

	// if no pop up, exit
	if ($('mpPop')==undefined) {
		return false;
	}
	
	// set up scrollbar compensation
	var mpScrollBars = 20;
	if (Browser.Platform.ipod) {
		mpScrollBars = 0;	// ipods/ipads don't have visible scrollbars so don't
	}

	// viewport size
	var mpBodySize = window.getSize();
	var mpViewPortX = mpBodySize.x;
	var mpViewPortY = mpBodySize.y;
	
	
	// calc the max size of the images
	var mpPopSize = $('mpPopImg').getSize();
	var mpPopW = mpPopSize.x;
	var mpPopH = mpPopSize.y;
	
	//console.log('popup old size - w:' + mpPopW + ' h:' + mpPopH);
	
	// if the image is too big, resize (the 20px margin is to take into account the scrollbars)
	if (mpPopW>(mpViewPortX-mpScrollBars)) {
		mpPopH = Math.round((mpViewPortX-mpScrollBars)*mpPopH/mpPopW);
		mpPopW = (mpViewPortX-mpScrollBars);
	}
	if (mpPopH>(mpViewPortY-mpScrollBars)) {
		mpPopW = Math.round((mpViewPortY-mpScrollBars)*mpPopW/mpPopH);
		mpPopH = (mpViewPortY-mpScrollBars);
	}
	// calc the middle of the page
	var mpPopX = Math.round(((mpViewPortX-mpScrollBars)-mpPopW)/2);
	var mpPopY = Math.round(((mpViewPortY-mpScrollBars)-mpPopH)/2);
	
	// set up the matte
	$('mpMatte').setStyles({
		'width':mpViewPortX,
		'height':mpViewPortY
	});
	// set up the img
	$('mpPopImg').setStyles({
		'width':mpPopW,
		'height':mpPopH
	});
	// set up the div
	$('mpPop').setStyles({
		'left':mpPopX,
		'top':mpPopY
	});
	
}



function mindPopClear() {
	//console.log('clear1');
	if ($('mpPop')!=undefined) {
		$('mpPop').set('html','');
		$('mpPop').dispose();
	}
	if ($('mpPopImg')!=undefined) {
		$('mpPopImg').dispose();
	}
	if ($('mpMatte')!=undefined) {
		$('mpMatte').dispose();
	}
	// kill the caption
	$('caption').setStyle('opacity',0);
	//console.log('clear2');
}
