/**
 * @author chrisjones@twofour.co.uk
 */
if(!window.Twofour){
	Twofour = {};
}
if(!Twofour.Usercontrols){
	Twofour.Usercontrols = {};
}
Twofour.Usercontrols.Scrollbar = function(canvas,track,marker,vertical,horizontal){
	this.control = canvas;
	this.track = track;
	this.marker = marker;

	this.allowVertical = vertical;
	this.allowHorizontal = horizontal;
	var root = canvas.getHost().content.root;
	root.addEventListener("MouseLeftButtonUp",Silverlight.createDelegate(this,this.cancelDrag));
	root.addEventListener("MouseMove",Silverlight.createDelegate(this,this.handleMouseMove));
	this.marker.addEventListener("MouseLeftButtonDown",Silverlight.createDelegate(this,this.handleMouseDown));
}
Twofour.Usercontrols.Scrollbar.prototype = {
	onScroll: null,
	handleMouseDown: function(sender, eventArgs){
		this.drag = {};
		this.drag.target = sender;
		this.drag.mouseOffset = eventArgs.getPosition(sender);
		this.drag.suspended=false;
	},
	cancelDrag: function(sender, eventArgs){
		this.drag=null;
	},
	suspendDrag: function(sender, eventArgs){
		if(this.drag)
			this.drag.suspended=true;	
	},
	resumeDrag: function(sender, eventArgs){
		if(this.drag)
			this.drag.suspended=false;	
	},
	handleMouseMove: function(sender, eventArgs){
		if(this.drag && !this.drag.suspended){
			var t = this.drag.target;
			var offset = this.drag.mouseOffset;
            var pos = eventArgs.getPosition(this.track);
			pos.x -= offset.x;
			pos.y -= offset.y;
			
			if(pos.y<0)
				pos.y = 0;
			if(pos.y>this.track.height - t.height)
				pos.y = this.track.height - t.height;
			if(this.allowVertical)
				t["Canvas.Top"] = this.track['Canvas.Top']+pos.y;
				
			if(pos.x<0)
				pos.x = 0;
			if(pos.x>this.track.width - t.width)
				pos.x = this.track.width - t.width;
			if(this.allowHorizontal)
	            t["Canvas.Left"] = this.track['Canvas.Left']+pos.x;
		
			if(this.onScroll)
				this.onScroll(this,{x:pos.x,y:pos.y});//this.onScroll(this,{x:t['Canvas.Left'],y:t['Canvas.Top']});
		}
	}
}

Twofour.Usercontrols.ScrollCanvas = function(canvas,scrollbar,clip){
    var plugIn = canvas.getHost();
    this.scrollbar = scrollbar;
    this.scrollbar.onScroll = Silverlight.createDelegate(this,this.scrollCanvas)
    this.outerCanvas = canvas;
    
    if(!clip){
        var clipregion = new Twofour.Xaml.UI.Geometry('M 0,0 ');
        clipregion.addLine(canvas.width,0);
        clipregion.addLine(canvas.width,canvas.height);
        clipregion.addLine(0,canvas.height);
        clipregion.close();
        clip = clipregion.toString();
    }
    canvas.clip = clip;
    var factory = new Twofour.Xaml.XamlFactory();
    var element = factory.createCanvas(null, new Twofour.Xaml.UI.Bounds(0,0,canvas.height,canvas));
    this.innerCanvas = plugIn.content.createFromXaml(element.toString(),true);
    canvas.children.add(this.innerCanvas);
}
Twofour.Usercontrols.ScrollCanvas.prototype = {
    add: function(control){
        var p = control.getParent();
        if(p)
            p.children.remove(control);
        this.innerCanvas.children.add(control);
		this._resizeCanvas(this.innerCanvas);
    },
    remove: function(control){
        this.innerCanvas.children.remove(control);
		this._resizeCanvas(this.innerCanvas);
    },
	clear: function(){
        this.innerCanvas.children.clear();
		this._resizeCanvas(this.innerCanvas);
	}
	,
    scrollCanvas: function(sender, eventArgs){
        var target = this.innerCanvas;
        if(target){
		    if(this.scrollbar.allowVertical){
		        var ratio = this.innerCanvas.height/this.outerCanvas.height;
		        target['Canvas.Top'] = 0-(eventArgs.y*ratio);
		    }
		    if(this.scrollbar.allowHorizontal){
		        var ratio = this.innerCanvas.width/this.outerCanvas.width;
		        target['Canvas.Left'] = 0-(eventArgs.x*ratio);
		    }
		}
	},
	_resizeCanvas: function(canvas){
		var vert=0;var horz=0;
		for(var i=canvas.children.count-1;i>-1;i--){
			var el = canvas.children.getItem(i);
			vert= Math.max(el['Canvas.Top']+el.height,vert);
			horz= Math.max(el['Canvas.Left']+el.width,horz);
		}
		canvas.height = vert;
		canvas.width = horz;
	}
}
		
