Hello, I have recently been working on a custom gui and am having trouble with a section of my code that handles the creation of window-style dialogs: (i appologise in advance but i had to include the whole code as Google Chrome would not pin point the error and only gives the error "Unexpected end of input")

function WINDOW()
{
this.name="";
this.width=640;
this.height=480;
this.xpos=100;
this.ypos=100;
this.menu=0;
this.cont="";
this.zOrder=1;
this.tabbed=0;
this.closed=0;

	function MOVEWINDOW(x,y)
	{
	this.this.xpos=x;
	this.this.ypos=y;
	document.getElementByID(this.this.name+'_wnd').style.left=x;
	document.getElementByID(this.this.name+'_wnd').style.top=y;
	document.getElementByID(this.this.name+'_tbar').style.left=x;
	document.getElementByID(this.this.name+'_tbar').style.top=y-22;
	document.getElementByID(this.this.name+'_cont').style.left=x;
	document.getElementByID(this.this.name+'_cont').style.top=y;

	document.getElementByID(this.this.name+'_title').style.left=x+3;
	document.getElementByID(this.this.name+'_title').style.top=y+3;
	document.getElementByID(this.this.name+'_controls').style.left=(x+this.this.width-51);
	document.getElementByID(this.this.name+'_controls').style.top=y+3;
	}

	function RESIZEWINDOW(w,h)
	{
	this.this.width=w;
	this.this.height=h;
	document.getElementByID(this.this.name+'_wnd').style.width=w;
	document.getElementByID(this.this.name+'_wnd').style.height=h+22;
	document.getElementByID(this.this.name+'_tbar').style.width=w;
	document.getElementByID(this.this.name+'_tbar').style.height=22;
	document.getElementByID(this.this.name+'_cont').style.width=w;
	document.getElementByID(this.this.name+'_cont').style.height=h;

	document.getElementByID(this.this.name+'_controls').style.left=(x+w-51);
	document.getElementByID(this.this.name+'_controls').style.top=this.this.ypos+3;
	}

	function HIDEWINDOW()
	{
	document.getElementByID(this.this.name+'_wnd').style.visibility="hidden";
	document.getElementByID(this.this.name+'_tbar').style.visibility="hidden";
	document.getElementByID(this.this.name+'_cont').style.visibility="hidden";
	document.getElementByID(this.this.name+'_title').style.visibility="hidden";
	document.getElementByID(this.this.name+'_controls').style.visibility="hidden";
	}

	function SHOWWINDOW()
	{
	if(this.this.closed==1){
		ERROR('Window: '+this.this.name+' is closed');
	}
	else
	{
	document.getElementByID(this.this.name+'_wnd').style.visibility="visible";
	document.getElementByID(this.this.name+'_tbar').style.visibility="visible";
	document.getElementByID(this.this.name+'_cont').style.visibility="visible";
	document.getElementByID(this.this.name+'_title').style.visibility="visible"
	document.getElementByID(this.this.name+'_controls').style.visibility="visible";
	}
	}
	
	function CLEARWINDOW()
	{
	this.this.cont="";
	}

	function APPENDCONTENT(n)
	{
	this.this.cont += n;
	}

	function CHANGENAME(n)
	{
	this.this.this.this.name=n;
	document.getElementByID(this.this.name+'_title').innerHTML='<b>'+n+'</b>';
	}

WINDOW.prototype.CHANGEthis.this.name=CHANGEthis.this.name;
WINDOW.prototype.CLEARWINDOW=CLEARWINDOW;
WINDOW.prototype.APPENDCONTENT=APPENDCONTENT;
WINDOW.prototype.MOVEWINDOW=MOVEWINDOW;
WINDOW.prototype.RESIZEWINDOW=RESIZEWINDOW;
WINDOW.prototype.HIDEWINDOW=HIDEWINDOW;
WINDOW.prototype.SHOWWINDOW=SHOWWINDOW;
WINDOW.prototype.WINDOW=WINDOW;
}

