function initGallery() {
	if ($(_ID_THUMBNAILS)) {

		// initialize navigation

		// initialize thumbnails
		initThumbs();

		// initialize controls
		initControls();

		// update graphic
		initPhoto();

	}
}
function initControls() {
// update controls

	$('zoom').setOpacity(0.5);
	$('ctr-left').observe('click', function(evt) {
		db('clicked');
		pictureLeft();
		evt.stop();
	});
	$('ctr-right').observe('click', function(evt) {
		pictureRight();
		evt.stop();
	});

	$('ctr-zoom').observe('click', function() {
		if (!_ZOOMED) {
//			$('ctr-zoom').addClassName('hidden');
			zoomIn();
		}
	});
	$('zoom').observe('mouseover', function() {
		$('zoom').setOpacity(1);
	});
	$('zoom').observe('mouseout', function() {
		$('zoom').setOpacity(0.5);
	});
	$('ctr-close').observe('click', function() {
		if (_ZOOMED) {
//			$('ctr-zoom').removeClassName('hidden');
			zoomOut();
		}
	});

}
function pictureRight() {
	db('RIGHT GO: '+_GALLERY_OFFSET);
	if (!_ZOOMED) {

		if ($(_LAST_THUMB)) {
			$(_LAST_THUMB).setOpacity(0.5);
		}
		var go = parseInt(_GALLERY_OFFSET) + 1;
		if ($$('div#thumbnails ul li img[offset='+go+']').length > 0) {
			db('GO++');
			_GALLERY_OFFSET++;
		}
		else {
			db('GO=0');
			db('div#thumbnails ul li img[offset='+go+']');
			db('LEN='+$$('div#thumbnails ul li img[offset='+go+']').length);
			// go to first
			_GALLERY_OFFSET = 0;
		}

		_LAST_THUMB = $$('div#thumbnails ul li img[offset='+_GALLERY_OFFSET+']')[0];
		_LAST_THUMB.setOpacity(1);
		var rel = _LAST_THUMB.getAttribute('rel');

		changeImage('/photos/' + _BASE_SCREEN + '/' + rel);
	}
}
function pictureLeft() {
	db('LEFT GO: '+_GALLERY_OFFSET);
	if (!_ZOOMED) {

		if ($(_LAST_THUMB)) {
			$(_LAST_THUMB).setOpacity(0.5);
		}
		var go = parseInt(_GALLERY_OFFSET) - 1;
		if (go >= 0) {
			_GALLERY_OFFSET--;
		}
		else {
			_GALLERY_OFFSET = $$('div#thumbnails ul li img').length - 1;
		}

		_LAST_THUMB = $$('div#thumbnails ul li img[offset='+_GALLERY_OFFSET+']')[0];
		_LAST_THUMB.setOpacity(1);
		var rel = _LAST_THUMB.getAttribute('rel');
		changeImage('/photos/' + _BASE_SCREEN + '/' + rel);
	}
}
function zoomIn() {
	photoInit();

	// hide thumbnails
	// update photo container size
	// update height

	var nh = eval(document.viewport.getHeight() - 50);
	$(_ID_PHOTO_CONTAINER).setStyle({ height: nh + 'px' });
	_ZOOMED = true;

	var ds = Effect.Fade($('thumb-dropshadow'), { duration: 0.1, queue: 'parallel' });

	setTimeout(function() {
	var s = Effect.DropOut($('thumbnails-container'), { duration: 0.3, queue: 'parallel' });
	var zo = new Effect.Morph('zoom', { 
		style: 'margin-top: -50px',//+eval(50+pxToInt($(_ID_PHOTO).getStyle('marginTop')))+'px',
		duration: 0.5,
		queue: 'parallel'
	});
	}, 100);
	db('trying to scale');

	var s = new Effect.Scale(_ID_PHOTO, (_PHOTO_SIZE.width / $(_ID_PHOTO).getWidth()) * 100, { 
		scaleFromCenter: true,
		duration: 1.0,
		queue: 'parallel'
	});
	if (_PHOTO_SIZE.height < eval(document.viewport.getHeight() - 50)) {
		db('extra scale');
		_PHOTO_EXTRA_MARGIN = pxToInt($(_ID_PHOTO).getStyle('marginTop'));
		var d = new Effect.Morph(_ID_PHOTO, { 
			style: 'margin-top: '+eval((document.viewport.getHeight() / 2) - (_PHOTO_SIZE.height / 2) + 50)+'px',				
			duration: 1.0,
			queue: 'parallel'
		});
	}
	else {
		_PHOTO_EXTRA_MARGIN = 0;
	}
	db('finished scaling');


	// hide thumbnails

	setTimeout(function() {
		$('thumbnails').addClassName('hidden');
		
		// display drag
		// first center it
		var v = document.viewport.getDimensions();
		var d = $('drag').getDimensions();
		$('drag').setStyle({ left: ((v.width/2)-(d.width/2))+'px', top: ((v.height/2)-(d.height/2))+'px' });
		$('drag').setStyle({ display: 'none' });
		$('drag').removeClassName('hidden');
		var p = Effect.Appear('drag', { duration: 1.0, queue: 'end' });
		var p = Effect.Fade('drag', { duration: 2.0, queue: 'end' });

	}, 1000);

	// hide arrows
	$('arrow-left').addClassName('hidden');
	$('arrow-right').addClassName('hidden');
	$('arrow-left-small').addClassName('hidden');
	$('arrow-right-small').addClassName('hidden');

	// animate zoom
	animateZoomIn();
}
function animateZoomIn() {
	if (_ZOOM_OFFSET < _ZOOM_COUNT) {
		$('ctr-zoom').src = _ZOOM_CLOSE[_ZOOM_OFFSET].src;
		_ZOOM_OFFSET++;
		setTimeout(animateZoomIn,5);
	}
	else {
		$('ctr-zoom').addClassName('hidden');
		$('ctr-zoom').src = '/images/zoom.png';
		_ZOOM_OFFSET = 0;
	}
}
function zoomOut() {
	_PHOTO_DRAG.destroy();
	_ZOOMED = false;

	$('thumbnails').removeClassName('hidden');
	$('thumbnails-container').setStyle({ marginTop: '100px' });
	$('thumbnails-container').show();
	setTimeout(function() {
		var b = new Effect.Morph('thumbnails-container', { style: 'margin-top: 0', duration: 0.3, queue: 'parallel' });
	},100);
	// update photo container
	var nh = vph = eval(document.viewport.getHeight() - 150);
	var s = new Effect.Morph(_ID_PHOTO_CONTAINER, { style: { height: nh + 'px' }, duration: 0.3, queue: 'parallel' });
	
	//var t = Effect.Appear('thumbnails-container', { duration: 0.3, queue: 'parallel' });

	var neww = eval(nh*_PHOTO_AR);
	if (neww > document.viewport.getWidth()) {
		neww = document.viewport.getWidth();
		nh = neww / _PHOTO_AR;
		db('ZO neww > vpwidth');
	}
	// calculate top margin
	db('photoextram: '+_PHOTO_EXTRA_MARGIN);
	_PHOTO_EXTRA_MARGIN == 0 ? _PHOTO_EXTRA_MARGIN = pxToInt($(_ID_PHOTO).getStyle('margin-top')) : '';
	var d = new Effect.Morph(_ID_PHOTO, { 
		style: 'height: '+nh+'px; width: '+neww+'px; top: 0; left: 0; margin-top: '+_PHOTO_EXTRA_MARGIN+'px',// marginLeft: '+eval((document.viewport.getHeight() / 2)-(neww / 2))+'px; marginTop: '+eval((vph / 2)-(nh / 2))+'px; marginBottom: '+eval((vph / 2)-(nh / 2))+'px',
		duration: 1.0,
		queue: 'parallel'
	});
	var zo = new Effect.Morph('zoom', { 
		style: 'margin-top: -150px',
		duration: 0.3,
		queue: 'parallel'
	});
	// do this later
	setTimeout(function() {
		var d = Effect.Appear('thumb-dropshadow', { duration: 0.3, queue: 'parallel' });

		// show
		$('arrow-left').removeClassName('hidden');
		$('arrow-right').removeClassName('hidden');
		$('arrow-left-small').removeClassName('hidden');
		$('arrow-right-small').removeClassName('hidden');
	}, 300);
// animate zoom
	animateZoomOut();
}
function animateZoomOut() {
	if (_ZOOM_OFFSET < _ZOOM_COUNT) {
		var newOffset = _ZOOM_COUNT - _ZOOM_OFFSET - 1;
		$('ctr-zoom').src = _ZOOM_CLOSE[newOffset].src;		
		_ZOOM_OFFSET == 0 ? $('ctr-zoom').removeClassName('hidden') : '';
		_ZOOM_OFFSET++;
		setTimeout(animateZoomOut,5);
	}
	else {
		$('ctr-zoom').src = '/images/zoom.png';
		_ZOOM_OFFSET = 0;
	}
}
function initThumbs() {
	_THUMBS == null ? _THUMBS = $$('div#thumbnails ul li img') : '';
	_THUMB_WIDTH = 0;
	_THUMBS.each(function(img,index) {
		db('adding thumb: '+index);
		img.setAttribute('offset',index);
		_THUMB_WIDTH += img.getAttribute('width') + 1;
		img.observe('click', function(evt) {
			if (!_ZOOMED) {
				var caller = getParentObject(evt.element(), 'offset');
				if (caller != null) {
					_GALLERY_OFFSET = caller.getAttribute('offset');
					
					db('updated offset: ' + _GALLERY_OFFSET);
					changeImage('/photos/' + _BASE_SCREEN + '/' + caller.getAttribute('rel'));

					//alert('/photos/' + _BASE_SCREEN + '/' + caller.getAttribute('rel'));
				}
				if ($(_LAST_THUMB)) {
					$(_LAST_THUMB).setOpacity(0.5);
				}
				_LAST_THUMB = evt.element();
				_LAST_THUMB.setOpacity(1);
			}
		});
		index != 0 ? img.setOpacity(0.5) : _LAST_THUMB = img;
		img.observe('mouseover', function(evt) {
			evt.element() != _LAST_THUMB ? evt.element().setOpacity(1) : ''
		});
		img.observe('mouseout', function(evt) {
			evt.element() != _LAST_THUMB ? evt.element().setOpacity(0.5) : ''
		});
	});
//	$('thumbnails-list').setStyle({ width: _THUMB_WIDTH+'px' });
//	$('thumbnails-list').width = _THUMB_WIDTH;

	if ($('thumbnails-list').getWidth() == 0) {
		setTimeout(function() {
			db('stupid thumbs: '+$('thumbnails-list').getWidth());
		}, 1000);
	}
	// thumbnail arrows 
	//arrow-left-small
	Element.observe('arrow-left-small','mouseover',function(evt) {
		_SCROLL_TIMER = setInterval(function() { moveLeft(-1); }, 5);
	});
	Element.observe('arrow-left-small','mouseout',function(evt) {
		clearInterval(_SCROLL_TIMER);
	});
	Element.observe('arrow-right-small','mouseover',function(evt) {
		_SCROLL_TIMER = setInterval(function() { moveRight(-1); }, 5);
	});
	Element.observe('arrow-right-small','mouseout',function(evt) {
		clearInterval(_SCROLL_TIMER);
	});
	/*
	$('arrow-left-small').setOpacity(0.5);
	$('arrow-right-small').setOpacity(0.5);
	
	Element.observe('arrow-left-small', 'mouseover', function(evt) {
		$('arrow-left-small').setOpacity(1);
	});
	Element.observe('arrow-left-small', 'mouseout', function(evt) {
		$('arrow-left-small').setOpacity(0.5);
	});
	Element.observe('arrow-right-small', 'mouseover', function(evt) {
		$('arrow-right-small').setOpacity(1);
	});
	Element.observe('arrow-right-small', 'mouseout', function(evt) {
		$('arrow-right-small').setOpacity(0.5);
	});*/
}
function moveRight(direction) {
	db('mr:'+$('thumbnails-list').getStyle('left'));
	if (parseInt($('thumbnails-list').getWidth() + parseInt(pxToInt($('thumbnails-list').getStyle('left')))) > parseInt(document.viewport.getWidth())) {
		db('left: '+eval(pxToInt($('thumbnails-list').getStyle('left'))-1)+'px');
		$('thumbnails-list').setStyle({ left: eval(pxToInt($('thumbnails-list').getStyle('left'))-3)+'px' });
	}
	else {
		db('clearing interval');
		clearInterval(_SCROLL_TIMER);
	}
}
function moveLeft(direction) {
	db('w:'+$('thumbnails-list').getWidth());
	if (parseInt(pxToInt($('thumbnails-list').getStyle('left'))) < 0) {
		var l = eval(pxToInt($('thumbnails-list').getStyle('left')));
		l++;
		l++;
		l++;
		db('right: '+l+'px');
		$('thumbnails-list').setStyle({ left: l+'px' });
	}
	else {
		db('clearing interval');
		clearInterval(_SCROLL_TIMER);
	}
}
function getImageSize(imagepath) {

	
	var url = '/ajax/image-size.php';
	var d = new Ajax.Request(url, {
		method: 'get',
		parameters: { size: ((_BASE_SCREEN == _SCREENSIZE_LARGE) ? 'large': 'small'), path: imagepath },
		requestHeaders: { accept: 'application/x-json' },
		onSuccess: function(tp) {
			var jsr = tp.responseText.evalJSON();
			_PHOTO_AR = jsr.width / jsr.height;

			alert(jsr.width+' '+jsr.height);
		},
		onFailure: function() {}		
	});
}

function initPhoto() {

	var imagepath = '..'+$(_ID_PHOTO).src;
	var url = '/ajax/image-size.php';
	db('initPhoto');
	var d = new Ajax.Request(url, {
		method: 'get',
		parameters: { size: ((_BASE_SCREEN == _SCREENSIZE_LARGE) ? 'large': 'small'), path: imagepath },
		requestHeaders: { accept: 'application/x-json' },
		onSuccess: function(tp) {
			var jsr = tp.responseText.evalJSON();
			db('w: '+jsr.width+' h:'+jsr.height);
			_PHOTO_AR = jsr.width / jsr.height;

			_PHOTO_SIZE.width = jsr.width;
			_PHOTO_SIZE.height = jsr.height;

			db('att: updateDefaultOffsets');
			updateDefaultOffsets();
			db('comp: updateDefaultOffsets');
			
			
		},
		onFailure: function() {}		
	});
}