I'm working on a project that integrates OpenLayers and Qooxdoo...so far I'm having lots of success. But now I want to be able to place qooxdoo widgets in an OpenLayers popup (FramedCloud in this case) and something weird is happening--the button won't click!
The hover events seem to be working, and I've determined that qx.event.handler.Focus.__onNativeMouseDown is being executed, so the click event seems to be getting to the qooxdoo event system (?), but qx.event.handler.Mouse._onButtonEvent never gets called!
Either something in OL is getting in the way, or I'm doing something wrong. See one or both of these links for a test case:
http://s89238293.onlinehome.us/olisletest/build/index.html
http://s89238293.onlinehome.us/olisletest/source/index.html
(be advised that the "source" link loads the uncompressed/debug versions of both qooxdoo and OpenLayers, so it takes a while to load!)
The links above build on the skeleton qx Inline app, here's the main custom part of the code:
var map = new OpenLayers.Map("map_canvas", {
projection: new OpenLayers.Projection("EPSG:900913"),
displayProjection: new OpenLayers.Projection("EPSG:4326"),
units: "m",
numZoomLevels: 18,
maxResolution: 156543.0339,
maxExtent: new OpenLayers.Bounds(-20037508, -20037508,
20037508, 20037508.34)
});
map.addLayer(new OpenLayers.Layer.OSM());
map.setCenter(new OpenLayers.LonLat(-97.0, 38.0).transform(map.displayProjection, map.projection), 3);
var popup = new OpenLayers.Popup.FramedCloud(
"searchSelection",
new OpenLayers.LonLat(-97.0, 38.0).transform(map.displayProjection, map.projection),
new OpenLayers.Size(200, 200),
null,
null,
true,
null
);
popup.autoSize = false;
map.addPopup(popup);
var button2 = new qx.ui.form.Button("A Button");
button2.addListener("execute", function(){alert("Hello???");}, this);
var isle = document.createElement("DIV");
popup.contentDiv.appendChild(isle);
var popupIsle = new qx.ui.root.Inline(isle, false, false);
popupIsle.setLayout(new qx.ui.layout.VBox);
popupIsle.setBackgroundColor("#fff");
popupIsle.add(button2);
Can anyone help me figure out what's happening to the click event?
== EDIT ==
Thanks Alex, I've done some more plugging at it to try and figure out.
I tried a test of essentially the same code outside the OL map and it works, so that's eliminated.
I did this additionally to the OL popup object:
popup.events.un({
"mousedown": popup.onmousedown,
"mousemove": popup.onmousemove,
"mouseup": popup.onmouseup,
"click": popup.onclick,
"mouseout": popup.onmouseout,
"dblclick": popup.ondblclick,
scope: popup
});
Which I think disables all event handling on the popup itself (notice, for example, you can now pan the map by dragging within the popup--which is suboptimal, but proves the point). And, that didn't help...which seems to suggest that perhaps the event handling on the map itself is blocking the events. I can't disable mouse events on the map, for obvious reasons.
I'm going to pass this on to the OpenLayers mailing list in hopes of some more help...but in the meantime, anyone have any ideas for a workaround? So strange to me that some events (mouseover) work fine, but click doesn't. I'm open even to hacks at this point.
Also, I'm having a real hard time debugging this...I tried using the "Break on Next" feature in Firebug (and Safari debugger), but since qooxdoo is running several interval timers internally I can't catch the click because of the noise (the interval code always comes up before I can click). Any tips on how to catch the click event i开发者_运维百科n the debugger would be appreciated!!
I had the same problem. Clicking on the Qooxdoo doesn't work. I use Qooxdoo v1.6 and OpenLayers v2.12. The Problem was the mousedown-event on the popup and the Map-Navigator. In my case the following has working fine:
// looking for the navigation control of the map
var controls = map.controls;
var navigator;
for(var i = 0; i < controls.length; i++) {
if(controls[i].CLASS_NAME == "OpenLayers.Control.Navigation")
navigator = controls[i];
}
popup.events.unregister("mousedown", popup, popup.onmousedown); // disable the mousedown-event
popup.events.register("mouseover", navigator, navigator.deactivate()); // on mouseover: deactivate the navigation-control of the map
popup.events.register("mouseout", navigator, navigator.activate()); // on mouseout: activate the navigation-control of the map
I hope, this would be helpful for anybody.
I've just tested your example and I think that the layer implementation is blocking the click event. So the click event is first processed by the OpenLayers and qooxdoo does not get it.
Do be sure that nothing is wrong with inline implementation of qooxdoo. Do you already tested your inline button without including the OpenLayers stuff? If everything is working fine without OpenLayers implementation you know at least that OpenLayers is somehow blocking the events.
This would be my first step in debugging. Hope that helps a bit.
Regards, Alex
精彩评论