///////////////////////////////////////////////////////////////////////////////
//
//  StageObjects.js   			version 1.0
//	2007 Julia Yu, Lenny Burdette
//
//  These objects appear on the stage and are usually singletons
//  they call creation on XamlObjects
//
//  FUNCTIONS:
//			Loc.Preloader
//			Loc.nav
//			Loc.navThumb
//			Loc.subTitle
//			Loc.stage
//			Loc.subPage
//			
//	DEPENDENCIES:
//			Utils.js
//			XamlObjects.js
//
///////////////////////////////////////////////////////////////////////////////

if ( !window.Loc) { window.Loc = {}; }

/**
 * The generic preloader
 */
Loc.Preloader = function(params){
	this.name = params.name;
	this.host = params.parent || Loc.root;
	this.top = params.top || 0;
	this.left = params.left || 0;
	this.bar = params.bar || true;
	this.fragment = Loc.loaderFragment

	try {
		this.host.children.add(this.fragment);
	}catch(e) {
		return; 
	}
	this.self = this.fragment.findName('preloader');
	this.spinWheel = this.fragment.findName("rotate");
	if (this.spinWheel) {
		this.spinWheel.Begin();	
	}
	
	this.position(this.top, this.left);
}

Loc.Preloader.prototype.position = function(top, left) {
	if (top) {
		this.self['Canvas.Top'] = top;
	}
	if (left) {
		this.self['Canvas.Left'] = left;
	}
}

Loc.Preloader.prototype.stop = function() {

	var preloadXaml = this.fragment.findName("preloader");
    if (preloadXaml != null){
        this.host.children.remove(preloadXaml); // removing from root
    }
}

/**
 * The navigation panel object 
 * creates all navigational thumbnails
 */
Loc.nav = function(params) {
	this.name = params.name; 				
	this.host = params.parent || Loc.root;
	this.self = this.host.findName("nav"); 
	this.selfContent = this.self;	
	
	this.downloadNav = new Silverlight.Downloader({
	    resource: "cmn/xaml/navThumb.xaml",
	    plugin: Loc.plugin,
	    onComplete: this.loaded.bind(this),
	    name: this.name
	});
}

Loc.nav.prototype.loaded = function(downloader) {
	var xamlText = downloader.responseText; 
	var i=0; 
	this.background = new Loc.NavBg();
	this.slideshow = new Loc.Slideshow();
	for (var myAsset in Loc.assetContent) {
		var fragment = Loc.plugin.content.createFromXaml(xamlText, true);
		fragment["Canvas.Left"] = i * 75 + 15; // CHANGE THIS
		this.selfContent.children.add(fragment);
		
		Loc.make('navThumb', { name : myAsset, fragment : fragment, background: this.background });
		i++;
	}
}

/**
 * The navigation thumbnail object, 1 per asset
 */
Loc.navThumb = function(params) {
	this.name = params.name; 			// this is the asset ID
	this.fragment = params.fragment;
	this.featured = Loc.assetContent[this.name].featured;
	this.thumbText = this.fragment.findName('navThumbText');
	this.thumbImage = this.fragment.findName('navThumbImage');
	this.scaler = this.fragment.findName('thumbScaler');
	this.hit = this.fragment.findName('hitArea');
	this.background = params.background;
	this.on = false;
	
	this.init();
}

Loc.navThumb.prototype.init = function() {
	this.thumbText.text = this.name;
	this.thumbImage.source = "cmn/img/nav/nav_" + this.name + ".png";

	this.hit.addEventListener('MouseEnter', this.onEnter.bind(this));
	this.hit.addEventListener('MouseLeave', this.onLeave.bind(this));
	this.hit.addEventListener('MouseLeftButtonUp', this.onClicked.bind(this));
		
	Loc.dispatch.subscribe("assetClick", this.name, this.listenAssetClick.bind(this));
}
	
Loc.navThumb.prototype.listenAssetClick = function(assetName) {
	if (assetName != this.name) {
		this.on = false;	
		this.onLeave();
	}
}
	
Loc.navThumb.prototype.onEnter = function() {
	if (this.growTween) {
		this.growTween.stop();
	}
	if (this.shrinkTween) {
		this.shrinkTween.stop();
	}

	this.growTween = new Loc.Tween([
		{ obj: this.scaler, prop: 'scalex', end: 1, func: Loc.Tween.linearTween },
		{ prop: 'scaley' }
		], .1).startFromHere();

}
	
Loc.navThumb.prototype.onLeave = function() {
	if (this.on) {
		return;
	}
	if (this.shrinkTween) {
		this.shrinkTween.stop();
	}
	if (this.growTween) {
		this.growTween.stop();
	}
	

	this.shrinkTween = new Loc.Tween([
	{ obj: this.scaler, prop: 'scalex', end: .9, func: Loc.Tween.linearTween },
	{ prop: 'scaley' }
	], .1).startFromHere();

}
	
