[Community-allwww-cvs] www/2005 handsets.html,1.7,1.8
anandv at helixcommunity.org anandv at helixcommunity.orgUpdate of /cvsroot/community/www/2005
In directory cvs:/tmp/cvs-serv24023
Modified Files:
handsets.html
Log Message:
make page viewable on IE and FireFox
Index: handsets.html
===================================================================
RCS file: /cvsroot/community/www/2005/handsets.html,v
retrieving revision 1.7
retrieving revision 1.8
diff -u -d -r1.7 -r1.8
--- handsets.html 25 Jul 2005 20:19:11 -0000 1.7
+++ handsets.html 26 Jul 2005 00:47:34 -0000 1.8
@@ -9,7 +9,11 @@
<meta http-equiv="content-type" content="text/html; charset=ISO-8859-1" >
<meta http-equiv="Content-Script-Type" content="text/javascript" >
<meta http-equiv="Content-Style-Type" content="text/css" >
- <style type="text/css">
+ </head>
+ <body>
+ <style>
+ .clDescriptionCont {position:absolute; visibility:hidden;}
+ .clDescription {font-family:verdana,arial,helvetica,sans-serif; overflow:hidden; border: 1px solid #999999; padding:3px}
OL,UL,P,BODY,TR,TD,TH,FORM {
font-family: verdana;
font-size:8;
@@ -20,12 +24,6 @@
A:active { color:#00ff00 }
A:hover { text-decoration:underline; color:#6f8e00 }
</style>
- </head>
- <body>
- <style>
- .clDescriptionCont {position:absolute; visibility:hidden;}
- .clDescription {font-family:verdana,arial,helvetica,sans-serif; overflow:hidden; border: 1px solid #999999; padding:3px}
- </style>
<script language="JavaScript" type="text/javascript" SRC="siteImages.txt"></Script>
<script language="JavaScript" type="text/javascript" SRC="imageFX.js" ></Script>
@@ -37,40 +35,63 @@
var HEIGHT_SCALER = 1;
var MAX_HEIGHT = 100;
var MAX_WIDTH = 100;
+ var imagesCompletelyLoaded = 0;
+ var _images = new Array();
+
+ function isEmpty ( _string ) {
+ return ( _string != null && _string != '' ) ? true : false;
+ }
- function getImageHeight ( imageName, scaleFactor ) {
- var _image = new Image ( );
-
+ function loadImages ( ) {
+// alert ( siteImages.length );
+ for ( var i = 0; i < siteImages.length; i++ ) {
+ _images[i] = new Image ();
+ _images[i].src = imageBasePath + siteImages[i][0];
+// alert ( _images[i].src + "\n" + _images[i].complete );
+ setImageProps ( i );
+ }
+ }
+
+ function setImageProps ( imageIndex ) {
+ if ( _images[imageIndex].complete ) {
+ imageProps = getImageHeightWidth ( imageIndex );
+ _images[imageIndex]["adjwidth"] = imageProps[0];
+ _images[imageIndex]["adjheight"] = imageProps [1];
+ } else {
+ setTimeout ( "setImageProps('" + imageIndex + "')", 100 );
+ }
+ }
+
+ function getImageHeight ( imageIndex, scaleFactor ) {
if ( !scaleFactor)
scaleFactor=HEIGHT_SCALER
- _image.src = imageBasePath + imageName;
-
+
+ var _image = _images[imageIndex];
+
if ( _image.complete )
return _image.height * scaleFactor
else {
- setTimeout ( "getImageHeight("+imageName+")", 100);
+ setTimeout ( "getImageHeight('" + imageIndex + "', '" + scaleFactor + "')", 100);
}
}
- function getImageWidth ( imageName, scaleFactor ) {
- var _image = new Image ( );
-
+ function getImageWidth ( imageIndex, scaleFactor ) {
if ( !scaleFactor)
scaleFactor=WIDTH_SCALER
- _image.src = imageBasePath + imageName;
+ _image = _images [ imageIndex ];
if ( _image.complete )
return _image.width * scaleFactor
else {
- setTimeout ( "getImageWidth("+imageName+")", 100);
+ setTimeout ( "getImageWidth('" + imageIndex + "', '" + scaleFactor + "')", 100);
}
}
- function getImageHeightWidth ( imageName ) {
- var _width = getImageWidth ( imageName ), _height = getImageHeight ( imageName );
+ function getImageHeightWidth ( imageIndex ) {
+ var _width = getImageWidth ( imageIndex), _height = getImageHeight ( imageIndex );
var aspectRatio = _width / _height;
-
+
if ( _width > MAX_WIDTH && _height <= MAX_HEIGHT ) {
_width = MAX_WIDTH;
_height = _width / aspectRatio;
@@ -80,66 +101,48 @@
} else if ( _height > MAX_HEIGHT && _width > MAX_WIDTH ) {
if ( _height > _width ) {
_height = MAX_HEIGHT;
- _width = _height * aspectRatio;
+ _width = Math.round ( _height * aspectRatio);
} else {
_width = MAX_WIDTH;
- _height = _width / aspectRatio;
+ _height = Math.round ( _width / aspectRatio );
}
}
var imageProps = [_width, _height];
return imageProps;
- }
+ }
function showImages ( ) {
numImages = siteImages.length;
numCols = Math.sqrt ( numImages );
if ( numCols < 3 ) numCols = 3; else
- if ( numCols > 6 ) numCols = 6 ;
-
+ if ( numCols > 6 ) numCols = 6 ;
colCount = 0;
- bodyString = "\
- <Table border=0>\
- <tr>";
- for ( i = 0; i < siteImages.length; i++ ) {
+ bodyString = "<Table border=0><tr>";
+ for ( var i = 0; i < siteImages.length; i++ ) {
if ( colCount >= numCols ) {
- bodyString += "\
- </tr>\
- <tr>";
-
+ bodyString += "</tr><tr>";
colCount = 0;
}
+
+ _href = isEmpty(siteImages[i][2])?"href='"+siteImages[i][2]+"'":"nohref";
- bodyString += "\
- <td align=center valign=bottom>\
- <table border=0 width=100% height=100%>\
- <tr>\
- <td align=center valign=middle>\
- <A target=_blank " + (siteImages[i][2]!=''?"href="+siteImages[i][2]:"nohref")+"><span id='image"+i+"'><img width="+getImageHeightWidth(siteImages[i][0])[0]+" height="+getImageHeightWidth(siteImages[i][0])[1]+" src='"+imageBasePath+siteImages[i][0]+"' border=0 alt='"+siteImages[i][1]+"'/></span></a>\
- </td>\
- </tr>\
- <tr>\
- <td align=center valign=middle><A " + (siteImages[i][2]!=''?"target=_blank href="+siteImages[i][2]:"nohref")+"><b>"+siteImages[i][1]+"</b></a></td>\
- </tr>\
- </table>\
- </td>";
+ bodyString += "<td align=center valign=bottom><table border=0 width=100% height=100%><tr><td align=center valign=middle><A target=_blank "+_href+"><span id='image"+i+"'><img width="+_images[i]["adjwidth"]+" height="+_images[i]["adjheight"]+" src='"+escape(imageBasePath + siteImages[i][0])+"' border=0 alt='"+siteImages[i][1]+"'/></span></a></td></tr><tr><td align=center valign=middle><A target=_blank "+_href+"><b>"+siteImages[i][1]+"</b></a></td></tr></table></td>";
colCount++;
}
if ( colCount < numCols ) {
- for ( j = colCount; j < numCols; j++ )
- bodyString += "\
- <td> </td>";
+ for ( var j = colCount; j < numCols; j++ )
+ bodyString += "<td> </td>";
}
- bodyString += "\
- </tr>\
- </Table>";
-
+ bodyString += "</tr></Table>";
+
+// alert ( bodyString );
document.write ( bodyString );
}
</Script>
<div id="divDescription" class="clDescriptionCont"></div>
- <Script>setPopup(); showImages()</Script>
+ <Script>setPopup(); loadImages(); showImages()</Script>
</body>
</html>