var menuFx = new Class({
	
	initialize: function(block){
		this.block = $(block);
		if(!this.block) return;
		
		this.parent = this.block.getParent('li');
		this.fx = new Fx.Slide(this.block, { duration: 300, transition: Fx.Transitions.Sine.easeInOut, wait: false });
		this.fx.hide();
		this.block.getParent('div').addClass('fx');
		this.block.addClass('fx');
		
		this.parent.addEvents({
			'mouseenter': this.show.bind(this),
			'mouseleave': this.hide.bind(this)
		});
	},
	
	show: function(){ this.fx.slideIn(); },
	
	hide: function(){ this.fx.slideOut(); }
	
});

var Slider = new Class({
	
	initialize: function(box){
		this.box = $(box);
		if(!this.box) return;
		
		this.wrapper = this.box.getElement('.wrapper');
		this.fx = new Fx.Scroll(this.wrapper, { duration: 1200, transition: Fx.Transitions.Back.easeInOut, wait: false, wheelStops: false });
		this.menu = this.box.getElement('ul');
		this.panel = this.box.getElement('.arrows-panel');
		this.panel.fade(0.5);
		this.currentImg = this.menu.getFirst('li');
		this.imgWidth = this.currentImg.getWidth();
		this.arrows = this.box.getElements('.arrows');
		this.leftArrow = this.box.getElement('.left');
		this.rightArrow = this.box.getElement('.right');
		this.setMenuWidth();
		if(this.maxWidth < 0) return;
		this.fx.set(this.paddingWidth, 0);
		this.startTimer();
		
		this.panel.addEvents({
			'mouseenter': this.fadeIn.bind(this),
			'mouseleave': this.fadeOut.bind(this)
		});
		this.arrows.addEvent('mouseenter', this.fadeIn.bind(this));
		this.leftArrow.addEvent('click', this.prev.bind(this));
		this.rightArrow.addEvent('click', this.next.bind(this));
		this.box.addEvents({
			'mouseenter': this.stopTimer.bind(this),
			'mouseleave': this.startTimer.bind(this)
		});
	},
	
	startTimer: function(){
		if(this.interval) return false;
		this.interval = this.next.periodical(5000, this);
		return true;
	},
	
	stopTimer: function(){
		if(!this.interval) return false;
		this.interval = $clear(this.interval);
		return true;
	},
	
	setMenuWidth: function(){
		this.width = 0;
		this.maxWidth = 0;
		this.menu.getElements('li').each(function(element){
			this.width += element.getWidth();
		}.bind(this));
		this.paddingWidth = this.menu.getStyle('padding-left').toInt()
		this.currentPosition = this.paddingWidth;
		this.width += this.paddingWidth * 2;
		this.maxWidth = this.width - this.imgWidth - this.paddingWidth;
		this.menu.setStyle('width', this.width);
	},
	
	fadeIn: function(){ this.panel.fade(1); },
	
	fadeOut: function(){ this.panel.fade(0.5); },
	
	prev: function(){
		this.currentPosition -= this.imgWidth;
		if(this.currentPosition < this.paddingWidth) this.currentPosition = this.maxWidth;
		this.move();
		return false;
	},
	
	next: function(){
		this.currentPosition += this.imgWidth;
		if(this.currentPosition > this.maxWidth) this.currentPosition = this.paddingWidth;
		this.move();
		return false;
	},
	
	move: function(){ this.fx.start(this.currentPosition, 0); }
	
});

var myMorph = new Class({

	initialize: function(link){
		this.link = $(link);
		if(!this.link) return;
		
		this.fx = new Fx.Morph(this.link, { wait:false });
		if(this.link.getParent('li').hasClass('current')) return false;
		else this.hide();
		
		this.link.addEvents({
			'mouseenter': this.show.bind(this),
			'mouseleave': this.hide.bind(this)
		});
	},
	
	show: function(){
		this.fx.cancel();
		this.link.setStyle('background', '#fff');
		this.fx.start('.showlink');
	},
	
	hide: function(){
		this.fx.cancel();
		this.fx.start('.hidelink');
		( function(){
			this.fx.cancel();
			this.fx.set('.nonelink');
		}).delay(400, this);
	}

});

