document.observe("dom:loaded", function() {

	var toggleArticle = function(articleCollapsible) {
		if (articleCollapsible.status == 'open') {
			articleCollapsible.status = 'closed';
			articleCollapsible.blindUp({
					duration: 0.5
			});
		} else {
			articleCollapsible.status = 'open';

			articleCollapsible.blindDown({
				duration: 0.5,
				afterFinish: function() {
						articleCollapsible.setStyle({
							height: 'auto'
						});
					}
			});
		}
	}

	var collapsibleArticles = $$('div.article_collapsible');
	if (collapsibleArticles) {
		collapsibleArticles.each(function(article) {

			// Add class to container element
			article.up().addClassName('collapsible_container');

			var articleCollapsible = new Element('div', {'class' : 'collapsible-wrapper'});
			articleCollapsible.status = 'open';

			var titleElem = article.previous(0);

			article.insert({'before' : articleCollapsible });
			articleCollapsible.update(article);
			articleCollapsible.setStyle({
				padding: 0 + 'px',
				margin: 0 + 'px'
			})

			article.childElements().last().setStyle({
				marginBottom: 0 + 'px'
			});

			article.originalHeight = article.getHeight();

			if (titleElem && titleElem.hasClassName('closed')) {
				articleCollapsible.status = 'closed';
				articleCollapsible.hide();
			}

			Event.observe(titleElem, 'click', function(event) {

				articleCollapsible.setStyle({
					height: article.originalHeight + 'px'
				});

				toggleArticle(articleCollapsible);
				this.toggleClassName('open');
				this.toggleClassName('closed');

			});
		});
	}

});
