DHTML Window - Dragging outside of browser boarder

[pdragon04]

1) Script Title: DHTML Window widget

2) Script URL (on DD): http://www.dynamicdrive.com/dynamici...ndow/index.htm

3) Describe problem:
I've come across a problem with the DHTML Window widget. Firefox seems to allow, completely at random, for the DHTML window widget to be dragged up and off the screen and not be able to be brought back. It happens both here in the DD site and my site I'm using it on as well. I say it happens randomly, because sometimes when the page is loaded, the widget is not allowed to be dragged up and off (it's stopped at the viewing window boarder). Other times, I can just drag it right up and completely out of the browser window. If I let go of the left mouse button, then the widget it stuck up off the screen until the page is reloaded. I cannot get this to do it with any consistency or figure out what is causing it since I do nothing different other than just load the page and sometimes it happens and sometimes it doesn't.

I'm using Firefox 2.0.0.4.

I cannot reproduce this in IE since when it's dragged off, the widget pops right to the mouse pointer and is movable when it's brought back into the browser window again.

[jscheuer1]

It happened to me too, just now when I tried it. Give this a shot (additions red):

move:function(t, e){
	t.style.left=dhtmlwindow.distancex+dhtmlwindow.initx+"px"
	t.style.top=Math.max(0,dhtmlwindow.distancey+dhtmlwindow.inity)+"px"
},

. . . from dhtmlwindow.js

[pdragon04]

That seems to have fixed it. Even gave Firefox the functionality that I described IE as having (moving the widget back to the pointer when it's brought back into the browser window after leaving).

Thanks very much for the quick fix!

[pdragon04]

Just noticed the same thing happens when the widget is dragged off the left edge off the browser. Added the same code to the line above that controls the left boundary and it stops that from happening.

Also, I don't seem to get any kind of consistency of the behavior I described of the widget popping back under the pointer when it's brought back into the browser window. Sometimes it does it, sometimes it doesn't.

That's not quite as big a problem, though, since moving the widget off the right or bottom edges doesn't make a difference. The browser window just adds/extends the browser window scroll bars.

[subpop]

t.style.left=Math.max(0,dhtmlwindow.distancex+dhtmlwindow.initx)+"px"
t.style.top=Math.max(0,dhtmlwindow.distancey+dhtmlwindow.inity)+"px"

this works fine, but.. what if I don't want the window to be dragged to the right or bottom?

[jscheuer1]

There really is no need to prevent that from happening, as the window cannot be lost by the user's doing that, and only someone who gets their kicks out of playing with the interface would even bother doing it more than once. I suppose one could find what the browser is comfortable with as defining the width and height of the window or page, depending upon if you want to limit movement in the window or on the page. These calculations are somewhat complex, but not impossible and several resources exist for finding the methods to use. Quirksmode.org is a good one. Once you have the outer right and bottom coordinates (limits) of your choosing, you would do something like:

t.style.top=Math.max(0,Math.min(bottomlimit-dhtmlwindow.offsetHeight,dhtmlwindow.distancey+dhtmlwindow.inity))+"px"

and similar for the left position. But, as I say, there is no real need to bother, and the code is certainly quite a bit more complex.

[veenaay]

I solved in following way. I set viewable area by 1200 x 500 px . Following code update will not allow window to be draged out from viewable area.

if((dhtmlwindow.distancex+dhtmlwindow.initx)>1000){
t.style.left=Math.max(0,1000)+"px"
}else{
t.style.left=Math.max(0,dhtmlwindow.distancex+dhtmlwindow.initx)+"px"
}
if((dhtmlwindow.distancey+dhtmlwindow.inity)>500){
t.style.top=Math.max(0,500)+"px"
}else{
t.style.top=Math.max(0,dhtmlwindow.distancey+dhtmlwindow.inity)+"px"
}

<veenaay>