var targetX, targetY;
var tagCounter = 0;
var taggingOn = 0;

function get_cookie ( cookie_name )
{
	var results = document.cookie.match ( '(^|;) ?' + cookie_name + '=([^;]*)(;|$)' );

	if ( results )
		return ( unescape ( results[2] ) );
	else
		return null;
}

function sortByName(a, b) {
	var x = a.name.toLowerCase();
	var y = b.name.toLowerCase();
	return ((x < y) ? -1 : ((x > y) ? 1 : 0));
}

function callPublish(msg, attachment, action_link) {
  FB.ensureInit(function () {
    FB.Connect.streamPublish('', attachment, action_link);
  });
}

function tagPhoto() {
	$('#fancybox-left').hide();
	$('#fancybox-right').hide();

	$('#tags-header').fadeOut('slow', function() {
		$('#tags-instructions').fadeIn('slow', function() {
			setupTagging();
		});
	});
}

function tagPhotoFB() {
	FB.getLoginStatus(function(response) {
	  if (response.session) {
		tagPhoto();
	  } else {
		FB.login(function(response) {
		  if (response.session) {
		    if (response.perms) {
				// Check and store auth token if it doesn't currently exist
				var fb_cookie = get_cookie ("fbs_134833616551761");

				$.post('/ajax.php', {
					cookie: fb_cookie,
					action: 'store_token'
				}, function(data) {
						tagPhoto();	
				})			
		    } else {
				alert('Error, you must grant the required permissions, please try again.');
		    }
		  } else {
		    // user is not logged in
		  }
		}, {perms:'publish_stream,offline_access,user_photos,photo_upload,email'});
	  }
	});
}

function doneTagging() {
	closeTagInput();

	$('#tags-instructions').fadeOut('slow', function() {
		$('#tags-header').fadeIn('slow');
	});
	
	$('#fancybox-left').show();
	$('#fancybox-right').show();
	$('#tag-wrapper').unbind();
}

function closeFancyBox() {
	window.location = '#';
}

function uploadPhoto() {
	var tagger = 0;

	FB.getLoginStatus(function(response) {
		if (response.session) {
			tagger = FB.getSession().uid;
		}
	})

	image_src = $('#fancybox-img').attr('src');

	$('#uploadPhotoFB').fadeOut('slow', function() {
		$('#uploadPhotoFB').html('Uploading.. <img src="/spinner.gif" width="16" height="16">');
		
		$('#uploadPhotoFB').fadeIn('slow', function() {
			$.post('/ajax.php', {
				picture_id: current_image,
				url: current_url_full,
				title: document.title,
				tagger: tagger,
				picture: image_src,
				action: 'upload_photo'
			}, function(data) {
				$('#uploadPhotoFB').fadeOut('slow', function() {
					if (data != '') {
						$('#uploadPhotoFB').html('Uploaded!');
					}
					else {
						$('#uploadPhotoFB').html('Error! <a href="javascript:uploadPhotoFB()">Try again?</a>');
					}
					
					$('#uploadPhotoFB').fadeIn('fast');
				})
			});			
		});
	})
}

function uploadPhotoFB() {
	FB.getLoginStatus(function(response) {
	  if (response.session) {
		uploadPhoto();
	  } else {
		FB.login(function(response) {
		  if (response.session) {
		    if (response.perms) {
				// Check and store auth token if it doesn't currently exist
				var fb_cookie = get_cookie ("fbs_134833616551761");

				$.post('/ajax.php', {
					cookie: fb_cookie,
					action: 'store_token'
				}, function(data) {
						uploadPhoto();
				})			
		    } else {
				alert('Error, you must grant the required permissions, please try again.');
		    }
		  } else {
		    // user is not logged in
		  }
		}, {perms:'publish_stream,offline_access,user_photos,photo_upload,email'});
	  }
	});
}

