$(function() {

	/* Replace dependency identifiers */
	$('.tech-info li.dep').each(
			function() {
				var _id = this.innerHTML;
				var _targetTitle = $('#tdesc-' + _id + ' h4');
				this.innerHTML = '';
				$('<a/>').attr('href', '#tl-' + _id)
						.append(_targetTitle.html()).appendTo($(this));
			});

	/* Map entries to tabs */
	var _entries = {};
	var _tabs = {};
	$('.tech-line').each(
			function() {
				var _id = $(this).attr('id').replace(/^tl-/, '');
				var _tab = $(this).parents('.tab-contents').attr('id').replace(
						/^tabc-/, '');
				_entries[_id] = _tab;
				if (!_tabs[_tab]) {
					_tabs[_tab] = [];
				}
				_tabs[_tab].push(_id);
			});
	var _selected = {};
	for ( var _tab in _tabs) {
		_selected[_tab] = _tabs[_tab][0];
		$('#tl-' + _selected[_tab]).toggleClass('selected');
	}

	/* Insert viewing area */
	var _viewingArea = $('<div/>').css({
		'float' : 'right',
		'width' : '300px',
		'position' : 'relative',
	}).attr('class', 'tech-view').prependTo($('#page-contents'));
	$('div.tabs').css({
		'margin-right' : '300px'
	});

	/* When an entry is clicked, set contents of viewing area */
	var _displayed = '';
	$('.tech-line').click(function() {
		var _id = $(this).attr('id').replace(/^tl-/, '');
		if (_id == _displayed) {
			return true;
		}
		_viewingArea.html($('#tdesc-' + _id).html());
		$('a', _viewingArea).click(function() {
			var _target = $(this).attr('href').replace(/^#tl-/, '');
			$('#tabb-' + _entries[_target]).click();
			$('#tl-' + _target).click();
		});
		if (_selected[_entries[_id]] != _id) {
			$('#tl-' + _selected[_entries[_id]]).toggleClass('selected');
			$(this).toggleClass('selected');
			_selected[_entries[_id]] = _id;
		}
		location.hash = '#tl-'+_id;
		return true;
	});

	/* When a tab button is clicked, select the appropriate entry */
	$('.tab-buttons a').click(function() {
		var _id = $(this).attr('id').replace(/^tabb-/, '');
		var _tech = _selected[_id];
		$('#tl-' + _tech).click();
	});

	(function() {
		var _current = location.hash;
		if (_current.match(/^#tl-/)) {
			_current = _current.replace(/#tl-/, '');
		} else if (_current.match(/^#/)) {
			_current = _selected[_current.replace(/^#/, '')];
		} else {
			for ( var _tab in _selected) {
				_current = _selected[_tab];
				break;
			}
		}
		$('#tabb-' + _entries[_current]).click();
		$('#tl-' + _current).click();
	})();
});