Index: branches/unlabeled/unlabeled-1.1.2/core/admin_templates/js/grid_scroller.js
===================================================================
diff -u -r6921 -r6924
--- branches/unlabeled/unlabeled-1.1.2/core/admin_templates/js/grid_scroller.js	(.../grid_scroller.js)	(revision 6921)
+++ branches/unlabeled/unlabeled-1.1.2/core/admin_templates/js/grid_scroller.js	(.../grid_scroller.js)	(revision 6924)
@@ -48,6 +48,7 @@
 		document.write(html);
 	}
 	document.body.style.overflow = 'hidden';
+	document.body.scroll = 'no'
 	this.SetReferences()
 
 	this.ScrollerW = this.MainInner.offsetWidth - this.MainInner.clientWidth
@@ -60,6 +61,7 @@
 	else {
 		this.Resize();
 	}
+
 	this.TheGrid.style.visibility = 'visible'
 	this.MainScroller.style.visibility = 'visible'
 }
@@ -104,20 +106,33 @@
 	var total = 0;
 	for (var i=0; i<header_widths.length; i++)
 	{
-		target = Math.max( Math.max(header_widths[i], data_widths[i]), footer_widths[i])+10;
+//		target = Math.max( Math.max(header_widths[i], data_widths[i]), footer_widths[i]);
+		target = Math.round( (header_widths[i]*0.2*3 + footer_widths[i]*0.2*3 + data_widths[i]*0.6*3) / 3 )
 		widths.push(target);
 //		alert('target: '+target)
 		total += target;
 	}
-	total += 150;
-	this.SetWidths('header_'+this.GridId, widths, total);
+	total += 0;
+	this.SetRowWidths('header_'+this.GridId, widths, total);
 	this.SetWidths('data_'+this.GridId, widths, total);
-	this.SetWidths('footer_'+this.GridId, widths, total);
+	this.SetRowWidths('footer_'+this.GridId, widths, total);
 
+	this.HeadTable.style.width = '100%'
+	this.FooterTable.style.width = '100%'
+
+	this.HeadHeight = this.HeadTable.offsetHeight;
+	this.DataHeight = this.DataTable.offsetHeight;
+	this.FooterHeight = this.FooterTable.offsetHeight;
+
+	this.HeadOuter.style.height = (this.HeadHeight) + 'px'
+	this.FooterOuter.style.height = this.FooterHeight + 'px'
+
 	this.MainInner.onscroll = function() {
 		this.TheGrid.SyncScroll()
 	}
 
+	this.MainOuter.style.width = 'auto'
+
 	if (document.all) {
 		this.DataScroller.onmousewheel = function(ev) {
 			var e = document.all ? window.event : ev;
@@ -134,48 +149,60 @@
 	}
 }
 
-GridScroller.prototype.SetWidths = function(table_id, widths, total)
+GridScroller.prototype.SetRowWidths = function(table_id, widths, total, row)
 {
+	if (!row) row = 0;
 	table = document.getElementById(table_id);
-	table.style.width = total+'px';
-	for (var col=0; col<table.rows[0].cells.length; col++)
+	var inner_width = 0;
+	for (var col=0; col<table.rows[row].cells.length-1; col++)
 	{
-		table.rows[0].cells[col].style.width =  widths[col]+'px';
-		table.rows[0].cells[col].minWidth =  widths[col];
+		table.rows[row].cells[col].innerHTML = '<div style="width: '+(widths[col]) +'px; overflow: hidden; border: 1px solid red;">' + table.rows[row].cells[col].innerHTML + '</div>'
+		table.rows[row].cells[col].style.width =  widths[col]+'px';
 //		alert('set ('+col+')'+table.rows[0].cells[col].innerHTML+' to '+widths[col])
 	}
 }
 