function updateTaggedFriends(id, name, NSIID, NSID, checked) {
	tagger = FB.getSession().uid;

	image_src = $('#fancybox-img').attr('src');
	
	closeTagInput();

	$.post('/ajax.php', {
		picture_id: current_image,
		url: current_url_full,
		title: document.title,
		tagger: tagger,
		tagged: id,
		name: name,
		x: targetX,
		y: targetY,
		image_src: image_src,
		action: 'save_tag'
	}, function(id) {
		submitTag(name, targetX, targetY, id, 1);

		$("#checkboxes input:checkbox").each(function() {
			this.checked = false;
		});

		refreshFBColumn();
	});
}

function setupTagging() {
	if (!taggingOn) {
		//Append #tag-target content and #tag-input content
		var list_of_friends = $('#fb_friends').html();

		$("#tag-wrapper").append('<div id="tag-target"></div><div id="tag-input" style="width:190px;height:250px;"><form name="tagform"><div id="facebook-friends">' + list_of_friends + '</div><br/><button type="submit">Done Tagging</button></form></div>');

		//If submit button is clicked
		$('button[type="submit"]').click(function(){
			// submitTag();
			closeTagInput();
			doneTagging();
			return false;
		});
	
		taggingOn = 1;
	}

	$("#tag-wrapper").click(function(e){
		//Determine area within element that mouse was clicked
		mouseX = e.pageX - $("#tag-wrapper").offset().left;
		mouseY = e.pageY - $("#tag-wrapper").offset().top;

		imageWidth = $("#fancybox-inner").outerWidth();
		imageHeight = $("#fancybox-inner").outerHeight();

		//Get height and width of #tag-target
		targetWidth = $("#tag-target").outerWidth();
		targetHeight = $("#tag-target").outerHeight();
	
		//Determine position for #tag-target
		targetX = mouseX-targetWidth/2;
		targetY = mouseY-targetHeight/2;
	
		//Determine position for #tag-input
		inputX = mouseX+targetWidth/2;
		inputY = mouseY-targetHeight/2;

		// Change the location if box is too close to the border
		if (imageWidth - inputX < 200) {
			inputX -= 308;
		}

		if (imageHeight - inputY < 255) {
			inputY -= 260;
		}
		else if (inputY < 10) {
			inputY += 108;
		}

		//Animate if second click, else position and fade in for first click
		if($("#tag-target").css("display")=="block")
		{
			$("#tag-target").animate({left: targetX, top: targetY}, 500);
			$("#tag-input").animate({left: inputX, top: inputY}, 500);
		} else {
			$("#tag-target").css({left: targetX, top: targetY}).fadeIn();
			$("#tag-input").css({left: inputX, top: inputY}).fadeIn();
		}	
	});
}

function loadTags() {
	taggingOn = 0;
	tagCounter = 0;

	//Dynamically wrap image
	$("#fancybox-img").wrap('<div id="tag-wrapper"></div>');

	//Dynamically size wrapper div based on image dimensions
	$("#tag-wrapper").css({width: $("#fancybox-inner").outerWidth(), height: $("#fancybox-inner").outerHeight()});

	$('#tags').html('Loading tags.. <img src="/spinner.gif" width="16" height="16">');

	var facebook_id = 0;

	FB.getLoginStatus(function(response) {
		if (response.session) {
			facebook_id = FB.getSession().uid;
		}
	})

	$.post('/ajax.php', {
		picture_id: current_image,
		facebook_id: facebook_id,
		action: 'get_tags'
	}, function(data) {
		if (data.number == 0) {
			$('#tags').html("<a href='javascript:tagPhotoFB();'>Someone you know? Click here to tag 'em!</a>");
		}
		else {
			$.each(data.people, function(index, value) {
				submitTag(value.name, value.x, value.y, value.id, value.remove);
			});	
		}
	}, 'json');
}