function WINMAN()
{
this.wCnt=0;
this.wnds=new Array();
this.tCnt=0;
this.tabs=new Array();
this.screenW=0;
this.screenH=0;

	function CREATEWINDOW(n, w, h, x, y)
	{
	var z=-1;
	var wc=this.this.wCnt;
	for(var i=0;i<wc;i++){
		if(this.this.wnds[i].closed)
		{
		z=i;i=wc;
		}
		else
		{
		}
	}
	if(z==-1){
		this.this.wCnt++;
		z=this.this.wCnt;
	}
	this.this.wnds[z]=new WINDOW();
	this.this.wnds[z].name=n;
	this.this.wnds[z].width=w;
	this.this.wnds[z].height=h;
	this.this.wnds[z].xpos=x;
	this.this.wnds[z].ypos=y;
	this.this.wnds[z].menu=0;
	this.this.wnds[z].cont="";
	this.this.wnds[z].zOrder=0;
	this.this.wnds[z].closed=0;
	this.this.wnds[z].tabbed=0;

	document.write('<div id="'+n+'_wnd'+'" class="WINDOW" style="top:'+(y-22)+';left:'+x+';width:'+w+';height:'+h+';"></div>');
	document.getElementByID(n+'_wnd').innerHTML='<div id="'+n+'_tbar'+'" onclick="" class="TITLEBAR" style="top:'+(y-22)+';left:'+x+';width:'+w+';height:22;"></div><div id="'+n+'_cont'+'" class="CONTENT" style="top:'+y+';left:'+x+';width:'+w+';height:'+h+'"></div><div id="'+n+'_title'+'" class="TITLE" style="top:'+(y+3)+';left:'+(x+3)+'">'+n+'</div><div id="'+n+'_controls'+'" class="CONTROLS" style="top:'+(y+3)+';left:'+(x+w-51)+';width:48;height:16;"></div>';
	document.getElementByID(n+'_controls').innerHTML='<img id="'+n+'_controls_min'+'" class="MINBUTTON" onclick="WINMAN.MIN('+n+')" /><img id="'+n+'_controls_max'+'" class="MAXBUTTON" onclick="WINMAN.MAX('+n+')" /><img id="'+n+'_controls_exit'+'" class="CLSBUTTON" onclick="WINMAN.CLS('+n+')" />';
	return z;
	}

	function MIN(n)
	{
	var z=-1;
	for(var i=0;i<this.this.wCnt;i++){
		if(this.this.wnds[i].name==n){
			z=i;i=this.this.wCnt;
		}
	}
	
	if(z==-1){
		ERROR('Window: '+n+' does not exist!');
		return FALSE;
		}
	
	else {
		var a=-1;
		for(var j=0;j<this.this.tCnt;j++){
			if(this.this.tabs[j]==""){
				a=j;j=this.this.tCnt;
			}
		}
		if(a==-1)
		{
		this.this.tCnt++;
		a=this.this.tCnt;
		}

		this.this.tabs[a]=n;
		this.this.wnds[z].HIDEWINDOW();
		this.this.wnds[z].tabbed=1;
		return TRUE;
		}
	
	}

	function MAX(n)
	{
	var z=-1;
	for(var i=0;i<this.this.wCnt;i++){
		if(this.this.wnds[i].name==n){
			z=i;i=this.this.wCnt;
		}
	}
	
	if(z==-1){
		ERROR('Window: '+n+' does not exist!');
		return FALSE;
		}
	
	else {
		this.this.wnds[z].SHOWWINDOW();
		this.this.wnds[z].tabbed=0;
		for(var j=0;j<this.this.tCnt;j++){
				if(this.this.tabs[j]==this.this.wnds[z].name){
					this.this.tabs[j]="";
					j=this.this.tCnt;
					tCnt--;
					}

				
			}
			return TRUE;
		}
	
	}

	function CLS(n)
	{
	var z=-1;
	for(var i=0;i<this.this.wCnt;i++){
		if(this.this.wnds[i].name==n){
			z=i;i=this.this.wCnt;
		}
	}
	
	if(z==-1){
		ERROR('Window: '+n+' does not exist!');
		return FALSE;
		}
	
	else {
		this.this.wnds[z].closed=1;
		this.this.wnds[z].HIDEWINDOW();
		}
	
	}

	function RESTORE(n)
	{
	document.getElementByID(n+'_tab').style.width=0;
	document.getElementByID(n+'_tab').style.height=0;
	var z=-1;
	for(var a=0;a<this.this.wCnt;a++){
		if(this.this.wnds[a].name==n){
			z=a;a=this.this.wCnt;
			}
		}
	if(z==-1){
		ERROR('Window: '+n+' not found!');
		}
	else {
		this.this.wnds[z].SHOWWINDOW();
		this.this.wnds[z].tabbed=0;
	}

	function SORTTABS()
	{}
	function SORTWINDOWS()
	{}

	function ManageTabs()
	{
	var c="";
	var sCnt=0;
	var Stack=new Array();
	for(var x=0;x<this.this.tCnt;x++){
		if(this.this.tabs[x]!=""){
			Stack[sCnt]=this.this.tabs[x];
			sCnt++;
			
		}
		else {}
		}
	this.this.SORTTABS();
	for(var y=0;y<sCnt;y++){
		c += '<div id="'+Stack[y]+'_tab'+'" class="TAB" onclick="this.this.RESTORE('+Stack[y]+');" style="top:'+(this.this.screenH-10)-(y*22)+';left:10;">'+Stack[y]+'</div>';
		}
	document.getElementByID('TABS').innerHTML=c;
	}

	function ManageWindows()
	{
	var c="";
	var sCnt=0;
	var Stack=new Array();
	this.this.SORTWINDOWS();
	for(var x=0;x<this.this.wCnt;x++){
		if(this.this.wnds[x].closed==0){
			Stack[sCnt]=this.this.wnds[x].name;
			sCnt++;
			}
		}
	for(var y=0;y<sCnt;y++){
		if(this.this.wnds[y].tabbed==1){
			}
		else
		{
			this.this.wnds[y].SHOWWINDOW();
			}
		}
	}

WINMAN.prototype.CreateWindow=CreateWindow;
WINMAN.prototype.MIN=MIN;
WINMAN.prototype.MAX=MAX;
WINMAN.prototype.CLS=CLS;
WINMAN.prototype.RESTORE=RESTORE;
WINMAN.prototype.SORTTABS=SORTTABS;
WINMAN.prototype.SORTWINDOWS=SORTWINDOWS;
WINMAN.prototype.ManageTabs=ManageTabs;
WINMAN.prototype.ManageWindows=ManageWindows;
WINMAN.prototype.WINDMAN=WINMAN;
}

Try using FireFox's firebug to find the error.

Well I noticed on thing at line 134, where you are creating window html, you have added 'style' attributes like :-

document.write('<div id="'+n+'_wnd'+'" class="WINDOW" style="top:'+(y-22)+';left:'+x+';width:'+w+';height:'+h+';"></div>');

you have not added 'px' for 'top', 'left' etc properties. The right way is:-

<div style="left: 20px; top: 20px; height: 200px; width: 300px">Test</div>

Try adding 'px'.

Be a part of the DaniWeb community

We're a friendly, industry-focused community of developers, IT pros, digital marketers, and technology enthusiasts meeting, networking, learning, and sharing knowledge.