var WW = WW || {};

WW.Controller = (function() {
	
	var _initQueue = [];
	
	var Self = {
		"init": function() {
			if (_initQueue.length > 0) {
				for (var i = 0; i < _initQueue.length; i++) {
					if (typeof _initQueue[i] === "function") {
						_initQueue[i]();
					}
				}
				_initQueue = [];
			}
		}, //end init
		"queue": function() {
			if (arguments.length > 0) {
				for (var j = 0; j < arguments.length; j++) {
					_initQueue.push(arguments[j]);
				}
			}
		} //end queue
	};
	return Self;
})();

$(function() {
	WW.Controller.init();
});

WW.Global = (function() {
	
	var Self = {
		
		"init": function() {
			
			if ($('#gallery').length > 0) {
				Self.slideShow('#gallery');
			}
			
			if ($('#scroller').length > 0 && typeof $.simplyScroll !== 'undefined') {
				$("#scroller").simplyScroll({
					className: 'custom',
					autoMode: 'loop',
					pauseOnHover: false,
					frameRate: 20,
					speed: 1
				});
			}
		
		}, //end init
		
		"slideShow": function(gallery) {
			var $gallery = $(gallery);
			
			$gallery.prepend('<div class="numbering"></div><div class="caption"><div class="content"></div></div>');
			
			//Creating numbering
			var count = 0;
			$gallery.find('img').each(function() {
				count++;
				$gallery.find('.numbering').append("<span class="+count+">"+count+"</span>");
			});
			
			//Set the opacity of all images to 0
			$gallery.find('mark').css({opacity: 0.0});
			
			//Get the first image and display it (set it to full opacity)
			$gallery.find('mark:first').css({opacity: 1.0});
			$gallery.find('.numbering span:first').addClass("highlight");
			
			//Set the caption background to semi-transparent
			$gallery.find('.caption').css({opacity: 0.7});
		
			//Resize the width of the caption according to the image width
			//$('#gallery .caption').css({width: $('#gallery a').find('img').css('width')});
			
			//Get the caption of the first image from title attribute and display it
			$gallery.find('.content').html($gallery.find('mark:first').attr('title'))
				.animate({opacity: 0.7}, 400);
			
			//Call the gallery function to run the slideshow, 6000 = change to next image after 6 seconds
			var slideshowInterval = setInterval(function(){ WW.Global.gallery(gallery) }, 6000);
			
			//Click event listener on numbers
			$(document.body).delegate(gallery + ' .numbering span:not(.highlight)', 'click', function() {
				clearInterval(slideshowInterval);
				var index = $(this).attr("class") - 1;
				var current = ($gallery.find('mark.show') ?  $gallery.find('mark.show') : $gallery.find('mark:first'));
				var currentNumber = ($gallery.find('.numbering span.highlight') ? $gallery.find('.numbering span.highlight') : $gallery.find('.numbering span:first'));
				//Get next image caption
				var caption = $gallery.find('mark')
					.eq(index)
					.attr('title');
		
				//Set the fade in effect for the next image, show class has higher z-index
				$gallery.find('mark')
					.eq(index)
					.css({opacity: 0.0})
					.addClass('show')
					.animate({opacity: 1.0}, 1000);
				$(this)
					.addClass('highlight');
			
				//Hide the current image
				current
					.animate({opacity: 0.0}, 1000)
					.removeClass('show');
				currentNumber
					.removeClass('highlight');
				
				//Set the opacity to 0 and height to 1px
				$gallery.find('.content').fadeOut();
				$gallery.find('.caption').animate({opacity: 0.0}, { queue:false, duration:0 }).animate({height: '1px'}, { queue:true, duration:300 });	

				//Animate the caption, opacity to 0.7 and heigth to 100px, a slide up effect
				$gallery.find('.caption').animate({opacity: 0.7},100 ).animate({height: '85px'},500, function(){
					$gallery.find('.content').fadeIn();
				});

				//Display the content
				$gallery.find('.content').html(caption);
			});
		},
		
		"gallery": function(gallery) {
			var $gallery = $(gallery);
			
			//if no IMGs have the show class, grab the first image
			var current = ($gallery.find('mark.show') ?  $gallery.find('mark.show') : $gallery.find('mark:first'));
			var currentNumber = ($gallery.find('.numbering span.highlight') ? $gallery.find('.numbering span.highlight') : $gallery.find('.numbering span:first'));
		
			//Get next image, if it reached the end of the slideshow, rotate it back to the first image
			var next = ((current.next().length) ? ((current.next().hasClass('caption'))? $gallery.find('mark:first') :current.next()) : $gallery.find('mark:first'));	
			var nextNumber = (currentNumber.next().length) ? currentNumber.next() : $gallery.find('.numbering span:first');	
			
			//Get next image caption
			var caption = next.attr('title');	
			
			//Set the fade in effect for the next image, show class has higher z-index
			next.css({opacity: 0.0})
				.addClass('show')
				.animate({opacity: 1.0}, 1000);
			nextNumber
				.addClass('highlight');
		
			//Hide the current image
			current.animate({opacity: 0.0}, 1000)
				.removeClass('show');
			currentNumber
				.removeClass('highlight');
				
			//Set the opacity to 0 and height to 1px
			$gallery.find('.content').fadeOut();
			$gallery.find('.caption').animate({opacity: 0.0}, { queue:false, duration:0 }).animate({height: '1px'}, { queue:true, duration:300 });	
			
			//Animate the caption, opacity to 0.7 and heigth to 100px, a slide up effect
			$gallery.find('.caption').animate({opacity: 0.7},100 ).animate({height: '85px'},500, function(){
				$gallery.find('.content').fadeIn();
			});
			
			//Display the content
			$gallery.find('.content').html(caption);
		}
	};
	return Self;
})();
WW.Controller.queue(WW.Global.init);



