/*

If you want to use the code below, feel free.  But if you do, please
let me know.  Thanks!

-Andrew, andrew@hedges.name

*/
var photoBlinds = {
	proxy: '/common/proxy.php?src=',
	src: 'http://www.zooomr.com/services/feeds/public_photos/?id=29821@Z01&format=rss_200',
/* 	src: 'http://api.flickr.com/services/feeds/photos_public.gne?id=51208828@N00&lang=en-us&format=rss_200', */
	captions: [],
	duration: {
		blind: 350,
		caption: 250
	},
	templates: {
		img: new Template('<img onmouseover="photoBlinds.list.setHilited(#{num});" onmouseout="photoBlinds.list.setUnhilited(#{num});" onclick="photoBlinds.photo.goto(#{num});" src="#{src}" alt="#{alt}" title="#{title}">'),
		li: new Template('<li id="li-#{num}"><a onmouseover="photoBlinds.photo.setHilited(#{num});" onmouseout="photoBlinds.photo.setUnhilited(#{num});" onclick="photoBlinds.photo.goto(#{num});">#{num}</a></li>'),
		div: '<div id="photo-blinds-caption"></div>',
		caption: new Template('#{title} &#8211; <em>#{pubDate}</em>')
	},
	init: function () {
		photoBlinds.xml.request();
	},
	xml: {
		request: function () {
			new Ajax.Request(
				photoBlinds.proxy + encodeURIComponent(photoBlinds.src), {
				method: 'get',
				onSuccess: function (transport) {
					var xml = transport.responseXML;
					photoBlinds.xml.process(xml);
				},
				onFailure: function () {
					$('photo-blinds').innerHTML = '<p>There was a problem loading the photos.</p>';
				}
			});
		},
		process: function (xml) {
			var clone = $('photo-blinds').cloneNode(false);
			$('photo-blinds').parentNode.replaceChild(clone, $('photo-blinds'));
			var num = 1;
			var values, items = $A(xml.getElementsByTagName('item'));
			items.each(function (item) {
				values = photoBlinds.xml.getValues(item);
				values.num = num;
				photoBlinds.photo.add(values);
				photoBlinds.caption.add(values);
				photoBlinds.list.add(num);
				++num;
			});
			$('photo-blinds').innerHTML += photoBlinds.templates.div;
			photoBlinds.photo.goto(1);
			$('photo-blinds-nav').firstChild.firstChild.setStyle({borderLeft: 'solid 1px black'});
			photoBlinds.caption.init();
		},
		getValues: function (item) {
			var content, src, title, alt, pubDate;
			content = item.getElementsByTagName('content');
			if (0 === content.length) {
				content = item.getElementsByTagName('media:content');
			}
			if (0 === content.length) {
				return {};
			}
			src = content[0].getAttribute('url');
			src = src.replace(/_m.jpg/, '.jpg');
			title = item.getElementsByTagName('title');
			alt = title[0].firstChild.nodeValue;
			pubDate = item.getElementsByTagName('pubDate');
			pubDate = pubDate[0].firstChild.nodeValue
			return {src: src, alt: alt, title: alt, pubDate: pubDate};
		}
	},
	photo: {
		add: function (values) {
			var img = photoBlinds.templates.img.evaluate({src: values.src, alt: values.alt, title: values.title, num: values.num});
			$('photo-blinds').innerHTML += img;
		},
		goto: function (num) {
			photoBlinds.list.setSelected(num);
			var fromImg, toImg, imgs = $('photo-blinds').immediateDescendants();
			toImg = imgs[num - 1];
			photoBlinds.caption.set(num - 1);
			imgs = imgs.without(imgs[num - 1]);
			imgs.each(function (img) {
				if (500 == img.getWidth()) {
					fromImg = img;
				}
			});
			photoBlinds.photo.blind(fromImg, toImg);
		},
		blind: function (fromImg, toImg) {
			var animator = new Animator({duration: photoBlinds.duration.blind})
				.addSubject(new NumericalStyleSubject(fromImg, 'width', 500, 10))
				.addSubject(new NumericalStyleSubject(toImg, 'width', 10, 500))
				.addSubject(new NumericalStyleSubject(fromImg, 'opacity', 1.0, 0.25))
				.addSubject(new NumericalStyleSubject(toImg, 'opacity', 0.25, 1.0))
			;
			animator.seekTo(1);
		},
		setHilited: function (num) {
			var imgs = $('photo-blinds').immediateDescendants();
			imgs.each(function (img) {
				img.className = '';
			});
			imgs[num - 1].className = 'hovered';
		},
		setUnhilited: function (num) {
			var imgs = $('photo-blinds').immediateDescendants();
			imgs[num - 1].className = '';
		}
	},
	caption: {
		animator: undefined,
		bound: {
			show: undefined,
			hide: undefined
		},
		init: function () {
			photoBlinds.caption.animator = new Animator({
				duration: photoBlinds.duration.caption
			}).addSubject(new NumericalStyleSubject($('photo-blinds-caption'), 'top', 375, 343));
			photoBlinds.caption.bound.show = photoBlinds.caption.show.bindAsEventListener();
			photoBlinds.caption.bound.hide = photoBlinds.caption.hide.bindAsEventListener();
			$('photo-blinds').observe('mouseover', photoBlinds.caption.bound.show);
			$('photo-blinds-nav').observe('mouseover', photoBlinds.caption.bound.show);
		},
		add: function (values) {
			var caption, pubDate = (values.pubDate.toDate()).format();
			caption = photoBlinds.templates.caption.evaluate({title: values.title, pubDate: pubDate});
			photoBlinds.captions[photoBlinds.captions.length] = caption;
		},
		set: function (idx) {
			$('photo-blinds-caption').innerHTML = photoBlinds.captions[idx];
		},
		show: function (event) {
			$('photo-blinds').stopObserving('mouseover', photoBlinds.caption.bound.show);
			$('photo-blinds-nav').stopObserving('mouseover', photoBlinds.caption.bound.show);
			$('photo-blinds').observe('mouseout', photoBlinds.caption.bound.hide);
			$('photo-blinds-nav').observe('mouseout', photoBlinds.caption.bound.hide);
			photoBlinds.caption.animator.seekTo(1);
		},
		hide: function (event) {
			$('photo-blinds').stopObserving('mouseout', photoBlinds.caption.bound.hide);
			$('photo-blinds-nav').stopObserving('mouseout', photoBlinds.caption.bound.hide);
			$('photo-blinds').observe('mouseover', photoBlinds.caption.bound.show);
			$('photo-blinds-nav').observe('mouseover', photoBlinds.caption.bound.show);
			photoBlinds.caption.animator.seekTo(0);
		}
	},
	list: {
		add: function (num) {
			$('photo-blinds-nav').innerHTML += photoBlinds.templates.li.evaluate({num: num});
		},
		setSelected: function (num) {
			$('li-' + num).className = 'pb-open';
			$('li-' + num).siblings().each(function (li) {
				li.className = '';
			});
		},
		setHilited: function (num) {
			$('li-' + num).firstChild.className = 'hovered';
			$('li-' + num).siblings().each(function (li) {
				li.firstChild.className = '';
			});
		},
		setUnhilited: function (num) {
			$('li-' + num).firstChild.className = '';
		}
	}
};