var BandPage = BandPage || {}; 
BandPage.cfg = {};
BandPage.windowFocus = true;

BandPage.quoteGallery = function(){
	var main = this;
	var currentIndex = 0;
	var items = [];
	
	
	$('.quote-item').each(function(index){
		var quote = $(this);
		
		items.push(quote);
		quote.data('onScreen', true);
		
		if(index != 0){
			quote.hide();
			quote.data('onScreen', false);
		}
	})
	
	
	main.nextQuote = function(){
		if(BandPage.windowFocus){
			
			
			for(var i = 0; i<items.length; i++){
				var quote = items[i];
				if(i == currentIndex){
					if(!quote.data('onScreen')){
						quote.delay(500).fadeIn(1000);
						quote.data('onScreen', true);
					}
				} else {
					if(quote.data('onScreen')){
						quote.fadeOut(1000);
						quote.data('onScreen', false);
					}
				}
				
			}
			currentIndex ++;
			if(currentIndex > items.length-1)currentIndex = 0;
		}
	}
	
	var quoteTimer;
	if(items.length > 1){
		quoteTimer = setInterval(main.nextQuote, 6000);
	}
}

BandPage.BandPage = function(){
	var main = this;

	//ENGINE DECLARATIONS
	
	var header = $('#header');
	var mainNode = $('#main');
	var concentrator = $('#concentrator');
	var quotes = $('#quotes');
	var animationCellContainer = $('<div id="animation-cell-container"></div>');
	var menu = $('<div id="navigation-primary"></div>');
	var container = $('<div id="container"></div>');
	var containerSlide = $('<div id="container_slide"></div>');
	var siteContent = $('<div id="site-content"></div>');
	var portrait = $('#portrait');
	var preloader = $('#main-preloader');
	var gigaToggle = $('<div id="giga-toggle"></div>');
	
	var callToActionDelay = 4000;
	
	BandPage.body.prepend(gigaToggle);
	
	var menuOpen = false;
	var menuBusy = false;
	var menuItems = [];
	var tempMenuItems = [];
	
	var pages = [];
	var currentPage;

	var currentIndex = -1;
	
	var visibleMenuHeight = 0;

	quotes.data('top', BandPage.cfg.portraitHeight);
	quotes.data('margin-top', parseInt(quotes.css('margin-top')));
	quotes.css('top', quotes.data('top') + quotes.data('margin-top') + "px");
	
	concentrator.css('width', BandPage.cfg.portraitWidth + "px");
	mainNode.css('width', BandPage.cfg.portraitWidth*1.5 + BandPage.cfg.menuDistance*2 + "px");
	
	
	main.width = concentrator.width();
	
	container.append(containerSlide);
	siteContent.append(container);
	siteContent.append(animationCellContainer);
	siteContent.append(menu);
	siteContent.append(quotes);
	concentrator.append(siteContent);
	
	var pageCount = $('.page').length;
	
	
	
	//PAGE MANAGEMENT
	
	var showCurrentPage = function(){
		for(var i = 0; i<pages.length; i++ ){
			var page = pages[i];
			
			containerSlide.stop().animate({
				left: -currentIndex * (BandPage.cfg.portraitWidth + BandPage.cfg.menuDistance)
			}, {
				duration: 500, 
				step:function(){},
				easing:BandPage.cfg.menuAnimation,
				complete:function(){ }
			});
			
			if(i == currentIndex){
				currentPage = page;
				tempMenuItems[i].addClass('selected_menu_item');
			} else {
				tempMenuItems[i].removeClass('selected_menu_item');
            }
		}
		 $('html body').animate({scrollTop : 0},1000);
		//if(!menuOpen) toggleMenu();
		positionQuotes();
		
	}
	
	var showPage = function(page){
		if(page.data('onScreen') == false){
			page.data('onScreen', true);
			page.addClass('visiblePage');
			page.hide().delay(BandPage.cfg.pageAnimationSpeed*0.8).fadeIn(BandPage.cfg.pageAnimationSpeed);
			
			
		}
	}

	var hidePage = function(page){
		if(page.data('onScreen') == true){
			page.data('onScreen', false);
			page.fadeOut(BandPage.cfg.pageAnimationSpeed, function(){
				page.removeClass('visiblePage');	
			})
		}
	}
	//PAGE MANAGEMENT - END


	//quotes POSITION
	
	var positionQuotes = function(){
		var pageHeight = currentPage.outerHeight(true);
		//alert('pageHeight: '+pageHeight);
		if(currentIndex == -1 )pageHeight = 0;
		
		var quotesV = Math.max(pageHeight, BandPage.cfg.portraitHeight); 


		$(quotes.data()).animate({
			top: quotesV
		}, {
			duration: 500, 
			step:function(){
				heightFormula();
				},
			easing:BandPage.cfg.menuAnimation,
			complete:function(){

			}
		});
	}
	
	var heightFormula = function(){
		//if(!headerHeight)headerHeight = header.outerHeight(true);
		quotes.css('top', quotes.data('top') + quotes.data('margin-top') + "px");
		container.css('height', quotes.data('top') + quotes.data('margin-top') + "px");
	}
	
	var fbOptions = {
		prevEffect	: 'none',
		nextEffect	: 'none',
		helpers	: {
			title	: {
				type: 'outside'
			},
			overlay	: {
				opacity : 0.8,
				css : {
					'background-color' : '#000'
				}
			},
			thumbs	: {
				width	: 50,
				height	: 50
			}
		}
  	};
  	$.fancybox.afterClose = function(){
		var hash = hasher.getHashAsArray();
		if(hash.length > 0){
			hasher.setHash(hash[0]);
		}
		
	};
	
	var loadGallery = function(galleryId) {
    $.getJSON("gallery/"+galleryId+"/photos.json", function(json){
      var photos = json.response.success.gallery_data.photos;
      
      var images = [];
      
      $.each(photos, function(i,photo){
        var image =  {href: photo.src_big, title: photo.caption }
        images.push(image);
      });
      images.reverse();
      $.fancybox.open(images, fbOptions);
    });

	}
	//quotes POSITION - end


  $("a.gallery-link").live("click",function(){
  	hasher.setHash('gallery/'+$(this).data("gallery-id"));
  	return false;
  });

	//setup crossroads
	crossroads.addRoute('{id}/:slug:',function(id,slug){
	  var navItem = document.getElementById(id);
	  var navIndex = $('h3.nav-item').index(navItem);
	   window.document.title = $(navItem).text() + " - The Orbweavers";
	  currentIndex = navIndex;
	  showCurrentPage();
	  if(slug){
		  loadGallery(slug);
	  }else{
		  $.fancybox.close( true );
	  }
	});

	//update URL fragment generating new history record


	
	$('.page').each(function(index){
		var page = $(this);
		
		page.data('onScreen', false);
		
		containerSlide.append(page);
		page.css('left', index * (BandPage.cfg.portraitWidth + BandPage.cfg.menuDistance) + "px");
		pages.push(page);
		
		var menuItem = $('h3.nav-item', page);
        menuItem.addClass('menu_item');
        menuItem.addClass('left_side');
        menuItem.addClass('no-display');

		
		menuItem.click(function(){
		  hasher.setHash($(this).attr("id"));
		});
		
		
		var menuItemBorder = $('<div class="menu_item_border"></div>');
        menuItem.append(menuItemBorder);
		tempMenuItems.push(menuItem);
		menu.append(menuItem);

	});
	
	//FILL WITH BLANK MENU ITEMS
	var menuItemHeight = parseInt(BandPage.cfg.portraitHeight/BandPage.cfg.portraitRows);   //menuItems[0].outerHeight();
	var menuItemWidth = parseInt(BandPage.cfg.portraitWidth/2);
  var totalMenuItems = Math.ceil(BandPage.cfg.portraitHeight/menuItemHeight)*2;

	for(var j = 0; j<totalMenuItems; j++){
		var menuItem = $('<div class="animation_cell blank_item"></div>');
		
		menuItem.data('status', 0); // 1, 0, -1 = off, busy, on
		menuItem.data('percent', 0); 
				
		//var side_index = parseInt(pageCount/2)
		if(menuItems.length%2 == 0){
			menuItem.data('animation_way', -1);
		} else {
			menuItem.data('animation_way', 1);
		}
		
		menuItem.click(function(){
			if(!menuBusy)toggleMenu();
		});
		
		menuItems.push(menuItem);
		animationCellContainer.append(menuItem);
	}
	
	$('.animation_cell').each(function(){
		$(this).addClass('no-display');
	});
	
	
	//ADD BG TO MENU ITEMS
	var col = 0;
	var row = 0;
	for(var ii = 0; ii<menuItems.length; ii++){
		var menuItemPic = $('<div class="animation_cell_pic"></div>');
		var menuItem = menuItems[ii];
		menuItem.append(menuItemPic);
		if(col == 2){
			col = 0;
			row++;
		}
		menuItemPic.css({ background: 'url("'+ portrait.attr('src') +'") no-repeat -'+ ((menuItemWidth + (col * menuItemWidth)) - menuItemWidth) +'px -' +  ((menuItemHeight + (row * menuItemHeight)) - menuItemHeight) + "px"});
		
		col++;		
	}
	
	
	var containerStatus = 0;	
	var toggleMenu = function(){
		var targetPercent = 0; //0 .. close the menu in portrait
		
		clearInterval(callToActionTimer);
		
		if(!menuBusy){
			menuAnimationStart();
			menuBusy = true;
			menuOpen = !menuOpen;
			if(menuOpen){
				targetPercent = 1;
				toggleMainMenu(-1);
			} else {
				toggleMainMenu(1);
			}

			for(var i = 0; i < menuItems.length; i++){
				animateMenuItem(menuItems[i], i * BandPage.cfg.menuAnimationDelay, targetPercent);
			}
			
			if(menuOpen){
				setTimeout(function(){showCurrentPage();}, BandPage.cfg.menuAnimationSpeed*0.3);
			} else {
				showCurrentPage();
			}

		}
	} 
	
	
	var animateMenuItem = function(button, targetDelay, targetPercent){
		//ANIM
		var animateButton = function(){
			button.css('left', button.data('percent')*button.data('animation_way')*(main.width/2 + BandPage.cfg.menuDistance) + "px");
		}		
		
		var imgBlock = $('.animation_cell_pic',button); 
		if(targetPercent == 0){
			imgBlock.delay(targetDelay * 1.5).fadeIn(BandPage.cfg.menuAnimationSpeed * 2, function(){checkAnimationEnd(button)});
		} else {
			imgBlock.delay(targetDelay * 1.5).fadeOut(BandPage.cfg.menuAnimationSpeed * 1.5, function(){checkAnimationEnd(button)});
		}
		
		$(button.data()).delay(targetDelay).animate({
			percent: targetPercent
		}, {
			duration: BandPage.cfg.menuAnimationSpeed , 
			step:function(){animateButton()},
			easing:BandPage.cfg.menuAnimation,
			complete:function(){
					animateButton();
					// if(button == menuItems[menuItems.length-1]){
							// menuBusy = false;
						// } 
				}
		});
	}
	
	var checkAnimationEnd = function(button){
		if(button == menuItems[menuItems.length-1]){ 
			menuAnimationEnd();
        }
	}
	
	
	//INTRO
	var introAnimation = function(){
		
		quotes.hide();
		$('.page').show();
		
		animationCellContainer.append(portrait);
		portrait.hide().fadeOut(0);	
		$('#main').removeClass('preload');
		$('#main-preloader').fadeOut(1000, function(){
			$('#main-preloader').remove();
		})
		
		toggleMainMenu(1);
		
		portrait.delay(1000).fadeIn(2000, function(){
			portrait.click(function(){
				toggleMenu();
			});
			
			header.click(function(){
				toggleMenu();
			});

			$('.animation_cell').each(function(){
				$(this).removeClass('no-display');
			});
			
			$('.menu_item').each(function(){
				$(this).removeClass('no-display');
			});
		  		//setup hasher
      hasher.initialized.add(crossroads.parse, crossroads); //parse initial hash
      hasher.changed.add(crossroads.parse, crossroads); //parse hash changes
      //hasher.prependHash = '!';
      hasher.init(); //start listening for history change
      
      if(hasher.getHash()){
        toggleMenu();
      }else{
        currentIndex = 0;
      }
      
			callToActionTimer = setInterval(main.callToActionWave, callToActionDelay);
		});	
		
		/*
		portrait.mouseover(function(){
		  toggle
		});
		portrait.mouseout();
		*/

		quotes.delay(2000).fadeIn(1000);
	}
	
	
	//CALL TO ACTION WAVE
	var callToActionTimer;
	main.callToActionWave = function(){
		var introBrickDelay = 40;
		clearInterval(callToActionTimer);
		callToActionDelay += callToActionDelay;
		callToActionTimer = setInterval(main.callToActionWave, callToActionDelay);
		if(!menuBusy){
			menuAnimationStart();
			menuBusy = true;
			var targetPercent = 1;
			for(var i = 0; i < menuItems.length; i++){
				animateCTAMenuItem(menuItems[i], i * introBrickDelay, targetPercent);
			}
			targetPercent = 0;
			var reset = false;
			for(i = 0; i < menuItems.length; i++){
				if(i == menuItems.length-1)reset = true;
				animateCTAMenuItem(menuItems[i], i * introBrickDelay, targetPercent, reset);
			}
		}
	}
	
	var animateCTAMenuItem = function(button, targetDelay, targetPercent, reset){
		$(button).delay(targetDelay).animate({
					left: targetPercent * 13 * button.data('animation_way')
				}, {
					duration: 200 , 
					step:function(){},
					easing:"easeInOutQuad",
					complete:function(){if(reset){menuBusy = false; menuAnimationEnd();}}
				});
	}
	
	
	//MANAGE PORTRAIT
	var loadportrait = new Image();
	loadportrait = $(loadportrait);
	
	loadportrait.load(function(){
		loadportrait.attr('title',  portrait.attr('title'));
		loadportrait.attr('alt',  portrait.attr('alt'));
		loadportrait.attr('width',  portrait.attr('width'));
		loadportrait.attr('id',  portrait.attr('id'));
		portrait.remove();
		portrait = loadportrait;
		
		containerSlide.css('left', -currentIndex * (BandPage.cfg.portraitWidth + BandPage.cfg.menuDistance) + "px");
		
		introAnimation();
	}).attr('src', portrait.attr('src'));
	//MANAGE PORTRAIT - END

	
	
	var menuAnimationEnd = function(){
		menuBusy = false;
		if(menuOpen != true){
            animationCellContainer.append(portrait);
		} else {
			container.addClass('containerOnTop');
			//animationCellContainer.hide();
		}
	}
	
	var toggleMainMenu = function(direction){
	   var amount = (direction==1) ? 150 : 0;
	   var opacity = (amount==0) ? 1 : 0;
	   for(var i = 0; i < tempMenuItems.length; i++){
			tempMenuItems[i].delay(+((i+1)*100)+500).animate({left:amount+'px', opacity:opacity}, +(i+1) * BandPage.cfg.menuAnimationDelay*2);    //,opacity:direction
		}
	}
	
	var menuAnimationStart = function(){
		portrait.detach();
		container.removeClass('containerOnTop');
		//container.hide();
	}
	


	heightFormula();
	

	BandPage.quoteGallery();
	header.hide().delay(1000).fadeIn(3000);
	
	gigaToggle.click(function(){
		toggleMenu();
	});

	

	
	//SCROLL FIX
	container.scroll(function(){
		var dd = $(this);
		dd.scrollLeft(0);
		dd.scrollTop(0);
	});
	
	containerSlide.scroll(function(){
		var dd = $(this);
		dd.scrollLeft(0);
		dd.scrollTop(0);
	});
	return {updatePosition:positionQuotes}
}