+GridScroller.prototype.SetWidths = function(table_id, widths, total)
+{
+	table = document.getElementById(table_id);
+	for (var row=0; row<table.rows.length; row++)
+	{
+		this.SetRowWidths(table_id, widths, total, row)
+	}
+	table.style.width = '100%'
+}
+
 GridScroller.prototype.GetWidths = function(table_id)
 {
 	var table = document.getElementById(table_id);
 	table.style.width = 'auto'
+//	alert('auto width of '+table_id+': '+table.offsetWidth)
+	if (table.offsetWidth < document.body.clientWidth * 0.8) {
+		table.style.width = Math.round( document.body.clientWidth * 0.8 ) + 'px'
+	}
+//	alert('auto width of '+table_id+': '+table.offsetWidth)
 	var widths = new Array();
 	for (var col=0; col<table.rows[0].cells.length; col++)
 	{
 		widths.push( table.rows[0].cells[col].offsetWidth )
+//		alert('get ('+col+')'+table.rows[0].cells[col].innerHTML+' to '+table.rows[0].cells[col].offsetWidth)
 	}
 	return widths;
 }
 
 GridScroller.prototype.GetAutoSize = function()
 {
-//	this.TheGrid.style.width = '100%';
-//	var w = this.TheGrid.offsetWidth;
-
+//	this.DataTable.style.width = 'auto'
+//	this.DataTable.style.width = 'auto'
 	this.MainOuter.style.width = 'auto'
-
-//	alert(this.MainInner.offsetWidth - this.MainInner.clientWidth)
-//	alert(this.MainInner.offsetHeight - this.MainInner.clientHeight)
-
 	var w = this.MainInner.offsetWidth;
 	var h = document.body.clientHeight;
 
+	alert('w: '+w+' doc width '+document.body.clientWidth)
+
 	var pos = findPos(this.MainOuter);
-	h -= pos[1] + 100;
+	h -= pos[1] + 150;
 
-//	alert('got auto size: '+w+' x '+h)
-
 	return [w,h]
 }
 
@@ -205,8 +232,10 @@
 	if (h) this.Height = h;
 
 	var data_width = this.HeadTable.offsetWidth;
-	var data_height = this.DataTable.offsetHeight + this.HeadTable.offsetHeight + this.FooterTable.offsetHeight;
+	var data_height = this.DataHeight + this.HeadHeight + this.FooterHeight;
 
+//	alert(this.HeadHeight + ' / ' + this.DataHeight + ' / ' + this.FooterHeight)
+
 //	alert('data_width: '+data_width+' theGrid: '+this.TheGrid.clientWidth + ' offset '+this.TheGrid.offsetWidth+' this width: '+this.Width)
 //	alert('data_height: '+data_height+' theGrid: '+this.TheGrid.clientHeight + ' offset '+this.TheGrid.offsetHeight+' this height: '+this.Height)
 
@@ -217,9 +246,9 @@
 	pos = findPos(this.Dot)
 
 	this.MainOuter.style.height = (this.Height)+'px'
-	this.MainOuter.style.width = (this.Width)+'px'
+//	this.MainOuter.style.width = (this.Width)+'px'
 
-//	alert('scroller W x H: '+scroller_width+' x '+scroller_height+' will resize to '+this.Width+' x '+this.Height+' data: '+data_width+' x '+data_height)
+	alert('pos: '+pos[0]+','+pos[1]+' scroller W x H: '+scroller_width+' x '+scroller_height+' will resize to '+this.Width+' x '+this.Height+' data: '+data_width+' x '+data_height)
 
 	this.TheGrid.style.width = (this.Width - scroller_width) + 'px';
 	this.TheGrid.style.height = (this.Height - scroller_height) + 'px';
@@ -231,123 +260,17 @@
 	this.DataOuter.style.width = (this.Width -scroller_width)+ 'px';
 	this.FooterOuter.style.width = (this.Width -scroller_width)+ 'px';
 
-	this.HeadOuter.style.height = this.HeadTable.offsetHeight + 'px'
-
 	if (data_height < this.Height - scroller_height) {
-		this.DataOuter.style.height = (data_height - this.HeadTable.offsetHeight - this.FooterTable.offsetHeight) + 'px'
+		this.DataOuter.style.height = (data_height - this.HeadHeight - this.FooterHeight) + 'px'
 	}
 	else {
-		this.DataOuter.style.height = (this.Height - this.HeadTable.offsetHeight - this.FooterTable.offsetHeight - scroller_height) + 'px'
+		this.DataOuter.style.height = (this.Height - this.HeadHeight - this.FooterHeight - scroller_height) + 'px'
 	}
-	this.FooterOuter.style.height = this.FooterTable.offsetHeight + 'px'
 
 	this.MainScroller.style.width = (this.HeadTable.offsetWidth)+'px'
 	this.MainScroller.style.height = ( this.DataTable.offsetHeight + this.HeadTable.offsetHeight + this.FooterTable.offsetHeight)+'px'
 }
 
