/**
 * @author Brian
 * Requires prototype, transitions
 * Handles requests for flickr images based on tags
 */
var isie = (navigator.userAgent.indexOf('MSIE') == -1)?false:true;

function object(o) {
    function F() {}
    F.prototype = o;
    return new F();
}

flickr = {
	defaultSearches:['waterdrop','aplusphoto','outstandingshots','specnature', 'abigfave', 'apophysis'],
	page:1,
	key:'',
	previewxml:[],
	pagesize:25,
	// TAKES XML AND CREATES PAGES
	paginate:function(xml, tagset){
		//split XML nodeset into sets that are the correct size
		//for each page now call tagset.createPage and pass it the reduced set.
	},
	refreshAds:function(){
		var IFs = document.getElementsByTagName('iframe');
		for(var i=0; i<IFs.length; i++){
			if(IFs[i].name.indexOf('google_ads_frame') == 0){
				IFs[i].src = IFs[i].src;
			}
		}
	},
	tagsets:{
		activeset:'',
		list:{},
		create:function(tag){
			
			if(!flickr.tagsets.list[tag]){
				// If this is not one of the default searches track it
				if(flickr.defaultSearches.toString().indexOf(tag) == -1){
					var savesearch = new Ajax.Request(
						'api/searches.php?action=save&text='+tag,
						{
							onSuccess:function(r){
								// Track this request with Urchin if possible
								// alert('saved Search');
							}
						}
					);
				}
				// Adds a pane to the accordian 
				var slider = interfaceElements[0].createPage(tag);
				Event.observe(slider.titlebar, 'click', function(e){
					if(flickr.key !== tag){
						flickr.key = tag;
						flickr.makeThumbnailPage(flickr.tagsets.list[tag].xmls[0]);
						flickr.showPageNumber(1);
					}
					return false;
				});
				// Get the XML for the tag 
				var nobj = {
					tag:tag,
					pages:0,
					xmls:[],
					createPage: function(){
						// Makes the next page in the current tag set
						flickr.tagsets.list[tag].pages++;
						var pagelink = document.createElement('li');
						pagelink.pagenum = flickr.tagsets.list[tag].pages;
						pagelink.innerHTML = flickr.tagsets.list[tag].pages;
						Event.observe(pagelink, 'click', function(e){
							flickr.makeThumbnailPage(pagelink.xml);
							flickr.showPageNumber(1);
							return false;
						});
						Event.observe(pagelink, 'mouseover', function(e){
							Element.addClassName(pagelink,'over');
							return false;
						});
						Event.observe(pagelink, 'mouseout', function(e){
							Element.removeClassName(pagelink,'over');
							return false;
						});
						$('tagul_'+tag).appendChild(pagelink);
						flickr.getPageByTag(tag, flickr.pagesize, pagelink.pagenum, pagelink);
					}
				}
				nobj.tagel = document.createElement('span');
				nobj.tagel.id = 'tag_'+tag;
				var keyname = document.createElement('span');
				//keyname.innerHTML = tag;
				var keyadd = document.createElement('div');
				keyadd.className = 'keyadd';
				keyadd.innerHTML = '>>';
				keyadd.tag = tag;
				Event.observe(keyadd, 'click', nobj.createPage.bindAsEventListener(this), false);
				keyname.appendChild(keyadd);
				nobj.pagelist = document.createElement('ul');
				nobj.pagelist.tag = tag;
				Element.addClassName(nobj.pagelist,'pagelist');
				Element.addClassName(nobj.pagelist,'clearfix');
				Event.observe(nobj.tagel, 'mouseover', function(e){
					Element.addClassName(nobj.tagel,'over');
					return false;
				});
				Event.observe(nobj.tagel, 'mouseout', function(e){
					Element.removeClassName(nobj.tagel,'over');
					return false;
				});
				nobj.pagelist.id = 'tagul_'+tag;
				nobj.tagel.appendChild(keyname);
				nobj.tagel.appendChild(nobj.pagelist);
				slider.appendContent(nobj.tagel);
				nobj.accordian = slider;
				flickr.tagsets.list[tag] = nobj;
				flickr.tagsets.list[tag].createPage();
			}
		}
	},
	init:function(el){
		Event.observe($('flickrtag'), 'keypress', function(e){
			if(window.event && window.event.keyCode == 13){
				flickr.tagsets.create($F('flickrtag'));
				return false;
			}
		})
		this.libraryparent = (el)?$(el):$('imagedisplay');
		if(typeof qs.vars['tag'] == 'undefined')  {
			flickr.tagsets.create(flickr.defaultSearches[parseInt(Math.random()*flickr.defaultSearches.length)]);
		} else {
			flickr.tagsets.create(qs.vars['tag']);
		}
		this.displaytabs = flickr.libraryparent.parentNode.getElementsByTagName('ul')[0];
		flickr.clientStore.parse();
	},
	makeThumbnailPage:function(xml) {
		var page = document.createElement('div');
		if($('detailfloater')) $('content').removeChild($('detailfloater'));
		var pagecount = this.libraryparent.childNodes.length;
		page.className = 'page';
		
		var cos = xml.responseXML.getElementsByTagName("photo");
		if(cos.length == 0) {
			window.status='no slides match your query';
			return;
		}
		for(p=0; p<cos.length; p++){
			var thisThumb = flickr.makeThumb(cos[p]);
			page.appendChild(thisThumb);
		}
		// make each of the thumbnails link to it's detail
		flickr.currentLibrary = page.childNodes;
		$A(flickr.currentLibrary).each(function(el){
			Event.observe(el, 'click', function(e){
				if(flickr.currentThumb)Element.removeClassName(flickr.currentThumb,'current');
				flickr.showDetails(el, el.previousSibling, el.nextSibling);
				flickr.currentThumb = el;
				Element.addClassName(el,'current');
			});
			
		});
		this.libraryparent.appendChild(page);

	},
	makeThumb:function(asset) {
		var photo = document.createElement('img');
		photo.title = asset.getAttribute('title');
		var photoElem = document.createElement('div');
		photoElem.className = 'flickrphoto';
		photo.src = 'http://static.flickr.com/' + asset.getAttribute('server') + '/' + asset.getAttribute('id') + '_' + asset.getAttribute('secret') + '_s.jpg'
		photo.id = 'flickr'+asset.getAttribute('id');
		photoElem.xml = asset;
		photoElem.appendChild(photo);
		return photoElem
	},
	showDetails:function(img){// this method is WAAAAAY too long
		var prev = img.previousSibling;
		var next = img.nextSibling;
		if(flickr.floater && flickr.floater.parentNode) flickr.floater.parentNode.removeChild(flickr.floater);
		imgxml = img.xml
		var thisimg = {
			lsrc:'http://static.flickr.com/' + imgxml.getAttribute('server') + '/' + imgxml.getAttribute('id') + '_' + imgxml.getAttribute('secret') + '.jpg',
			flickrid:imgxml.getAttribute('id'),
			secret:imgxml.getAttribute('secret'),
			owner:imgxml.getAttribute('id'),
			ptitle:imgxml.getAttribute('title'),
			server:imgxml.getAttribute('server'),
			ispublic:imgxml.getAttribute('ispublic'),
			isfriend:imgxml.getAttribute('isfriend'),
			isfamily:imgxml.getAttribute('isfamily')
		}
		flickr.floater = document.createElement('div');
		flickr.floater.id = 'detailfloater';
		Element.addClassName(flickr.floater,'floater');
		$('content').appendChild(flickr.floater);
		var imginfo = document.createElement('div');
		imginfo.className = 'imginfo';
		imginfo.id = 'imginfo';
		flickr.floater.appendChild(imginfo);
		
		// BUILD THUMBNAIL FOR INSIDE THE INFO PANE
		var thumb = document.createElement('img');
		thumb.src = img.getElementsByTagName('img')[0].src;
		thumb.title = 'View this image at Flickr.';
		thumb.alt = 'View this image at Flickr.';
		thumb.style.cursor = 'pointer';
		thumb.style.display='block';
		thumb.className = 'thumbnail';
		flickr.getImageInfo(thisimg.flickrid, thisimg.secret, function(r){
			Event.observe(thumb, 'click', function(){
					window.open(getNodeText(r.responseXML.getElementsByTagName('url')[0]));
				}
			)
			var title = document.createElement('div');
			Element.addClassName(title,'title');
			var titletext = getNodeText(r.responseXML.getElementsByTagName('title')[0])
			title.innerHTML = (titletext == '')?'Untitled':titletext;
			Event.observe(title, 'click', function(){
				flickr.addToFavs(img);
			})
			var owner = document.createElement('div');
			Element.addClassName(owner,'owner');
			owner.href=getNodeText(r.responseXML.getElementsByTagName('url')[0]);
			owner.target='_blank';
			owner.innerHTML = r.responseXML.getElementsByTagName('owner')[0].getAttribute('username');
			Event.observe(owner, 'click', function(){
					//window.open(getNodeText(r.responseXML.getElementsByTagName('url')[0]));
				}
			)
			
			var desctext=getNodeText(r.responseXML.getElementsByTagName('description')[0]);
			var desc = document.createElement('div');
			Element.addClassName(desc,'description');
			desc.innerHTML = (desctext == '')?'No description provided.':desctext;
			imginfo.appendChild(title);
			imginfo.appendChild(owner);
			imginfo.appendChild(thumb);
			imginfo.appendChild(desc);
			// ------------------------------ MAKE TAG LIST METHOD?? //
			taglist = flickr.makeTagList(r.responseXML.getElementsByTagName('tag'))
			imginfo.appendChild(taglist);
			var preview = document.createElement('div');
			preview.className = 'preview';
			preview.id = 'detailpreview';
			imginfo.appendChild(preview);
			//
		});
		if(next){
			var nextImage = flickr.makeThumb(next.xml);
			Element.addClassName(nextImage,'next');
			nextImage.onclick=function(){
				Element.removeClassName(flickr.currentThumb,'current');
				flickr.currentThumb = next;
				Element.addClassName(next,'current');
				flickr.showDetails(next, img, next.nextSibling)
			}
			flickr.floater.appendChild(nextImage);
		}
		if(prev){
			var prevImage = flickr.makeThumb(prev.xml);
			Element.addClassName(prevImage,'previous');
			prevImage.onclick=function(){
				Element.removeClassName(flickr.currentThumb,'current');
				flickr.currentThumb = prev;
				Element.addClassName(prev,'current');
				flickr.showDetails(prev, prev.previousSibling, img)
			}
			flickr.floater.appendChild(prevImage);
		}
		
		var thumbslink = document.createElement('img');
		thumbslink.id = 'tothumbs';
		thumbslink.src = 'images/tothumbs.png';
		Event.observe(thumbslink, 'click', function(){
			$('content').removeChild(flickr.floater);
		});
		Event.observe(thumbslink, 'mouseover', function(){
			bblib.transitions.yPos(thumbslink, {finish:-5})
		});
		Event.observe(thumbslink, 'mouseout', function(){
			bblib.transitions.yPos(thumbslink, {finish:-18})
		});
		flickr.floater.appendChild(thumbslink);
		
		flickr.floater.style.backgroundImage='url(' + thisimg.lsrc + ')';
		Event.observe(imginfo, 'mouseover', function(e){
			if($('imginfo')) bblib.transitions.height($('imginfo'), {finish:385, speed:3});
			var mytags = $A($('infotaglist').getElementsByTagName('li'));
			// Get XML for each of the tags in this image
			if(!$('infotaglist').loaded && mytags.length > 0){
				mytags.each(function(el){
					if(!flickr.previewxml[el.querytext]){
						$('infotaglist').loaded = true;
						flickr.getTagListXML(el.querytext,6,1,function(r){
							el.xml = r;
						})
					} else {
						el.xml = flickr.previewxml[el.querytext]
					}
				});
			}
		});
		Event.observe(imginfo, 'mouseout', function(e){
			if($('imginfo')) bblib.transitions.height($('imginfo'), {finish:28, speed:3});
		});
		//Set the top of the new pane to the right spot
		$(imginfo).style.height = '28px'
		bblib.transitions.height($('imginfo'), {finish:28, speed:10});
	},
	/*
	 * Make list of tags from a nodeset...used in the photo details display
	 */
	makeTagList:function(tagnodes){
		var tagset = [];
		var taglist = document.createElement('ul');
		taglist.id = 'infotaglist';
		for(var t=0; (t<tagnodes.length && t<5); t++){
			var tag = document.createElement('li');
			tag.querytext = getNodeText(tagnodes[t]);
			tag.id = 'previewtag'+tag.querytext;
			tag.innerHTML = tagnodes[t].getAttribute('raw');
			taglist.appendChild(tag);
			Event.observe(tag, 'click', function(e){
				flickr.tagsets.create(Event.element(e).querytext);
			})
			Event.observe(tag, 'mouseover', function(e){
				$('detailpreview').style.display = 'block';
				Element.addClassName(Event.element(e), 'over')
				if(Event.element(e).xml){
					$('detailpreview').innerHTML = '';
						var imageList = Event.element(e).xml.responseXML.getElementsByTagName('photo');
						var description = document.createElement('div');
						description.innerHTML = 'TAG: '+ Event.element(e).innerHTML + ' - Total Images:'+Event.element(e).xml.responseXML.getElementsByTagName('photos')[0].getAttribute('total');
						$('detailpreview').appendChild(description);
						for(var i=0; i<imageList.length; i++){
							var thisthumb = flickr.makeThumb(imageList[i]);
							$('detailpreview').appendChild(thisthumb);
						}
				} else {
					$('detailpreview').innerHTML = 'Loading '+Event.element(e).querytext+'...';
				}
			});
			Event.observe(tag, 'mouseout', function(e){
				//$('detailpreview').innerHTML = '';
				Element.removeClassName(Event.element(e), 'over');
				//$('detailpreview').style.display = 'none';
			});
			tagset.push(tagnodes[t].getAttribute('raw'));
		}
		return taglist;		
	},
	getPageByTag:function(k,n,p,li){
		if($('detailfloater')) $('content').removeChild($('detailfloater'));
		flickr.showLoading(k);
		flickr.getTagListXML(k,n,p,function(r){
				flickr.hideLoading();
				if(r.responseXML.getElementsByTagName('err').length > 0){
					var errdiv = document.createElement('div');
					errdiv.align='center'
					errdiv.innerHTML = r.responseXML.getElementsByTagName('err')[0].getAttribute('msg');
					flickr.libraryparent.appendChild(errdiv);
				}else{
					li.xml = r;
					flickr.makeThumbnailPage(r);
					flickr.tagsets.list[k].xmls.push(r);
					flickr.showPageNumber(1);
					var count = r.responseXML.getElementsByTagName('photos')[0].getAttribute('total');
					flickr.tagsets.list[k].accordian.setTitle(k+' <span class="count">'+count + ' photos</span>')
				}
			}
		);
	},
	showPageNumber:function(n){
		var pages = $A(this.libraryparent.childNodes);
		
		pages.each(function(el){
			var newLeft = el.offsetLeft - 492;
			//$(el).setOpacity(opacity);
			if(flickr.libraryparent.childNodes.length > 1) flickr.libraryparent.removeChild(flickr.libraryparent.childNodes[0])
			bblib.transitions.opacity(el, {finish:100})
			//bblib.transitions.xPos(el, {finish:newLeft, speed:2})
		});

	},
	getTagListXML:function(k,n,p,oncomplete){
		var pagenum = (p)?p:1;
		flickr.key = k;
		var nmbr = (n)?n:flickr.pagesize;
		var keys = (k)?k:'blue';
		var photolist = new Ajax.Request(
			'fetchr.php?method=flickr.photos.search&per_page='+nmbr+'&tags='+keys+'&page='+pagenum+'&tag_mode=any&extras=owner_name',
			{
				onSuccess:function(r){
					//Track this request with Urchin if possible
					try {
						urchinTracker('/' + flickr.key + '/thumbs/' + pagenum);
					} catch(err){
						// do nothing
					}
					flickr.refreshAds();
					oncomplete(r);
				}
			});
	},
	getImageInfo:function(flickrid, secret, oncomplete){
		var photoinfo = new Ajax.Request(
			'fetchr.php?method=flickr.photos.getinfo&photo_id='+flickrid+'&secret='+secret,
			{
				onSuccess:function(r){
					//Track this request with Urchin
					try{
						urchinTracker('/imageinfo/'+flickrid);
					} catch(err){
						// do nothing
					}flickr.refreshAds();
					oncomplete(r);
				}
			});
	},
	writeRecommended:function(tags){
		var recommendedList = $('popular');
		recommendedList.innerHTML = '';
		for(var t=0; t<tags.length; t++){
			var listitem = document.createElement('li');
			var link = document.createElement('a');
			link.innerHTML = tags[t].display + ' ('+tags[t].count+')';
			link.tagtext = tags[t].text;
			link.href = '#';
			link.onclick = function(){flickr.tagsets.create(this.tagtext)}
			listitem.appendChild(link);
			recommendedList.appendChild(listitem);
		}
	},
	showLoading:function(tag){		
		if(document.getElementsByClassName('floater', $('content')).length != 0){	
			$('content').removeChild(flickr.floater);
		}
		var queryTerm = (tag)?tag:'';
		if(!flickr.loadingDiv){
			flickr.loadingDiv = document.createElement('div');
			flickr.loadingDiv.id = 'loadingdiv';
			flickr.libraryparent.parentNode.appendChild(flickr.loadingDiv);
		}
		flickr.loadingDiv.innerHTML = 'loading '+ tag;
		flickr.loadingDiv.style.display = 'block';
	},
	hideLoading:function(){
		if(flickr.loadingDiv){
			flickr.loadingDiv.style.display = 'none';
		}
	},	
	addToFavs:function(el){
			var theclone = flickr.makeThumb(el.xml);
			theclone.onclick=function(){
				flickr.showDetails(theclone, theclone.previousSibling, theclone.nextSibling);
			}
			$('favorites').appendChild(theclone);
			currfavs = (flickr.clientStore.get('favorites') != null)?flickr.clientStore.get('favorites'):'';
			flickr.clientStore.set('favorites', currfavs + '|' + el.xml.getAttribute('id') + ':' + el.xml.getAttribute('secret'));
	}
}
function getNodeText(node){
	if(node.childNodes.length && node.firstChild.nodeValue){
		return node.firstChild.nodeValue
	}
	return ''
}

