<html><head><link rel="stylesheet" href="style.css" type="text/css" />
<style type='text/css'>.thumb {max-height:200px;width:150px}</style>
<script type="text/javascript">

image = new Array();
caption = new Array();

image[0] = "IMG_2011";
image[1] = "IMG_2012";
image[2] = "IMG_2014";
image[3] = "IMG_2015";
image[4] = "IMG_2016";
image[5] = "IMG_2018";
image[6] = "IMG_2019";
image[7] = "IMG_2022";
image[8] = "IMG_2025";
image[9] = "IMG_2027";
image[10] = "IMG_2028";

caption[0] = "The house at 508 4th Avenue in Asbury Park, bought by Stephen\'s mother in 1883.";
caption[1] = "The entrance was part of the porch until 1888.";
caption[2] = "Front parlor once surrounded on 3 sides by the porch.";
caption[3] = "Another view of the front parlor.";
caption[4] = "Old pump organ built by the \"Beethoven Piano and Organ Co.\" of Paterson, NJ.";
caption[5] = "Once the dining room, now the lecture room.";
caption[6] = "Literary events and classic movies presented here.";
caption[7] = "Our small reception room.";
caption[8] = "Part of the Crane House library, a work in progress.";
caption[9] = "Smallest original bedroom.  Stephen\'s?";
caption[10] = "1896 stove, once on 2nd Avenue in Asbury Park.";

function galLoad()
{
g=document.getElementById("gallery");
if (g.rows.length>0)
 {
g.deleteRow(2);
g.deleteRow(1);
g.deleteRow(0);
 }
for (h=0;h<=2;h++)
 {
r=g.insertRow(h);
for (t=0;t<=3;t++)
  {
i=r.insertCell(t);
if (t+(h*4)<image.length)
   {
i.innerHTML='<img src="gallery/' + image[t+(h*4)] + '_THUMB.jpg" class="thumb link" onclick="imgLoad(' + (t+(h*4)) + ')">';
//alert(i.innerHTML);
   }
  }
 }
}

function imgLoad(index)
{
for (h=0;h<=2;h++)
 {
g.deleteRow(0);
 }
iRow=g.insertRow(0);
i=iRow.insertCell(0);
i.colSpan="3";
i.height="486";
i.align="center";
cRow=g.insertRow(1);
c=cRow.insertCell(0);
c.colSpan=3;
c.height="50";
c.width="400";
bRow=g.insertRow(2);
bBack=bRow.insertCell(0);
bGal=bRow.insertCell(1);
bNext=bRow.insertCell(2);
i.innerHTML='<img id="galSpace" src="gallery/' + image[index] + '.jpg" class="link" onclick="imageOpen(' + index + ')" />';
c.innerHTML='<p style="{text-align:center;}">' + caption[index] + '</p>';
bBack.innerHTML='<img src="left.gif" alt="Back" class="link" onclick="imgLoad(' + indexLoop(index - 1) + ')" />';
bGal.innerHTML='<p style="{text-align:center}"><img src="home.gif" alt="Back to Gallery" class="link" onclick="galLoad()" /></p>';
bNext.innerHTML='<p style="{text-align:right}"><img src="right.gif" alt="Next" class="link" onclick="imgLoad(' + indexLoop(index + 1) + ')" /></p>';

}

function imageOpen(index)
{
fullWin = window.open("","_blank","");
fullWin.document.write('<html><body><img id="galSpace" src="gallery/' + image[index] + '_FULL.jpg" /></body></html>');
fullWin.document.close();
}

function indexLoop(ind)
{
if (ind == image.length)
 {return 0;}
else if (ind < 0)
 {return image.length-1;}
else {return ind;}
}

</script>
</head>
<body>

<!-- the table in the format of the entire site -->
<table height=100% cellpadding="14" width="800" >
<tr><td rowspan="2" valign="top" align="right" width="100"><br><img src="draw2.jpg" width="100">
<br><br>
<a href="main.html" class="link">the House</a><br><br>
<a href="gallery.html" class="link">gallery</a><br><br>
<a href="events.php" class="link">events</a><br><br>
<a href="listadd.php" class="link">mailing list</a><br><br>
<a href="links.html" class="link">links</a><br><br>
<td valign="top"><img src="logosm.jpg" width="700"><tr height="600" valign="top"><td>

<table id="gallery" width="100%" >

</table>

</td></tr></table>

<table width="800">
<tr><td class="foot" width="33%">508 Fourth Ave, Asbury Park 07712
<td style="{text-align:center}" class="foot" width="34%">732-775-5682
<td style="{text-align:right}" width="33%"><a href="mailto:asburycheech@yahoo.com" class="foot">Frank D'alessandro</a>
</table>

<script type="text/javascript">
//alert("test");
//alltest();
galLoad();

</script>


</body></html>