-GridScroller.prototype.Test = function()
-{
-
-
-}
-
-GridScroller.prototype.OldResize = function(w,h)
-{
-	if (typeof(w) == 'object') {
-		h = w[1];
-		w = w[0];
-	}
-
-	var scroller_width = this.MainInner.offsetWidth - this.MainInner.clientWidth;
-	var scroller_height = this.MainInner.offsetHeight - this.MainInner.clientHeight;
-
-	var v_scroller = scroller_width == 0;
-	var h_scroller = scroller_height == 0;
-
-	var w_original = w;
-	var h_original = h;
-	w -= scroller_width;
-	h -= scroller_height;
-
-	alert('scroller W x H: '+scroller_width+' x '+scroller_height+' will resize to '+w+' x '+h)
-
-	if (w) this.Width = w;
-	if (h) this.Height = h;
-
-	this.HeadOuter.style.width = (this.Width)+ 'px';
-	this.DataOuter.style.width = (this.Width)+ 'px';
-	this.FooterOuter.style.width = (this.Width)+ 'px';
-
-	this.HeadOuter.style.height = this.HeadTable.offsetHeight + 'px'
-
-	var data_height = this.DataTable.offsetHeight + this.HeadTable.offsetHeight + this.FooterTable.offsetHeight;
-	if (data_height < this.Height) {
-		this.DataOuter.style.height = (data_height - this.HeadTable.offsetHeight - this.FooterTable.offsetHeight) + 'px'
-	}
-	else {
-		this.DataOuter.style.height = (this.Height - this.HeadTable.offsetHeight - this.FooterTable.offsetHeight) + 'px'
-	}
-	this.FooterOuter.style.height = this.FooterTable.offsetHeight + 'px'
-
-	/*var cur_spacer = this.DataSpacer.style.width;
-	var cur_width = this.DataTable.style.width;
-	alert('before: '+this.DataTable.offsetWidth)
-	this.DataSpacer.style.width = '100px'
-//	this.DataTable.style.width = '100%'
-	this.DataSpacer.style.width = 1 + 'px'
-	alert('now '+this.DataTable.offsetWidth)
-	var cur_width = this.DataTable.offsetWidth;
-	var new_width = Math.max(cur_width, this.Width);
-	alert('current width: '+this.DataTable.offsetWidth+' new: '+new_width)
-
-	this.DataTable.style.width = cur_width;
-	this.DataSpacer.style.width = cur_spacer;
-*/
-	/*if (cur_width != new_width) {
-		this.HeadSpacer.style.width = (new_width - cur_width)  + 'px';
-		this.DataSpacer.style.width = (new_width - cur_width)  + 'px';
-		this.FooterSpacer.style.width = (new_width - cur_width)  + 'px';
-		this.HeadTable.style.width = (new_width)  + 'px';
-		this.DataTable.style.width = (new_width)  + 'px';
-		this.FooterTable.style.width = (new_width)  + 'px';
-	}
-	else {
-		this.DataTable.style.width = cur_width;
-		this.DataSpacer.style.width = cur_spacer;
-	}*/
-
-	this.MainScroller.style.width = (this.HeadTable.offsetWidth - scroller_width)+'px'
-	this.MainScroller.style.height = ( this.DataTable.offsetHeight + this.HeadTable.offsetHeight + this.FooterTable.offsetHeight)+'px'
-
-	var correction_x = Math.round((this.MainOuter.offsetWidth - this.MainOuter.clientWidth) / 2);
-	var correction_y = Math.round((this.MainOuter.offsetHeight - this.MainOuter.clientHeight) / 2);
-
-	alert('corrections: '+correction_x+','+correction_y)
-
-	this.ResizeOuter(scroller_width, scroller_height)
-
-	this.MainOuter.style.width = (this.Width + scroller_width)+'px'
-	this.MainOuter.style.height = (this.Height + scroller_height)+'px'
-
-//	this.MainOuter.style.top = (this.TheGrid.offsetTop - correction_y ) + 'px';
-//	this.MainOuter.style.left = (this.TheGrid.offsetLeft - correction_x ) + 'px' ;
-
-	this.TheGrid.style.width = (this.Width)+ 'px';
-	this.TheGrid.style.height = (this.Height) + 'px'
-
-	preg_print_pre(findPos(this.MainOuter), /.*/i)
-	preg_print_pre(this.MainOuter.style , /padding/i)
-
-	this.TheGrid.style.top = this.MainOuter.offsetTop + 'px';
-
-
-	scroller_width = this.MainInner.offsetWidth - this.MainInner.clientWidth;
-	scroller_height = this.MainInner.offsetHeight - this.MainInner.clientHeight;
-	if ( (scroller_width == 0) != v_scroller || (scroller_height == 0) != h_scroller ) {
-		this.Resize(w_original,h_original);
-	}
-}
-
 GridScroller.prototype.SyncScroll = function()
 {
 	this.HeadScroller.scrollLeft = this.MainInner.scrollLeft;
@@ -362,9 +285,9 @@
 	w = this.Width;
 	h = this.Height;
 	var o = '';
-	o += this.CreateScroller( '<div id="main_scroller_'+this.GridId+'" style="background-color: green; position: relative; width: auto;"><img src="core/admin_templates/img/spacer.gif" id="dot_'+this.GridId+'" width="200" height="200"><br/><br/></div>', 100, 100, 'main_'+this.GridId, false, 1 );
+	o += this.CreateScroller( '<div id="main_scroller_'+this.GridId+'" style="background-color: green; position: relative; width: auto;"><img src="'+this.Spacer+'" id="dot_'+this.GridId+'" width="200" height="200"><br/><br/></div>', 100, 100, 'main_'+this.GridId, false, 1 );
 
-	o += '<div id="'+this.GridId+'" style="top: 0px; background-color: yellow; visibility: hidden; z-index: 10; width: auto; height: '+300+'px; position: absolute; overflow: hidden;">';
+	o += '<div id="'+this.GridId+'" class="grid-container" style="top: 0px; background-color: yellow; visibility: visible; z-index: 10; width: auto; height: '+300+'px; position: absolute; overflow: hidden;">';
 	var header = this.CreateScroller( this.CreateTable( this.GetHeaderCells(), 'header_'+this.GridId), 100, 10, 'header_'+this.GridId, true, 5 )
 	var data = this.CreateScroller( this.CreateTable( this.GetDataCells(), 'data_'+this.GridId ), 100, 10, 'data_'+this.GridId, true, 5  )
 	var footer = this.CreateScroller( this.CreateTable( this.GetFooterCells(), 'footer_'+this.GridId ), 100, 10, 'footer_'+this.GridId, true, 5 )
@@ -376,7 +299,7 @@
 
 GridScroller.prototype.CreateTable = function(content, id)
 {
-	return '<table style="width: auto" id="'+id+'">'+content+'</table>';
+	return '<table style="width: 100%;" id="'+id+'">'+content+'</table>';
 }
 
 GridScroller.prototype.CreateScroller = function(content, w, h, id, hidden, z)
@@ -410,9 +333,9 @@
 {
 	var o = '<tr class="grid-header-row">'
 	for (var col=0; col<this.Header.length; col++) {
-		o += '<td nowrap="nowrap">'+this.Header[col]+'</td>'
+		o += '<td>'+this.Header[col]+'</td>'
 	}
-	o += '<td nowrap="nowrap">Header</td>'
+	o += '<td style="width: auto">H&nbsp;</td>'
 	o += '</tr>'
 	return o
 }
@@ -426,9 +349,9 @@
 		o += even ? '<tr class="grid-row grid-row-even">' : '<tr class="grid-row">'
 		even = !even;
 		for (var col=0; col<this.Data[row].length; col++) {
-			o += '<td nowrap="nowrap">'+this.Data[row][col]+'</td>'
+			o += '<td>'+this.Data[row][col]+'</td>'
 		}
-		o += '<td nowrap="nowrap">D&nbsp;</td>'
+		o += '<td style="width: auto">D&nbsp;</td>'
 		o += '</tr>'
 	}
 	return o
@@ -440,7 +363,7 @@
 	for (var col=0; col<this.Footer.length; col++) {
 		o += '<td>'+this.Footer[col]+'</td>'
 	}
-	o += '<td nowrap="nowrap">F&nbsp;</td>'
+	o += '<td style="width: auto">F&nbsp;</td>'
 	o += '</tr>'
 	return o
 }