Convert javascript to vb script?

D

D Newsham

Hi,

This javascript creates a table that has a header and side column that
do not move while scrolling through the table. I need to convert this
to vb script. Can anybody help, or do you have code in vb (asp) that
would do the same thing?

<html>
<head>
<title>Scrolling Grid Demo</title>
<script type="text/javascript">
function Grid(name, data)
{
// store arguments
this.name = name;
this.data = data;

var cursor = document.all ? "hand" : "pointer";

// persist object for later use.
window[name] = this;

// initialize internal properties.
this.xOffset = 0;
this.yOffset = 0;

// render table
var aStr = new Array;
aStr.push('<table border=1 cellpadding=0 cellspacing=0 id="' +
this.name + '">');

// column header row
aStr.push('<tr>');
aStr.push('<td>&nbsp;</td>');
for ( var j = 0; j < this.data.nCol; j++ )
{
aStr.push('<th width=' + this.data.nCellWidth + '><span>' +
this.data.colHeaders[j] + '</span></th>');
}
aStr.push('<td width=20>&nbsp;</td>');
aStr.push('</tr>');

// data rows
for ( var i = 0; i < this.data.nRow; i++ )
{
aStr.push('<tr>');
aStr.push('<th valign=top width=' + this.data.nCellWidth + '><span>'
+ this.data.rowHeaders + '</span></th>');
for ( j = 0; j < this.data.nCol; j++ )
aStr.push('<td><span style="overflow:hidden;width:' +
this.data.nCellWidth + 'px;height:' + this.data.nCellHeight + 'px;
text-align:center;">' + this.data.values[j] + '</span></td>');

// add the vertical scroll bar
if ( i == 0 )
{
aStr.push('<td rowspan=' + this.data.nRow + ' valign=top>');
aStr.push('<div style="position:relative;height:' + nHeight +
'px;width:20px;">');

// add the scroll indicator
var nHeight = this.data.nRow * this.data.nCellHeight +
(this.data.nRow-1) * 2;
var nStartHeight = 1;
var nBarHeight = Math.floor(nHeight * this.data.nRow /
this.data.rowHeaders.length);
var nEndHeight = nHeight - nStartHeight - nBarHeight;
aStr.push('<div style="position:absolute;height=120px;">');
aStr.push('<table width=20 height=' + nHeight + ' border=0
cellpadding=0 cellspacing=0>');
aStr.push('<tr><td height=1><div></div></td></tr>');
aStr.push('<tr><td height=' + nBarHeight + ' bgcolor="#33cc33"
height=20><div></div></td></tr>');
aStr.push('<tr><td height=' + nEndHeight +
'><div></div></td></tr>');
aStr.push('</table>');
aStr.push('</div>');

// add the scroll buttons
aStr.push('<div style="position:absolute;height=' + nHeight +
'px;width=20px;">');
aStr.push('<table width=20 height=' + nHeight + ' border=0
cellpadding=0 cellspacing=0>');
aStr.push('<tr><td width=' + nHeight/2 + ' valign=top
align=center><div style="cursor:' + cursor + ';" onclick="window.' +
this.name + '.scroll(0,-1);">^</div></td></tr>');
aStr.push('<tr><td width=' + nHeight/2 + ' valign=bottom
align=center><div style="cursor:' + cursor + ';" onclick="window.' +
this.name + '.scroll(0,1);">v</div></td></tr>');
aStr.push('</table>');
aStr.push('</div>');

aStr.push('</div>');
aStr.push('</td>');
}

aStr.push('</tr>');
}

// add the horizontal scroll bar
aStr.push('<tr>');
aStr.push('<td>&nbsp;</td>');
aStr.push('<td colspan=' + this.data.nCol + '>');
aStr.push('<div style="position:relative;width=' + nWidth +
'px;height=20px;">');

// the scroll indicator part
var nWidth = this.data.nCol * this.data.nCellWidth +
(this.data.nCol-1) * 2;
var nStartWidth = 1;
var nBarWidth = Math.floor(nWidth * this.data.nCol /
this.data.colHeaders.length);
var nEndWidth = nWidth - nStartWidth - nBarWidth;
aStr.push('<div style="position:absolute;width=' + nWidth +
'px;left:0px;top:0px">');
aStr.push('<table width=' + nWidth + ' border=0 cellpadding=0
cellspacing=0>');
aStr.push('<tr>');
aStr.push('<td width=1><div></div></td>');
aStr.push('<td width=' + nBarWidth + ' bgcolor="#33cc33"
height=20><div></div></td>');
aStr.push('<td width=' + nEndWidth + '><div></div></td>');
aStr.push('</tr>');
aStr.push('</table>');
aStr.push('</div>');

// the scroll buttons
aStr.push('<div style="position:absolute;width=' + nWidth +
'px;;left:0px;top:0px">');
aStr.push('<table width=' + nWidth + ' border=0 cellpadding=0
cellspacing=0>');
aStr.push('<tr>');
aStr.push('<td width=' + nWidth/2 + ' align=left><div style="cursor:'
+ cursor + ';width:20px;" onclick="window.' + this.name +
'.scroll(-1,0);">&lt;</div></td>');
aStr.push('<td width=' + nWidth/2 + ' align=right><div
style="cursor:' + cursor + ';width:20px;" onclick="window.' +
this.name + '.scroll(1,0);">&gt;</div></td>');
aStr.push('</tr>');
aStr.push('</table>');
aStr.push('</div>');

aStr.push('&nbsp;');

aStr.push('</div>');
aStr.push('</td>');
aStr.push('<td>&nbsp;</td>');
aStr.push('</tr>');

// finally close off the table
aStr.push('</table>');

// write HTML to document.
document.write(aStr.join(''));
}

// locate all spans and control points
Grid.prototype.init = function()
{
// if already initialized, return
if ( this.oTable ) return;

this.oTable = document.getElementById(this.name);

// get all <span> elements within the table
var aSpan = this.oTable.getElementsByTagName('span');
var n = 0;
// the first few are all column headers
this.aColSpan = new Array;
for ( var j = 0; j < this.data.nCol; j++ )
this.aColSpan.push(aSpan[n++]);

// the remainder are row headers and cells
this.aRowSpan = new Array;
this.aCellSpan = new Array;
for ( var i = 0; i < this.data.nRow; i++ )
{
this.aRowSpan.push(aSpan[n++]);

this.aCellSpan.push(new Array());
for ( j = 0; j < this.data.nCol; j++ )
this.aCellSpan.push(aSpan[n++]);
}

// get all the <div> elements
var aDiv = this.oTable.getElementsByTagName('div');

// the vertical scroll is in aDiv[2]
this.aVerticalTD = aDiv[1].getElementsByTagName('td');

// the horizontal scroll is in aDiv[10]
this.aHorizontalTD = aDiv[9].getElementsByTagName('td');
}

// fill all the column/row headers and cell values
// and adjust the scroll bars
Grid.prototype.fill = function()
{
this.init();

// headers
for ( var j = 0; j < this.data.nCol; j++ )
this.aColSpan[j].innerHTML = this.data.colHeaders[j + this.xOffset];
for ( var i = 0; i < this.data.nRow; i++ )
this.aRowSpan.innerHTML = this.data.rowHeaders[i + this.yOffset];

// values
for ( i = 0; i < this.data.nRow; i++ )
for ( j = 0; j < this.data.nCol; j++ )
this.aCellSpan[j].innerHTML = this.data.values[i +
this.yOffset][j + this.xOffset];

// scroll bars
var nHeight = this.data.nRow * this.data.nCellHeight +
(this.data.nRow-1) * 2;
var nStartHeight = Math.floor(nHeight * this.yOffset /
this.data.rowHeaders.length);
if ( nStartHeight == 0 ) nStartHeight++;
var nBarHeight = Math.floor(nHeight * this.data.nRow /
this.data.rowHeaders.length);
var nEndHeight = nHeight - nStartHeight - nBarHeight;
if ( nEndHeight == 0 ) nStartHeight--, nEndHeight++;

this.aVerticalTD[0].height = nStartHeight;
this.aVerticalTD[1].height = nBarHeight;
this.aVerticalTD[2].height = nEndHeight;

var nWidth = this.data.nCol * this.data.nCellWidth +
(this.data.nCol-1) * 2;
var nStartWidth = Math.floor(nWidth * this.xOffset /
this.data.colHeaders.length);
if ( nStartWidth == 0 ) nStartWidth++;
var nBarWidth = Math.floor(nWidth * this.data.nCol /
this.data.colHeaders.length);
var nEndWidth = nWidth - nStartWidth - nBarWidth;
if ( nEndWidth == 0 ) nEndWidth++, nStartWidth--;

this.aHorizontalTD[0].width = nStartWidth;
this.aHorizontalTD[1].width = nBarWidth;
this.aHorizontalTD[2].width = nEndWidth;
}

Grid.prototype.scroll = function(x,y)
{
this.xOffset += x;
if ( this.xOffset < 0 ) this.xOffset = 0;
if ( this.xOffset > this.data.colHeaders.length - this.data.nCol )
this.xOffset = this.data.colHeaders.length - this.data.nCol;

this.yOffset += y;
if ( this.yOffset < 0 ) this.yOffset = 0;
if ( this.yOffset > this.data.rowHeaders.length - this.data.nRow )
this.yOffset = this.data.rowHeaders.length - this.data.nRow;

this.fill();
}


</script>
</head>
<body>
ggg

<script>
var currencies = ["ARS","ATS","AUD","BBD","BEF","BGL","BMD","BRL","BSD","CAD",
"CHF","CLP","CNY","CYP","CZK","DEM","DKK","DZD","EGP","ESP",
"EUR","FIM","FJD","FRF","GBP","GRD","HKD","HUF","IDR","IEP",
"ILS","INR","ISK","ITL","JMD","JOD","JPY","KRW","LBP","LUF",
"MXN","MYR","NLG","NOK","NZD","PHP","PKR","PLN","PTE","ROL",
"RUR","SAR","SDD","SEK","SGD","SKK","THB","TRL","TTD","TWD",
"USD","VEB","XAG","XAU","XCD","XDR","XPD","XPT","ZAR","ZMK"];
var data =
{
nCol:6,
nRow:10,
nCellWidth:70,
nCellHeight:20
};
data.colHeaders = currencies;
data.rowHeaders = currencies;
data.values = new Array();
for ( var i = 0; i < currencies.length; i++ )
{
data.values.push(new Array());
for ( var j = 0; j < currencies.length; j++ )
{
if ( i == j )
data.values.push('-');
else
data.values.push(Math.round(10000*Math.random() /
Math.random())/10000);
}
}
new Grid('theGrid', data);
</script>
Full scrolling grid example.
NB: The values in this table bear no relation to any currency, real
or imaginary.
</body>
</html>
 
K

kaeli

Hi,

This javascript creates a table that has a header and side column that
do not move while scrolling through the table. I need to convert this
to vb script.
Click to expand...

Why? ASP can use javascript (JScript) if you wanted it to run on the
server. However, a lot of the stuff here uses client-side only things,
like the height of page elements, which will not be available on the
server. So, you must want it for client-side use. Converting it to
vbscript for client-side use will work only in IE.

What are you really wanting to do? Create something on the server, or
the client?

ASP, which runs on the server, creates html pages on the fly. It knows
nothing of the client (usually a browser). It simply sends a response to
whatever user agent sent it a request.

--
 
M

McKirahan

D Newsham said:
Hi,

This javascript creates a table that has a header and side column that
do not move while scrolling through the table. I need to convert this
to vb script. Can anybody help, or do you have code in vb (asp) that
would do the same thing?
Click to expand...

[snip]

You did a multipost (separate copies to separate NGs) instead of a crosspost
(one copy to more than one NG).

Please do not multipost!
 
D

D Newsham

I apologize for the multipost. I got an error in Google the first
time I posted this, which said it hadn't been posted. Since the posts
don't come up for several hours, I did not realize it had already
posted.
 
M

McKirahan

D Newsham said:
I apologize for the multipost. I got an error in Google the first
time I posted this, which said it hadn't been posted. Since the posts
don't come up for several hours, I did not realize it had already
posted.
Click to expand...

Multi-post means you the same message in different newsgroups, not the same
message in one newsgroup at different times.

You posted this same message in the "microsoft.public.scripting.vbscript"
newsgroup (where I offered a partial solution).
 

Ask a Question

Want to reply to this thread or ask your own question?

You'll need to choose a username for the site, which only take a couple of moments. After that, you can post your question and our members will help you out.

Ask a Question

Similar Threads

Image shifts to the right when export the page to pdf 4
How to have two html audio players on one page? 0
I am trying to detect Which image id="" was clicked ? 22
Nested Loop Insert Page Break 1
Angularjs newbie - second JSON datasource does not display 0
Can someone tell me if this a real tracker? Or is it one designed to show you a different message at certain times, ie. acting like one? 0
SendGrid email issue in responsive Gmail 1
Help with my responsive home page 2

Members online

No members online now.
Total: 19 (members: 0, guests: 19)
Robots: 351

Forum statistics

Threads
473,755
Messages
2,569,536
Members
45,015
Latest member
AmbrosePal

Latest Threads

Top