WW.GlobalSlide = (function() {
	
	var Self = {
		
		"init": function() {
			
			if ($('#subgallery').length > 0) {
				Self.subslideShow();
			}
		
		}, //end init
		
		"subslideShow": function() {
			
			$('#subgallery').prepend('<div class="numbering"></div><div class="caption"><div class="content"></div></div>');
			
			//Creating numbering
			var count = 0;
			$('#subgallery img').each(function() {
				count++;
				$('#subgallery .numbering').append("<span class="+count+">"+count+"</span>");
			});
			
			//Set the opacity of all images to 0
			$('#subgallery a').css({opacity: 0.0});
			
			//Get the first image and display it (set it to full opacity)
			$('#subgallery a:first').css({opacity: 1.0});
			$('#subgallery .numbering span:first').addClass("highlight");
			
			//Set the caption background to semi-transparent
			$('#subgallery .caption').css({opacity: 1.0});
		
			//Resize the width of the caption according to the image width
			//$('#gallery .caption').css({width: $('#gallery a').find('img').css('width')});
			
			//Get the caption of the first image from REL attribute and display it
			$('#subgallery .content').html($('#subgallery a:first').find('img').attr('title'))
				.animate({opacity: 1.0}, 400);
			
			//Call the gallery function to run the slideshow, 6000 = change to next image after 6 seconds
			var slideshowInterval = setInterval('WW.GlobalSlide.subgallery()',8000);
				
			$(document).delegate('#subgallery .numbering span:not(.highlight)', 'click', function() {
				clearInterval(slideshowInterval);
				var index = $(this).attr("class") - 1;
				var current = ($('#subgallery a.show') ?  $('#subgallery a.show') : $('#subgallery a:first'));
				var currentNumber = ($('#subgallery .numbering span.highlight') ? $('#subgallery .numbering span.highlight') : $('#subgallery .numbering span:first'));
				//Set the fade in effect for the next image, show class has higher z-index
				$('#subgallery a')
					.eq(index)
					.css({opacity: 0.0})
					.addClass('show')
					.animate({opacity: 1.0}, 1000);
				$(this)
					.addClass('highlight');
			
				//Hide the current image
				current
					.animate({opacity: 0.0}, 1000)
					.removeClass('show');
				currentNumber
					.removeClass('highlight');
			});
		},
		
		"subgallery": function() {
			//if no IMGs have the show class, grab the first image
			var current = ($('#subgallery a.show') ?  $('#subgallery a.show') : $('#subgallery a:first'));
			var currentNumber = ($('#subgallery .numbering span.highlight') ? $('#subgallery .numbering span.highlight') : $('#subgallery .numbering span:first'));
		
			//Get next image, if it reached the end of the slideshow, rotate it back to the first image
			var next = ((current.next().length) ? ((current.next().hasClass('caption'))? $('#subgallery a:first') :current.next()) : $('#subgallery a:first'));	
			var nextNumber = (currentNumber.next().length) ? currentNumber.next() : $('#subgallery .numbering span:first');	
			
			//Get next image caption
			var caption = next.find('img').attr('title');	
			
			//Set the fade in effect for the next image, show class has higher z-index
			next.css({opacity: 0.0})
				.addClass('show')
				.animate({opacity: 1.0}, 1000);
			nextNumber
				.addClass('highlight');
		
			//Hide the current image
			current.animate({opacity: 0.0}, 1000)
				.removeClass('show');
			currentNumber
				.removeClass('highlight');
				
			//Set the opacity to 0 and height to 1px
			$('#subgallery .content').fadeOut();
			$('#subgallery .caption').animate({opacity: 0.0}, { queue:false, duration:0 }).animate({height: '1px'}, { queue:true, duration:300 });	
			
			//Animate the caption, opacity to 0.7 and heigth to 100px, a slide up effect
			$('#subgallery .caption').animate({opacity: 1.0},100 ).animate({height: '50px'},500, function(){
				$('#subgallery .content').fadeIn();
			});
			
			//Display the content
			$('#subgallery .content').html(caption);
		}
	};
	return Self;
})();
WW.Controller.queue(WW.GlobalSlide.init);


