Windows with IFRAME - glaring mistake to show contents while dragging

Suite and Optimus Suite 5
#1

We used an older version of this library that worked perfectly. Now in a new project we have used your latest version, but it seem to work differently when it comes to windows.

In the old version, it would not show the content of the window, but rather a placeholder, that you could easily move around.

In the new version the actual window moves, with the content… however. Something serious has been overlooked here. When the content is loaded with an IFRAME, the redraw is delayed, and the window can “slip” off the cursor, causing the onmouseup event not to fire, and since the mouse is no longer over the title bar, the user can lift their cursor, but the window now is “attached” to the movement of the mouse, so the user cannot move their mouse over the window again.

I have seen this behavior many times with the same result, in other UI systems too, all suffering from the same issue for many years, and i was shocked to see that this DHTMLX library had simply overlooked this issue, especially when there is a such a simple fix (to not show the content of the window as you had it before!).

Please, you absolutely have to fix this issue - its a glaring mistake in an otherwise wonderful product.

Please either allow a “showContentWhileDragging(bool)” toggle, or make it automatically use the older method if the content is loaded using an IFRAME.

Thanks in advance for your consideration.

#2

You can add style like next to reenable cover behavior

<style>
  .dhxwin_fr_cover_dnd{
    display:block !important;
  }
</style>

http://snippet.dhtmlx.com/1898e6a24

#3

Hi Stanislav, Fantastic support! Thanks

However, while I can see an immediate impact of adding this snippet to your code, the same does not impact my code at all… I’m running the Standard Edition, 5.1.0. so we should be on the same version.

I have double check a few times, i see the class .dhxwin_fr_cover_dnd being included, and overriding the existing attribute, but it has no impact.

I’m seeing drastically different performance in the window dragging between your sample and my site - only when the IFRAME is used.

I have even been fiddling around trying things like deleting the IFRAME object after the page loads (using Google Chrome inspect) but the same behavior persists after the IFRAME is removed from the DOM. The same thing happens across all types of machines, not just mine.

There is a distinct deference between the window that loads html with ajax and with the IFRAME, the ajax window never slips off the cursor, but the iframe one always does at some point if you shake your mouse enough (worse if you grab near the edge).

In your sample, once that snippet was applied, your sample was much better and i could see the difference with it on and off… but with me it never seemed to make any difference.

#4

Ah, this is very interesting! if i leave my code as is… but change it to:
.setModal(true);
The behavior of the window is completely different, IFRAME or not, i don’t even need that CSS trick attached, it just never “slips” off the cursor.

Anything you can think of given this new information?

#5

For anyone who comes across the post, the solution in the end was this:

win1 = dhxWins.createWindow(1, 100, 100, 300, 600);

win1.attachEvent("onBeforeMoveStart", function (winObj) {
        $('BODY').append("<div id=\"" + winObj.getId() + "MoveOverlay\" class=\"dhxwins_mcover\"></div>");
        return true;
});
win1.attachEvent("onMoveFinish", function (winObj) {
        $("#" + winObj.getId() + "MoveOverlay").remove();
});
win1.attachEvent("onMoveCancel", function (winObj) {
        $("#" + winObj.getId() + "MoveOverlay").remove();
});
win1.show();

Now the window does not “slip” off the the cursor.

Maybe something worth considering as a built in feature for the Window Object:
.showOverlayWhileDraggig(bool);

Just a suggestion.