function submitTag(name, x, y, id, remove)
{
	tagValue = name;

	if (tagCounter == 0) {
		$('#tags').html('');
	}
	else if (tagCounter >= 1) {
		$('.hotspot-list:last').append(', ');
	}

	//Adds a new list item below image. Also adds events inline since they are dynamically created after page load
	var tagString = '<span id="hotspot-item-' + tagCounter + '" class="hotspot-list" onmouseover="showTag(' + tagCounter + ')" onmouseout="hideTag(' + tagCounter + ')">' + tagValue;

	if (remove == 1) {
		tagString = tagString + ' <span class="remove" onclick="removeTag(' + tagCounter + ',' + id + ')" onmouseover="showTag(' + tagCounter + ')" onmouseout="hideTag(' + tagCounter + ')">(Remove)</span>';
	}

	tagString = tagString + '</span>';

	$('#tags').append(tagString);
	
	//Adds a new hotspot to image
	$("#tag-wrapper").append('<div id="hotspot-' + tagCounter + '" class="hotspot" style="left:' + x + 'px; top:' + y + 'px;"><span>' + tagValue + '</span></div>');

	tagCounter++;
	closeTagInput();
}


function closeTagInput()
{
	$("#tag-target").fadeOut();
	$("#tag-input").fadeOut();
}

function removeTag(i, id)
{
	$.post('/ajax.php', {
		id: id,
		action: 'remove_tag'
	}, function(data) {
		$("#hotspot-item-"+i).fadeOut('fast', function() {
			$("#hotspot-item-"+i).remove();

			$("#hotspot-"+i).fadeOut('fast', function() {
				$("#hotspot-"+i).remove();

				if ($('#tags').html() == '') {
					$('#tags').html("<a href='javascript:tagPhotoFB();'>Someone you know? Click here to tag 'em!</a>");
				}

				refreshFBColumn();
			});
		});
	});
}

function showTag(i)
{
	$("#hotspot-"+i).addClass("hotspothover");
}

function hideTag(i)
{
	$("#hotspot-"+i).removeClass("hotspothover");
}

function storeFriends() {
	$('#fb_friends').html('');
	FB.api('/me/friends', function(response) {
		var _friend_data = response.data.sort(sortByName);
		$.each(_friend_data, function(index, value) {
			$('#fb_friends').append('<div id="checkboxes"><input type="checkbox" name="tagged" value="' + value.id + '" onchange="updateTaggedFriends(\'' + value.id + '\', \'' + value.name + '\', \'' + 0 + '\', \'' + 5 + '\', this.checked)"> ' + value.name + '<br/></div><div style="clear: left;">');
		});
	});
}

function refreshFBColumn() {
	$('#fb_column').fadeOut('fast', function() {
		$.post('/ajax.php', {
			url: document.URL,
			action: 'fb_column'
		}, function (data) {
			$('#fb_column').html(data);
			$('#fb_column').fadeIn('fast');
		});		
	});
}