Loc.navThumb.prototype.onClicked = function() {
	Loc.tracker.currentAsset = this.name;
	Loc.tracker.currentPage = "asset";
	
	this.on = true;
	this.scaler.scalex = 1;
	this.scaler.scaley = 1;
	Loc.dispatch.broadcast("assetClick", this.name); // event sent to dispatcher
	this.background.select(this.fragment['Canvas.Left'], this.featured);
}


Loc.NavBg = function() {
	this.xaml = Loc.root.findName('navBg');

	this.featuredText = this.xaml.findName('featuredText');
	this.hidden = true;
	this.showTween = new Loc.Tween({ obj: this.xaml, prop: 'opacity', end: 1, func: Loc.Tween.easeOutExpo });
	this.hideTween = new Loc.Tween({ obj: this.xaml, prop: 'opacity', end: 0, func: Loc.Tween.easeOutExpo });
	
	Loc.dispatch.subscribe("pageLoad", this.name, this.hide.bind(this));
	Loc.dispatch.subscribe("assetClick", this.name, this.listenAssetClick.bind(this));
}

Loc.NavBg.prototype = {
	select : function(x, featured) {
		this.show();
		this.stopTweens();
		this.moveTween = new Loc.Tween({ obj: this.xaml, prop: 'Canvas.Left', end: x - 17, func: Loc.Tween.easeOutExpo }).startFromHere();
		this.featuredText.visibility = featured ? 'visible' : 'collapsed';
	},
	
	stopTweens : function() {
		if (this.moveTween) {
			this.moveTween.stop();
		}
	},
	
	show : function() {
		if (this.hidden) {
			this.showTween.startFromHere();
			this.hidden = false;
		}
	},
	
	hide : function() {
		this.hideTween.startFromHere();
		this.hidden = true;
	},
	
	listenAssetClick : function(asset) {
		var asset = Loc.assetContent[asset];
		var offset = asset.position * 75 + 15; // CHANGE THIS
		this.select(offset, asset.featured);
	}
}

/**
 * parse a textContent and put in textBlock
 */
Loc.parseItalics = function(textBlock, textContent) {
	var iTest = textContent.split("<i>");
	if (iTest.length > 1) {
		for (z in iTest) {
			var iEndTest = iTest[z].split("</i>");
			if (iEndTest.length > 1) {
				var italicRun = Loc.plugin.content.createFromXaml('<Run FontStyle="Italic" />', true);
				italicRun.Text = iEndTest[0];
				textBlock.inlines.add(italicRun);
				//console.log("adding as italic " +  iEndTest[0]);
				
				var run = Loc.plugin.content.createFromXaml('<Run/>', true);
				run.Text = iEndTest[1];
				textBlock.inlines.add(run);

			} else {
				var runrun = Loc.plugin.content.createFromXaml('<Run/>', true);
				runrun.Text = iTest[z];
				textBlock.inlines.add(runrun);
			}
		}
	} else {
		textBlock.Text = textBlock.Text + textContent; // no italics found, set it to that
	}	
}

/**
 * Subtitle bar changes when the asset is loaded
 * or when a different page is loaded
 */
Loc.subTitle = function(params) {
	this.name = params.name; 	
	this.host = params.parent || Loc.root; 		
	this.self = this.host.findName("sub_title");
	this.selfContent = this.host.findName("sub_title_content");
	this.textContent = this.host.findName("sub_title_text");
	
	this.textContent.Text = Loc.page.home.subTitle; // initialize (might not need this if pageload called right away)
	
	Loc.dispatch.subscribe("assetClick", this.name, this.listenAssetClick.bind(this));
	Loc.dispatch.subscribe("pageLoad", this.name, this.listenPageLoad.bind(this));
	Loc.dispatch.subscribe("subPageLoad", this.name, this.listenSubPageLoad.bind(this));
}

Loc.extend(Loc.subTitle, Loc.clearable);

Loc.subTitle.prototype.listenAssetClick = function(assetName) {
	var myAsset = Loc.assetContent[assetName];
	
	this.textContent.text = '';
	Loc.parseItalics(this.textContent, myAsset.title);
	
	this.clearChildren();
	var audioOffset = 900;
	
	// the divider shows up if we have audio and other stuff
	if ((myAsset.featured || myAsset.rollout) && myAsset.audio) {
		this.addChild('graphic', {
			name: 'divider', source : "cmn/img/divider_subnav.png", top: 5, left: 840
		});	
		audioOffset = 777;
	}

	// if there is an audio URL then add the audio
	if (myAsset.audio) {
		this.addChild('button', { 
			text : "AUDIO", 
			bgFill: '#375055', 
			marginH: 10, top: 4, left: audioOffset, 
			click: function() { Loc.dispatch.broadcast('AudioSelected'); }
		});
		
		this.addChild('Player', { 
			name:'audioPlayer', 
			type: 'audio',  
			source: Loc.assetContent[assetName].audio, 
			top: 30, left: 700, 
			hidden: true,
			transcript: Loc.assetContent[assetName].transcript
		});
	}
	
	// display roll out image button if we have it
	if (myAsset.rollout){
		var bName = "expanded"; // don't change!
		
		this.addChild('button', { 
			name: bName, 
			text : "EXPANDED VIEW", 
			left: 845, top: 4, 
			bgFill: '#375055', marginH: 10,
			click: function() { Loc.subPage(bName); } 
		});
	}
	
	// display featured button
	if (myAsset.featured) {
		var fName = "explore"; // don't change!
		
		this.addChild('button', { 
			name: fName, 
			text : "EXPLORE", 
			left: 845, top: 4,
			bgFill: '#375055', marginH: 10,
			click: function() { Loc.subPage(fName); } 
		});
		
	} 
}

