/**
 * 
 * @application UWE Degree Show
 * @version 0.0.0.1
 * @author Mariana Mota, Chris Keegan
 * @copyright Evans & Finch, 2010
 * 
 */

function onSettingsLoaded( tracker )
{
	
}


/////////////////////// MODEL ///////////////////////
( 
	function()
	{
		var udsPage = window.udsPage = function()
		{
			return udsPage.fn.__init();
		};
	
		udsPage.fn = (Object) (udsPage.prototype =
		{
				
			model : 
			{
				selected_quote : 4,
				quotes : 
				[

				 
				 	{
				 		quote: "Kan kan girls and dancing girls. No. A bit of entertainment, lots of new work from the students finishing that year- interspersed with Kan kan girls and dancing girls. Overall an entertaining afternoon or evening really.",
				 		attribution: "Managing Director",
				 		idx : 0,
						words : [],
						initial: [],
						selected : false
					},
					
				 
				 	{
						quote: "It's a brilliant, unique chance to have a big celebration at the end of a hard three years. What other degrees have a big party where the work is the centrepiece?",
						attribution: "Production Assistant",
						idx : 1,
						words : [],
						initial: [],						
						selected : false         
					},
					
				 
				 	{
						quote: "I think its for all the students to show what they've done over their three years, all the investigations and all the hard work, this is ultimately the end result and an example of what their future may hold and where they may go with it.",
						attribution: "Office Manager",
						idx : 2,
						words : [],
						initial: [],						
						selected : false	         
					},
					
			
				 	{
						quote: "Absolutely no idea, what is a degree show? Like when Jacob got his degree? So you obviously do an exhibition don't you.",
						attribution: "Caterer",
						idx : 3,
						words : [],
						initial: [],						
						selected : false        
					}, 
					
				 	{
				 		quote: "Come and look at our work and find out some more about all the exciting stuff we are always doing.",
				 		attribution: "",
				 		idx : 4,
						words : [],
						initial: [ 1, 8, 10, 11, 12, 13, 16, 17, 18, 19 ],
						selected : true
					},				 
					
				]
			},//model
			
			view: 
			{
				animating: false,
				dragging: false
			},
			
			
			__init : function()
			{
				window.page = this;
				
				this.initModel();
				this.initView();
				this.initController();
				
				return this;
			}, // __init
			
			
			initModel : function()
			{
				this.initQuoteModel( this.model.quotes[0] );
				this.initQuoteModel( this.model.quotes[1] );
				this.initQuoteModel( this.model.quotes[2] );
				this.initQuoteModel( this.model.quotes[3] );
				this.initQuoteModel( this.model.quotes[4] );
				
				return this;
			}, // initModel
			
			initQuoteModel : function( quote )
			{
				var arr_quote = quote.quote.split(" ");
				var words = quote.words;
				var initial = quote.initial;
				
				var container = $(".quote_container#quote_container_quote"+(quote.idx+1));
				$.each(arr_quote, function(idx,value)
				{
					var id = "quote" + (quote.idx+1) + "_word" + (idx+1);
					var img_id = id + "_img";
					container.append("<div class='block_container'><div class='block' id='" + id + "' word_idx='" + idx + "'>" + value + "</div><img class='block_img' id='" + img_id + "' word_idx='" + idx + "' src='assets/images/block_img.gif' ></img></div>");
				});
				container.append("<div class='quote_attribution'>" + quote.attribution + "</div>");
				
				words.length=arr_quote.length;
				$.each(words, function(idx,value)
				{
					words[idx]=false;
				});

				$.each(initial, function(idx,value)
				{
					words[value]=true;
				});
				
				return this;
				
			}, //initQuote
			
			
			initView : function()
			{	
				var selected = this.model.selected_quote;
				
				this.initQuoteView( this.model.quotes[0] );
				this.initQuoteView( this.model.quotes[1] );
				this.initQuoteView( this.model.quotes[2] );
				this.initQuoteView( this.model.quotes[3] );
				this.initQuoteView( this.model.quotes[4] );
				
				this.updateViewQuote(-1);
				
			},//initView
			
			initQuoteView : function( quote )
			{
				var words = quote.words;

				$.each(words, function(idx,value)
				{
					var jq_word = $("#quote"+(quote.idx+1)+"_word"+(idx+1));
					var jq_img = $("#quote"+(quote.idx+1)+"_word"+(idx+1)+"_img");
					if (value == true)
					{
						jq_word.hide();
						jq_img.show();
					}
					else
					{
						jq_word.show();
						jq_img.hide();
					}
				});
							
				return this;
			}, //initQuoteView
			

/////////////////////// CONTROLER ///////////////////////
			
			initController : function()
			{	
				var page = this;
				
				$("#arrow_right").click( function(ev)
				{
					page.modelRight();
				});
				
				$("#arrow_left").click( function(ev)
				{
					page.modelLeft();
				});	
				
				$("#link_print_page").click( function()
				{
					page.printPage ();
				});
				
				$(".block_img").mouseenter
				( 
					function(ev)
					{
						if ( page.view.dragging == false && page.view.animating == false )
						{
							page.viewPrepareWordDrag( this );
						}
					} 
				);

				$("#block_link").mouseenter
				( 
					function(ev)
					{
						if ( page.view.dragging == false && page.view.animating == false )
						{
							page.viewPrepareBlockDrag( this );
						}
					} 
				);
				
				$(".block").droppable( 
				{ 
					over : function(ev, ui)
					{
						var quote = page.model.quotes[page.model.selected_quote];
						var word_idx = parseInt($(this).attr("word_idx"));
						//var img_id = "#quote"+(quote.idx+1)+"_word"+(word_idx+1)+"_img";
						//$(img_id).css("opacity","0.25");

						if ( page.model.quotes[page.model.selected_quote].words[word_idx] == false )
							page.modelToggleWord(word_idx);
					},
					out : function(ev, ui)
					{
						var quote = page.model.quotes[page.model.selected_quote];
						var word_idx = parseInt($(this).attr("word_idx"));
						//var img_id = "#quote"+(quote.idx+1)+"_word"+(word_idx+1)+"_img";
						//$(img_id).css("opacity","1.0");
						
						if ( page.model.quotes[page.model.selected_quote].words[word_idx] == true )
							page.modelToggleWord(word_idx);
					},		
					stop : function(ev,ui)
					{
					}
				});
							
			},//initController
			
			modelRight : function()
			{
				var selected = this.model.selected_quote;
				if ( this.view.animating == true )
					return;
				
				//if(this.model.selected_quote == this.model.quotes.length-1)
				if(this.model.selected_quote == 4)
				{
					this.model.selected_quote = 0;
				}
				else
				{
					this.model.selected_quote++;
				}
				
				this.updateViewQuote(selected);
				
			},//modelRight
			
			modelLeft : function()
			{
				var selected = this.model.selected_quote;
				if ( this.view.animating == true )
					return;
				
				if(this.model.selected_quote == 0)
				{
					this.model.selected_quote = 4;
				}
				else
				{
					this.model.selected_quote--;
				}
				
				this.updateViewQuote(selected);
			},//modelLeft		

			
			modelToggleWord : function(word_idx)
			{
				var selected = this.model.selected_quote;
				var quote = this.model.quotes[selected];
				
				quote.words[word_idx] = !quote.words[word_idx];
				this.updateViewWord(word_idx, quote.words[word_idx]);
				//this.initQuoteView(quote);
				
			},//modelToggleWord
			
			printPage : function ()
			{
					window.print();
					return false;
			},	
			//printPage
			
/////////////////////// VIEW ///////////////////////			
			
			updateViewQuote : function(previous)
			{
				var selected = this.model.selected_quote;
				var quote = this.model.quotes[selected];
				var page = this;
				
				this.view.animating = true;
				if ( previous != -1 )
				{
					var prev = $("#quote_container_quote"+(previous+1));
					var curr = $("#quote_container_quote"+(selected+1)); 
					prev.fadeOut( 1000, function()
					{
						page.initQuoteView(quote);
						curr.fadeIn( 1000, function()
						{
							page.view.animating = false;
						});
					});
				}
				else
				{
					var curr = $("#quote_container_quote"+(selected+1)); 
					curr.fadeIn( 1000 , function()
					{
						page.view.animating = false;
					});
				}
				
			},//updateViewQuote	
			
			updateViewWord : function(word_idx, value)
			{
				var selected = this.model.selected_quote;
				var quote = this.model.quotes[selected];
				
				if (value == true)
				{
					$("#quote"+(quote.idx+1)+"_word"+(word_idx+1)+"_img").show();
					$("#quote"+(quote.idx+1)+"_word"+(word_idx+1)).hide();
				}
				else
				{
					$("#quote"+(quote.idx+1)+"_word"+(word_idx+1)+"_img").hide();
					$("#quote"+(quote.idx+1)+"_word"+(word_idx+1)).show();
				}
			}, //updateViewWord

			viewPrepareWordDrag : function( element )
			{
				var page = this;
				var selected = this.model.selected_quote;
				var quote = this.model.quotes[selected];
				var word_idx = parseInt($(element).attr("word_idx"));
				var word_id = "#quote"+(quote.idx+1)+"_word"+(word_idx+1);
				
				var clone = $("<div></div>").appendTo("body");
				var offset = $(element).offset();
				clone.css(
				{
					position:"absolute",
					backgroundColor: "#000",
					display: "block",
					width: $(element).css("width"),
					height: $(element).css("height"),
					left: offset.left,
					top: offset.top,
					cursor: "pointer",
					opacity: 1.0
				});
				
				//clone.animate({opacity: 0.75}, 500);
				this.prepared = true;
				clone.data("element", element).addClass("clone").draggable(
				{
					refreshPositions : false,
					start: function(ev, ui)
					{
						page.view.dragging = true;
						clone.css({opacity: 0.3});
						quote.words[word_idx] = false;
					},
					drag: function(ev,ui)
					{
						//page.initQuoteView(quote);
					},
					stop: function(ev, ui)
					{
						page.view.dragging = false;
						//$(this).hide();
						page.viewUnprepareWordDrag(this);
					}
				});
				
				clone.mouseleave( function(ev)
				{
					if ( page.view.dragging == false )
					{
						page.viewUnprepareWordDrag(this);
					}
				});
				
				$(word_id).show();				
				$(element).hide();
				
			}, //viewPrepareWordDrag

			viewUnprepareWordDrag : function( element )
			{
				if ( this.prepared == false )
					return;
				this.prepared = false;
				var selected = this.model.selected_quote;
				var quote = this.model.quotes[selected];
				var original = $(element).data("element");
				var word_idx = parseInt($(original).attr("word_idx"));
				
				//this.updateViewWord( word_idx, quote.words[word_idx] );
				this.initQuoteView( quote );
				//$(word_id).hide();	
				//$(original).show();
				$(".clone").remove();
				
			}, //viewUnprepareWordDrag			

			viewPrepareBlockDrag : function( element )
			{
				var page = this;
				
				var clone = $("<div></div>").appendTo("body");
				var offset = $(element).offset();
				clone.css(
				{
					position:"absolute",
					backgroundColor: "#000",
					display: "block",
					width: $(element).css("width"),
					height: $(element).css("height"),
					left: offset.left,
					top: offset.top,
					cursor: "pointer",
					opacity: 1.0
				});
				
				this.prepared = true;
				clone.data("element", element).addClass("clone").draggable(
				{
					start: function(ev, ui)
					{
						page.view.dragging = true;
						clone.css({opacity: 0.3});
					},
					stop: function(ev, ui)
					{
						page.viewUnprepareBlockDrag(this);
						page.view.dragging = false;
					}
				});
				
				clone.mouseleave( function(ev)
				{
					if ( page.view.dragging == false )
					{
						page.viewUnprepareBlockDrag(this);
					}
				});
				
			}, //viewPrepareBlockDrag			
			
			viewUnprepareBlockDrag : function( element )
			{
				if ( this.prepared == false )
					return;
				this.prepared = false;
				$(".clone").remove();
				
			} //viewUnprepareBlockDrag				
			
		});

	}
)();

udsPage.fn.__init.prototype = udsPage.fn;

$(window).load( function()
{
	var page = udsPage();
	
});