WW.TellAFriend = (function() {

	var self = {
	
		"init": function() {
			
			//Event listeners
			$("a.add-friend").live("click", function() {
				self.addFriends();
				return false;
			});
			$("a.remove-friend").live("click", function() {
				self.removeFriends($(this));
				return false;
			});
			
			
			//Form ID
			var formID = "#tell-a-friend-form";
			
			//Captcha image reloader
			$("#reload-captcha")
				.click( function() {
					$("#captcha").attr("src", "/lib/securimage/securimage_show.php?" + Math.random());
					$(RequiredFormElements.captcha.id).val("");
					return false;
				});
			
			var RequiredFormElements = {
				"name": {
					"name": "Name",
					"id": "#name",
					"type": "alphanumeric",
					"message": "Enter your name.",
					"errorClass": "ui-state-error"					
				},
				"email": {
					"name": "Email",
					"id": "#email",
					"type": "email",
					"message": "Enter a valid e-mail address.",
					"errorClass": "ui-state-error"					
				},
				"captcha": {
					"name": "Captcha",
					"id": "#captcha_code",
					"type": "notempty",
					"message": "Enter the CAPTCHA code.",
					"errorClass": "ui-state-error"					
				}
			};
			
			$(formID).submit( function() {
				if ( Utilities.forms.validateAndSendForm(RequiredFormElements) ) {
					var options = {
						url: $(formID).attr("action"),
						cache: false,
						type: "POST",
						data: $(formID).serialize(),
						error: function(data){
							Utilities.message.display("Error", data);
						},
						success: function(data){
							Utilities.message.display("Response", data);
						}
					};
				
					$.ajax(options);
				}
				return false;						
			});
		},
		
		"count": 1,
		
		"maxFriends": 10,
		
		"addFriends": function() {
			if ( $("fieldset#contacts div").size() < self.maxFriends) {
				self.count++;
				
				var newFriend = $("#recipient1-wrapper").clone();
				newFriend
					.attr("id","recipient"+self.count+"-wrapper");
				newFriend.children("label")
					.attr("for", "recipient"+self.count);
				newFriend.children("input")
					.attr("id", "recipient"+self.count)
					.attr("name", "Recipient "+self.count)
					.val("");
				var deleteFriend = $('<a href="#" class="remove-friend" title="Remove friend"></a>').toggle();
				$(deleteFriend).appendTo(newFriend);
				$(newFriend).appendTo("fieldset#contacts");
				$("#recipient"+self.count+"-wrapper a.remove-friend").show();
			}
		},
		
		"removeFriends": function(item) {
			if ( $("fieldset#contacts div").size() > 0) {
				$(item).parent().remove();
			}
		}
		
	};
	return self;
})();
WW.Controller.queue(WW.TellAFriend.init);

WW.BecomeASupporter = (function() {

	var self = {
	
		"init": function() {
			
			//Contact form ID
			var supporterFormID = "#become-a-supporter";
			var redirectOnSuccess = true;
			var redirectURL = "/Tell-a-friend";
			
			//Captcha image reloader
			$("#reload-captcha")
				.click( function() {
					$("#captcha").attr("src", "/lib/securimage/securimage_show.php?" + Math.random());
					$(RequiredsupporterFormElements.captcha.id).val("");
					return false;
				});
			
			var RequiredsupporterFormElements = {
				"firstname": {
					"name": "First name",
					"id": "#firstname",
					"type": "alphanumeric",
					"message": "Enter your first name.",
					"errorClass": "ui-state-error"					
				},
				"lastname": {
					"name": "Last name",
					"id": "#lastname",
					"type": "alphanumeric",
					"message": "Enter your last name.",
					"errorClass": "ui-state-error"					
				},
				"email": {
					"name": "Email",
					"id": "#email",
					"type": "email",
					"message": "Enter a valid e-mail address.",
					"errorClass": "ui-state-error"					
				},
				"captcha": {
					"name": "Captcha",
					"id": "#captcha_code",
					"type": "notempty",
					"message": "Enter the CAPTCHA code.",
					"errorClass": "ui-state-error"					
				}
			};
			
			$("form"+supporterFormID).submit(function() {
				if ( Utilities.forms.validateAndSendForm(RequiredsupporterFormElements) ) {
					var options = {
						url: $("form"+supporterFormID).attr("action"),
						cache: false,
						type: "POST",
						data: $("form"+supporterFormID).serialize(),
						error: function(data) {
							Utilities.message.display("Error", data);
						},
						success: function(data) {
							if (redirectOnSuccess === true) {
								window.location = redirectURL;
							} else {
								Utilities.message.display("Response", data);
							}
						}
					};
				
					$.ajax(options);
				}
				return false;						
			});
		}
		
	};
	return self;
})();
WW.Controller.queue(WW.BecomeASupporter.init);

WW.ShowHide = (function() {

	var self = {
	
		"init": function() {
			
			$("div.article").each(function(){		
			
			var thisArticle = this;

				// Initially, hide the "hide" link and "article"
				$("p.hide", thisArticle).hide();
				$("div.articleBody", thisArticle).hide();
		
				// The show and hide links both toggle themselves and the article body
				$("p.show a, p.hide a", thisArticle).click(function(){
					$("p.show, p.hide, div.articleBody", thisArticle).toggle();
					return false;
				});
		
			});
		}
		
	};
	return self;
})();
WW.Controller.queue(WW.ShowHide.init);