Contrib: simple Mouse Wheel support for GWT

[Tiago Serafim]

Hi,

Yesterday (http://groups.google.com/group/Google-Web-Toolkit/browse_thread/thread/02afe807b35d99c4/# ) I was looking to a way to use the mouse wheel in my GWT app, but I didn´t find a straightforward way... so today I spend my morning learning JSNI and, with some piece of code I found on the Internet, I my my own approach... Feel free to use anywere .. Hope that it might be useful for someone else too...

public interface MouseWheelListener {
   
    public void onMouseWheelUp(int intensity);
   
    public void onMouseWheelDown(int intensity);
   
}

public class MouseWheel {
   
    private MouseWheel(Element e, MouseWheelListener listener) {
        attachMouseWheelListener(e, listener);
    }
   
    /**
     * Sets a MouseWheelListener to a given Element
     */
    public static void setMouseWheelListener(Element e, MouseWheelListener listener) {
        new MouseWheel(e, listener);
    }
   
   
    /**
     * This method is used by FF
     * @param event
     */
    private static native void dispatchMouseWheelEvent(JavaScriptObject event) /*-{
       
        @br.com.example.client.util.MouseWheel::dispatchMouseWheelEvent(Lcom/google/gwt/core/client/JavaScriptObject;Lbr/com/example/client/util/MouseWheelListener;)(event, this.__mousewheellistener);
   
    }-*/;
   
    /**
     * This method is used by IE and FF
     * Part of this method was retrieved from http://adomas.org/notes/mouse-wheel.html
     *
     * @param event
     * @param listener
     */
    private static native void dispatchMouseWheelEvent(JavaScriptObject event, MouseWheelListener listener) /*-{

         if (!event) event = $wnd.event; // For IE

         var delta = 0;
         if (event.wheelDelta)             // IE case, delta is multiple of 120
              delta = event.wheelDelta / 120;
         else if (event.detail )            // Mozilla case
              delta = -event.detail / 3;   // different sign and multiple of 3
        
         if ( delta > 0 ) {
             listener.@br.com.example.client.util.MouseWheelListener::onMouseWheelUp(I)(delta);
         } else {
             listener.@br.com.example.client.util.MouseWheelListener::onMouseWheelDown(I)(-delta);
         }
   
    }-*/;
   
   
    private native void attachMouseWheelListener(Element e, MouseWheelListener listener) /*-{
       
        e.__mousewheellistener = listener;
       
        // for FF
        if (e.addEventListener) {
            e.addEventListener('DOMMouseScroll', @br.com.example.client.util.MouseWheel::dispatchMouseWheelEvent(Lcom/google/gwt/core/client/JavaScriptObject;), false);
            return;
        }
       
        // for IE
        e.onmousewheel = function(event) {
            @br.com.example.client.util.MouseWheel::dispatchMouseWheelEvent (Lcom/google/gwt/core/client/JavaScriptObject;Lbr/com/example/client/util/MouseWheelListener;)(event, this.__mousewheellistener);
        }
       
    }-*/;
   
}




And here is how to use it:

        MouseWheel.setMouseWheelListener(RootPanel.get("slot2").getElement(), new MouseWheelListener() {

            public void onMouseWheelUp(int intensity) {
                Window.alert("up.. " + intensity);
            }

            public void onMouseWheelDown(int intensity) {
                Window.alert("down..." + intensity);
            }
       
        });



Remember to replace my hardcoded package name (br.com.example) for your own... If you have any suggestion or critic, feel free to tell me...

Cheers,

--
Tiago Serafim

[I.O.]

Thanks! hope they WILL include it into GWT! :-D

On 6/19/06, Tiago Serafim <tser...@gmail.com> wrote:

Hi,

Yesterday ( http://groups.google.com/group/Google-Web-Toolkit/browse_thread/thread/02afe807b35d99c4/# ) I was looking to a way to use the mouse wheel in my GWT app, but I didn´t find a straightforward way... so today I spend my morning learning JSNI and, with some piece of code I found on the Internet, I my my own approach... Feel free to use anywere .. Hope that it might be useful for someone else too...