jQuery.noConflict();

jQuery(document).ready(function(){
	//HowTo
	var howTo = "<h2 style='color:white;'>How To</h2>" +
			"	<p style='color:white;'>DoubleClick on the image to add an image comment. Comments will appear automatically on the right side in the list.</p>" +
				"<p style='color:white;'>Doppelklicken Sie auf das Bild um eine Bildnotiz hinzuzufügen. Die Notizen werden danach in der Liste auf der rechten Seite aufgeführt.</p>" +
				"<p style='color:white;'>Doublecliquez sur l'image si vous voulez ajouter une note à l'image. Les notes vont automatiquement à droite.</p>";
	jQuery('#imageComment_editor').append("<div style='border-top:1px solid white; text-align:center;'>"+howTo+"</div>");
	//click on the icon to call the imageComment plugin
	jQuery('.imageComment_enabler').live('click', function(){
		var image = jQuery(this).parent().find('#imageComment_icon_id').attr('src');
		image = image.substr(image.indexOf('/')+ 1);
		image = image.substr(image.indexOf('/')+ 1);
		image = image.substr(image.indexOf('/')+ 1);
		image = '/' + image;

		jQuery('body').imageComment({
			userID			: userID,
			image			: image,
			docroot			: docroot,
			read			: read,
			write			: write
		});
		
		 jQuery('html, body').animate({scrollTop:0}, 'slow');
		 return false;
	});
	
	
	//nodes available and you may have a look at them
	jQuery('.imageComment-nodes').live('mouseenter', function(){
		/*var ele = '<img class="imageComment_enabler" src="/osr/olefa14/hi16green/tool_infobuttonbiggreen.png" >';
		jQuery(this).parent().append(ele);*/
		jQuery(this).parent().find('.imageComment_enabler').css({
			'left'		:	(1 * this.clientWidth) + (1 * this.offsetLeft) - (1 * 30),
			'top'		:	(1 * this.clientHeight) + (1 * this.offsetTop) - (1 * 30)
		});
		
		jQuery(this).parent().find('.imageComment_enabler').fadeIn(2000);
	});
	
	jQuery('.imageComment-nodes').live('mouseleave', function(){
		jQuery(this).parent().find('.imageComment_enabler').fadeOut(2000);
	});
	
	
	//No nodes available for this image ==> you may add one or more
	jQuery('.imageComment-new').live('mouseenter', function(){
		/*var ele = '<img class="imageComment_enabler" src="/osr/olefa14/hi16grey/tool_infobuttonbiggrey.png" >';
		jQuery(this).parent().append(ele);*/
		jQuery(this).parent().find('.imageComment_enabler').css({
			'left'		:	(1 * this.clientWidth) + (1 * this.offsetLeft) - (1 * 30),
			'top'		:	(1 * this.clientHeight) + (1 * this.offsetTop) - (1 * 30)
		});
		
		jQuery(this).parent().find('.imageComment_enabler').fadeIn(2000);
	});
	
	jQuery('.imageComment-new').live('mouseleave', function(){
		jQuery(this).parent().find('.imageComment_enabler').fadeOut(2000);
	});
	
});
