
if (! Istos) var Istos = {};
Istos.tabs = {}

Istos.tabs.register = function (selector) {
	Event.observe(window, 'load', function() {
		$$(selector).map(function(elm) { Istos.tabs.tabify(elm); });
	});
}

Istos.tabs.tabify = function (elm) {
	var tabBar = $(document.createElement('DIV'));
	tabBar.className = 'tab-bar';

	var tabPanels = $(document.createElement('DIV'));
	tabPanels.className = 'tab-panels';

	var first = true;
	var tabLabel = elm.down();
	var tabPanel = tabLabel.next();
	var next = tabPanel.next();

	while (tabLabel && tabPanel) {
		tabBar.appendChild(tabLabel);
		tabPanels.appendChild(tabPanel);

		if (first) {
			tabLabel.addClassName('act');
			tabLabel.addClassName('first');
			tabPanel.addClassName('act');

		} else {
			tabLabel.removeClassName('act');
			tabLabel.removeClassName('first');
			tabPanel.removeClassName('act');
		}

		tabLabel._tabPanel = tabPanel;

		Event.observe(tabLabel, 'click', function(event) {
			var clicked = Event.element(event);
			if (clicked._tabPanel) {
				clicked.up().childElements().map(function(elm) {
					elm.removeClassName('act');
				});
				clicked.addClassName('act');

				clicked._tabPanel.up().childElements().map(function(elm) {
					elm.removeClassName('act');
				});
				clicked._tabPanel.addClassName('act');
			}
		});

		tabLabel = next;
		if (tabLabel) tabPanel = tabLabel.next();
		first = false;
	}

	elm.appendChild(tabBar);
	elm.appendChild(tabPanels);
}
