var audioPlayer = new Class({
	Implements: [Events,Options],

	options: {
		target: 'audioplayer',
		delay: 0
	},

	initialize: function(options) {
		this.setOptions(options);
		this.ticking = false;
		this.currentTitle = null;
		this.currentTrack = null;
		this.playlistContainer = null;
		this.playlistStatus = 'closed';
		this.player = null;

		this.createPlayer();
		this.loadPlaylist.delay(400, this);
	},
	
	createPlayer: function() {
		this.player = new Swiff('assets/swf/musicplayer.swf', {
			id: 'musicPlayer',
			width: 217,
			height: 34,
			container: $(this.options.target),
			params: {
				wmode: 'transparant',
				bgcolor: '#ffffff'
			},
			events: {
				onLoad: function() {
					//console.log("Current track numbers is "+this.activateTrack());
				}
			}
		});
	},
	
	loadPlaylist: function() {
		new Request.JSON({
			url: 'playlist.php',
			method: 'get',
			data: {
				json: 'true'
			},
			onSuccess: this.createPlaylist.bind(this)
		}).send();
	},

	createPlaylist: function(playlist) {
		var playerCoordinates = $(this.options.target).getCoordinates();
		this.playlistContainer = new Element('div', {
			id: 'playlist'
		}).inject($('audioplayer'), 'after');

		playlist.each(function(track) {
			var trackContainer = new Element('div', {
				'class': 'playlisttrack',
				rel: track.musicPlayerTrackId,
				events: {
					mouseenter: function(e) {
						if(e.target.hasClass('playlisttrack')) {
							e.target.addClass('hovertrack');
						} else {
							track = e.target.getParent('div[class^=playlisttrack]');
							track.addClass('hovertrack');
						}
					},
					mouseleave: function(e) {
						if(e.target.hasClass('playlisttrack')) {
							e.target.removeClass('hovertrack');
						} else {
							track = e.target.getParent('div[class^=playlisttrack]');
							track.removeClass('hovertrack');
						}
					},
					click: this.activateTrack.bind(this)
				}
			});
			trackContainer.inject(this.playlistContainer);
			var trackTitle = new Element('div', {
				'class': 'tracktitle',
				events: {
					mouseenter: this.titleTicker.bind(this),
					mouseleave: this.stopTitleTicker.bind(this)
				}
			});
			var trackInfo = new Element('div', {
				'class': 'trackinfo'
			});
			trackTitle.inject(trackContainer);
			trackInfo.inject(trackContainer);
			trackInfo.appendText('..........');
			trackTitle.appendText(track.artist+' - '+track.title);
		}.bind(this));	
	},
	
	titleTicker: function(e) {
		title = e.target;
		//console.log(this.ticking);
		if(!this.ticking && title != this.currentTitle) {
			//console.log('start');
			this.currentTitle = title;
			this.ticking = true;
			this.moveTickerRight(title);
		}
	},
	
	stopTitleTicker: function(e) {
		this.ticking = false;
	},
	
	moveTickerRight: function(title) {
		if(this.ticking && this.currentTitle == title) {
			//console.log(title.innerHTML);
			titleScroll = title.getScrollSize();
			titleSize = title.getSize();
			if(titleScroll.x > titleSize.x) {
				//console.log('right');
				var myFx = new Fx.Scroll(title, {
					duration: (titleSize.x * 10),
					wait: false,
					onComplete: this.moveTickerLeft.bind(this)
				}).toRight();
			}
		} else {
			this.ticking = false;
		}
	},

	moveTickerLeft: function(title) {
		//console.log(title.innerHTML);
		//console.log('left');
		titleScroll = title.getScrollSize();
		titleSize = title.getSize();
		var myFx = new Fx.Scroll(title , {
			duration: (titleSize.x * 10),
			wait: false,
			onComplete: this.moveTickerRight.bind(this)
		}).toLeft();
	},

	togglePlaylist: function() {
		if(this.playlistStatus == 'closed') this.showPlaylist();
			else this.closePlaylist();
	},

	showPlaylist: function() {
		var playlistScroll = this.playlistContainer.getScrollSize();
		var myEffect = new Fx.Morph(this.playlistContainer, {duration: 'short', transition: Fx.Transitions.Sine.easeOut});

		myEffect.start({
			'height': playlistScroll.y,
			'padding-top': '20px',
			'padding-bottom': '10px'
		});
		this.playlistStatus = 'open';
	},

	closePlaylist: function() {
		var playlistScroll = this.playlistContainer.getScrollSize();
		var myEffect = new Fx.Morph(this.playlistContainer, {duration: 'short', transition: Fx.Transitions.Sine.easeOut});

		myEffect.start({
			'height': 0, 
			'padding-top': '0px',
			'padding-bottom': '0px'
		});
		this.playlistStatus = 'closed';
	},

	activateTrack: function(e) {
		if(e.target.hasClass('playlisttrack')) {
			id = e.target.getProperty('rel');
		} else {
			track = e.target.getParent('div[class^=playlisttrack]');
			id = track.getProperty('rel');
		}
		this.currentTrack = id;
		this.player.remote('activateTrack', this.currentTrack);
	},
	
	setActive: function(trackId){
		$$('.playlisttrack').each(function(div){div.removeClass('activetrack');});
		$$('.tracktitle').each(function(div){div.removeClass('activetitle');});
		trackDiv = this.playlistContainer.getElement('div[rel='+trackId+']');
		titleDiv = trackDiv.getElement('div[class=tracktitle]');
		trackDiv.addClass('activetrack');
		titleDiv.addClass('activetitle');
	}
});