// JavaScript Document

// global, root
var nav; 
var sections;
var isMSIE;
var categories;
var videos;
var preloader;
var ddNavController;
var clientsController;
var portfolios;
var myScroll;


$(document).ready(function(){

	// ------------------------------------------------------------------------
	// Feature/Browser Detection
	// ------------------------------------------------------------------------
	
	function getIsMSIE() {
	  return '\v' == 'v';
	}
		
	isMSIE = getIsMSIE();
	
	// --------------------------------------------------------------------------------
	// --------------------------------------------------------------------------------
	// psuedo-Class::log

	var log = function(msg) {
		// for IE
		if (typeof console == "undefined") {
			this.console = {log: function() {}};
		}
		console.log(msg);
		if( msg == undefined || msg == null || msg == '' ){
			//console.log( "(undefined)" );
		} else {
			if (!$('.log').size()) {
				$('<div class="log" />').appendTo('#log-window');
			}
			$('.log').append(msg.replace(/^([^:]*):(.*)$/, '<p><b>$1:</b> <span class="$1">$2</span></p>'))
				.attr({scrollTop: $('.log').attr('scrollHeight')})
				.find('p:nth-child(even)').addClass('even');
		}
	   
	};
	
	// END psuedo-Class::log
	// --------------------------------------------------------------------------------
	// --------------------------------------------------------------------------------

	
	// ------------------------------------------------------------------------
	// UI Events
	// ------------------------------------------------------------------------
	
	$("a#dd-show").bind("click",function(){
		ddNavController.showDDNav();											
	});
	
	$("a#dd-hide").bind("click",function(){
		ddNavController.hideDDNav();											
	});
	
	$("a#clients-show-less").bind('click',function(){
		//nav.showLessClients();
		clientsController.showLess();
	});
	
	$("a#clients-show-more").bind('click',function(){
		//nav.showMoreClients();
		clientsController.showMore();
	});
	
	
	// --------------------------------------------------------------------------------
	// --------------------------------------------------------------------------------
	// Mobile Device Options
	if( mdevice != null && mdevice == 0 ){
		$("#section-still #download-image-btn").hide();	
	}

	// --------------------------------------------------------------------------------
	// --------------------------------------------------------------------------------
	// Class::DropDownNav
	
	function DropDownNav(){
	}
	
	DropDownNav.prototype.showStillSubNav = function(){
		//this.section_requested.sub_menu_active = true;
		log("showStillSubNav");
		$("a#dd-show").show();
		$("a#dd-hide").hide();
		$("div#dropdown-menu").fadeIn("slow");
	}
	
	DropDownNav.prototype.hideStillSubNav = function(){
		//this.section_requested.sub_menu_active = false;
		log("hideStillSubNav");
		$("a#dd-hide").show();
		$("a#dd-show").hide();
		this.hideDDNav();
		$("div#dropdown-menu").fadeOut("fast");
	}
	DropDownNav.prototype.showDDNav = function(){
		log("showDDNav");
		$("a#dd-show").hide();
		$("a#dd-hide").show();
	
		$("#dropdown-menu div#menu-container").stop(true, true).fadeIn("slow");
	}

	DropDownNav.prototype.hideDDNav = function(){
		log("hideDDNav");
		$("a#dd-hide").hide();
		$("a#dd-show").show();
		$("#dropdown-menu div#menu-container").stop(true, true).fadeOut("fastr");
	}
	
	
	// END Class::DropDown
	// --------------------------------------------------------------------------------
	// --------------------------------------------------------------------------------
	
	
	
	// --------------------------------------------------------------------------------
	// --------------------------------------------------------------------------------
	// Class::Clients
	
	
	function Clients(){
	}
	
	Clients.prototype.showMore = function(){
		//$("#section-about-client-list").show();
		var elList  = $("#section-about-client-list");
		var elMain= $("#section-about-main");
		var mainTargX = -1200;
		var listTargX = 0;
		
		elMain.animate({left: mainTargX,opacity:0.0},
					   {duration: 600,specialEasing: { left: 'easeOutCubic'},
					   complete: function() {}
					   });
		
		elList.fadeIn("slow");
		elList.animate({left: listTargX,opacity:1},
					   {duration: 1000,specialEasing: {left: 'easeInOutCubic'},
					   complete: function() {}
		  				});
		
	}
	Clients.prototype.showLess = function(){
		var elList  = $("#section-about-client-list");
		var elMain= $("#section-about-main");
		var mainTargX = 0;
		var listTargX = 1000;
	
		elMain.animate({left: mainTargX,opacity:1},
					   {duration: 1000, specialEasing: { left: 'easeInOutCubic'	},
						complete: function() { }
		 				});
		
		elList.animate({left: listTargX, opacity:0.0},
					   {duration: 600, specialEasing: { left: 'easeOutCubic'},
						complete: function() { }
		 				});
	}
	
	// END Class::Clients
	// --------------------------------------------------------------------------------
	// --------------------------------------------------------------------------------
	
	
	
	// --------------------------------------------------------------------------------
	// --------------------------------------------------------------------------------
	// Class::Section

		
	function Section( id, html_title, slug, el ){
		this.type = "section";
		this.id = id;
		this.el = el;
		this.html_title = html_title;
		this.slug = slug;
		this.active = false;
		this.sub_menu_active = false;
		this.subsections = new Array();
		this.current_subsection_id = 0;
		if( el != null || el != undefined ){
			el.data('data',{id: id} );
		}
	}
	
	Section.prototype.show = function(){
		if( !this.inited ){
			this.init();
		}
		
		// Submenu
		if( this.slug == 'still' ){
			ddNavController.showStillSubNav();//**hack
		}
		
		nav.state = this.SHOWING_SECTION;
		this.el.fadeIn("slow", function(){
			//log("fadeIn section");
			nav.state = nav.SHOW_SECTION_COMPLETE;
			nav.resume();								
		});
	}
	
	Section.prototype.hide = function(){
		nav.state = this.HIDING_SECTION;
		if( this.slug == 'still' ){
			ddNavController.hideStillSubNav();//**hack
		}
		var n = this.html_title;
		
		this.el.fadeOut("fast", function(){
			 //log("fadeOut Section");
			nav.state = nav.HIDE_SECTION_COMPLETE;
			nav.resume();								
		});
	}
	
	Section.prototype.init = function(){
		//log("Section init()");	
	}
	
	Section.prototype.addSubSection = function( ss ){
		this.subsections[ this.subsections.length ] = ss;
	}
	
	Section.prototype.getSlug = function(){ return this.slug; }
	
	Section.prototype.getEl = function(){ return this.el; }
	
	Section.prototype.getId = function(){ return this.el; }
	
	Section.prototype.getTitle = function(){ return this.html_title;	}
	
	Section.prototype.getActive = function(){ return this.active; }
	
	Section.prototype.getNumSubSections = function(){ return this.subsections.length; }
	
	Section.prototype.getSubSectionById = function( id ){
		if( id >= 0 && id < this.subsections.length ){
			var ss = this.subsections[id];
			if( ss != null ){
				return ss;	
			}
		}
		return false;	
	}
	

	// END Class::Section
	// --------------------------------------------------------------------------------
	// --------------------------------------------------------------------------------
	
	
	// --------------------------------------------------------------------------------
	// --------------------------------------------------------------------------------
	// Class::Section
	
	function SubSection( id, html_title, slug, el ){
		this.type = "subsection";
		this.id = id;
		this.el = el;
		this.html_title = html_title;
		this.slug = slug;
		this.inited = false;
		//log("SubSection: " + this.id + ", " + this.slug);
		this.active = false;
		if( el != null  ){
			el.data('data',{id: id} );
		}
	}
	
	SubSection.prototype.show = function(){
		if( !this.inited ){
			this.init();
		}
		
		nav.state = this.SHOWING_SUBSECTION;
		if( this.el != null ){			
			this.el.fadeIn(200, function(){
			//log("fadeIn SubSection");
			nav.state = nav.SHOW_SUBSECTION_COMPLETE;
			nav.resume();								
		});
			
		} else {
			//log(this.el);
		}
	}
	
	SubSection.prototype.hide = function(){
		nav.state = this.HIDING_SUBSECTION;
		
		this.el.fadeOut(100, function(){
			//log("fadeOut SubSection");
			nav.state = nav.HIDE_SUBSECTION_COMPLETE;
			nav.resume();								
		});
	}
	
	SubSection.prototype.addSubsection = function( id, html_title, slug, el ){
		this.subsections[ this.subsections.length ] = new SubSection( id, html_title, slug, el );	
	}
	
	
	SubSection.prototype.init = function(){
		// extend me
		//log("SubSection init()");
	}
	SubSection.prototype.getSlug = function(){ return this.slug; }
	
	SubSection.prototype.getEl = function(){ return this.el; }
	
	SubSection.prototype.getId = function(){ return this.el; }
	
	SubSection.prototype.getTitle = function(){ return this.html_title;	}
	
	SubSection.prototype.getActive = function(){ return this.active; }
	
	// END Class::Section
	// --------------------------------------------------------------------------------
	// --------------------------------------------------------------------------------
	

	
	
	// --------------------------------------------------------------------------------
	// --------------------------------------------------------------------------------
	// Class::Videos

	function Videos( ){
		this.list = new Array();
		this.count = 0;
		this.firstView = true;//first run flag
		this.images_per_screen = 4;
		this.max_pages = 0;
		this.cur_page = 0;
		this.pre_page = 0;
		this.page_width = 1000;
		this.loaded = false;
		this.thumb_opacity_off = .5;
		this.thumb_opacity_on = 1.0;
		this.image_path = '/media/video/';
	}
	
	Videos.prototype.addItem = function( video ){
		this.list[this.count++] = video;
	}
	
	Videos.prototype.loadXML = function(){
		var jqxhr = $.get("media/videos.xml", function(data) {
		videos.parseXML(data);
	  })
	  .success(function( data ) {  })
	  .error(function( data ) {  })
	  .complete(function(data) {  });
	//jqxhr.complete(function(){ log("second complete"); });
	}

	Videos.prototype.parseXML = function (data) {
		if (isMSIE ) {
			 xml = new ActiveXObject("Microsoft.XMLDOM");
			 xml.async = true;
			 xml.loadXML(data);
		} 
		  else {
			xml = data;
		}

		$(xml).find('video').each(function(){
			var id = $(this).attr("id");
			var w = $(this).attr("width");
			var h = $(this).attr("height");
			var title = $(this).text();
			videos.addItem( new Video( id, w, h, title ) );  
		}); 
		
		videos.onLoadXML();
	}
	
	
	Videos.prototype.onLoadXML = function(){
		log("onLoadXML");
		this.loaded = true;
		
		var pos = $("ul#videos-text");
		
		if(!(this.list.length > 0 )) return;
		for ( var i = 0; i < this.list.length; i++){
			pos.append("<li>" + this.list[i].title + " (" + this.list[i].id + ")</li>");  
		}
		
		this.count = 0; // reset

		this.loadThumbs();
		
		// Add actions to buttons
		var el_next = $("a#navigator-motion-next");
		var el_prev = $("a#navigator-motion-previous");
		el_prev.addClass("inactive-btn");
		
		//el_next.data( { videoWidth:video.width, videoHeight:video.height} );
		el_next.bind("click", function( event ){
			videos.navThumbs(1);						   
		});
		if(this.cur_page != 0 ){
			el_prev.bind("click", function( event ){
				videos.navThumbs(-1);						   
			});
		}
		
		
		//el_prev.data( { videoWidth:video.width, videoHeight:video.height} );
	}
	
	Videos.prototype.init = function(){
		//log("Videos::init");
	}
	
	Videos.prototype.hideNavigator = function(){
		//log("Videos::hideNavigator()");	
		var navigator_el = $("div#navigator-motion");
		navigator_el.fadeOut("fast",function(){});
	}
	
	Videos.prototype.showNavigator = function(){
		//log("Videos::showNavigator()");
		var navigator_el = $("div#navigator-motion");
		navigator_el.fadeIn("slow",function(){});
	}
	
	Videos.prototype.navThumbs = function( dir ){
		var el_thumbs = $("div#section-motion div#section-motion-inner div#videos-container div#video-thumbs");
		var el_next = $("a#navigator-motion-next");
		var el_prev = $("a#navigator-motion-previous");
		
		// update buttons
		this.pre_page = this.cur_page;
		this.cur_page = (  dir > 0 ) ? this.cur_page + 1 : this.cur_page -1;
		
		//log("cur page: " + this.cur_page + " pre page: " + this.pre_page +" max pages: " + this.max_pages );
		
		if( this.cur_page == (this.max_pages -1 ) ){
			// disable next button
			var el_next = $("a#navigator-motion-next");
			el_next.unbind("click");
			el_next.addClass("inactive-btn");
		} else {
			el_next.unbind("click");
			// renable the next button
			el_next.removeClass("inactive-btn");
			el_next.bind("click", function( event ){
				videos.navThumbs(1);						   
			});
		}
		
		if( this.cur_page == 0){
				//el_prev.removeClass("inactive");
				el_prev.addClass("inactive-btn");
				el_prev.unbind("click");
		} else {
			el_prev.removeClass("inactive-btn");
			el_prev.unbind("click");
			el_prev.bind("click", function( event ){
			videos.navThumbs(-1);						   
		});
		}
		
		// Update positions
		var targX = 0 - (this.cur_page * this.page_width);
		var targXStr = targX + "";
		el_thumbs.animate({
			left: targX,
		  }, {
			duration: 800,
			specialEasing: {
			  left: 'easeInOutCubic'
			},
			complete: function() {
			}
		  });
		
		// Update text
		$("#motion-navigator-page-num").text( this.cur_page + 1 );
		
	}
	
	Videos.prototype.onNavComplete = function(){
		//log("Videos.onNavComplete");
	}
	
	Videos.prototype.loadThumbs = function(){
		//console.log("loadThumbs, count:" + this.count);
	
		var video = this.list[this.count];
		var pos = $("div#section-motion div#section-motion-inner div#videos-container div#video-thumbs");
		var xPos = ( ( this.count % 2 ) ? 480 : 0) + Math.floor(this.count / this.images_per_screen ) * this.page_width;
		var yPos = ( (this.count) % 4  > 1) ? 260 : 0;
		//log("count: " + this.count + " x: " + xPos + ", yPos: " + yPos );
		var newElStr = '<div id="video-thumb-' + (this.count+1) + '"' +
						'style="position:absolute;top:' + yPos + 'px;left:' + xPos + 'px;">' +
						'<a href="http://player.vimeo.com/video/' + 
						video.id + '?title=0&amp;byline=0&amp;portrait=0&autoplay=true"></a></li>';
		pos.append( newElStr );
		var el = $('div#video-thumb-'+(this.count+1) +' a');
		
		// set initial opacity
		el.addClass('vthumb-loading');
		
		var imgFile = this.image_path + video.id + ".jpg";
		
		var img = new Image();
		el.data( { videoWidth:video.width, videoHeight:video.height} );
		log("video w: " + video.width + " h: " + video.height);
		$(img)
		.load(function () {
		  $(this).hide();
		  $(el)
			.removeClass('vthumb-loading')
			.bind('mouseenter',function(){
				$(this).stop(true,true).animate({opacity:videos.thumb_opacity_on},
				   {duration: 200,specialEasing: { opacity: 'easeOutSine'},
				   complete: function() {}
				 });
			})
			.bind('mouseleave',function(){
				$(this).stop(true,true).animate({opacity:videos.thumb_opacity_off},
				   {duration: 300,specialEasing: { opacity: 'easeOutQuad'},
				   complete: function() {}
				 });			
			})
			.css('opacity',videos.thumb_opacity_off)
			.append(this)
			.fancybox({
				//'width' : el.data('videoWidth'),
				//'height' : el.data('videoHeight')
				'width' : parseInt(video.width),
				'height' : parseInt(video.height)
			});
			
			if( videos.count < videos.list.length-1){
				videos.count++;
				videos.loadThumbs();
				videos.updateView();
			} else {	
				videos.onLoadThumbs();
			}
			
		  $(this).fadeIn("slow");
		  
		})
		.error(function () { })
		.attr('src', imgFile );
		
		
		// ----
	}
	
	Videos.prototype.updateView = function(){
		// update view
		this.total_images = this.count + 1;	
		this.max_pages = Math.ceil( this.total_images / this.images_per_screen );
		//log("this.total_images : " +this.total_images );
		$("#motion-navigator-page-num-max").text( this.max_pages );
		if( this.total_images > this.images_per_screen && this.firstView){
			this.firstView = false;
			$("div#motion-navigator-buttons").fadeIn("slow");
		}
	}
	
	Videos.prototype.onLoadThumbs = function(){
		log("onLoadThumbs");	
	}
	
	function Video( id, w, h, title ){
		//log("new Video(" + id + ", " + w + ", " + h + ", " + title + ")");
		this.id = id;
		this.width = w;
		this.height = h;
		this.title = title;
	}
	
	// END Class::Videos
	// --------------------------------------------------------------------------------
	// --------------------------------------------------------------------------------


	// --------------------------------------------------------------------------------
	// --------------------------------------------------------------------------------
	// Class::Writers
	
	
	
	// END Class::Writers
	// --------------------------------------------------------------------------------
	// --------------------------------------------------------------------------------
	
	
	
	
	// --------------------------------------------------------------------------------
	// --------------------------------------------------------------------------------
	// Class::Navigation

	
	function Navigation( ){
		this.id = 0;
		this.first = true;
		this.isNavigating = false;
		this.current_section = null;
		this.previous_section = null;
		this.sections = new Array();
		this.section_requested;
		this.subsection_requested;
		this.state = 0;
		this.AVAILABLE = 0;
		this.PAUSED = 1;
		this.BUSY = 2;
		this.SHOW_SECTION_COMPLETE = 3;
		this.HIDE_SECTION_COMPLETE = 4;
		this.SHOW_SUBSECTION_COMPLETE = 5;
		this.HIDE_SUBSECTION_COMPLETE = 6;
		this.still_page_pre_id = 0;
		still_page_cur_id = 0;
	}
	
	Navigation.prototype.updateMainMenu = function(){
		if( this.current_section != null ){
			$("div#site-nav li a").eq( this.current_section.id - 1).removeClass("selected");
		}
		if( this.section_requested != null ){
			$("div#site-nav li a").eq( this.section_requested.id -1 ).addClass("selected");
		}
	}
	
	
	Navigation.prototype.navigateHome = function( ){
		var section = this.getSection( 0 );
		if(!(this.current_section == section || this.current_section == null)){
			this.previous_section = this.current_section;
			this.previous_section.hide();
		}
		this.current_section = section;
		this.current_section.show();
		
		this.hideHeaderFooter();
		
	}
	
	Navigation.prototype.showHeaderFooter = function(){
		$("#sections-header").fadeIn("slow");
		//$("#sections-footer").fadeIn("slow");	
	}
	
	Navigation.prototype.hideHeaderFooter = function(){
		$("#sections-header").fadeOut("fast");
		//$("#sections-footer").fadeOut("fast");
	}
	
	
	Navigation.prototype.pause = function(){
		this.state = this.PAUSED;
	}
	
	Navigation.prototype.resume = function(){
		switch( this.state ){
			case this.HIDE_SECTION_COMPLETE:
				//log("HIDE_SECTION_COMPLETE");
				this.onHideSection();
				break;
			case this.SHOW_SECTION_COMPLETE:
				//log("SHOW_SECTION_COMPLETE");
				this.onShowSection();
				break;
			case this.HIDE_SUBSECTION_COMPLETE:
				//log("HIDE_SUBSECTION_COMPLETE");
				this.onHideSubSection();
				break;
			case this.SHOW_SUBSECTION_COMPLETE:
				//log("SHOW_SUBSECTION_COMPLETE");
				this.onShowSubSection();
				break;
			case this.PAUSED:
				//log("PAUSED");
				break;
			case this.COMPLETE:
				//log("COMPLETE");
				this.onNavigationComplete();
				break;
			default:
				break;
		}
	}

	Navigation.prototype.onNavigationComplete = function(){
		//log("Nav done.");
		this.state = this.AVAILABLE;
	}
	
	Navigation.prototype.onHideSection = function(){
		if( this.section_requested ){
			// If coming from home, show header/footer
			//log( "cur id: " + this.current_section.id + " req id: " + this.section_requested.id );
			this.section_requested.show();
			
			// Show/Hide Header & Footer
			if( this.current_section.id == 0 && this.section_requested.id > 0){
				//log("showHeaderFooter");
				this.showHeaderFooter(); 
			} 
			
			if( this.current_section.slug == "motion" ){
				videos.hideNavigator();
			} 
		
		}
	}
	Navigation.prototype.onHideSubSection = function(){
		if( this.subsection_requested ){
			this.subsection_requested.show();
		}
	}
	Navigation.prototype.onShowSection = function(){
		
		//log("set previous_section here");
		this.previous_section = this.current_section;
		this.current_section = this.section_requested;
		this.section_requested = null;

		if( this.subsection_requested ){
			//log("sub requested");
			this.subsection_requested.show();
		} else if( this.current_section.getNumSubSections() > 0 ){
			//log("sub requested, but no id given");
			this.subsection_requested = this.current_section.getSubSectionById(0);
			if( this.subsection_requested != null ){
				this.current_section.current_subsection_id = this.subsection_requested.id;
				this.subsection_requested.show();
			} else {
				//log("oops, current sebsection problem: " + this.subsection_requested.id);	
			}
		} else {
			this.state = this.COMPLETE;
			this.resume();
		}
		
		// Do extra tasks
		if( this.current_section.slug == "motion" ){
			videos.showNavigator();
		} 
		
	}
	
	Navigation.prototype.onShowSubSection = function(){
		//log("onShowSubSection");
		// As deep as navigation will go, halt
		this.previous_subsection = this.current_subsection;
		this.current_subsection = this.subsection_requested;
		this.current_subsection.current_subsection_id = this.subsection_requested.id;
		this.subsection_requested = null;
		this.state = this.COMPLETE;
		this.resume();
	}
	
	
	Navigation.prototype.navigateSection = function ( ){
		//log("navigateSection(" + this.section_requested.id + ")");
		if(this.current_section != null){
			//log("previous_section: " + this.current_section.id);
		} else{
			//log("no previous_section");
		}
		if( this.current_section != null ){
			this.current_section.hide();
			if( this.section_requested.id == 0 ){
				this.hideHeaderFooter(); 
			}
		} else {
			this.section_requested.show(); // no history, show requested section
			if( this.section_requested.id > 0 ){
				this.showHeaderFooter();
			}
			
		}
		
	}
	
	
	Navigation.prototype.navigateSubSection = function (){
		//log("navigateSubSection(" + this.section_requested.slug + ", " + this.subsection_requested.slug +")");

		if( this.current_section != null ){ // already in a section
			//log("current_section != null ");
			if( this.current_section.slug == this.section_requested.slug ){
			//	log("cur slug == requestd slug");
				// within current section
				//this.previous_section = this.current_section;
				//this.current_section = this.section_requested;
				if( this.current_subsection != null ){
					//log("hide pre sub");
					//this.previous_subsection = this.current_subsection;
					//this.current_subsection = this.subsection_requested;
					this.current_subsection.hide();
				} else {
					//log("show current sub");
					//this.current_subsection = this.subsection_requested;
					//this.current_section.current_subsection_id = this.current_subsection.id;
					this.subsection_requested.show();
				}
			} else {
				// new section
			//log("navigateSubSection, but nav section first");
			this.navigateSection( );
			}
		} else {
			//log("navigateSubSection, but nav section first, no section yet");
			this.navigateSection( );
		}
	}
	
	Navigation.prototype.toggleClients = function(){
		var el_clients = $('#section-about-client-list');
		var el_main = $('#section-about-main');
		if(el_main.is(':visible')){
			el_main.hide();
			el_clients.show();
		} else {
			el_main.show();
			el_clients.hide();
		}
	}
	
	Navigation.prototype.handleNavigationEvent = function ( event ){
	
		// event.value, event.data.msg, event.pathNames[], 
		// NB: alue, path, pathNames, parameterNames, parameters and queryString
		
		var paths = event.pathNames;
		
		if( paths.length == 0 ){
			//log("path = 0 length");
			if( this.current_section == null || this.current_section.id != 0 ){
				this.section_requested = nav.getSectionBySlug( "" );
				this.subsection_requested = null;
				this.current_subsection = null;
				this.previous_subsection = null;
				nav.navigateSection();
			}
		} else if( paths.length == 1 ){
			this.section_requested = nav.getSectionBySlug(  event.pathNames[0].toLowerCase() );
			if( this.section_requested != false ){
				if( this.section_requested.getNumSubSections() > 0 ){
					if( this.current_subsection != null ){
						var id = this.section_requested.current_subsection_id;
						this.subsection_requested = this.section_requested.getSubSectionById(id);
						//this.current_subsection = null;
						//this.previous_subsection = null;
						//log(this.current_subsection.id + ", " + this.current_subsection.html_title);
						nav.navigateSubSection();
					} else {
						nav.navigateSection( );	
					}
					
				} else {
					nav.navigateSection( );	
				}
			}
		} else if( paths.length >= 2){
			this.section_requested = nav.getSectionBySlug( event.pathNames[0].toLowerCase() );
			if( this.section_requested != false ){
				this.subsection_requested = this.getSubSectionBySlug(event.pathNames[0].toLowerCase(),  event.pathNames[1].toLowerCase() );
				if( this.subsection_requested != false ){
					//log("section: " + this.section_requested.slug + " sub slug: " + this.subsection_requested.slug );
					nav.navigateSubSection();
				} else {
					//log("subsection is false: " +  event.pathNames[1].toLowerCase());	
				}
			}
		}
		
		nav.updateMainMenu();
		//nav.onNavigationComplete();
	}
	
	
	
	Navigation.prototype.init = function(){
		$("#sections-container").fadeIn("slow");
	}
	
	
	// ------------------------------------------------------------------------------------
	// Get/Set
	
	Navigation.prototype.addSection = function( section ){
		this.sections[this.sections.length] = section;
	}
	
	Navigation.prototype.getSectionById = function( id ){
		if( id >= 0 && id < this.sections.length ){
			var section = this.sections[id];
			if( section == null || section == undefined ){
				return false;
			} else  {
				return this.sections[id];
			}
		} else {
			return false;
		}
	}
	
	Navigation.prototype.getSubSectionBySlug = function( section_slug, subsection_slug){
		log("getSubSectionBySlug("+section_slug+","+subsection_slug+")");
		var section = this.getSectionBySlug( section_slug );
		if( !section || !(section.getNumSubSections() > 1) ){
			log("no subsections");
			return; // section is invalid or has no subsections
		} else {
			for( var i = 0; i < section.subsections.length; i++){
				var ssobj = section.subsections[i];
				//log(i + "ss slug: " + section.subsections[i].slug );
				if( section.subsections[i].getSlug() == subsection_slug ){
					return section.subsections[i];	
				}
			}
		}
		return false;
	}
	
	Navigation.prototype.getSectionBySlug = function( section_slug ){
		for( var s in this.sections ){
			if( this.sections[s].getSlug() == section_slug ){
				return this.sections[s];
			}
		}
		return false;
	}
	
	Navigation.prototype.returnToThumbView = function(){
		var id = portfolios.current_id;
		this.navigateFromDDMenu( id );
	}
	
	Navigation.prototype.navigateFromDDMenu = function( id ){
		//log("navigateFromDDMenu("+id+")");
		
		ddNavController.hideDDNav();
		
		log("Navigation::navigateFromDDMenu");
		var el_navigator = $("div#navigator-still");
		el_navigator.stop(true,true).fadeOut("fast");
		
		// update portfolio IDs
		portfolios.previous_id = portfolios.current_id;
		portfolios.current_id = id;
		
		var el;//reuse
		var previous_portfolio = portfolios.portfolios[ (portfolios.previous_id-1) ];
		var current_portfolio = portfolios.portfolios[(id-1)];
		
		current_portfolio.view = this.THUMB_VIEW;
	
		if( portfolios.previous_id > 0 ){
			var pc = portfolios.portfolios[(portfolios.previous_id-1)];
			if( portfolios.previous_id != portfolios.current_id ){
				// unset previous menu item
				el = $('a#dd-item' + previous_portfolio.menu_id);
				el.removeClass("dd-selected");
			}
		}
		
		// set current menu item
		el = $('a#dd-item' + current_portfolio.menu_id);
		el.addClass("dd-selected");
		
		// update title in top mene	
		var title_el = $("a#a-category-title");
		title_el.text( current_portfolio.title.toUpperCase() );
		title_el.addClass("inactive");
		title_el.unbind('click');
		
		
		
		
		// ----------------------------------------------------
		// Load content into category section
		if( !current_portfolio.loaded ){
			portfolios.loadPortfolio( current_portfolio );
		}
		
		// ----------------------------------------------------
		// Swap sections in main content area
		 
		
		//this.still_page_pre_id = this.still_page_cur_id;
		//this.still_page_cur_id = id;
		//log("#section-still-thumbs #thumb-page" +  portfolios.current_id);
		//log("previous id: " +  portfolios.previous_id );
		var el_cur = $("#section-still-thumbs #thumb-page" +  current_portfolio.menu_id);
		var el_pre;
		var el_pre_to_fade;
		var el_cur_to_fade = $("#section-still-thumbs");
		
		if( portfolios.previous_id > 0 ){
			
			if(previous_portfolio.view == portfolios.FULL_VIEW ){
				el_pre_to_fade = $("#section-still-viewer");
				//$("#section-still-viewer-inner").fadeOut("fast");
			} else {
				el_pre_to_fade = $("#section-still-thumbs");	
			}
		
			el_pre_to_fade.fadeOut("fast", function(){
				 $("#section-still-viewer").fadeOut("fast", function(){
				previous_portfolio.resetView();//hides both thumb and viewer pages
				el_cur.show(); // cur thumb page
				el_cur_to_fade.fadeIn("slow",function(){
				});							 
			 });
			
			});
			
		} else {
			//log("fadeIn cur");
			el_cur.fadeIn("slow",function(){});		
		}
	}
	
	Navigation.prototype.navigateFromStillThumb = function( menu_id, image_id ){
		//log("navigateFromStillThumb(" + menu_id + ", " + image_id +")" );
		// hide current thumb section
		var portfolio =	portfolios.getCurrentPortfolio();
		
		portfolio.requested_image_id = image_id;
		
		if( !portfolio.inited ){
			portfolio.init();	
		}
		portfolio.view = portfolios.FULL_VIEW;
		portfolios.transitionThumbToFull( image_id );
	}
	
	//POE
	Navigation.prototype.onPortfoliosLoaded = function(){
		//log("Navigation::onPortfoliosLoaded (starting app)");
		//log("num ports: " + portfolios.portfolios.length);
		nav.navigateFromDDMenu( 1 );
	}
	
	// --------------------------------------------------------------------------------
	// --------------------------------------------------------------------------------
	// Class::Still
	
	function Portfolios(){
		this.portfolios = new Array();// store list of portfolio objects
		this.portfolio_load_count = 0;
		this.current_loading_portfolio = null;
		this.loaded = true;
		this.current_id = 0;
		this.previous_id = 0;
		this.THUMBS_VIEW = 0;
		this.FULL_VIEW = 1;
		this.opacity_off = .3;
		this.opacity_over = .7;
		this.thumb_opacity_off = .3;
		this.thumb_opacity_over = .8;
		this.opacity_over = .5;
		this.opacity_off = .2;
		var hn = window.location.hostname;
		var tld = hn.substr(hn.length-3,3);
		this.image_path = 'http://admin.dansaelinger.' + tld + '/uploads/';
		this.image_path_thumbs = this.image_path + 't/';
	}
	
	Portfolios.prototype.transitionThumbToFull = function( id ){
		
		ddNavController.hideDDNav();
		
		var current_portfolio = this.getCurrentPortfolio();
		//log("transitionThumbToFull(" + id +") in portfolio: " + current_portfolio.menu_id );

		current_portfolio.view = this.FULL_VIEW;
		current_portfolio.requested_image_id = id;
		
		var el_thumb_page = $("div#thumb-page" + this.current_id);
		var el_thumb_container = $("div#section-still-thumbs");
	
		el_thumb_container.fadeOut("fast",function(){
			el_thumb_page.hide();//off
			portfolios.showCurrentViewerImage( );
		});
	}
	
	Portfolios.prototype.showCurrentViewerImage = function(){
		
		var current_portfolio = this.getCurrentPortfolio();
		//log("showCurrentViewerImage()");
		
		ddNavController.hideDDNav();
		
		var el_viewer_page = $("div#viewer-page"+current_portfolio.menu_id);
		var el_page_container = $("div#page-container");
		var el_viewer_container = $("div#section-still-viewer");
		
		// before revealing the viewer page
		
		var current_portfolio = this.getCurrentPortfolio();
		var images = current_portfolio.portfolio_images;

		// hide all images
		for( var i in images ){
			//log("unset image id: " + i);
			if( images[i].getEl() != null ) {
				images[i].getEl().css('opacity',portfolios.opacity_off);
			}
			
		}
		
		// show page container (no fade)

		el_viewer_container.show();
		
		// swap requested, current, previous
		current_portfolio.previous_image_id = current_portfolio.current_image_id;
		current_portfolio.current_image_id = current_portfolio.requested_image_id;
		
		// set new position
		var current_image_id = current_portfolio.current_image_id;
		var current_image = images[(current_image_id-1)];
		
		current_image.getEl().data( {active:true} );
		current_image.getEl().removeClass("inactive").addClass("active");
		//current_image.getEl().data( {active:true} );
		
		var previous_image = current_portfolio.getPreviousImage();
		if( previous_image != null ){
		previous_image.getEl().removeClass("active").addClass("inactive");
		
		previous_image.getEl().data( {active:false} );
		}
		
		// xxx
		
		// hide all images
		
		for( var i in images ){
			var index = parseInt(i) + 1;
			//log("setViewerToImage::current image id: " + current_image_id + " vs " + i);
			if( images[i].getEl() != null ) {
				if( index > current_image_id ){
					//log("setViewerToImage::current image id RIGHT: " + current_image_id + " vs " + index);
					if( index != current_portfolio.previous_image_id ){
						images[i].getEl().css('opacity',portfolios.opacity_off);
					}
					images[i].getEl().addClass('cursor-r').removeClass('cursor-l');
				} else if ( index < current_image_id ) {
					if( index  != current_portfolio.previous_image_id ){
						images[i].getEl().css('opacity',portfolios.opacity_off);
					}
					//log("setViewerToImage::current image id LEFT: " + current_image_id + " vs " + index);
					images[i].getEl().removeClass('cursor-r').addClass('cursor-l');
				} else {
					//log("setViewerToImage::current image id Remove Both: " + current_image_id + " vs " + index);
					images[i].getEl().removeClass('cursor-r').removeClass('cursor-l');
				}
			}
		}
		
		// add new cursor class to images LEGT of the current image
		
		
		// add new cursor class to images RIGHT of the current image
		
		
		
		var target_xpos = 0- current_image.x;
		//log("target_xpos: " + target_xpos );
		el_viewer_page.css('left',target_xpos);
		
		// remove class on previous
		//log("current_portfolio.previous_image_id: "+ current_portfolio.previous_image_id);
		
		if( current_portfolio.previous_image_id > 0 ){
			//log("unset previous image with id: " + current_portfolio.previous_image_id );
			var previous_image = images[(current_portfolio.previous_image_id - 1)];
			var previous_image_el = previous_image.getEl();
			previous_image_el.removeClass("active");
			previous_image_el.addClass("inactive");
		}
		
		// set new class on current image
		var current_image_el = current_image.getEl();
		current_image_el.removeClass("inactive");
		current_image_el.addClass("active");
		current_image_el.css('opacity',0.0);
		
		//show page
		el_viewer_page.show();
		
		var secondary_images = new Array();
		var count = 1;
		var num_images = images.length;
		var offset;
		var index;
		while( count < 4 && ( num_images - count > 0 ) ){
			
			offset =  Math.ceil( count / 2);// 1 = 1, 2 = 1, 3 = 2, 4 = 2
			if( !( count % 2 ) ){
				index = ( current_image_id - offset );// if even, subtract
			}else {
				index = ( current_image_id + offset );// if even, subtract
			}
			//log("offset: " + offset + ",index: " + index);
			
			if( index > 0 && index <= num_images ){
				count++;
				secondary_images[(count-1)] = images[(index-1)];
			} else if( count % 2 == 0 ){
				count = 9999;
				continue;
			} else {
				count++;
			}

		}
		
		for( var i in secondary_images ){
			//log("secondary images: " + i );
			 if( secondary_images[i].uid != current_image.uid )
			  secondary_images[i].getEl().css('opacity',0.0);
		 }
		 
		
		
		 portfolios.updateNavigator();
		// fade in current image
		current_image_el.stop(true,true).animate({opacity:1.0},
		   {duration: 1000,specialEasing: { opacity: 'easeOutCubic'},
		   complete: function() {
			   
			 // previous_image.getEl().removeClass("active").addClass("inactive");
			 
			  
			 
		   }
		   });
		
	  
			   
		//--
		for( var i in secondary_images ){
			 if( secondary_images[i].uid != current_image.uid ){
				 secondary_images[i].getEl().stop(true,true).delay(300).animate({opacity:portfolios.opacity_off},
				   {duration: 1000,specialEasing: { opacity: 'easeOutCubic'},
				   complete: function() {	}});

			   }
		}
	}
	
	//
	
	Portfolios.prototype.showNavigator = function(){
		var el_navigator = $("div#navigator-still");
		//if ( !(el_navigator.is(":visible") ) ){
		el_navigator.stop(true,true).fadeIn("slow");
	}
	
	Portfolios.prototype.updateNavigator = function(){
		//log("updateNavigator");
		
		var current_portfolio = this.getCurrentPortfolio();
		var current_image = current_portfolio.getCurrentImage();
		
		this.showNavigator();
		// reactivate category title button
		var title_el = $("a#a-category-title");
		title_el.removeClass("inactive");
		title_el.unbind('click');
		title_el.bind('click',function(){
			// navigate back to the thumb view
			//log("using id: " +  portfolios.current_id);
			nav.navigateFromDDMenu( portfolios.current_id );
		});
		
		
		
		// update view all mouse events
		var el_view_all_btn = $("div#navigator-still a#view-all-btn");
		el_view_all_btn.unbind('click');
		el_view_all_btn.bind('click',function(){
			nav.returnToThumbView( );
		});
		
		// update previous button mouse events
		var el_previous_btn = $("a#previous-image-btn");
		var has_previous = ( current_portfolio.current_image_id > 1 ) ? true : false;
		if( has_previous || true){
			//log("has previous true");
			el_previous_btn.removeClass("inactive-btn");
			el_previous_btn.unbind('click');
			el_previous_btn.bind('click',function(){
				portfolios.showPreviousImage();										  
			});
		} else {
			//log("has previous false");
			el_previous_btn.unbind('click');
			el_previous_btn.addClass("inactive-btn");
		}
		
		// update next button mouse events
		var el_next_btn = $("a#next-image-btn");
		var has_next = ( current_portfolio.current_image_id < current_portfolio.portfolio_images.length ) ? true : false;
		if( has_next || true){
			//log("has next true");
			el_next_btn.unbind('click');
			el_next_btn.removeClass("inactive-btn");
			el_next_btn.bind('click',function(){
				portfolios.showNextImage();										  
			});
		} else {
			//log("has next false");
			el_next_btn.unbind('click');
			el_next_btn.addClass("inactive-btn");
		}
		
		// update download image button mouse events
		var el_download_btn = $("a#download-image-btn");
		el_download_btn.unbind('click');
		el_download_btn.data( { uid:current_image.uid, menu_id:current_image.menu_id } );
		el_download_btn.unbind('click');
		el_download_btn.bind('click', function(){
		   
		   var uid = $(this).data('uid');
		   var url = "/assets/inc/compcard.php?id=" + uid;
			
			var downloadURL = function(url)
			{
				//var iframe  = $("#hiddenDownloader");
				var iframe = document.getElementById("hiddenDownloader");
				if (iframe === null)
				{
					iframe = document.createElement('iframe');  
					iframe.id = "hiddenDownloader";
					iframe.style.visibility = 'hidden';
					var el = $('#hiddenDownloader');
					el.addClass("dload");
					el.css("width",0);
					el.css("height",0);
					el.hide();
					document.body.appendChild(iframe);
				}
				iframe.src = url;   
			}
			
			var hn = window.location.hostname;
			var tld = hn.substr(hn.length-3,3);
			downloadURL("http://dansaelinger." + tld + "/assets/inc/compcard.php?id=" + uid);
		
			
	  
		});
		
		// update text for current image
		var el_image_title = $("div#image-title");
		var title = current_image.title;
		el_image_title.html( title );
		
		var number_display = $("span#portfolio-num-of");
		number_display.text( current_portfolio.current_image_id + " / " + current_portfolio.portfolio_images.length );
		
	
		var el_category_title = $("span#portfolio-category-name");
		el_category_title .text( current_portfolio.title.toUpperCase() );
		
		el_category_title .unbind('click');
		el_category_title .bind('click',function(){
			nav.navigateFromDDMenu( portfolios.current_id );
		});
		
	}
	
	
	Portfolios.prototype.updateImageViewer = function(){
		//log("Portfolios::updateImageViewer");
		this.updateNavigator();
		// TODO, make sure image is in off opacity
		// TODO, make sure images are loaded/loading
		// deactive mouse events on images
		// slide viewer to requested position
		// fade in requested image
		// reactive mouse events on images
		// reactivate mouse events on buttons
	}
	
	Portfolios.prototype.transitionFullToThumb = function( id ){
		// set current image to half opacity
		// fade out full image viewer
		// fade in thumb viewer
	}
	
	
	Portfolios.prototype.setViewerToImage = function( id ){
		if( this.animating ) return;
		
		ddNavController.hideDDNav();
		
		this.animating = true;
		//log("setViewerToImage(" + id +")");
		// grab X position of this
		var current_portfolio = this.getCurrentPortfolio();
		current_portfolio.previous_image_id = current_portfolio.current_image_id;
		current_portfolio.current_image_id = id;
		this.updateNavigator();
		var current_image = current_portfolio.getCurrentImage();
		current_image.getEl().data( {active:true} );
		current_image.getEl().removeClass("inactive").addClass("active");
		// 
		var previous_image = current_portfolio.getPreviousImage();
		previous_image.getEl().removeClass("active").addClass("inactive");
		
		previous_image.getEl().data( {active:false} );
		
		
		var images = current_portfolio.portfolio_images;
		var current_image_id = current_portfolio.current_image_id;
		for( var i in images ){
			var index = parseInt(i) + 1;
			if( images[i].getEl() != null ) {
				if( index > current_image_id ){
					if( index != current_portfolio.previous_image_id ){
						images[i].getEl().css('opacity',portfolios.opacity_off);
					}
					log("setViewerToImage::current image id Right cursor: " + current_image_id + " vs " + index);
					images[i].getEl().addClass('cursor-r').removeClass('cursor-l');
				} else if( index < current_image_id ) {
				if( index  != current_portfolio.previous_image_id ){
						images[i].getEl().css('opacity',portfolios.opacity_off);
					}
						images[i].getEl().removeClass("active").addClass("inactive");
					//log("setViewerToImage::current image id Left Cursor: " + current_image_id + " vs " + index);
					images[i].getEl().removeClass('cursor-r').addClass('cursor-l');
				} else {
					//log("setViewerToImage::current image id NO Cursor: " + current_image_id + " vs " + index);
					images[i].getEl().removeClass('cursor-r').removeClass('cursor-l');
				}
				
			}
		}
		
		
		
		
		
		var target_xpos = 0 - current_image.x;
	
		var el_viewer_page = $("div#viewer-page"+current_portfolio.menu_id);
		 previous_image.getEl().stop(true,true).animate({opacity:portfolios.opacity_off},
					   {duration: 600,specialEasing: { opacity: 'easeOutCubic'},
					   complete: function() {
						   
						  previous_image.getEl().removeClass("active").addClass("inactive");
						  
						  
						  
						   }
					   });
		 
			el_viewer_page.stop(true,true).animate({left: target_xpos},
			   {duration: 600,specialEasing: { left: 'easeInOutCubic'},
			   complete: function() { 
			   
				 current_image.getEl().stop(true,true).animate({opacity:1.0},
				   {duration: 600,specialEasing: { opacity: 'easeOutCubic'},
				   complete: function() {
					   current_image.getEl().removeClass("inactive").addClass("active");
					   portfolios.animating = false;
					   }
				   });
				}
			   });
		
		// fade in new image
		
		// fade out current image
	}
	
	Portfolios.prototype.showNextImage = function(){
		//log("showNextImage");
		var next_id = this.getCurrentPortfolio().current_image_id + 1;
		var total = this.getCurrentPortfolio().portfolio_images.length;
		if(  next_id  > total ) next_id = 1;
		//log("next image: " + next_id + " total: " + total);
		this.setViewerToImage( next_id );
		
	}
	
	Portfolios.prototype.showPreviousImage = function(){
		//log("showPreviousImage");
		var next_id = this.getCurrentPortfolio().current_image_id - 1;
		var total = this.getCurrentPortfolio().portfolio_images.length;
		if(  next_id  == 0 ) next_id  = total;
		
		this.setViewerToImage( next_id );
	}
		
	Portfolios.prototype.loadXML = function(){
		//var jqxhr = $.get("assets/inc/get-portfolios.php", function(data) {
		var jqxhr = $.get("/assets/inc/get-feed.php", function(data) {
		portfolios.parseXML(data);
	  })
	  .success(function( data ) { })
	  .error(function( data ) { })
	  .complete(function(data) { });
	//  jqxhr.complete(function(){ log("second complete"); });
		
	}
	
	Portfolios.prototype.parseXML = function( data ){
		if (isMSIE ) {
			xml = new ActiveXObject("Microsoft.XMLDOM");
			xml.async = true;
			xml.loadXML(data);
		} 
		else {
			xml = data;
		}
		
		// Parse each portfolio
		$(xml).find('portfolio').each(function(){
			//log("each portfolio");
			var portfolio_uid =  $(this).attr("uid");
			var portfolio_title = $(this).find("title").text();
			// Get Title
			var portfolio = new Portfolio( portfolio_uid, portfolio_title, (portfolios.portfolios.length+1) );
			
			var images_node = $(this).find('imgs');
			images_node.find('img').each(function(){
				//var title = $(this).text();
				var uid =  $(this).attr("uid");
				var file = $(this).attr("file");
				var width = $(this).attr("width");
				var height = $(this).attr("height");
				var title =  $(this).find('t').text();
				var description =  $(this).find('d').text();
				if( file.length > 0 ){
					var portfolio_image = new PortfolioImage( uid, file, title, description, width, height );
					portfolio.addItem( portfolio_image );
				}
			});
			portfolios.addItem( portfolio );
		}); 
		
		portfolios.onLoadXML();
	}
	
	Portfolios.prototype.onLoadXML = function(){
		//log("Portfolios::onLoadXML");
		
		//this.xml_loaded = true;
		
		// Create menu items
		var pos = $("ul#category-menu");
		if(!(this.portfolios.length > 0 )) return;
		for ( var i = 0; i < this.portfolios.length; i++){
			var portfolio = this.portfolios[i];
			var idStr = 'dd-item' + portfolio.menu_id;
			//log("Portfolios.onLoadXML:: id: " + portfolio.menu_id, +", uid: " + portfolios.uid);
			var elStr = '<li><a id="' + idStr + '" href="javascript:;;">' + portfolio.title.toUpperCase() + '</a></li>';
			pos.append( elStr );
			var el = $('a#' + idStr);
			el.data( { menu_id:portfolio.menu_id, uid:portfolio.uid, url:portfolio.url} );
			el.bind('click',function(){
				nav.navigateFromDDMenu( $(this).data('menu_id') );
			});
		}
		
		// Exit if no portfolio
		if(!(this.portfolios.length > 0 )) return;
	
		//this.loadNextPortfolio(); // start loading in the background
		
		nav.onPortfoliosLoaded();//POE
	}
	
	
	Portfolios.prototype.addItem = function( portfolio ){
		//log("add portfolio menu_id: " + portfolio.menu_id );
		this.portfolios[ this.portfolios.length ] = portfolio;
		portfolio.initDOM();
	}
	
	Portfolios.prototype.loadNextPortfolio = function(){
		
		//log("loadNextPortfolio, this.portfolio_load_count = " + this.portfolio_load_count );
		this.loadPortfolio( this.portfolio_load_count );
		
	}
	
	Portfolios.prototype.loadPortfolio = function( portfolio ){
		this.current_loading_portfolio = portfolio;
		this.current_loading_portfolio.loadNextThumbImage();
	}
	
	Portfolios.prototype.onLoadPortfolio = function(){
		this.current_loading_portfolio.loaded = true;
		//log("onLoadPortfolio");
		/*
		this.portfolio_load_count++;
		if( this.portfolio_load_count < this.portfolios.length ){
			this.loadNextPortfolio();
		} else {
			log("Done loading all portfolio's thumbs.");	
		}
		*/
	}
	
	Portfolios.prototype.getCurrentPortfolio = function(){
		var portfolio = this.portfolios[ ( this.current_id - 1 )];
		if( portfolio != null ){
			return portfolio;
		}
		return null;
	}
	
	// ---------------------------------------------------------
	// ---------------------------------------------------------
	
	function Portfolio( uid, title, menu_id){
		this.uid = uid;
		this.title = title;
		this.menu_id = menu_id;
		this.requested_image_id = 0;
		this.current_image_id = 0;
		this.previous_image_id = 0;
		this.inited = false;
		//log("new Portfolio(" + uid + ", " + title + ", " + menu_id + ")");
		this.portfolio_images = new Array();//list of thumb files
		this.load_count = 0;
		this.loaded_thumbs = false;// true when ALL are loaded
		this.loaded_large_images = false;//true when ALL are loaded
		this.view = 0;
		this.right_margin = 20;// must also be changed in CSS
		//this.initDOM();
	}
	
	Portfolio.prototype.initDOM = function(){

		// Large
		var el_page_container = $("div#section-still-viewer div#pages-container");
		var viewer_page_html = '<div id="viewer-page' + this.menu_id + '" class="viewer-page"></div>';
		el_page_container.append( viewer_page_html );	
		var el_viewer_page = $('div#viewer-page' + this.menu_id);
							   
		// Thumbs
		var el_thumb_container = $("div#thumb-container");
		var thumb_page_html = '<div class="thumb-page" id="thumb-page' + this.menu_id + '">';
		el_thumb_container.append( thumb_page_html );
		var el_thumb_page = $('div#thumb-container div#thumb-page' + this.menu_id);
		
		// Loop trhough, generate widths
		var cum_width = 0;
		for( var i in this.portfolio_images ){
			var p = this.portfolio_images[i];
			p.x = cum_width;
			cum_width += p.width + this.right_margin;
		}
		
		cum_width -= this.right_margin;
		el_viewer_page.css('width',cum_width);
		
		// reset vars
		thumb_page_html =  '';
		viewer_page_html = '<ul style="width:' + cum_width + 'px;">';
		
		// Loop through all portfolio images, 20 max
		var col_count = 0;
		
		
		for( var i = 0; i < this.portfolio_images.length && i < 20;i++ ){
			
			var last_image = !( i < this.portfolio_images.length - 1 && i < 19 );
			var portfolio_image = this.portfolio_images[i];
			
			// ----------------------------------------------------------------------------
			// Thumbs
			
			if( col_count == 0 ) thumb_page_html += '<ul class="col">';
			
			thumb_page_html += '<li>';
			thumb_page_html += '<a  class="still-thumb-loading" id="' + 'st' + (i+1) + '" href="javascript:;">'
			thumb_page_html += '</a>';
			thumb_page_html += '</li>';
			
			col_count++;
			
			if( col_count == 5 || last_image  ){
				col_count = 0;
				thumb_page_html += '</ul>';	
			}
			
			// -----------------------------------------------------------------------------------
			// Large
			var margin = ( last_image ) ? 0 : this.right_margin;
			viewer_page_html += '<li class="inactive" style="margin-right:' + margin + 'px;width:' + portfolio_image.width + 'px;" id="full-image' + (parseInt(i)+1) + '" class="inactive">';
			viewer_page_html += '<li><!-- insert image -->';
			viewer_page_html += '</li>';
			if( last_image ) viewer_page_html += '</ul>';
			
		}
		
		// Close and append large images html
		el_viewer_page.append(  viewer_page_html );
		
		// Close and append thumb images html
		el_thumb_page.append( thumb_page_html );
		
		this.inited = true;
		
	}
	
	Portfolio.prototype.resetView = function(){
		log("resetView in " + this.menu_id);
		this.view = portfolios.THUMB_VIEW;
		this.getFullEl().hide();
		this.getThumbsEl().hide();
	}
	
	
	Portfolio.prototype.onLoadedThumbs = function(){
		this.loaded_thumbs = true;
		log("onLoadedThumbs");	
	}
	
	Portfolio.prototype.onLoadedLargeImages = function(){
		this.loaded_large_images = true;
		log("onLoadedLargeImages");
	}
	
	Portfolio.prototype.getCurrentImage = function(){
		return this.portfolio_images[ (this.current_image_id - 1) ];	
	}
	
	Portfolio.prototype.getPreviousImage = function(){
		log("previous id: " + this.previous_image_id );
		if( this.previous_image_id > 0 )
			return this.portfolio_images[ (this.previous_image_id - 1) ];	
		else 
			return null;
	}
	
	Portfolio.prototype.getFullEl = function(){
		var el = $("div#viewer-page" + this.menu_id );
		el.fadeOut("slow");
		if(el != null){
			return el;
		}
		return null;
	}
	
	Portfolio.prototype.getThumbsEl = function(){
		var el = $("div#section-still-thumbs div#thumb-page" + this.menu_id );
		if(el != null)
			return el;
		return null;
	}
	
	Portfolio.prototype.addItem = function( portfolio_image ){
		//log("add PortfolioImage, file: " + portfolio_image.file );
		this.portfolio_images[ this.portfolio_images.length ] = portfolio_image;
	}
	
	
	// RECURSIVE thumb loader
	Portfolio.prototype.loadNextThumbImage = function(){
		
		// Thumb Image
		var portfolio_image = this.portfolio_images[this.load_count];
		var index_id = this.load_count + 1;
		var img = new Image();
		var img_file = portfolios.image_path_thumbs + this.portfolio_images[this.load_count].file;
		//log("loadNextThumbImage, id: " + this.menu_id + " load_count: " + this.load_count + ", total images: " + this.portfolio_images.length +  "file: " + img_file );
		//log("loadNextThumbImage: " + img_file);
		

		// Add data to the video, for fancybox
		var el_thumb = $('div#thumb-page' + (this.menu_id) + ' a#st' + index_id);
		
		el_thumb.data( { menu_id:this.menu_id, uid:this.uid, image_id:index_id } );
		el_thumb.addClass('still-thumb-loading');
		
		$(img)
		.load(function () {
		  $(this).hide();
		  $(el_thumb)
			.removeClass('still-thumb-loading')
			.bind('mouseenter',function(){
				$(this).stop(true,true).animate({opacity:videos.thumb_opacity_on},
				   {duration: 200,specialEasing: { opacity: 'easeOutSine'},
				   complete: function() {}
				 });
			})
			.bind('mouseleave',function(){
				$(this).stop(true,true).animate({opacity:videos.thumb_opacity_off},
				   {duration: 300,specialEasing: { opacity: 'easeOutQuad'},
				   complete: function() {}
				 });			
			})
			.append(this);
			
			// Attach mouseevents
			
			el_thumb.css('opacity',portfolios.thumb_opacity_off);
			
			el_thumb.bind('click',function(){
				var menu_id = $(this).data('menu_id');
				var image_id = $(this).data('image_id');
				nav.navigateFromStillThumb( menu_id, image_id );
			}).bind('mouseenter',function(){
				$(this).stop(true,true).animate({opacity:portfolios.thumb_opacity_over},
				   {duration: 150,specialEasing: { opacity: 'easeOutQuad'},
				   complete: function() {}
				});
			})
			.bind('mouseleave',function(){
				$(this).stop(true,true).animate({opacity:portfolios.thumb_opacity_off},
				   {duration: 300,specialEasing: { opacity: 'easeOutQuad'},
				   complete: function() {}
				 });			
			});
			
			portfolios.getCurrentPortfolio().loadNextLargeImage();
			
			$(this).fadeIn("slow");
		  
		})
		.error(function () { })
		.attr('src', img_file );		
	}
	
	Portfolio.prototype.loadNextLargeImage = function(){
		
		//log("loadNextLargeImage, id: " + this.menu_id + " load_count: " + this.load_count + ", total images: " + this.portfolio_images.length );
		
		// Load image
		var portfolio_image = this.portfolio_images[this.load_count];
		var index_id = this.load_count + 1;
		var img = new Image();
		var img_file = portfolios.image_path + this.portfolio_images[this.load_count].file;
		
		var el_image = $("div#section-still-viewer-inner div#viewer-page" + this.menu_id +" li#full-image" + index_id );
		el_image.data( { image_id:index_id, uid:portfolio_image.uid, active:false} );
		portfolio_image.setEl( el_image );
		//el_thumb.css('opacity',videos.thumb_opacity_off);
		
		$(img)
		.load(function () {
		  $(this).hide();
		  $(el_image)
			.removeClass('still-image-loading')
			.bind('click',function(){
				log("active: " + $(this).data('active') );
				if( $(this).data('active') != true ){
				//var menu_id = $(this).data('menu_id');
				var image_id = $(this).data('image_id');
				//log("image_id: " + image_id );
				portfolios.setViewerToImage( image_id );
				}
			})
			.bind('mouseenter',function(){
				if( $(this).data('active') != true ){
					$(this).stop(true,true).animate({opacity:portfolios.opacity_over},
					   {duration: 200,specialEasing: { opacity: 'easeOutSine'},
					   complete: function() {}
					 });
				}
			})
			.bind('mouseleave',function(){
				if( $(this).data('active') != true ){
					$(this).stop(true,true).animate({opacity:portfolios.opacity_off},
					   {duration: 300,specialEasing: { opacity: 'easeOutQuad'},
					   complete: function() {}
					 });
				}
			})
			.append(this);
			

			
			portfolios.getCurrentPortfolio().onLoadPortfolioImage();
			
			$(this).fadeIn("slow");
		  
		})
		.error(function () { })
		.attr('src', img_file );		
		
		
		
		/*
		el_image.bind('click',function(){
			portfolios.setViewerToImage( $(this).data('image_id') );
			log( "image_id: " + $(this).data('image_id') + ", uid: " + $(this).data('uid') );
		});
		
		// mouseover
		el_image.bind('mouseover',function(){
			if( $(this).data('active') != true ){
				$(this).animate({opacity:.6},
				   {duration: 150,specialEasing: { opacity: 'easeOutCubic'},
				   complete: function() {}
				 });
			}
		});
		
		el_image.bind('mouseleave',function(){
		if( $(this).data('active') != true ){
			$(this).animate({opacity:.3},
			   {duration: 200,specialEasing: { opacity: 'easeOutCubic'},
			   complete: function() {}
			   });
			}
		});
		*/
		
		
		// on load image, set mouse events, and reveal image
		
		// Call back to reveal thumb
		
		// Callback to load next thumb
	}
	
	Portfolio.prototype.onLoadPortfolioImage = function(){
		this.load_count++;
		if( this.load_count >= this.portfolio_images.length ){
			// done
			portfolios.onLoadPortfolio();
			
		} else {
			this.loadNextThumbImage();
		}
	}
	
	Portfolio.prototype.updateView = function(){
	}

	
	// ---------------------------------------------------------------------------
	
	function PortfolioImage( uid, file, title, description, width, height ){
		//log( uid +", " + ", " + file + ", " + title + ", "+  description + ", " + width + ", " + height );
		//log( uid +", " + ", " + file + ", "+  description + ", " + width + ", " + height );
		this.uid = parseInt(uid);
		this.title = title;
		if( file != null )
		this.file = file;
		this.width = parseInt(width);
		this.height = parseInt(height);
		this.thumbLoaded= false;
		this.thumbLoading = false;
		this.photoLoaded = false;
		this.photoLoading = false;
		this.isActive = false;
		this.x = 0;
		this.imagePosition = 0;
		this.el = null;
	}
	
	PortfolioImage.prototype.loadImage = function( ){
	}
	
	PortfolioImage.prototype.onLoad = function(){
	}
	
	PortfolioImage.prototype.setEl = function( el ){
		//log("setting el for " + this.title + " to: " + el.innerHTML );
		this.el = el;
	}
	PortfolioImage.prototype.getEl = function(){
		return this.el;
	}
	
	
	
	// END Class::Still
	// --------------------------------------------------------------------------------
	// --------------------------------------------------------------------------------
	
	// ------------------------------------------------------------------------------------
	
	// These are for the jQuery Address functions
	$.address.init(function(event) {
		nav.init();
	}).change(function(event) {
		var text = (event.value == '') ? 'Home' : event.pathNames[0].substr(0, 1).toUpperCase() + event.pathNames[0].substr(1);
		nav.handleNavigationEvent(event);
	}).internalChange(function(event) {
		// NB: Called when links are clicked on page
		//log('internalChange: "' + event.value + '"');
	}).bind('externalChange', {msg: 'The value of the event is "{value}".'}, function(event) {
		// NB: Called when page loads
		// NB: Called when browser buttons are used
		//log('externalChange: ' + event.data.msg.replace(/\{value\}/, event.value));
	});
		
	// END Class::Navigation
	// --------------------------------------------------------------------------------
	// --------------------------------------------------------------------------------
	
	
	
	

	// --------------------------------------------------------------------------------
	// --------------------------------------------------------------------------------
	// Class::Preloader
	/*
	function Preloader(){
		this.loadedStatus = { categories:false };
	}
	
	Preloader.prototype.isReady = function(){
		for(var b in this.loadedStatus ){
			if( this.loadedStatus[b] != true ){
				log("assets still loading?");
				return false;
			}
		}
		log("preload complete");
		return true;
	}
	
	Preloader.prototype.setStatus = function( name, status ){
		log("setStatus(" + name + ", " + status ")");
		this.loadedStatus[name] = status;
	}
	*/
	
	// END Class::Preloader
	// --------------------------------------------------------------------------------
	// --------------------------------------------------------------------------------
	
	
	
	// ***************************************************************************************
	// ***************************************************************************************
	// Point of Entry
	// ***************************************************************************************
	// ***************************************************************************************
	
	videos = new Videos(); // global, root
	videos.loadXML(); // load from DB
	
	ddNavController = new DropDownNav();
	clientsController = new Clients();
	var portfolios = new Portfolios();
	portfolios.loadXML();
	
	//preloader = new Preloader();
	
	nav = new Navigation( ); // global, root
	//sections = new Array(); // global, root
		
	nav.addSection( new Section(0, "Home", "", $('#section-splash') ) );
	nav.addSection( new Section(1, "Still", "still", $('#section-still') ) );
	nav.addSection( new Section(2, "Motion", "motion", $('#section-motion') ) );
	nav.addSection( new Section(3, "About", "about", $('#section-about') ) );
	
	var section = nav.getSectionById( 3 ); // about
	section.addSubSection( new SubSection( 0, "About Section", '', $("#section-about-main") ) );
	section.addSubSection( new SubSection( 1, "Client Section", "clients", $("#section-about-client-list") ) );
	
	section = nav.getSectionById( 1 ); // still
	section.addSubSection( new SubSection( 0, "Portfolio Thumbs", "", $("#section-still-thumbs") ) );
	section.addSubSection( new SubSection( 1, "Portfolio Viewer", "viewer", $("#section-still-viewer") ) );
	
	// ------------------------------------------------------------------------
	// Spider Hiders
	// ------------------------------------------------------------------------

	
	
	///writers.writeAboutPage(); 
	//wrters.writeFooter(); 	
	


            
			
}); // document ready