DHTML Window Widget drag handle off the page.

[riospace]

1) Script Title: DHTML Window Widget

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

3) Describe problem: The drag bar can be moved out of the underlying window causing the user to lose control of the dhtml window.

I found a suggestion on how to keep the user from moving the drag bar too high (under the address bar) , but the major problem I am having is if the main window is small and the uhttp://www.dynamicdrive.com/forums/showthread.php?t=38892ser clicks on a thumbnail that opens the dhtml window, the drag bar is too high (off the page) even if I added the script to keep the user from dragging the bar too high.

[vwphillips]

see attached

[riospace]

That window works perfectly for what I need, but what is the actual code that keeps the window from being dragged out? Thanks!

[vwphillips]

new functions

mm:function(t){
    var wwhs=this.wwhs(),osx=t.offsetWidth/2,osy=t.offsetHeight/2;
	t.style.left=Math.min(Math.max(parseInt(t.style.left),wwhs[2]-osx),wwhs[2]+wwhs[0]-osx)+"px"
	t.style.top=Math.min(Math.max(parseInt(t.style.top),wwhs[3]),wwhs[3]+wwhs[1]-osy)+"px"
},

 wwhs:function(){
  if (window.innerHeight) return [window.innerWidth-10,window.innerHeight-10,window.pageXOffset,window.pageYOffset];
  else if (document.documentElement.clientHeight) return [document.documentElement.clientWidth-10,document.documentElement.clientHeight-10,document.documentElement.scrollLeft,document.documentElement.scrollTop];
  return [document.body.clientWidth,document.body.clientHeight,document.body.scrollLeft,document.body.scrollTop];
 },

modified functions

moveTo:function(t, x, y){ //move window. Position includes current viewpoint of document
	this.getviewpoint() //Get current viewpoint numbers
	t.style.left=(x=="middle")? this.scroll_left+(this.docwidth-t.offsetWidth)/2+"px" : this.scroll_left+parseInt(x)+"px"
	t.style.top=(y=="middle")? this.scroll_top+(this.docheight-t.offsetHeight)/2+"px" : this.scroll_top+parseInt(y)+"px"
   this.mm(t);
},

move:function(t, e){
	t.style.left=dhtmlwindow.distancex+dhtmlwindow.initx+"px"
	t.style.top=dhtmlwindow.distancey+dhtmlwindow.inity+"px"
   this.mm(t);
},

resize:function(t, e){
	t.style.width=Math.max(dhtmlwindow.width+dhtmlwindow.distancex, 150)+"px"
	t.contentarea.style.height=Math.max(dhtmlwindow.contentheight+dhtmlwindow.distancey, 100)+"px"
   this.mm(t);
},

minimize:function(button, t){
	dhtmlwindow.rememberattrs(t)
	button.setAttribute("src", dhtmlwindow.imagefiles[2])
	button.setAttribute("title", "Restore")
	t.state="minimized" //indicate the state of the window as being "minimized"
	t.contentarea.style.display="none"
	t.statusarea.style.display="none"
	if (typeof t.minimizeorder=="undefined"){ //stack order of minmized window on screen relative to any other minimized windows
		dhtmlwindow.minimizeorder++ //increment order
		t.minimizeorder=dhtmlwindow.minimizeorder
	}
	t.style.left="10px" //left coord of minmized window
	t.style.width="200px"
	var windowspacing=t.minimizeorder*10 //spacing (gap) between each minmized window(s)
	t.style.top=dhtmlwindow.scroll_top+dhtmlwindow.docheight-(t.handle.offsetHeight*t.minimizeorder)-windowspacing+"px"
   this.mm(t);
},

restore:function(button, t){
	dhtmlwindow.getviewpoint()
	button.setAttribute("src", dhtmlwindow.imagefiles[0])
	button.setAttribute("title", "Minimize")
	t.state="fullview" //indicate the state of the window as being "fullview"
	t.style.display="block"
	t.contentarea.style.display="block"
	if (t.resizeBool) //if this window is resizable, enable the resize icon
		t.statusarea.style.display="block"
	t.style.left=parseInt(t.lastx)+dhtmlwindow.scroll_left+"px" //position window to last known x coord just before minimizing
	t.style.top=parseInt(t.lasty)+dhtmlwindow.scroll_top+"px"
	t.style.width=parseInt(t.lastwidth)+"px"
   this.mm(t);
},

show:function(t){
	if (t.isClosed){
		alert("DHTML Window has been closed, so nothing to show. Open/Create the window again.")
		return
	}
	if (t.lastx) //If there exists previously stored information such as last x position on window attributes (meaning it's been minimized or closed)
		dhtmlwindow.restore(t.controls.firstChild, t) //restore the window using that info
	else
		t.style.display="block"
	this.setfocus(t)
	t.state="fullview" //indicate the state of the window as being "fullview"
   this.mm(t);
},

[riospace]

Thanks Vic, this does the job, but when you drag the window around, it leaves visual remnants of the window (on the veil that covers entire page while modal window is visible) around the page as you drag it.