function hideWidgets(){
	var widgets = bblib.isClass('popular','div');
	widgets.each(function(a){
		bblib.transitions.height(a,{finish:200});
		bblib.transitions.opacity(a,{finish:100});
		 Event.observe(a.getElementsByTagName('div')[0], 'click', function(e){
			var t = e.target?e.target:e.srcElement;
			if(t.nodeName.toLowerCase() != 'input' && t.nodeName.toLowerCase() != 'button'){
				while(t.className.indexOf('widget') == -1 && t.parentNode.nodeName.toLowerCase() != 'body') t=t.parentNode;
				if(t.transHeight) clearTimeout(t.transHeight);
				(Element.getHeight(t) <= 30)?
					bblib.transitions.height(t, {speed:2,finish:200}):
					bblib.transitions.height(t, {speed:2,finish:25})  
			}
		});		
	});
}

qs = {
	pairs:document.location.search.substring(1).split('&'),
	vars:[],
	init:function(){
		qs.pairs.each(function(p){
			var tmp=p.split('=');
			if(tmp.length == 2) qs.vars[tmp[0]] = tmp[1];		
		})
	}
}
qs.init();


function getNodeHTML(node){
	if(node){
		if(node.nodeType == 3){
			var resultElement = document.createTextNode(node.nodeValue);
		} else if(node.nodeType == 1) {
			var resultElement = document.createElement(node.nodeName);
			if(node.childNodes && node.childNodes.length > 0){
				for(var n=0; n<node.childNodes.length; n++){
					resultElement.appendChild(getNodeHTML(node.childNodes[n]));
				}
			}		
			if(node.attributes && node.attributes.length > 0){
				for(var a=0; a<node.attributes.length; a++){
					if(node.attributes[a].nodeName.toLowerCase() != 'style'){
						var attNode = document.createAttribute(node.attributes[a].nodeName);
						attNode.nodeValue = node.getAttribute(node.attributes[a].nodeName);
						resultElement.setAttributeNode(attNode);
					}
				}
			}
		}
		return resultElement;
	}
}
flickr.go = function(){
		setTimeout("hideWidgets()", 1500);
		interfaceElements = [];
		var accs = document.getElementsByClassName('accordian', $('structurebody'));
		for(var a=0; a<accs.length; a++){
			interfaceElements.push(
				new bblib.accordianDisplay(accs[a],{height:75, speed:5})
			)
		}
		/*
		flickr.tagcloud = bblib.tagcloud.create(false, null, function(){
			var recommended = flickr.tagcloud.getTop(7);
			flickr.writeRecommended(recommended)
		});
		*/
		flickr.init('imagedisplay');
	}

Event.observe(window,'load', flickr.go)


//