Beginner struggling with custom events

Beginner struggling with custom events

Hi everyone! First post here, I hope I'm not violating any rule here.

I'm modifying the open source jQuery Image Color Picker plugin from project-sierra.de. Here are some parts of my code. This is where I define what happens on mousemove when the mouse is on an image (better, on a canvas that I created to coincide with the image):

  1. widget.$canvas.bind("mousemove", function(e){
  2.        var point = imageCoordinates( that, e.pageX, e.pageY );
  3.   var abscoor = absCoordinates( that, e.pageX, e.pageY );
  4.        var color = lookupColor( that.imageData, point );
  5.        updateSelectedColor( that, color.red, color.green, color.blue );
  6.        //alert(abscoor.x +" " + abscoor.y);
  7.   that._trigger("afterColorSelected", 0, that.selectedColor(), abscoor);
  8. });

imageCoordinates and absCoordinates return the coordinates of the mouse, relative to either the image or the page. lookupColor looks for the color where the mouse is and updateSelectedColor updates the value of that.selectedColor().
The alert is useful for debuggin purposes and it gives me the correct coordinates.

Here is how I handle the event:

  1. $(document).ready(function(){
  2. var tooltip = $( '<div id="tooltip">' ).appendTo( 'body' )[0];
  3.   $("img").ImageColorPicker({
  4.    afterColorSelected: function(event, color, pos) {
  5.   $("#tooltip").html(color).show(); 
  6.                 //alert(pos.x +" "+ pos.y);
  7.   }
  8.   });
  9. });

For some reason, the alert is not fired. The color is correctly displayed in the tooltip div, but pos is undefined. Sometimes the alert is not even fired, sometimes it gives "undefined undefined" (which is also weird, why does it change?)

Thanks again and sorry for the newbie question

Best

ZT