Loc.subTitle.prototype.listenPageLoad = function(pageName) {
	var myPage = Loc.page[pageName];
	if (myPage.subnavContent) {
		this.makeNewChildren(myPage.subnavContent, "subTitle");
	} else {
		this.clearChildren();	
	}
	if (Loc.page[pageName].subTitle) {
		this.textContent.Text = Loc.page[pageName].subTitle.toUpperCase();	
	}
}

Loc.subTitle.prototype.listenSubPageLoad = function(buttonType) {	
	var myButton = Loc.tracker.button[buttonType]; 
	if (buttonType == "expanded") {
		myButton.changeText("EXPANDED VIEW");
	}
	if (buttonType == "explore") {
		myButton.changeText("EXPLORE");
	}
	myButton.changeClick(function(){ Loc.subPage(buttonType); });
}

/**
 * Stage content area
 */
Loc.stage = function(params) {
	this.name = params.name; 	// identify this instance of panel
	this.host = params.parent || Loc.root; 		// the root of the canvas contains the panel
	this.selfContent = this.host.findName('stage_content');
	
	Loc.dispatch.subscribe("assetClick", this.name, this.listenAssetClick.bind(this));
	Loc.dispatch.subscribe("pageLoad", this.name, this.listenPageLoad.bind(this));
	Loc.dispatch.subscribe('AudioSelected', this.name, this.listenAudioSelected.bind(this));
	Loc.dispatch.subscribe("subPageLoad", this.name, this.listenSubPageLoad.bind(this));
}

Loc.extend(Loc.stage, Loc.clearable);

Loc.stage.prototype.listenAssetClick = function(myAsset){
	this.clearChildren();
	
	var asset = Loc.assetContent[myAsset];
	
	if (!asset.featured) {
		var mySource = "cmn/img/asset/" + myAsset + ".png";
		this.addChild('graphic', {parent : this.selfContent, source : mySource, top: 54, left: 500 });
	} else {
		var myJPGSource = "cmn/img/rotate/" + myAsset + ".jpg";
		this.addChild('graphic', {parent : this.selfContent, source : myJPGSource, top: 54, left: 500 });
		this.addChild('rotator', {parent : this.selfContent, top: 54, left: 500 });
	} 
}
	
Loc.stage.prototype.listenAudioSelected = function() {
	var player = Loc.tracker['Player']['audioPlayer']; // change to find current audio player
	if (player) {
		if (player.hidden) {
			player.show();
		} else {
			player.hide();
		}
	}
}

Loc.stage.prototype.listenPageLoad = function(pageName) {
	var myPage = Loc.page[pageName];	
	if (myPage.stageContent) {
		this.makeNewChildren(myPage.stageContent, "stage");
	} else {
		this.clearChildren();	// always remove children on page load
	}
}

Loc.stage.prototype.listenSubPageLoad = function() {
	this.listenAssetClick(Loc.tracker.currentAsset); 
}

/**
 * Load a sub page of the current asset
 */
Loc.subPage = function(pageType) {	
	Loc.tracker.stage.stage_content.clearChildren();
	Loc.tracker.panel.panel_intro.clearChildren();
	Loc.tracker.panel.panel_intro.hide();
	
	var thisStage = Loc.tracker.stage.stage_content;
	var myButton = Loc.tracker.button[pageType]; // page type correspond to what sort of button it is
	
	if (pageType == "expanded") {
		var newsource = 'cmn/img/asset/' + Loc.tracker.currentAsset +'R.png';	
		var myAsset = Loc.assetContent[Loc.tracker.currentAsset];
		thisStage.addChild('graphic', {parent : thisStage.selfContent, source: newsource, top: myAsset.rollY, left: myAsset.rollX, width: myAsset.width, height: myAsset.height });
	}
	 if (pageType == "explore") {
	 	// MAKE HOTSPOT STUFF ITS FEATURED!!!!
		thisStage.addChild('Zoomer', { parent : thisStage.selfContent, assetId: Loc.tracker.currentAsset, top: 38 });
	 }
	
	myButton.changeText("STANDARD VIEW");
	myButton.changeClick(function(){ Loc.dispatch.broadcast("subPageLoad", pageType); });
}