/***
*
*  Controls for Audio and Video  
*
***/
var MediaControls = new Class({
        //
		//  initialize
		//
		Implements: [Options,Events,EventManager],
        options: {
				play_id:"media_play",
				pause_id:"media_pause",
				stop_id:"media_stop",
				next_id:"media_next",
				prev_id:"media_prev",
				mute_id:"media_mute",
				unmute_id:"media_unmute",
				time_id:"media_time",
				totaltime_id:"media_totaltime",
				progBar_id:"media_progress",
				progBack_id:"media_progressBack",
				volumeCover_id:"volumeCover",
				volumeBack_id:"volume",
				artist_id:"info_artist",
				name_id:"info_name",
				album_id:"info_album",
				year_id:"info_year",
                maxVolume:1,
                stop_off_opacity:.25,
				autoPlay:false
        },
        initialize: function(player,options){
                this.setOptions(options)
                this.player = player
				this.listen()
		},
        //
        //  setup
        //
        playButtons: function(container,ply,pau){
                this.playButton = this.newButtonSpan(this.options.play_id)
                this.pauseButton = this.newButtonSpan(this.options.pause_id)
				this.selectionStopper()
				if (ply) this.playButton.set("html",ply)
				if (pau) this.pauseButton.set("html",pau)
				if (this.options.autoPlay){
						this.playButton.fade("hide")
						this.pauseButton.fade("show")
				} else {
						this.playButton.fade("show")
						this.pauseButton.fade("hide")
				}	
                this.pushEvents(this.playButton,'click',function(){
						this.player.play()
						return false
				}.bind(this))
                this.pushEvents(this.pauseButton,'click',function(){
						this.player.pause()
						return false
				}.bind(this))
				document.id(container).grab(this.playButton)
				document.id(container).grab(this.pauseButton)
        },
		stopButton: function(container,stp){
                this.stopButton = this.newButtonSpan(this.options.stop_id)
				if (stp) this.stopButton.set("html",stp)
                this.pushEvents(this.stopButton,'click',function(){
						this.stopPlayer()
				}.bind(this))
				document.id(container).grab(this.stopButton)
        },
		stopPlayer: function(){
				this.player.stop()
				this.stopButton.setStyle("opacity",this.options.stop_off_opacity)
				if (this.playButton) this.playButton.fade("show")
				if (this.pauseButton) this.pauseButton.fade("hide")
				if (this.muteButton) this.muteButton.fade("show")
				if (this.unmuteButton) this.unmuteButton.fade("hide")
				return false;
		},
        muteButtons: function(container,mt,unmt){
                this.muteButton = this.newButtonSpan(this.options.mute_id)
                this.unmuteButton = this.newButtonSpan(this.options.unmute_id)
				if (mt) this.muteButton.set("html",mt)
				if (unmt) this.unmuteButton.set("html",unmt)
				this.unmuteButton.fade("hide")
				this.muteButton.fade("show")
                this.pushEvents(this.muteButton,'click',function(){
						this.player.mute()
						this.muteButton.fade("hide")
						this.unmuteButton.fade("show")
						return false;
				}.bind(this))
                this.pushEvents(this.unmuteButton,'click',function(){
						this.player.unmute()
						this.muteButton.fade("show")
						this.unmuteButton.fade("hide")
						return false;
				}.bind(this))
				document.id(container).grab(this.muteButton)
				document.id(container).grab(this.unmuteButton)
        },
		prevNextButtons: function(container,prv,nxt){
                this.prevButton = this.newButtonSpan(this.options.prev_id)
                this.nextButton = this.newButtonSpan(this.options.next_id)
				if (prv) this.prevButton.set("html",prv)
				if (nxt) this.nextButton.set("html",nxt)
                this.pushEvents(this.prevButton,'click',function(){
						this.player.previous()
						return false;
				}.bind(this))
                this.pushEvents(this.nextButton,'click',function(){
						this.player.next()
						return false;
				}.bind(this))
				document.id(container).grab(this.prevButton)
				document.id(container).grab(this.nextButton)
        },
        progressBar: function(container,br,bk){
                this.pbar = this.newButtonSpan(this.options.progBar_id)
                this.pback = this.newButtonSpan(this.options.progBack_id)
				if (br) this.pbar.set("html",br)
				if (bk) this.pback.set("html",bk)
                this.pushEvents(this.pback,'mousedown',function(e){
						this.killSelection = true
                        if ($chk(this.player.duration)){
                                this.player.media.pause()
                                this.pushEvents(document,'mousemove',this.seekEvent.bind(this),"scrub")
                                this.pushEvents(document,'mouseup',this.stopScrub.bind(this),"scrub")
                        }
						return false;
                }.bind(this))
				this.pback.grab(this.pbar)
				document.id(container).grab(this.pback)
				//
				this.pbar.width = this.pbar.getStyle("width").toInt()
                this.pback.width = this.pback.getStyle("width").toInt()
                this.pback.x = this.pback.getPosition().x				
                this.pbar.setStyle("width",0)
		},
		volumeScrubber: function(container,cvr,bk){
                this.vcover = new Element("div",{id:this.options.volumeCover_id})
                this.vback = new Element("div",{id:this.options.volumeBack_id})
				if (cvr) this.vcover.set("html",cvr)
				if (bk) this.vback.set("html",bk)
                this.pushEvents(this.vback,'mousedown',function(e){
						this.killSelection = true
						this.player.unmute(true)
						this.pushEvents(document,'mousemove',this.volumeScrub.bind(this),"vscrub")
						this.pushEvents(document,'mouseup',function(){this.pullEvents("vscrub")}.bind(this),"vscrub")
						return false;
                }.bind(this),"volume")
				this.pushEvents(this.player,"VOLUME",this.setVolumeScrubber.bind(this),"volume")
				this.vback.grab(this.vcover)
				//
                this.vback.width = this.vback.getStyle("width").toInt()
				this.vback.x = this.vback.getPosition().x
				document.id(container).grab(this.vback)
		},
		addTimer: function(container,nometa,noslash){
				this.time = this.newInfoDiv(this.options.time_id,container)
				this.time.set("html",this.player.time)
				if (!nometa) {
						this.totaltime = this.newInfoDiv(this.options.totaltime_id,container)
						this.timeSlash = !noslash
						if (!noslash) this.totaltime.set("html",this.player.totaltime)
						else this.totaltime.set("html","/"+this.player.totaltime)
				}		
        },		
		addInfo: function(name,album,year,artist,container){
				if (name) this.name = this.newInfoDiv(this.options.name_id,container)
				if (album) this.album = this.newInfoDiv(this.options.album_id,container)
                if (year) this.year = this.newInfoDiv(this.options.year_id,container)
                if (artist) this.artist = this.newInfoDiv(this.options.artist_id,container)				
        },
		//
		//  internal
		//
        seekEvent: function(e){
				document.body.focus();
                var t = this.player.duration * (((e.event.pageX - this.pback.x)/ this.pback.width).limit(0,1))
				this.player.seek(t,true)
                this.pbar.setStyle("width",(this.pbar.width * t / this.player.duration)+"px")
                if (this.time) this.time.set("html",this.player.time)
        },
        stopScrub: function(){
				this.player.isSeeking = false
                this.pullEvents("scrub")
				this.player.update()
                if (this.player.state == "play") this.player.play()
        },
		volumeScrub: function(e){
				//
				//  i am having a positioning problem
				//
				console.log(e.event.localX,e.event.pageX,this.vback)
				var mousex = (e.event.pageX - this.vback.x).limit(0,this.vback.width)
				var cvrwidth = (this.vback.width - mousex)
				this.vcover.setStyle("left",mousex)
				this.vcover.setStyle("width",cvrwidth)
				console.log(e.event.pageX,this.vback.x,mousex,cvrwidth)
				this.player.setVolume(this.options.maxVolume * (1-cvrwidth/this.vback.width))
        },
		setVolumeScrubber: function(){
				var cvrwidth = this.vback.width *  (1 - this.player.media.volume/this.options.maxVolume)
				var cvrx = this.vback.width - cvrwidth
				this.vcover.setStyle("width",cvrwidth+"px")
                this.vcover.setStyle("left",cvrx+"px")	
		},
        update: function(){
                if (this.pbar) this.pbar.setStyle("width",(this.pbar.width * this.player.playProgress)+"px")
                if (this.time) this.time.set("html",this.player.time)
        },
		updateMeta: function(){
				if (this.totaltime) {
						if (this.timeSlash) this.totaltime.set("html","/"+this.player.totaltime)
						else this.totaltime.set("html",this.player.totaltime)
				}
				if (this.stopButton) this.stopButton.setStyle("opacity",1)
				if (this.vcover) this.setVolumeScrubber()
		},
		updateInfo: function(){
				if (this.name) this.name.set("html",this.player.name)
				if (this.album) this.album.set("html",this.player.album)
                if (this.year) this.year.set("html",this.player.year)
                if (this.artist) this.artist.set("html",this.player.artist)
        },
		listen: function(){
				this.pushEvents(this.player,"UPDATE",this.update.bind(this),"update")
				this.pushEvents(this.player,"READY",this.updateMeta.bind(this),"update")
				this.pushEvents(this.player,"INFO",this.updateInfo.bind(this),"update")
				this.pushEvents(this.player,'PLAY',function(){
						this.playButton.fade("hide")
						this.pauseButton.fade("show")
				}.bind(this),"statechange")
				this.pushEvents(this.player,'PAUSE',function(){
						this.pauseButton.fade("hide")
						this.playButton.fade("show")
				}.bind(this),"statechange")
        },
		newInfoDiv: function(elm_id,container){
				var elm = new Element("div",{id:elm_id})
				elm.setStyle("position","absolute")
				document.id(container).grab(elm)
				return elm
		},
		newButtonSpan: function(elm_id){
				var elm = new Element("span",{id:elm_id})
				elm.setStyles({
						cursor:"pointer",
						position:"absolute"
				})
				return elm
		}
});