// JavaScript Document
// Original code by Andrew Davis; modified by Tim Swalling and David Matthewman (Avid Technology)

function showImage(id, filename) {
	if (id==undefined) { id = 'default'}
	if (filename==undefined) { filename = id}
		
	var path= 'http://www.sibelius.com/helpcenter/images/';		// The default path for the image
	var pathIndicator = /\/|http:\/\/|ftp:\/\//gi;		// Strings whose presence will indicate that the filename includes a path
	var matchPos = filename.search(pathIndicator);		
	if (matchPos == 0) {path = ''}		// Remove the default path if the filename includes a path
	
	$(id + '_pic').src=path + filename;
	$(id).show();
}

function hideImage(id) {
	$(id).hide();
	$(id + '_pic').src="http://www.sibelius.com/helpcenter/images/loading.png";		// Returns a placeholder image
}

function createImagePopup(image_id) {
	var positioner = new Element('div', { id: image_id + '_positioner', style: 'position:relative'});
	var image_box = new Element('span', { id: image_id, style: 'position:absolute; top: 0px; left: 0px; z-index:1; background-color: #FFFFFF; layer-background-color: #FFFFFF; border: solid thin #000000; display: none;'});
	
	image_box.insert('<table border=\"0\" cellpadding=\"3\"><tr><td align=\"center\">' 
									 + '<a href=\"javascript:hideImage(\'' + image_id + '\')\">Hide picture</a>' 
									 + '</td></tr><tr><td align=\"center\">' 
									 + '<a href=\"javascript:hideImage(\'' + image_id + '\')\">' 
									 + '<img id=\"' + image_id + '_pic\" border=\"0\" src=\"http://www.sibelius.com/helpcenter/images/loading.png"\">'
									 + '</a></td></tr></table>');
	positioner.appendChild(image_box);
	return positioner;
}

function replaceWithPopUp(element) {
	var image_id = element.id + '_popoup';
	if (!$(image_id)) {
		image_box = createImagePopup(image_id);
		element.insert({before: image_box});
	}
	var link_text = element.innerHTML;
	var filename = element.href;
  element.replace('<a href=\"javascript:showImage(\'' + image_id + '\', \'' + filename + '\')\">' + link_text + '</a>');	
}

document.observe('dom:loaded', function() {
	var image_popups = $$('a.image_popup');
  image_popups.each(replaceWithPopUp);
});