GWT / GWTBootstrap3 Extending Tooltip: Exception with addHandler in C'tor - gwtbootstrap3

I created the following class as an extension of gwtbootstrap3 Tooltip. There are at least 2 reasons why I want to derive the gwtbootstrap3 Tooltip class:
1.) Add a onWindowClosing Handler when the tooltip is shown so I can hide() the tooltip when the user leaves the page (this is - as far as I understand - a feature which is also not supported in Bootstrap, is it?)
2.) I want to prevent Tooltips from being shown when the page is displayed on iPads or iPhones as they behave strange when tooltips are involved (first tip shows the tooltip , the second tip executes the button, which is not exactly what the user expects)
Please note that the class given below is still not finished ... but already at this stage I get an exception when adding a handler.
Please also note that it throws an exception no matter what type of Handler (ShowHandler, ShownHandler, etc.) I add.
Any help greatly appreciated.
package com.mypackage.client.widgets.featureWidgets;
import org.gwtbootstrap3.client.shared.event.ShowEvent;
import org.gwtbootstrap3.client.shared.event.ShowHandler;
import org.gwtbootstrap3.client.ui.constants.Trigger;
import com.google.gwt.event.shared.HandlerRegistration;
import com.google.gwt.user.client.Window;
import com.google.gwt.user.client.Window.ClosingEvent;
public class Tooltip extends org.gwtbootstrap3.client.ui.Tooltip {
private boolean isMobile;
private HandlerRegistration windowClosingHandlerRegistration;
private final Tooltip tooltip;
public Tooltip() {
super();
tooltip = this;
this.addShowHandler(new ShowHandler() {
#Override
public void onShow(final ShowEvent showEvent) {
// TODO Auto-generated method stub
if (windowClosingHandlerRegistration == null) {
windowClosingHandlerRegistration = Window.addWindowClosingHandler(new Window.ClosingHandler() {
#Override
public void onWindowClosing(final ClosingEvent arg0) {
tooltip.hide();
}
});
}
}
});
}
}
When I create a instance of this tooltip using the following:
[...]
<b:ButtonToolBar ui:field="itemButtonToolBar" addStyleNames="hiddenPrint">
<b:ButtonGroup>
<a:Tooltip title="{msgs.buttomTitleAddItem}" container="body">
<b:Button ui:field="addItemButton" icon="PLUS"/>
</a:Tooltip>
[...]
I get the following exception when trying to add the Handler, why?
SEVERE: (TypeError) : Cannot read property 'addHandler_11_g$' of undefinedcom.google.gwt.core.client.JavaScriptException: (TypeError) : Cannot read property 'addHandler_11_g$' of undefined
at Unknown.addShowHandler_2_g$(meetingApp-0.js#26:57195)
at Unknown.Tooltip_6_g$(meetingApp-0.js#8:57685)
at Unknown.build_f_Tooltip2_0_g$(meetingApp-0.js#55:31606)
at Unknown.get_f_Tooltip2_0_g$(meetingApp-0.js#15:31831)
at Unknown.build_f_ButtonGroup1_0_g$(meetingApp-0.js#38:31524)
at Unknown.get_f_ButtonGroup1_0_g$(meetingApp-0.js#15:31791)
at Unknown.build_itemButtonToolBar_0_g$(meetingApp-0.js#41:31696)
at Unknown.get_itemButtonToolBar_0_g$(meetingApp-0.js#15:31876)
at Unknown.createAndBindUi_58_g$(meetingApp-0.js#91:31437)
at Unknown.createAndBindUi_59_g$(meetingApp-0.js#15:31441)
at Unknown.ItemButtonGroup_2_g$(meetingApp-0.js#56:30733)
at Unknown.$init_589_g$(meetingApp-0.js#31:37722)
at Unknown.SummaryWidget_1_g$(meetingApp-0.js#8:37686)
at Unknown.loadSummaryWidget_0_g$(meetingApp-0.js#26:4991)
at Unknown.setSummary_1_g$(meetingApp-0.js#10:5028)
at Unknown.onSuccess_8_g$(meetingApp-0.js#21:3312)
at Unknown.onSuccess_9_g$(meetingApp-0.js#8:3317)
at Unknown.onResponseReceived_0_g$(meetingApp-0.js#26:156917)
at Unknown.fireOnResponseReceived_0_g$(meetingApp-0.js#17:129224)
at Unknown.onReadyStateChange_0_g$(meetingApp-0.js#28:129532)
at Unknown.<anonymous>(meetingApp-0.js#18:172082)
at Unknown.apply_0_g$(meetingApp-0.js#28:104636)
at Unknown.entry0_0_g$(meetingApp-0.js#16:104692)
at Unknown.<anonymous>(meetingApp-0.js#14:104672)

Disclaimer: I use gwtbootstrap3 v0.9.2 and I believe it's the same version as you use as I got the same error for your code.
A Tooltip needs a Widget to operate on (in your case the Button is a Tooltip's widget). Tooltip uses it's widget to do all events handling - see source code for addShowHandler for example.
Now you need to understand how the whole structure is built:
first the Tooltip is created (wit no widget set)
then the Button is created
Tooltip's setWidget method is called to set the button as a widget
So when you use addShowHandler method in your constructor, you actually call widget.addHandler while widget is null.
You can check it by Window.alert(tooltip.getWidget() == null ? "null" : tooltip.getWidget().toString());
There are few ways to make it work (the later the better):
wait for DOM structure to be built by scheduling a deferred command (if you are sure that the widget will be eventually set):
Scheduler.get().scheduleDeferred(new ScheduledCommand() {
#Override
public void execute() {
// set up events handling
}
});
override setWidget method (note thet there are two methods: setWidget(Widget w) and setWidget(IsWidget w)):
#Override
public void setWidget(Widget w) {
super.setWidget(w);
// set up events handling
}
you don't need to addWindowClosingHandler in the showEvent handler, you can do it directly in the constructor:
public class Tooltip extends org.gwtbootstrap3.client.ui.Tooltip {
private boolean isMobile;
private final Tooltip tooltip;
public Tooltip() {
super();
tooltip = this;
Window.addWindowClosingHandler(new Window.ClosingHandler() {
#Override
public void onWindowClosing(final ClosingEvent arg0) {
tooltip.hide();
}
});
}
}

Related

SwipeRefreshLayout error

I am trying to implement swiperefreshlayout and I am getting error at "this"
public class viewBets_activity extends ActionBarActivity {
SwipeRefreshLayout swipeLayout;
#Override
protected void onCreate(Bundle savedInstanceState) {
super.onCreate(savedInstanceState);
setContentView(R.layout.viewbets);
swipeLayout = (SwipeRefreshLayout) findViewById(R.id.swipe_container);
swipeLayout.setOnRefreshListener(this);
swipeLayout.setColorScheme(android.R.color.holo_blue_bright,
android.R.color.holo_green_light,
android.R.color.holo_orange_light,
android.R.color.holo_red_light);
}
public void onRefresh() {
new Handler().postDelayed(new Runnable() {
#Override
public void run() {
swipeLayout.setRefreshing(false);
}
}, 5000);
}
}
I am getting error at swipeLayout.setOnRefreshListener(this); screenshot below
Well, now that you added the screenshot, the error is clear.
You're passing the wrong argument into setOnRefreshListener()! And of course, this makes sense, if you think about it. Your class is a ActionBarActivity. You're trying to set the OnRefreshListener as an ActionBarActivity...doesn't make any sense! You need to change your code to this:
swipeLayout.setOnRefreshListener(new OnRefreshListener()
{
#Override
public void onRefresh()
{
// what you want to happen onRefresh goes here
}
});
Here, you're creating a new OnRefreshListener object which you're adding as the listener.
For the future, in general, any time you have a setOn______Listener() method, the argument you'll be passing will be a On_____Listener object that you've customized. You can either created separately, or create it right in the set method the way I did in my answer.
Your class is missing
implement SwipeRefreshLayout.OnRefreshListener
This allows the listener to refer to the overridden method onRefresh when passing through this as the argument for setOnRefreshListener

Adding button to SimplePanel results in error

I am performing the following action in GWT
public class FooPanel extends SimplePanel {
private String url;
public FooPanel () {
super(DOM.createAnchor());
Button button = new Button();
button.addClickHandler(new ClickHandler() {
public void onClick(ClickEvent event) {
foo();
}
});
add(button);
}
}
however when I run the code I get the following error
SimplePanel can only contain one child widget
However Button is a single widget so I am not sure what the problem is? The problem doesn't occur if i don't add the button
Remove this line:
super(DOM.createAnchor());
You don't need it.
You can simply use your Button in your code, or extend a Button widget. Adding a Button to a SimplePanel does not offer any benefits.
Have a look at source code of SimplePanel#add() to analyze this error.
#Override
public void add(Widget w) {
// Can't add() more than one widget to a SimplePanel.
if (getWidget() != null) {
throw new IllegalStateException("SimplePanel can only contain one child widget");
}
setWidget(w);
}
Now its clear from the source code that you have already added a widget in SimplePanel.
Call SimplePanel#getWidget() to get the already added widget.
Look at the source code of default constructor if SimplePanel class. It might help you to understand that how SimplePanel enclose the widget inside it.
/**
* Creates an empty panel that uses a DIV for its contents.
*/
public SimplePanel() {
this(DOM.createDiv());
}
Try with setWidget(button); instead of add(button);

GWT is making an unexpected event call

My code is below: I am seeing that on running the app the loadWidget method gets invoked even when the adminLink is not clicked. This is not want I want, but I'm not sure what is causing the issue. Please advise
public class LoginModule implements EntryPoint {
LoginPopup loginPopup;
private class LoginPopup extends PopupPanel {
public LoginPopup() {
super(true);
}
public void loadWidget(){
System.out.println("I am called 1");
CommonUi cUi = new CommonUi();
//#342 moved code to common area
FormPanel loginForm = cUi.getLoginFormUi();
setWidget(loginForm);
}
}
#Override
public void onModuleLoad() {
//#251 improved login popup ui.
final Anchor adminLink = new Anchor("User Login");
// final Label adminLink = new Label("User Login");
adminLink.addClickHandler(new ClickHandler() {
public void onClick(ClickEvent event) {
// Instantiate the popup and show it.
loginPopup = new LoginPopup();
loginPopup.loadWidget();
loginPopup.showRelativeTo(adminLink);
loginPopup.show();
}
});
if(RootPanel.get("admin") !=null)
RootPanel.get("admin").add(adminLink);
}
}
Running Dev Mode, set a breakpoint in that method in your Java IDE, and take a look at the current stack, what code is calling that method. If that is the only code in your app, then this only appears to be invokable from that onClick handlers, so it is a matter of figuring out why that is being invoked.

GWT Widget.addHandler

I am trying to utilize Widget.addHandler(). However, the handler never gets called. Below is my sample code. What do I need to change to fix this?
My Handler Implementation:
public class CustomMouseMoveHandler
extends GwtEvent.Type<MouseMoveHandler>
implements MouseMoveHandler
{
#Override
public void onMouseMove(MouseMoveEvent event) {
System.out.println("----> onMouseMove.");
}
}
My EntryPoint.OnModuleLoad():
ContentPanel cp = new ContentPanel();
cp.setHeaderVisible(false);
cp.setHeight(com.google.gwt.user.client.Window.getClientHeight());
CustomMouseMoveHandler handler = new CustomMouseMoveHandler();
cp.addHandler(handler, handler);
RootPanel.get().add(cp);
/////
Added on 7/1/2011.
The following complete GWT simple code does not work either (with Jason's hint applied). Please help me out. Thanks
package tut.client;
import com.google.gwt.core.client.EntryPoint;
import com.google.gwt.event.dom.client.MouseMoveEvent;
import com.google.gwt.event.dom.client.MouseMoveHandler;
import com.google.gwt.user.client.ui.RootPanel;
import com.google.gwt.user.client.ui.TextArea;
/**
* Entry point classes define <code>onModuleLoad()</code>.
*/
public class GwtHandler implements EntryPoint, MouseMoveHandler {
/**
* This is the entry point method.
*/
public void onModuleLoad() {
TextArea comp = new TextArea();
comp.setSize("200px", "200px");
comp.setText("Testing Text");
comp.addHandler(this, MouseMoveEvent.getType());
RootPanel.get().add(comp);
}
#Override
public void onMouseMove(MouseMoveEvent event) {
com.google.gwt.user.client.Window.alert("onMouseMove");
}
}
GwtEvent.Type is used to dispatch events based on an event specific and unique object (object equality - == - is used to match event types). Passing your CustomMouseMoveHandler as the Type to addHandler indicates an event type other than that used for MouseMoveEvents (Indeed in this case every CustomMouseMoveHandler would be assigned to a different event Type since each object is different).
Instead of extending GwtEvent.Type<MouseMoveHandler> in your handler you need to get the event Type from MouseMoveEvent itself (using the static getType() method).
Don't extend GwtEvent.Type in your CustomMouseMoveHandler:
public class CustomMouseMoveHandler
implements MouseMoveHandler
{
...
}
And to add the handler:
cp.addDomHandler(handler, MouseMoveEvent.getType());
DomEvents have to be registered using addDomHandler, or you have to sinkEvents for their event type. addDomHandler is a shortcut for sinkEvents+addHandler.
Here's how I solved my problem. I wanted to add handlers to a NumberLabel. This is what worked:
final NumberLabel<Long> label = new NumberLabel<Long>();
label.setValue(2000l);
label.setHorizontalAlignment(HasHorizontalAlignment.ALIGN_RIGHT);
MouseOverHandler handler = new MouseOverHandler() {
public void onMouseOver(MouseOverEvent event) {
System.out.println("mouse over");
}
};
Widget widget = label.asWidget();
widget.addDomHandler(handler, MouseOverEvent.getType());
Treating is as a Widget did the trick.
By the way, System.out.println worked.

Drag and Drop in GWT using gwt dnd

I have been really struggling to get Drag and Drop working in GWT. Last 3 days, I was trying to create a basic drag and drop application and failed. Currently I can drag it around, but I am unable to drop to any location.
How can we solve it? Do we need to modify onDragEnd - I am under the impression that unless I specifically have to do something, I dont have to? I am quite confused.
Also, how do I limit the drop to any single area? I do understand that we can do it using DropController. But I have defined the panels using UiBinder, so how do I get that panel back to link in the DropController? i.e. RootPanel.get() gives me the basic root panel and not the actual panel I want. I tried RootPanel.get("field-id"), but that is showing null even if that id is available. What am I doing wrong?
The code I have written is as follows:
public class TestPanel extends Composite implements
DragHandler, HasMouseDownHandlers, HasMouseUpHandlers, HasMouseMoveHandlers, HasMouseOutHandlers {
interface Binder extends UiBinder<Widget, TestPanel> { }
private static final Binder binder = GWT.create(Binder.class);
#UiField AbsolutePanel absolutePanel;
private PickupDragController TestDragController;
private Image img = new Image("./testicon.png");
public TestPanel(){
initWidget(binder.createAndBindUi(this));
absolutePanel.add(img);
TestDragController = new PickupDragController(RootPanel.get(), false);
AbsolutePositionDropController dropController = new AbsolutePositionDropController(
RootPanel.get());
TestDragController.registerDropController(dropController);
TestDragController.addDragHandler(this);
TestDragController.makeDraggable(this, getDragHandle());
}
private Widget getDragHandle() {
return img;
}
#Override
public void onDragEnd(DragEndEvent event) { }
#Override
public void onDragStart(DragStartEvent event) { }
#Override
public void onPreviewDragEnd(DragEndEvent event) throws VetoDragException { }
#Override
public void onPreviewDragStart(DragStartEvent event) throws VetoDragException { }
#Override
public HandlerRegistration addMouseDownHandler(MouseDownHandler handler) {
return addDomHandler(handler, MouseDownEvent.getType());
}
#Override
public HandlerRegistration addMouseUpHandler(MouseUpHandler handler) {
return addDomHandler(handler, MouseUpEvent.getType());
}
#Override
public HandlerRegistration addMouseMoveHandler(MouseMoveHandler handler) {
return addDomHandler(handler, MouseMoveEvent.getType());
}
#Override
public HandlerRegistration addMouseOutHandler(MouseOutHandler handler) {
return addDomHandler(handler, MouseOutEvent.getType());
}
}
and the testpanel uibinder looks like the following:
<g:AbsolutePanel ui:field="absolutePanel" styleName="{style.panel}">
</g:AbsolutePanel>
If somebody can help me out, I will be very much obliged.
K
P.S: To explain more: I was able to solve the first question by updating onDragEnd as the following:
#Override
public void onDragEnd(DragEndEvent event) {
DragContext context = event.getContext();
RootPanel.get().add(context.draggable, context.desiredDraggableX, context.desiredDraggableY);
}
but, I am not sure whether this is the correct solution - since I think I should not be doing the positioning myself.
If you're new to GWT dnd, why don't you try the working demo ?
There is a lot of examples and all the source code is available.
(And no, you're not supposed to do the positionning yourself)
You have to add a DragOverHandler on the drop target(s): even if it does nothing, it defines the component as a drop target.
Of course, you still need to define the DropHandler too on this component (and optionally, DragEnterHandler and DragLeaveHandler for visual feedback, in general).
The DragEndHandler is called even if the target isn't reached (drag abandoned in a non-drop area), it is used to change the state of the dragged object, you might need to set a way for the DropHandler to communicate success on dropping to the DragEndHandler (shared variable, EventBus, etc.).