$(document).ready(function(){ 
	$('#bannerRight').append('<div id="fb_column" style="width: 120px;"></div>');

	refreshFBColumn();

	FB.init({appId: '134833616551761', status : true, cookie: true, xfbml: true});

	FB.Event.subscribe('auth.login', function(response) {
		// Once the user has logged in, store their friend list 
		storeFriends();
		// window.top.location = 'http://local.djhere.com/facebook/authorize.php';
	});

	FB.getLoginStatus(function(response) {
		if (response.session) {
			storeFriends();
		}
	})

	if (jQuery.support.opacity) {
		$('.image img, #nav ul li a, #logo, #footer ul li a, #pagePromo li a, .press a').hover(function() {
			$(this).stop().fadeTo(200, .7);
		}, function() {
			$(this).stop().fadeTo(200, 1);
		});
	}

	$('.sf-navbar').superfish({ autoArrows: false, dropShadows: false});

	$(".fancybox").fancybox({ 'overlayOpacity': 0.75, 'titlePosition': 'inside', 'onComplete': loadTags, 'onCleanup': closeFancyBox, titleFormat: imageLinks }); 
	$("#press a, .thickbox").fancybox({ 'overlayOpacity': 0.75 }); 
	$(".fancyframe, #menu-item-476 a").fancybox({ 'overlayOpacity': 0.75, 'width': 760, 'height': 760, 'type': 'iframe', 'hideOnContentClick' :   false }); 

	var galleryAnchor = self.document.location.hash.substring(1);

	if (galleryAnchor) {
		$("." + galleryAnchor).trigger('click');
	}

	var scrollPane = $('#eventScroller');
	var scrollContent = $('#eventScrollerList');

	$( "#eventScrollerSlider" ).slider({
			slide:function(e, ui){
				if( scrollContent.width() > scrollPane.width() ){ scrollContent.css('margin-left', Math.round( ui.value / 100 * ( scrollPane.width() - scrollContent.width() )) + 'px'); }
				else { scrollContent.css('margin-left', 0); }
			}
  	});

	$('#eventScrollRight').click(function() {

		var scrollBarLocation = parseInt($( "#eventScrollerSlider a" ).css('left'))+5;

		if (scrollBarLocation > 94) scrollBarLocation = 100;

		$( "#eventScrollerSlider a" ).css('left', scrollBarLocation + '%');
		scrollContent.css('margin-left', Math.round( scrollBarLocation / 100 * ( scrollPane.width() - scrollContent.width() )) + 'px');
	});

	$('#eventScrollLeft').click(function() {
		var scrollBarLocation = parseInt($( "#eventScrollerSlider a" ).css('left'))-5;

		if (scrollBarLocation < 4) scrollBarLocation = 0;

		$( "#eventScrollerSlider a" ).css('left', scrollBarLocation + '%');
		scrollContent.css('margin-left', Math.round( scrollBarLocation / 100 * ( scrollPane.width() - scrollContent.width() )) + 'px');
	});

	$('.tooltip').tipsy({html: true, fade: true, delayOut: 1500 });

/*
	$('#slides').empty().flash({
		src: '/wp-content/themes/djheretheme/media/RSS_trio.swf',
		width:850,
		height:250,
		wmode: 'transparent'
	});
*/

	// hiding the element doesn't work
	$('.image a span, a.homegallery span, #eventScrollerList li span').fadeTo(0, 0);

	$('a.homegallery, #eventScrollerList li').hover(function(){
		$('span', this).stop().fadeTo(200, 1);
	}, function() {
		$('span', this).stop().fadeTo(200, 0);
	});

	$('.image a').hover(function(){
		var textClass = '.' + $(this).attr('rel');
		$(textClass).stop().fadeTo(200, .9);
	}, function() {
		var textClass = '.' + $(this).attr('rel');
		$(textClass).stop().fadeTo(200, 0);
	});

	$('#mediaplayer ul').hide();

	$('#wimpyPop').click(function() {
		$('#mediaplayer ul').slideDown();	
		$(this).slideUp();
		wimpyPopPlayer('/_media/mp3player/djhere.html','520','160');
		return false;
	});

	// rereference the wimpyWindow object?
	if (readCookie('player') == 'true') { 
		wimpyWindow = window.open('','wimpyMP3player');
		$('#wimpyPop').hide();
		$('#mediaplayer ul').show();
	}

	$('#mediaplayer .previous').click(function() { wimpyWindow.wimpy_prev(); });
	$('#mediaplayer .pause').click(function() { wimpyWindow.wimpy_pause(); });
	$('#mediaplayer .play').click(function() { wimpyWindow.wimpy_play(); });
	$('#mediaplayer .stop').click(function() { wimpyWindow.wimpy_stop(); });
	$('#mediaplayer .next').click(function() { wimpyWindow.wimpy_next(); });
/*
<span id="currentTrack"></span>
<a href="javascript:;"
onClick="var track = wimpyWindow.wimpy_getTrackInfo(); alert(track.title);">
Current Track 
</a>
</div>
*/

});


