Implement Javascript Function Callback with GWT JsInterop

Question

I want to wrap a javascript code like this :

map.addMarker({
        lat: -12.043333,
        lng: -77.028333,
        draggable: true,
        fences: [polygon],
        outside: function(m, f){
          alert('This marker has been moved outside of its fence');
        }
      });

Here how I write it in Java :

@JsType(namespace = JsPackage.GLOBAL, isNative = true, name = "Object")
public class MarkerOptions {
    @JsProperty
    public double lat;

    @JsProperty
    public double lng;

    @JsProperty
    public boolean draggable;

    @JsProperty
    public Polygon fences;

    @JsFunction
    public interface FunctionOutsideParam {
        void outside();
    }

    @JsProperty
    public FunctionOutsideParam outside;
}

But it's not working. Even thou it didn't have any error in my browser console. Anybody know how to make it working for the outside callback function? Thanks and regards.

How does "it is not working" manifest itself? Error? Expected invocation that is not happening? — Andrei, Jun 12 '17 at 12:32
Your sample JS and Java are inconsistent - the `fences` property should be `Polygon[]`, and the `FunctionOutsideParam` should take two parameters, right? Can you share the Java you have that does the equivalent of the JS you have in the question? — Colin Alworth, Jun 12 '17 at 15:01
@Andrei The invocation is not happening, and no error in console or everywhere else. That's why it's even more confusing how to do this. — the.wizard, Jun 13 '17 at 01:17
@ColinAlworth Yes, you're right. They are inconsistent, I will try to update it. I will post the complete code of JS and Java code. Thank you. — the.wizard, Jun 13 '17 at 01:32
Looks like it should work, although I did not used functions before. Does the final JS contain your MarkerOptions class in it? Do you use the `generateJsInteropExports` flag? — Andrei, Jun 13 '17 at 08:34

score 1 · Accepted Answer · answered Jun 13 '17 at 10:39

I finally found a solution. It appears that my java code was inconsistent with my javascript code. Thanks to Colin Alworth for pointing me the inconsistent part. So here is my full code :

@JsType(namespace = JsPackage.GLOBAL, isNative = true, name = "Object")
public class MarkerOptions {
    @JsProperty
    public double lat;

    @JsProperty
    public double lng;

    @JsProperty
    public boolean draggable;

    @JsProperty
    public Polygon[] fences;

    @JsFunction
    public interface FunctionOutsideParam {
        void outside(Marker m, Polygon[] f);
    }

    @JsProperty
    public FunctionOutsideParam outside;
}

Now whenever I run it, the outside function callback was invocated correctly. Thanks everyone. I hope my answer could help many others developer who tried to figured out how to implement js callback function with GWT JSInterop.

Implement Javascript Function Callback with GWT JsInterop

1 Answers1

Linked