Twofour.Usercontrols.VideoSlider = function(canvas,track,marker,mediaElement){
	this.mediaElement = mediaElement;
	this.scrollbar = new Twofour.Usercontrols.Scrollbar(canvas,track,marker,false,true);
	this.scrollbar.onScroll = Silverlight.createDelegate(
		this,
		function(sender,eventArgs){
			if(this.onReposition){
				var pos = eventArgs.x/track.width;
				var sec = Math.floor(pos*this.mediaElement.naturalDuration.seconds);
				var ts = Twofour.Usercontrols.VideoSlider.formatTime(0,0,sec);
				this.onReposition(this,{position:pos,timespan:ts,secondsElapsed:sec});
			}
		
		});
	var funcname = canvas.name+'_VideoSliderUpdate';
	window[funcname] = Silverlight.createDelegate(this,this.videoSliderRefresh);
	window.setInterval(funcname+'()',500);
}
Twofour.Usercontrols.VideoSlider.formatTime = function (h, m, s){ 
    var ss = s % 60; 
    var sm = Math.floor(s / 60)%60;
    var sh = Math.floor(s / 3600);
    
    var mm = sm + (m % 60);
    var mh = Math.floor(m / 60);
    
    var hh = sh + mh + h;
	
	var lt = function(v,l,s){
		if(v < l)
			return s;
		return '';
	}
	var str = hh.toString()+':'+lt(mm,10,'0')+mm.toString()+':'+lt(ss,10,'0')+ss.toString(); 
    return str;
}
Twofour.Usercontrols.VideoSlider.prototype = {
	scrollbar: null,
	setHorizontalPosition: function(value){
		this.scrollbar.marker['Canvas.Left'] = value;
	},
	getHorizontalPosition: function(value){
		return this.scrollbar.marker['Canvas.Left'];
	},
	onReposition: null,
	videoSliderRefresh: function(){
		var sb = this.scrollbar;
		if(!sb.drag || sb.drag.suspended){
			var pos = this.mediaElement.position.seconds/this.mediaElement.naturalDuration.seconds;
			var parent = sb.control;
			var p =pos*parent.width;
			if(p & p!=NaN)
				this.setHorizontalPosition(pos*parent.width);
				//update played indicator
			}
	},
	formatTime: Twofour.Usercontrols.VideoSlider.formatTime
}

Twofour.Usercontrols.DataboundItem = function(plugIn, template, dataitem){
	this.plugIn = plugIn;
	this.template = template;
	this.dataitem = dataitem;
	this.uniqueId = Twofour.Usercontrols.DataboundItem.createUniqueId();
}
Twofour.Usercontrols.DataboundItem.nextId = null;
Twofour.Usercontrols.DataboundItem.createUniqueId = function(){
	if(!Twofour.Usercontrols.DataboundItem.nextId)
		Twofour.Usercontrols.DataboundItem.nextId=0;
	return Twofour.Usercontrols.DataboundItem.nextId++;
}
Twofour.Usercontrols.DataboundItem.prototype = {
	databind: function(){
		var t = new String(this.template);
		var d = this.dataitem;
		var rxD = new RegExp(/\$DatabindingId/gi);
		for(f in d){
			var rx=new RegExp('\\$'+f,'gi');
			t=t.replace(rx,d[f].toString());
		}
		t=t.replace(rxD, this.uniqueId);
		this.control = this.plugIn.content.createFromXaml(t);
	}
}