window.addEvent('domready', function() {
	
	function createDiv (text, count, container) {
		var div = new Element('div', {
			'class': 'wrapper'
		});
		var p = new Element('p');
		var bottom = new Element('div', {
			'class': 'bottom'
		});
		var close = new Element('a', {
			'href': '#',
			'events': {
				'click': function(e) {
					e = new Event(e).stop();
					div.setStyle('display', 'none');
					container.setStyle('z-index', '1001');
				}
			},
			'class': 'close'
		});
		close.setText('Close').injectInside(div);
		p.setHTML(text).injectAfter(close);
		bottom.injectAfter(p);
		return div;
	}
	
	function createSpan (text) {
		var span = new Element('span');
		span.setText(text);
		return span;
	}
	
	if ($$('#content span.footnote')) {
		$$('#content span.footnote').each(function(element, count) {
			var div, text = element.innerHTML, container = element;
			count++;
			element.setText('');
			span = createSpan('['+count+']').injectInside(container);
			div = createDiv(text, count, container).injectInside(container);
			$E('span', container).addEvent('click',function(element) {
				$$('#content span.footnote div.wrapper').each(function(element) {
					element.setStyle('display', 'none');
				});
				container.setStyle('z-index', '1002');
				div.setStyle('display', 'block');
			});
		});

		$$('#content span.footnote div.wrapper').each(function(element) {
			element.setStyle('display', 'none');
		});
	}
	
	if ($$('#content span.citation')) {
		$$('#content span.citation').each(function(element, count) {
			var div, text = element.innerHTML, container = element;
			element.setText('');
			span = createSpan('*').injectInside(container);
			div = createDiv(text, '', container).injectInside(container);
			$E('span', element).addEvent('click',function(element) {
				$$('#content p.citation div.wrapper').each(function(element) {
					element.setStyle('display', 'none');
				});
				container.setStyle('z-index', '1002');
				div.setStyle('display', 'block');
			});
		});

		$$('#content span.citation div.wrapper').each(function(element) {
			element.setStyle('display', 'none');
		});
	}
	

});
