﻿
function montre(id) {
	 $(id).setProperty('style','display:block').fade('in');
}
function montre_inline(id) {
	$(id).setProperty('style','display:inline'); 
}
function cache(id) {
	 $(id).fade('out').setProperty('style','display:none');
}
window.addEvent('domready', function() {

//AudioPlayer = new AudioPlayer($('AudioPlayer'));

	//------------------------------
	//Player processes
	//------------------------------

	//Moosund & player initialising

	$('Files').setStyle('display', 'none'); 
	Playlist = new Playlist();



	Playlist.theContainer = new Element('div', {
		'id': 'AudioPlayer',
		'class': 'audioplayer'
	}).inject($('Main'), 'before');

	//------------------------------
	//Main Player
	//------------------------------
	Playlist.Player = new Element('div', {
		'id': 'Player',
		'class': 'player'
	}).inject(Playlist.theContainer);

	Playlist.theSoundList = new Element('div', {
		'id': 'Playlist',
		'class': 'playlist'
	}).inject(Playlist.theContainer);


	Playlist.Player.el = new Element('div', {id:'PlayerSong','class':'song'});
	Playlist.Player.controls     = new Element('div', {id:'PlayerControls','class':'controls'}).inject(Playlist.Player.el);
	Playlist.Player.num        = new Element('span', {id:'PlayerNum','class':'num'}).inject(Playlist.Player.el);
	Playlist.Player.title        = new Element('span', {id:'PlayerTitle','class':'title', text:'Aucuns sons par ici'}).inject(Playlist.Player.el);
	Playlist.Player.seekbar      = new Element('div', {id:'PlayerSeekbar','class': 'seekbar'}).inject(Playlist.Player.el);
	Playlist.Player.position     = new Element('div', {id:'PlayerPosition','class':'position'}).inject(Playlist.Player.seekbar);
	//Playlist.Player.duration     = new Element('span', {'class':'duration'}).inject(Playlist.Player.title);
	Playlist.Player.progressFx   = new Fx.Tween(Playlist.Player.seekbar, 'width', {unit:'%', link: 'cancel'});
	Playlist.Player.positionFx   = new Fx.Tween(Playlist.Player.position, 'left', {unit:'%', link: 'cancel'});
	Playlist.Player.infos     = new Element('div', {'class':'infos'}).inject(Playlist.Player.el);
	//Playlist.Player.album     = new Element('span', {'class':'album'}).inject(Playlist.Player.infos);
	Playlist.Player.comment     = new Element('div', {id:'PlayerComment','class':'comment'}).inject(Playlist.Player.infos);
	Playlist.Player.links     = new Element('div', {'class':'links'}).inject(Playlist.Player.infos);
	Playlist.Player.genre    = new Element('span', {'class':'genre'}).inject(Playlist.Player.links);
	Playlist.Player.artist     = new Element('span', {'class':'artist'}).inject(Playlist.Player.links);
	Playlist.Player.tools     = new Element('div', {id:'PlayerTools','class':'tools'}).inject(Playlist.Player.el);

	Playlist.Player.playlistEl       = new Element('a', {'class':'playlistButton', title:'Liste de lecture', text:'playlist' }).inject(Playlist.Player.controls);

	Playlist.Player.prevEl       = new Element('a', {'class':'prevButton', title:'Precedent', text:'prev',id:'Prev' }).inject(Playlist.Player.controls);
	Playlist.Player.playEl       = new Element('a', {'class':'playButton', title:'Jouer', text:'play',id:'Play' }).inject(Playlist.Player.controls);
	Playlist.Player.pauseEl      = new Element('a', {'class':'pauseButton', title:'Pause', text:'pause',id:'Pause'}).setStyle('display', 'none').inject(Playlist.Player.controls);
	Playlist.Player.stopEl       = new Element('a', {'class':'stopButton', title:'Stop', text:'stop',id:'Stop' }).inject(Playlist.Player.controls);
	Playlist.Player.nextEl       = new Element('a', {'class':'nextButton', title:'Suivant', text:'next',id:'Next' }).inject(Playlist.Player.controls);

	Playlist.Player.playlistEl.addEvent('click', function(e) { 
				e.stop(); 
				if(Playlist.theSoundList.getStyle('height').toInt() == 0){Playlist.theSoundList.tween('height', [0, 150]);}
				else{
					Playlist.theSoundList.tween('height', [150, 0]);
				}
		}.bind(Playlist.Player));
	Playlist.Player.prevEl.addEvent('click', function(e) {
				e.stop(); 
				Playlist.playPrev(Playlist.focus.url); 
		}.bind(Playlist.Player));
	Playlist.Player.stopEl.addEvent('click', function(e) { 
				e.stop();
				Playlist.stopSounds(); 
				Playlist.Player.playEl.setStyle('display', 'block'); 
				Playlist.Player.pauseEl.setStyle('display', 'none'); 
		}.bind(Playlist.Player));
	Playlist.Player.playEl.addEvent('click', function(e) { 
				e.stop();
				Playlist.startList();
				Playlist.Player.playEl.setStyle('display', 'none'); 
				Playlist.Player.pauseEl.setStyle('display', 'block');  
		}.bind(Playlist.Player));
	Playlist.Player.pauseEl.addEvent('click', function(e) { 
				e.stop();
				Playlist.pauseSounds(); 
				Playlist.Player.playEl.setStyle('display', 'block'); 
				Playlist.Player.pauseEl.setStyle('display', 'none'); 
		}.bind(Playlist.Player));
	Playlist.Player.nextEl.addEvent('click', function(e) { 
				e.stop();
				Playlist.playNext(Playlist.focus.url); 
		}.bind(Playlist.Player));

	Playlist.Player.randomEl     = new Element('span', {'class':'randomButton', id:'Random'}).inject(Playlist.Player.tools);
	Playlist.Player.randomInput       = new Element('input', {'type':'checkbox', 'class':'randomInput',  title:'random', id:'RandomInput' }).inject(Playlist.Player.randomEl);
	Playlist.Player.randomLabel    	= new Element('label', {'for':'Random',  'class':'randomLabel', text:'Aleatoire', id:'RandomLabel'}).inject(Playlist.Player.randomEl);

	Playlist.Player.chainEl     = new Element('span', {'class':'chainButton', id:'Chain'}).inject(Playlist.Player.tools);
	Playlist.Player.chainInput       = new Element('input', {'type':'checkbox', 'checked':'checked', 'class':'chainInput',  title:'chain', id:'ChainInput' }).inject(Playlist.Player.chainEl);
	Playlist.setOptions({'chain': true});
	Playlist.Player.chainLabel    	= new Element('label', {'for':'chain',  'class':'chainLabel', text:'Enchainer', id:'ChainLabel'}).inject(Playlist.Player.chainEl);

	Playlist.Player.chainInput.addEvent('click', function(el) { 
					if (this.chainInput.checked){
						el.checked = true;
						Playlist.setOptions({'chain': true});
					}else{
						el.checked = false;
						Playlist.setOptions({'chain': false});
					}
		}.bind(Playlist.Player));
	Playlist.Player.randomInput.addEvent('click', function(el) { 
					if (this.randomInput.checked){
						el.checked = true;
						Playlist.setOptions({'random': true});
					}else{
						el.checked = false;
						Playlist.setOptions({'random': false});
					}
		}.bind(Playlist.Player));

	Playlist.Player.el.inject($('Player'));

	Playlist.scroll = new Fx.Scroll('Playlist', {
		wait: false,
		duration: 1000,
		offset: {'x': 0, 'y': -0},
		transition: Fx.Transitions.Quad.easeInOut
	});
	//------------------------------
	//Sound Interface
	//------------------------------
	var index = 0;
	var options = {
		'onRegister': function() {		
			index++;
			this.id = index;
			this.el = new Element('div', {id:'song'+index,'class':'song'});
			this.controls     = new Element('div', {'class':'controls'}).inject(this.el);
			this.download     = new Element('a', {'class':'download',id:'download'+index,href:this.url }).inject(this.el);
			this.num          = new Element('span', {id:'num'+index,'class':'num', text:index}).inject(this.download);
			this.title        = new Element('span', {id:'title'+index,'class':'title', text:this.url.substr(this.url.lastIndexOf("/")+1)}).inject(this.download);
			this.seekbar      = new Element('div', {'class': 'seekbar'}).inject(this.el);
			this.position     = new Element('div', {'class':'position'}).inject(this.seekbar);
			this.duration     = new Element('span', {'class':'duration'}).inject(this.el);
			this.infos        = new Element('div', {'class':'infos','styles': {'display': 'none'}}).inject(this.el);
			//this.album      = new Element('span', {'class':'album'}).inject(this.infos);
			this.comment      = new Element('div', {'class':'comment'}).inject(this.infos);
			this.links        = new Element('div', {'class':'links'}).inject(this.infos);
			this.genre        = new Element('span', {'class':'genre'}).inject(this.links);
			this.artist       = new Element('span', {'class':'artist'}).inject(this.links);
			this.copyright    = new Element('div', {'class':'copyright',  text:'' }).inject(this.infos);
			this.progressFx   = new Fx.Tween(this.seekbar, 'width', {unit:'%', link: 'cancel'});
			this.positionFx   = new Fx.Tween(this.position, 'left', {unit:'%', link: 'cancel'});
			this.playEl       = new Element('a', {'class':'playButton',  text:'play',id:'play'+i }).inject(this.controls);
			this.pauseEl      = new Element('a', {'class':'pauseButton', text:'pause',id:'pause'+i}).setStyle('display', 'none').inject(this.controls);
			this.stopEl       = new Element('a', {'class':'stopButton',  text:'stop',id:'stop'+i }).inject(this.controls);
			this.stopEl.addEvent('click', function(e) {
				e.stop();
				 this.stop(); 
			}.bind(this));
			this.playEl.addEvent('click', function(e) {
				e.stop(); 
				this.manager.stopSounds(); 
				this.start(); 
			}.bind(this));
			this.pauseEl.addEvent('click', function(e) { 
				e.stop();
				this.pause(); 
			}.bind(this));
				this.seekbar.addEvent('click', function(e) {
				var coords = this.seekbar.getCoordinates();
				var ms = ((e.page.x - coords.left)/coords.width)*this.duration;
				this.jumpTo(ms);
			}.bind(this));
			this.download.addEvent('click', function(e) { 
				e.stop();
				this.start();this.pause();
				this.setFocus();
				this.infos.setStyle('display', 'block');
			}.bind(this));
			this.el.inject($('Playlist'));
				Playlist.scroll.toElement(this.el); 
		},
		'onLoad': function() {
				//this.manager.loadNext(this.url);
		},
		'onPause': function() {
				this.playEl.setStyle('display', 'block'); 
				this.pauseEl.setStyle('display', 'none');  
				Playlist.Player.playEl.setStyle('display', 'block'); 
				Playlist.Player.pauseEl.setStyle('display', 'none'); 
		},
		'onFocus': function() {
				this.el.addClass('focus');
				$('PlayerTitle').set('text',this.title.get('text'));
				$('PlayerNum').set('text',this.num.get('text') + ') ');
		},
		'onBlur': function() {
				this.el.removeClass('focus');
		},
		'onPlay': function() { 
				this.setFocus();
				Playlist.scroll.toElement(this.el);
				this.el.addClass('focus playing'); 
				this.playEl.setStyle('display', 'none'); 
				this.pauseEl.setStyle('display', 'block'); 
				Playlist.Player.playEl.setStyle('display', 'none'); 
				Playlist.Player.pauseEl.setStyle('display', 'block'); 
				//$('playingDesc').set('html',this.infos.get('html'));
		},
		'onStop': function() { 
				this.el.removeClass('playing'); 
				this.playEl.setStyle('display', 'block'); 
				this.pauseEl.setStyle('display', 'none'); 
				this.manager.Player.playEl.setStyle('display', 'block'); 
				this.manager.Player.pauseEl.setStyle('display', 'none'); 
		},
		'onProgress': function(loaded, total) {
				var percent = (loaded / total*100).round(2);
				this.seekbar.get('tween').start('width', percent*3);
				this.manager.Player.seekbar.get('tween').start('width', percent*3);
				//this.duration.set('text',this.getPosition()+'/'+this.getDuration());
		},
		'onPosition': function(position,duration) {
				var percent = (position/duration*100).round(2);
				this.position.get('tween').start('left', percent*3);
				this.manager.Player.position.get('tween').start('left', percent*3);
				this.setFocus();
				if(percent == 100){this.fireEvent('onStop').fireEvent('onComplete');}
		},
		'onID3': function(key, value) { 
			if (key == "TIT2") { this.title.set('text', value);}
			if (key == "TPE1") { this.artist.set('text', value); }
			if (key == "TALB") { this.album.set('text', value); }
			if (key == "TCON") { this.genre.set('text', value); }
			if (key == "COMM") { this.comment.set('text', value); }
			//if (key == "TCOP") { this.copyright.set('title', value); }
			//if (key == "WXXX") { this.copyright.set('href', value); }
			this.infos.setStyle('display', 'block');
			this.infos.removeClass('loading'); 

		},
		'onComplete': function() {
			if(this.manager.options.chain !== false){ 
				this.manager.playNext(this.url); 
			}
		}
	};


	//------------------------------
	//Add Sounds
	//------------------------------
			

				var soundsToLoad = $('content').getElements('a.mp3');
				for (var i=0;i<soundsToLoad.length;i++)
				{
					soundsToLoad[i].getParent().addClass('sound');
					var url = soundsToLoad[i].get('href');
					if(!Playlist.getSound(url)){
						Playlist.loadSound(url, options);
					}
				}
				
				if(soundsToLoad[0]){	
					Playlist.theSoundList.tween('height', [0, 150]);
					var SoundKeys = Playlist.sounds.getKeys();
					var url = SoundKeys[SoundKeys.length-1];
					Playlist.sounds.get(url).setFocus();
				}else{
					Playlist.theSoundList.setStyle('display', 'none');
					$('Player').setStyle('display', 'none');
				}
				var soundslists = $('content').getElements('div.list');
				for (var i=0;i<soundslists.length;i++)
				{
					soundslists[i].setStyle('display', 'none');
				}
				
	

	//------------------------------
	//Sizing processes
	//------------------------------
	/*
	var size = window.getSize();
	//$('AudioPlayer').setStyle('width', size.x-550);
	$('AudioPlayer').setStyle('height', size.y-200);
	$('Playlist').setStyle('height', size.y-300);
	$('all').setStyle('height', size.y);
	$('all').setStyle('width', size.x);
	$('Main').setStyle('height', size.y-300);
	$('Main').setStyle('overflow', 'auto');
	*/
	//------------------------------
	//Menu processes
	//------------------------------
	//var fisheye = new fish($('Projects'));
	/*
			var list = $$('.scroller a');
			list.each(function(element) {
				element.setStyle('opacity','0.7');
				element.addEvent('mouseenter',function() {
					element.setStyle('opacity','1');
				});
				element.addEvent('mouseleave',function() {
					element.setStyle('opacity','0.7');
				});
			});
	*/
	//------------------------------
	//Ajax processes
	//------------------------------

	//contentUpdater = new contentUpdater('#Main','#all a');

/*
			var theTools = new Element('div', {
				'id': 'Tools',
				'class': 'tools'
			}).inject(AudioPlayer.theContainer, 'top');

			var addPageToList = new Element('a', {
				'href': '',
				'text': 'Ajouter à la liste',
				'id': 'addPageToListButton',
				'class': 'addPageToListButton',
				events:{
					'click':function(event) {
						event.stop(); 

						var list = $$('#Main a.mp3');
						for (var i=0;i<list.length;i++){
							AudioPlayer.addToList(list[i],options);
						}
					}
				}
			    }).inject(theTools, 'bottom');
			var addPageToList = new Element('a', {
				'href': '',
				'text': 'Jouer tout les sons',
				'id': 'playAllButton',
				'class': 'playAll',
				events:{
					'click':function(event) {
						event.stop(); 
					}
				}
			    }).inject(theTools, 'bottom');
			var addPageToList = new Element('a', {
				'href': '',
				'text': 'Vider la liste',
				'id': 'clearAllButton',
				'class': 'clearAll',
				events:{
					'click':function(event) {
						event.stop(); 
					}
				}
			    }).inject(theTools, 'bottom');
			var addPageToList = new Element('a', {
				'href': '',
				'text': 'Sauver',
				'id': 'saveButton',
				'class': 'save',
				events:{
					'click':function(event) {
						event.stop(); 
					}
				}
			    }).inject(theTools, 'bottom');
			//Playlist.registerSounds();
/*
			var size = window.getSize();
			$('AudioPlayer').setStyle('width', size.x-650);
			$('Playlist').setStyle('height', size.y-125);
			$('Main').setStyle('height', size.y-175);
			$('Main').setStyle('overflow', 'auto');

/*
			var list = $$('.scroller a, #MainMenu a, #UserMenu a');
			list.each(function(element) {
			  	// Gestionnaire d'évènement 'click'
			  	element.addEvent('click', function(e){
				// On stoppe le pointage naturel du lien pour ne pas recharger la page
					e = new Event(e).stop();
					var path = element.getProperty('href');
					//We can use one Request object many times.
					var req = new Request.HTML({url:path+':::template/inc',evalResponse:true,
						onRequest: function(html) {
							$('Main').set('text', '');
							$('Main').addClass('loading'); 
						},
						onSuccess: function(html) {
							//Clear the text currently inside the results div.
							$('Main').set('text', '');
							$('Main').removeClass('loading'); 
							//Inject the new DOM elements into the results div.
							$('Main').adopt(html);
						},
						//Our request will most likely succeed, but just in case, we'll add an
						//onFailure method which will let the user know what happened.
						onFailure: function() {
							$('Main').set('text', 'The request failed.');
						}
					});
					req.send();
				});
			});*/
});
