dojo.require("dojox.av.FLVideo");
dojo.require("dijit.form.Button");
dojo.require("dijit.form.HorizontalSlider"); 
dojo.require("dojo.dnd.Source");
dojo.require("dojo.parser");
dojo.require("dojox.analytics.Urchin");

var passthrough = function(msg){
	//for catching messages from Flash
	if(window.console){
		console.log(msg);	
	}
}

var player, controls, progress, lib, libNode;
var dndItem = {};

var extended = {
	onDropExternal: function(){
		console.warn("DROP --- check to copy, move, or none:", dndItem);
		var node = dojo.byId(dndItem.dragNode.id);
		var target = dndItem.dropNode;
		if(target.id == "videoOverlay") return;
		arguments[2] = true;
		this.inherited("onDropExternal", arguments);
		
	}
};
//dojo.extend(dojo.dnd.Source, extended);
dojo.extend(dojo.dnd.Target, extended);
//dojo.dnd.Target.prototype.onDropExternal = extended.onDropExternal;

createRelated = function(items){
	var txt = '<span class="relText">Related Items:</span>'
	dojo.forEach(items, function(m){
		var id = m.title.replace(/\s/g,"");
		var path = "media/"+id+".flv"; 
		var thumb = "media/thumbs/"+id+".jpg"; 	 
		txt += 	'<div class="related" id="click_'+id+'"><div class="thumb" style="background-image:url(media/thumbs/'+id+'.jpg)"></div>'+
				'<div class="title">'+m.title+'</div>'+
				'<div class="desc">'+m.desc+'</div></div>';
	});
	txt +='';	
	return txt;
}




dojo.addOnLoad(function(){
	libNode = dojo.byId("library"); //dojo.dnd.Source; jsId="dnd_library" within "libContainer"
	lib = dnd_library;

	dojo.xhrGet({
			url:"items.json",
			handleAs:"json",
			load:function(items){
				controls.setItems(items);
				var txt = '';
				dojo.forEach(items, function(m){
					var id = m.id = m.title.replace(/\s/g,"");
					var path = m.path = "media/"+id+".flv"; 
					var thumb = m.thumb = "media/thumbs/"+id+".jpg"; 
					txt += ''+
					'<div class="dojoDndItem" id="dnd_'+id+'" path="'+path+'" dndType="blue">'+
						'<div id="'+id+'" class="thumb" style="background-image:url('+thumb+');"></div>'+
						'<div class="title">'+m.title+'</div>'+
						'<div class="desc">'+m.desc+'</div>'+
					'</div>';						 
				});
				libNode.innerHTML = txt;
				lib.sync();
				
				controls.load(items[0].path);
			}
	});
	
	
	player = new dojox.av.FLVideo({initialVolume:.2, isDebug:false}, "video");
	
	dojo.connect(player, "onLoad", controls, "init");
	dojo.connect(player, "onClick", controls, "toggle");
	dojo.connect(player, "onMetaData", controls.progress, "onMeta");
	dojo.connect(player, "onEnd", controls, "onEnd");
	dojo.connect(player, "onStart", controls, "onStart");
	dojo.connect(player, "onPosition", controls.progress, "onPosition");
	
	dojo.subscribe("/dnd/source/over", function(evt){ 
		//console.log("onDndSourceOver", evt);
		if(evt){
			if(evt.node){
				dndItem.dropNode = evt.node
			}
			if(evt.anchor){
				dndItem.dragNode = evt.anchor
			}
		}
	});
	dojo.subscribe("/dnd/start",  function(evt){ console.log("onDndStart", evt)});
	dojo.subscribe("/dnd/drop",   function(evt){ 
		//console.log( "onDndDrop", evt);
		//console.log("dndItem:", dndItem)
		var node = dojo.byId(dndItem.dragNode.id);
		var target = dndItem.dropNode;
		console.log("TARGET:", target)
		if(target.id=="videoOverlay"){
			var path = dojo.attr(node, "path");
			controls.load(path);
			controls.showPause();
		}
	});
	dojo.subscribe("/dnd/cancel", function(evt){ 
		//console.log( "onDndCancel")
	});
	
	new dojox.analytics.Urchin({ 
		acct: "UA-3572741-1", 
		GAonLoad: function(){
			this.trackPageView("/demos/video");
		}
	});	
	
});