var Carousel = new Class({

	initialize: function(main){
		this.main = $(main);
		if(!this.main) return;
		
		this.scrollBox = this.main.getElement('.carousel');
		this.fx = new Fx.Scroll(this.scrollBox, { duration: 600, wait: false, wheelStops: false });
		this.menu = this.main.getElement('ul');
		this.mainWidth = this.scrollBox.getWidth();
		this.startPosition();
		if(this.maxWidth <= 0) return false;
		this.leftArrow = this.main.getElement('.left');
		this.rightArrow = this.main.getElement('.right');
		this.stepWheelWidth = this.main.getElement('li').getWidth();
		this.stepWidth = this.mainWidth;
		this.curPosition = 0;
		this.rightArrow.removeClass('none');
		
		this.scrollBox.addEvent('mousewheel', this.wheel.bind(this));
		this.leftArrow.addEvent('click', function(){
			this.minusPosition(this.stepWidth);
			return false;
		}.bind(this));
		this.rightArrow.addEvent('click', function(){
			this.plusPosition(this.stepWidth);
			return false;
		}.bind(this));
	},
	
	startPosition: function(){
		this.width = 0;
		this.menu.getElements('li').each(function(element){
			this.width += element.getWidth();
		}.bind(this));
		this.menu.setStyle('width', this.width);
		this.maxWidth = this.width - this.mainWidth;
	},
	
	move: function(how){ this.fx.start(how, 0); },
	
	minusPosition: function(how){
        if(this.curPosition > 0){
        	this.curPosition -= how;
        	if(this.curPosition <= 0){
        		this.curPosition = 0;
        		this.leftArrow.addClass('none');
        	}
        	this.rightArrow.removeClass('none');
        	this.move(this.curPosition);
        }
	},
	
	plusPosition: function(how){
        if(this.curPosition < this.maxWidth){
        	this.curPosition += how;
        	if(this.curPosition >= this.maxWidth){
        		this.curPosition = this.maxWidth;
        		this.rightArrow.addClass('none');
        	}
        	this.leftArrow.removeClass('none');
        	this.move(this.curPosition);
        }
	},
	
	wheel: function(e){
		e.wheel > 0	? this.minusPosition(this.stepWheelWidth) : this.plusPosition(this.stepWheelWidth);
		return false;
	}

});

var Pictures = new Class({
		
	initialize: function(main){
		this.main = $(main);
		if(!this.main) return;
		
		this.smallImgBox = this.main.getElement('.small-pictures');
		this.smallImgBox.addClass('active');
		this.links = this.smallImgBox.getElements('li a');
		if(!this.links) return false; 
		this.images = this.smallImgBox.getElements('li a img');
		new Tips(this.images, {
			onShow: function(tip){ tip.setStyle('opacity', '0.9'); },
			onHide: function(tip){ tip.setStyle('opacity', '0'); }
		});
		this.current = this.smallImgBox.getElement('.current');
		if(!this.current){
			this.current = this.smallImgBox.getElement('ul').getFirst('li').getElement('a');
			this.current.addClass('current');
		}
		this.use();
		
		this.links.addEvent('click', this.start.bind(this));
	},
	
	busy: function(what){
		if(what){
			this.wait = true;
			this.smallImgBox.addClass('busy');
		} else {
			this.wait = false;
			this.smallImgBox.removeClass('busy');
		}
	},

	build: function(){
		this.busy('true');
		this.mediumBox = new Element('div', { 'class': 'medium none' }).inject(this.currentParent);
		this.mediumLink = new Element('a', { 'href': this.href }).inject(this.mediumBox);
		this.mediumImg = new Asset.image(this.src, {
			onload: function(){
				this.mediumImg.addClass('loaded');
				this.mediumBox.removeClass('none');
				this.mediumBox.setStyle('opacity', '0');
				this.mediumBox.tween('opacity', '1');
				this.busy(false);
			}.bind(this)
		}).inject(this.mediumLink);
		ReMooz.assign(this.mediumLink, {
			'origin': 'img',
			'shadow': 'onOpenEnd', 
			'resizeFactor': 1,
			'opacityResize': 0.4,
			'dragging': true,
			'centered': true
		});
	},
	
	use: function(){
		this.current.addClass('use');
		this.currentParent = this.current.getParent('li');
		this.href = this.current.get('rel');
		this.src = this.current.get('href');
		this.build();
	},
	
	getMediumBox: function(){
		this.currentParent = this.current.getParent('li');
		this.mediumBox = this.currentParent.getElement('.medium');
	},

	show: function(){
		this.getMediumBox();
		this.mediumBox.removeClass('none');
		this.mediumBox.tween('opacity', '1');
	},
	
	hide: function(){
		this.getMediumBox();
		this.hideMediumBox = this.mediumBox;
		this.hideMediumBox.get('tween').start('opacity', 0).chain(function(){ this.hideMediumBox.addClass('none'); }.bind(this));
	},
	
	start: function(e){
		if(this.wait) return false;
		this.target = $(e.target).getParent('a') || $(e.target);	
		if(this.target.hasClass('current')) return false
		else this.target.addClass('current');
		this.hide();
		this.current.removeClass('current');
		this.current = this.target;
		if(!this.current.hasClass('use')) this.use()
		else this.show();
		
		return false;
	}

});