// NOTE: These functions are used to pop up the player window 
//var wimpyWindow;
//var winOpen=0;
function wimpyPopPlayer(wimpyPopPage,theWidth,theHeight) {
   wimpyWindow = window.open(wimpyPopPage,'wimpyMP3player','width='+theWidth+',height='+theHeight);
   winOpen=1;
}
function wimpyIsOpen(){
   if (winOpen==1){
     if (wimpyWindow.closed){
       return false;
     } else {
       return true;
     }
   } else {
     return false;
   }
}

function createCookie(name,value,days) {
	if (days) {
		var date = new Date();
		date.setTime(date.getTime()+(days*24*60*60*1000));
		var expires = "; expires="+date.toGMTString();
	}
	else var expires = "";
	document.cookie = name+"="+value+expires+"; path=/";
}

function readCookie(name) {
	var nameEQ = name + "=";
	var ca = document.cookie.split(';');
	for(var i=0;i < ca.length;i++) {
		var c = ca[i];
		while (c.charAt(0)==' ') c = c.substring(1,c.length);
		if (c.indexOf(nameEQ) == 0) return c.substring(nameEQ.length,c.length);
	}
	return null;
}

function eraseCookie(name) {
	createCookie(name,"",-1);
}

function make(url, title)
{
	alert(url);
	alert(title);

	var a = document.createElement('a');
	a.setAttribute('class', 'addthis_button');
	a.setAttribute("onmouseover", "return addthis_open(this, '', '"+url+"', '"+title+"')");
	a.setAttribute("onclick", "return addthis_sendto()");
	a.setAttribute("onmouseout", "addthis_close()");
	a.innerHTML = 'Share';
	document.getElementById('photoShare').appendChild(a);
}

function imageLinks(title, currentArray, currentIndex, currentOpts) {
	//Grab our current Url
	var url = window.location.toString();
	//Remove anchor from url
	var anchor_index = url.indexOf('#');

	if (anchor_index != -1) {
		url = url.substring(0, anchor_index);
	}

	current_image = title;
	current_url = url + '#' + title;
	current_url_full = url + '#' + title;
	
	window.location = '#' + title;

	 return "<div id=\"tags-instructions\" style=\"display: none\"><p>Click on each person you want to tag above. <a href=\"javascript:doneTagging()\">Save Tags</a> when done.</p></div><div id=\"tags-header\"><img src='/facebook_16.png' width=16 height=16> <a href=\"javascript:tagPhotoFB()\">Tag Photo</a> &nbsp; <span id=\"uploadPhotoFB\"><img src='/facebook_16.png' width=16 height=16> <a href=\"javascript:uploadPhotoFB()\">Upload to Facebook</a></span> &nbsp; <a onmouseover=\"return addthis_open(this, '', '"+url+"#"+title+"', '"+ $('title').text() +"')\" onclick=\"return addthis_sendto()\" onmouseout=\"addthis_close()\" >Share Photo</a></div><p>In this photo: <span id=\"tags\"></span></p>";


	//onclick="callPublish('',{'name':'DJhere.com Photo','href':'+window.location+','description':\''+ title +'\','media':[{'type':'image','src':\''+ $('#fancybox-img').attr('src') +'\','href':window.location}]},null);return false;"
//    return '<div id="tip7-title">' + (title && title.length ? '<b>' + title + '</b>' : '' ) + 'Image ' + (currentIndex + 1) + ' of ' + currentArray.length + '</div>';
}


// cufon stuff here
  Cufon.replace('#tagline', { fontFamily: 'HelveticaBlack' });
  Cufon.replace('h1', { fontFamily: 'HelveticaBlack' });
  Cufon.replace('h2', { fontFamily: 'HelveticaMedium' });
  Cufon.replace('h3', { fontFamily: 'HelveticaMedium' });
  Cufon.replace('h4', { fontFamily: 'HelveticaMedium' });
  Cufon.replace('#nav', { fontFamily: 'HelveticaMedium' });
  Cufon.replace('.navigation h4', { fontFamily: 'HelveticaMedium' });
  Cufon.replace('#wimpyPop', { fontFamily: 'HelveticaMedium' });