controls = {
	progress: {
		init: function(){
			this.duration = null;
			this.seeking = false;
			this.progressBar = dijit.byId("progress");
			dojo.connect(this.progressBar.sliderHandle, "mousedown", this, "startDrag");
			this.timeNode = dojo.byId("timeNode");
			this.durNode = dojo.byId("durNode");
			this.initialized = true;
		},
		onMeta: function(data){
			if(data && data.duration){
				this.duration = data.duration;
				this.durNode.innerHTML = this.timecode(this.duration);
				this.progressBar.attr("disabled", false);
			}else{
				this.duration = null;
				this.durNode.innerHTML = "NA";
				this.progressBar.attr("disabled", true);
				this.progressBar.attr("value", 0);
			}
		},
		onDrag: function(val){
			//
			if(this.seeking){
				//console.log("DRAG:", val);
				var p = val*.01
				player.seek(this.duration*p);
			}
		},
		startDrag: function(){
			this.seeking = true;
			this.conChg = dojo.connect(this.progressBar, "onChange", this, "onDrag");
			this.conUp = dojo.connect(dojo.doc, "mouseup", this, "endDrag")
		},
		endDrag: function(){
			this.seeking = false;
			dojo.disconnect(this.conUp);
			dojo.disconnect(this.conChg);
		},
		onPosition: function(time){
			if(this.initialized){
				this.timeNode.innerHTML = this.timecode(time);
				
				if(this.duration){
					if(!this.seeking){
						// IE freaks if the prgressBar's value goes over 1.0
						var p = Math.min(time/this.duration, 1);
						this.progressBar.attr("value", p*100);
					}
				}
			}
		},
		timecode: function(time){
			ts = time.toString()

			if(ts.indexOf(".")<0){
				ts += ".00"
			}else if(ts.length - ts.indexOf(".")==2){
				ts+="0"
			}else if(ts.length - ts.indexOf(".")>2){
				ts = ts.substring(0, ts.indexOf(".")+3)
			}
			return ts;
		}
	},
	volume: {
		
		init:function(){
			
			this.volNode = dojo.byId("volume");
			this.volBack = dojo.byId("volBack");
			dojo.setSelectable(this.volNode, false);
			dojo.setSelectable(this.volBack, false);
			dojo.setSelectable(dojo.byId("volMask"), false);
			
			this.volDim = dojo.coords(this.volNode);
			var v = player.initialVolume; // returns 0 - 1
			dojo.style(this.volBack, "backgroundPosition", "-"+(this.volDim.w-(this.volDim.w*v))+"px 0px");
			
			dojo.connect(this.volNode, "mousedown", this, "begDrag");
			dojo.connect(dojo.doc, "mouseup", this, "endDrag");
			dojo.connect(this.volNode, "mouseover", this, "over");
			dojo.connect(this.volNode, "mouseout", this, "out");
		},
		onDrag: function(evt){
			var x = evt.clientX - this.volDim.x;
			if(x<0) x = 0;
			if(x>this.volDim.w) x = this.volDim.w;
			var p = x/this.volDim.w;
			player.volume(p);
			var prex = x
			x = Math.ceil(x*.1)*10;
			dojo.style(this.volBack, "backgroundPosition", "-"+(this.volDim.w-x)+"px 0px");
		},
		begDrag: function(){
			this.dragging = true;
			this.conMove = dojo.connect(dojo.doc, "mousemove", this, "onDrag");
		},
		endDrag: function(){
			if(this.conMove) {
				dojo.disconnect(this.conMove);
			}
			this.dragging = false;
			this.out();
		},
		over: function(){
			dojo.addClass(this.volBack, "volBackHover");
		},
		out: function(){
			if(!this.dragging){
				dojo.removeClass(this.volBack, "volBackHover");	
			}
		}
	},
	
	
	init: function(){
		this.progress.init();
		this.volume.init();
		this.initialized = true;
	},
	setItems:function(_items){
		this.items = _items;
	},
	onStart: function(){
		this.hideOverlay();
		this.showPause();
		if(this.conM1) dojo.disconnect(this.conM1);
		if(this.conM2) dojo.disconnect(this.conM1);
		if(this.conTog) dojo.disconnect(this.conTog);
		this.conTog = dojo.connect(dojo.byId("videoOverlay"), "click", this, "toggle");
	},
	toggle: function(){
		if(player.isPlaying){
			player.pause();
		}else{
			player.play();
		}
	},
	onEnd: function(){
		console.log("onEnd")
		dojo.disconnect(this.conTog);
		var rel, m1, m2;
		for(var i=0, len=this.items.length;i<len;i++){
			if(this.items[i].path==this.currentPath){
				m1 = i+1;
				m2 = i+2
				if(m1>len-1){
					m1=0;
					m2=1;
				}else if(m2>len-1){
					m2=0;	
				}
				break;
			}
		}
		m1 = this.items[m1];
		m2 = this.items[m2];
		var txt = createRelated([ m1, m2 ]);
		dojo.byId("relatedNode").innerHTML=txt;
		this.conM1 = dojo.connect(dojo.byId("click_"+m1.id), "click", this, function(){
			this.load(m1.path);																
		});
		this.conM2 = dojo.connect(dojo.byId("click_"+m2.id), "click", this, function(){
			this.load(m2.path);																
		});
		this.showOverlay();
		this.showPlay();
		console.log("onEnd done")
	},
	hideOverlay: function(){
		dojo.style(dojo.byId("relatedContainer"), "display", "none");
		dojo.style(dojo.byId("relatedBack"), "display", "none");
	},
	showOverlay: function(){
		dojo.style(dojo.byId("relatedContainer"), "display", "");
		dojo.style(dojo.byId("relatedBack"), "display", "");
		dojo.fadeIn({node:"relatedContainer", start:0, end:.9, duration:500}).play();
		dojo.fadeIn({node:"relatedBack", start:0, end:.5, duration:500}).play();
	},
	doSlider: function(val){
		console.log("VALUE:", val);
	},
	load: function(path){
		
		if(!this.initialized){
			var c = dojo.connect(this, "init", this, function(){
				this.load(path);
				dojo.disconnect(c);
			});
			return;
		}
		console.log("Play:", path)
		this.currentPath = path;
		player.play(path);
		this.hideOverlay();
		this.showPause();
	},
	doPlay: function(){
		player.play();
		this.hideOverlay();
		this.showPause();
	},
	doPause: function(){
		player.pause();
		this.showPlay();	
	},
	showPlay: function(){
		dojo.style(dijit.byId("pauseButton").domNode, "display", "none");
		dojo.style(dijit.byId("playButton").domNode, "display", "");
	},
	showPause: function(){
		dojo.style(dijit.byId("pauseButton").domNode, "display", "");
		dojo.style(dijit.byId("playButton").domNode, "display", "none");
	}
}