var Comments = new Class({
	
	initialize: function(main){
		this.main = $(main);
		if(!this.main) return;
		
		this.addLink = this.main.getElement('.add-comment');
		this.addBox = this.main.getElement('.add-commentfx');
		this.addCommentLink = $('comment-sub');
		this.form = this.main.getElement('form');
		this.nameInput = this.main.getElement('input.name');
		this.inputs = this.main.getElements('input');
		this.textarea = this.main.getElement('textarea');
		this.fxAdd = new Fx.Slide(this.addBox, { duration: 400, wait: false, transition: Fx.Transitions.Sine.easeOut });
		new Input(this.nameInput);
		new Input(this.textarea);
		this.startPosition();
		this.commentBox = this.main.getElement('ul');
		this.colMessage = this.main.getElement('h2 span');
		
		this.addLink.addEvent('click', this.start.bind(this));
		this.addCommentLink.addEvent('click', this.addComment.bind(this));
	},
	
	startPosition: function(){
		this.addBox.getParent('div').addClass('fx');
		this.fxAdd.hide();
	},
	
	addComment: function(){
		this.request = new Request.JSON({
			'method': 'post',
			'url': '/requests/Blog.php',
			/*
			onRequest: function(){
				this.inputs.each(function(element){ element.disabled = true; });
				this.textarea.disabled = true;
			}.bind(this),
			*/
			onSuccess: function(responseJSON, responseText){
				console.info(responseJSON);
				this.colMessage.set('text', this.colMessage.get('text').toInt() + 1);
				this.author = responseJSON.data.author;
				this.message = responseJSON.data.message;
				this.date = responseJSON.data.date;
				this.build();
			}.bind(this)
		}).send({data:{article_id: $('article_id').get('value'),author: $('author').get('value'),comment: $('comment-0').get('value')  }});
		return false;
	},
	
	build: function(){
		this.liEl = new Element('li').inject(this.commentBox);
		this.title = new Element('div', { 'class': 'title' }).inject(this.liEl);
		this.name = new Element('div', { 'class': 'name border-tb' }).inject(this.title);
		this.nameBor = new Element('div', { 'class': 'border-lr' }).inject(this.name);
		this.nameSpan = new Element('span', { 'text': this.author }).inject(this.nameBor);
		this.dateBox = new Element('div', { 'class': 'date' }).inject(this.title);
		this.dateSpan = new Element('span', { 'text': this.date }).inject(this.dateBox);
		this.commentP = new Element('p', { 'text': this.message }).inject(this.liEl);
	},
	
	start: function(){ this.fxAdd.toggle(); return false; }
	
});

var Input = new Class({
	
	initialize: function(element){
		this.element = $(element);
		if(!this.element) return false;
		
		this.elementText = this.element.get('default');
		
		this.element.addEvents({
			'focus': this.removeText.bind(this),
			'blur': this.addText.bind(this)
		});
	},
	
	removeText: function(){	if(this.element.get('value') == this.elementText) this.element.set('value', ''); },
	
	addText: function(){ if(this.element.get('value') == '') this.element.set('value', this.elementText); }
	
});

window.addEvent('domready', function(){
	
	if($$('#header .navigation ul') != ''){
		$$('#header .navigation ul').each(function(element){
			new menuFx(element);
		});
	}
	if($('imgBox')){ new Slider('imgBox'); }
	if($('welittaLink')){
		$('welittaLink').tween('color', '#dad9d7');
		$('welittaLink').addEvents({
			'mouseenter': function(){ this.tween('color', '#afafaf'); },
			'mouseleave': function(){ this.tween('color', '#dad9d7'); }
		});
	}
	/*
	if($$('#header .inside li a') != ''){ $$('#header .inside li a').each(function(element){
			new myMorph(element);
		});
	}
	*/
	if($('pictures')){ new Carousel($('pictures')); new Pictures($('pictures')); }
	if($('Comments')){ new Comments('Comments'); }
	if($('callName')){ new Input('callName'); }
	if($('callNumber')){ new Input('callNumber'); }
	
});

