var NJS = NJS || {};

NJS.Mch = new Class({
	Implements: Options,
	options: {
	},
	initialize: function(element, newsData, options) {
		this.setOptions(options);
		this.element = $(element);
		var that = this;

		var activeItem;
		var colors = [];
		var coordsNo = [];
		var coordsHo = ['71,73,6,96,53,141',
		'71,69,82,1,21,22',
		'74,72,126,118,141,54',		
		'69,71,16,27,3,91',
		'73,70,140,44,92,1',
		'73,74,59,143,121,123'];
		

		var headerPictures = $('header').getChildren('div[class=header-picture inactive]');
		var images = [];
		headerPictures.each(function(el, index) {
			images[index] = el.getProperty('title');
			el.removeProperty('title');
		});

		$('header').getChildren('div').getLast().toggleClass('inactive');
		
		
		var loader = new Asset.images(images, {
			onProgress: function(counter,index) {
			},
			onComplete: function() {
				images.each(function(im, index) {
					new Element('img',{ src:im }).inject(headerPictures[index], 'top');
				});
			}
		});
		
		

		var boxes = this.element.getElement('div[class=right-part]').getChildren('div');
		boxes.each(function(el) {
			el.toggleClass('inactive');
		});
		
		var umbrella = this.element.getElement('div[class=umbrella]');
		umbrella.addEvent('mouseenter', function(){
			umbrella.over = true;
		});
		
		umbrella.addEvent('mouseleave', function(){
			umbrella.over = false;
			umbrella.addClass(colors[active]);
			buttons[active].setProperty('coords', coordsHo[active]);
		});
		
		
		var buttons = umbrella.getElement('map').getChildren('area');
		
		buttons.each(function(el,index) {
			coordsNo[index] = el.getProperty('coords');
			colors[index] = el.getProperty('class');
		});
		
		this.getRandomItem(boxes,umbrella,colors,coordsHo,buttons,headerPictures);
		var active = this.active;
		
		buttons.each(function(el,index) {
			
			el.clicked = false;
			
			el.addEvent('mouseover', function(event) {
				if(umbrella.hasClass(colors[active]) && active != index) {
					umbrella.removeClass(colors[active]);
				}
				umbrella.addClass(colors[index]);
				el.setProperty('coords', coordsHo[index]);
			});
			el.addEvent('mouseleave', function(event) {
				if(index != active) {
					umbrella.removeClass(colors[index]);
				}

				if(!umbrella.over) {
					umbrella.addClass(colors[active]);
				}
			
				el.setProperty('coords', coordsNo[index]);
			});
			el.addEvent('click', function(event) {
				boxes.each(function(el,index) {
					if(!el.hasClass('inactive')) {
						el.toggleClass('inactive');
					}
				});
				headerPictures.each(function(el,index) {
					if(!el.hasClass('inactive')) {
						el.toggleClass('inactive');
					}
				});
				boxes[index].toggleClass('inactive');
				headerPictures[index].toggleClass('inactive');
				active = index;
			});
			
		});
	},
	
	getRandomItem: function(boxes,umbrella,colors,coordsHo,buttons,headerPictures) {
		activeItem = 5*(Math.random());
		activeItem = Math.round(activeItem);
		boxes[activeItem].toggleClass('inactive');
		headerPictures[activeItem].toggleClass('inactive');
		umbrella.addClass(colors[activeItem]);
		buttons[activeItem].setProperty('coords', coordsHo[activeItem]);
		this.active = activeItem;
	}
});
window.addEvent('domready', function() {
if($('division-preview')) {
	newsTeaser = new NJS.Mch('division-preview');
}
}
);