/* ---------------------------------------------------------------------------------------------------- */
/* =auto-zuerich.js */
/* ---------------------------------------------------------------------------------------------------- */

var AZ = {};


/* -------------------------------------------------- */
/* =Gallery */

AZ.Gallery = new Class({
	
	Implements: [Options, Events],
	
	options: {
		gridSize: {x: 2, y: 4},
		thumbHeight: 73
	},
	
	initialize: function (items, options) {
		this.items = items;
		this.setOptions(options);
		this.thumbsContainer = this.options.controlsContainer.getElement('.gallery-thumbs');
		this.image = new Element('img').inject(this.options.galleryContainer.getElement('.gallery-img'));
		this.options.galleryContainer.getElement('.navigation').set('styles', {
			'background-color': '#000',
			'opacity': 0.7
		});
		this.copyright = this.options.galleryContainer.getElement('.gallery-copyright');
		this.galleryCount = this.options.galleryContainer.getElement('.gallery-count');
		this.buttons = {
			prev: this.options.galleryContainer.getElement('.go-back'),
			next: this.options.galleryContainer.getElement('.go-forward'),
			up: this.options.controlsContainer.getElement('.gallery-top'),
			down: this.options.controlsContainer.getElement('.gallery-bottom')
		};
		this.buttons.prev.addEvent('click', this.prevImage.bindWithEvent(this));
		this.buttons.next.addEvent('click', this.nextImage.bindWithEvent(this));
		this.buttons.up.addEvent('click', this.scrollUp.bindWithEvent(this));
		this.buttons.down.addEvent('click', this.scrollDown.bindWithEvent(this));
		this.taf = $$('.gallery-taf')[0];
		this.populateThumbs();
		this.fx = new Fx.Tween(this.thumbsContainer, {property: 'top', link: 'cancel', transition: 'sine:out', duration: 750});
		this.setImage(this.getIndexFromId(this.taf.get('value').toInt()));
		this.currentPage = 0;
	},
	
	populateThumbs: function () {
		this.items.each(function (item, index) {
			new Element('li').inject(this.thumbsContainer).adopt(new Element('a', {
				'events': {
					'click': this.setImage.bind(this, index)
				}
			}).adopt(new Element('img', {
				'src': item.thumburl
			})));
		}, this);
	},
	
	setCopyright: function (copyright) {
		this.copyright.set('text', copyright);
	},
	
	setCount: function () {
		this.galleryCount.set('text', this.currentIndex + 1 + '/' + this.items.length);
	},
	
	setImage: function (index) {
		this.currentIndex = index;
		var item = this.items[this.currentIndex];
		this.image.set({
			'src': item.fullurl,
			'title': item.title
		});
		this.setCopyright(item.copyright);
		this.setCount();
		this.adjustThumbs();
		this.taf.set('value', item.id);
	},
	
	prevImage: function (event) {
		event.stop();
		if (this.currentIndex > 0) {
			this.setImage(--this.currentIndex);
		}
	},
	
	nextImage: function (event) {
		event.stop();
		if (this.currentIndex < this.items.length - 1) {
			this.setImage(++this.currentIndex);		
		}
	},
	
	scrollTo: function (pageIndex) {
		this.fx.start(-(pageIndex * (this.options.thumbHeight * this.options.gridSize.y)));
	},
	
	scrollUp: function (event) {
		event.stop();
		if (this.currentPage > 0) {
			this.scrollTo(--this.currentPage);
		}
	},
	
	scrollDown: function (event) {
		event.stop();
		if (this.currentPage < Math.ceil(this.items.length / (this.options.gridSize.x * this.options.gridSize.y)) - 1) {
			this.scrollTo(++this.currentPage);
		}
	},
	
	adjustThumbs: function () {
		var pageIndex = Math.floor(this.currentIndex / (this.options.gridSize.x * this.options.gridSize.y));
		if (pageIndex != this.currentPage) {
			this.currentPage = pageIndex;
			this.scrollTo(this.currentPage);
		}
	},
	
	getIndexFromId: function (id) {
		var filtered = this.items.filter(function (item) {
			return item.id == id;
		}, this);
		var index = this.items.indexOf(filtered[0]);
		return (index >= 0) ? index : 0;
	}
	
});


/* -------------------------------------------------- */
/* =teaser switcher */

AZ.TeaserSwitcher = new Class({
	
	initialize: function (imageElement, anchorElement, anchors, items) {
		this.imageElement = imageElement;
		this.anchorElement = anchorElement;
		this.anchors = anchors;
		this.items = items;
		this.activeIndex = 0;
		this.anchors.each(function (anchor, index) {
			anchor.addEvent('click', this.changeTeaser.bindWithEvent(this, index));
		}, this);
		if (this.items.length) this.changeTeaser(null, 0);
	},
	
	changeTeaser: function (event, index) {
		if (event) event.stop();
		this.anchors[this.activeIndex].removeClass('active');
		this.activeIndex = index;
		this.imageElement.setStyle('background-image', 'url(' + this.items[this.activeIndex].src + ')');
		this.anchorElement.setProperty('href', this.items[this.activeIndex].href);
		this.anchors[this.activeIndex].addClass('active');
	}
	
});

/* -------------------------------------------------- */
/* =news */

AZ.news = {
	
	init: function () {
		this.items = $$('.news-item');
		this.items.each(function (item) {
			var more = item.getElement('.more');
			if (more) {
				more.set('slide', {link: 'cancel', transition: 'sine:out'});
				more.get('slide').hide();
				var trigger = item.getElement('.trigger');
				trigger.addEvent('click', this.toggle.bindWithEvent(this, [more, trigger]));
			}
		}, this);
	},
	
	toggle: function (event, more, trigger) {
		event.stop();
		more.slide('toggle');
		trigger.toggleClass('isExpanded');
	}
	
};


/* -------------------------------------------------- */
/* =lightbox */

AZ.lightbox = {
	
	init: function () {
		// get lightbox-elements defined in cms
		this.elements = $$('.lightbox');
		this.elements.each(function (element) {
			var src = element.get('src');
			var filetype = src.match(/\.\w{3,4}$/);
			src = src.replace(filetype, '_lightbox' + filetype);
			new Element('a', {
				'href': src,
				'rel': 'lightbox[cms]'
			}).wraps(element);
		}, this);
		
		// load slimbox
		new Asset.javascript('/_js/slimbox.js');
	}
	
};

window.addEvent('domready', function () {
	AZ.lightbox.init();
});