I have some code that doesn't work or even breaks few platforms

[trikota]

HI.
I was here before and kind people helped me with my problem.
The problem was such:
I have 5 different images that have to randomly load into a page with a link to a bigger image (it is not just a bigger image of the same graphic, it is a different one).

The problem I have now is that it crashes IE5 and Mac (so was reported, ,but I haven't seen it) and definitely works only partially on Netscape 4.7 (it puts an image but not the link). And it has to work on all those platforms.

Please, help. It will be greatly appreciated.

So, this is the code I have:

<script>
var imageData = [
['empa_fullquote01.jpg','empa_quote01.jpg','280','595'],
['empa_fullquote02.jpg','empa_quote02.jpg','280','540'],
['empa_fullquote03.jpg','empa_quote03.jpg','280','478'],
['empa_fullquote04.jpg','empa_quote04.jpg','280','560'],
['empa_fullquote05.jpg','empa_quote05.jpg','280','560'],
];
var imgRoot = "images/";
var picked = new Array();
for (var i=0; i<imageData.length-1; picked.push(0), i++);

function showPopup(i) {
var f = 'width=' + imageData[i][2] + ',height=' + imageData[i][3];
window.open(imgRoot+imageData[i][0],'picWin', f);
}

function insertRandomImgs(qty) {
var p = 0;
while (p < qty) {
var i = Math.floor(Math.random() * imageData.length);
if (picked[i] == 0) {
// <img src="images/image.gif" style="" alt="picture" onClick="">
document.write('<img src="'+imgRoot+imageData[i][1]+'" style="cursor:hand" alt="'+imageData[i][0]+'" onClick="showPopup('+i+')">');
picked[i] = 1;
p++;
}
}
}
</script>

<script>
insertRandomImgs(1);
</script>

[beetle]

Hey trikota

If I'm not mistaken, that looks like my code :D

Uhm, I'm not really up on what makes IE5 Mac and NS4.7 tick, so I'm only guessing here, but they may not like the literal notation definition of the imageData array. To not use literal notation would look like this

var ii=0;
var imageData = new Array();
imageData[ii] = new Array('empa_fullquote01.jpg','empa_quote01.jpg','280','595'); ii++;
imageData[ii] = new Array('empa_fullquote02.jpg','empa_quote02.jpg','280','540'); ii++;
imageData[ii] = new Array('empa_fullquote03.jpg','empa_quote03.jpg','280','478'); ii++;
etc....

[realisis]

hi beetle + trikota:

a quick look (I'm at work right now) , and I noticed these things:

1) versions of IE previous to 5.5 for *Windows* don't implement the push() method on arrays... Same true for MAC < 5.5? Maybe...

I only found this out last month. Below is the most economical way that I could come up with of emulating push()... Anyway, it's worth a try. Replace

picked.push(0) (did I read that right? digit zero as the element value?),

with

picked[picked.length] = 0

(with that last statement, if adding subsequent array elements incrementally, you don't need a counter... that's handled automatically via picked.length which keeps updating after each addition)

...


therefore, same goes with the imageData array (omit the counter)

imageData[imageData.length] = new Array('empa_fullquote01.jpg','empa_quote01.jpg','280','595');

etc, etc...


2) NS4 insists that whenever you use the document.write() method, you follow the last one with document.close(), otherwise it displays nothing, or does unpredictable things to the page.

3) I noticed there are no "hide this script" comments inside the script tags... Again, NS4 sometimes barks at omissions like these.

4) lastly beetle, I've never seen 2-dim arrays defined with literal notation like you have done... pretty fascinating.... If I can make the time, I'll try out the syntax tonight on NS4 and report back on how it's being handled.

But anyway shouldn't the outside delimiters still be parentheses rather than square brackets??? Or am I wrong on that detail?

var imageData = (
['empa_fullquote01.jpg','empa_quote01.jpg','280','595'],
['empa_fullquote02.jpg','empa_quote02.jpg','280','540'],
['empa_fullquote03.jpg','empa_quote03.jpg','280','478'],
['empa_fullquote04.jpg','empa_quote04.jpg','280','560'],
['empa_fullquote05.jpg','empa_quote05.jpg','280','560'],
);


instead of:

var imageData = [
['empa_fullquote01.jpg','empa_quote01.jpg','280','595'],
['empa_fullquote02.jpg','empa_quote02.jpg','280','540'],
['empa_fullquote03.jpg','empa_quote03.jpg','280','478'],
['empa_fullquote04.jpg','empa_quote04.jpg','280','560'],
['empa_fullquote05.jpg','empa_quote05.jpg','280','560'],
];


Cheers -

[beetle]

Good eye realisis

array[array.length] is exactly how I handled .push() type additions before useing .push()

Definitely could cause some problems.

As far as the bracketing goes, I believe using parens for the array's 1st dimension would require you to call the new array constructor

var imageData = new Array(
['empa_fullquote01.jpg','empa_quote01.jpg','280','595'],
['empa_fullquote02.jpg','empa_quote02.jpg','280','540'],
['empa_fullquote03.jpg','empa_quote03.jpg','280','478'],
['empa_fullquote04.jpg','empa_quote04.jpg','280','560'],
['empa_fullquote05.jpg','empa_quote05.jpg','280','560'],
);

[Owl]

Hi trikota,

Add the blue to the corresponding line:for (var i=0; i<imageData.length-1; picked.push(0), i++){}
And since push() is not supported by IE5- (already mentioned by realisis),
I suggest you change it to this:for (var i=0; i<imageData.length-1; picked[i]=0, i++){}Less sophisticated, but efficient.

( •) (• )
>>V

[trikota]

Thank you, everybody
I will try everything and see what makes it tick.
I will be back with results...

[trikota]

HI, everybody.

I am back.

Here are the things: THe Netscape 4.7 puts in the image, but not the link. I read that N4 doesn't supper cursor:hand. Maybe that is the problem.

I tried to put the parens instead of brackets:
var imageData = (
['empa_fullquote01.jpg','empa_quote01.jpg','280','595'],
['empa_fullquote02.jpg','empa_quote02.jpg','280','540'],
['empa_fullquote03.jpg','empa_quote03.jpg','280','478'],
['empa_fullquote04.jpg','empa_quote04.jpg','280','560'],
['empa_fullquote05.jpg','empa_quote05.jpg','280','560'],
);

with or without New Array, it gives me JS error on the closing paren line.

And on the line in the body
insertRandomImgs(1);

I hope I made it clear.
Here is the code. Again.

<html>
<head>
<title></title>

<script LANGUAGE="JavaScript">
<!--
var imageData = [
['empa_fullquote01.jpg','empa_quote01.jpg','280','560'],
['empa_fullquote02.jpg','empa_quote02.jpg','280','505'],
['empa_fullquote03.jpg','empa_quote03.jpg','280','494'],
['empa_fullquote04.jpg','empa_quote04.jpg','280','560'],
['empa_fullquote05.jpg','empa_quote05.jpg','280','560'],
];

var imgRoot = "images/";
var picked = new Array();
for (var i=0; i<imageData.length-1; picked[i]=0, i++){};

function showPopup(i) {
var f = 'width=' + imageData[i][2] + ',height=' + imageData[i][3];
window.open(imgRoot+imageData[i][0],'picWin', f);
}

function insertRandomImgs(qty) {
var p = 0;
while (p < qty) {
var i = Math.floor(Math.random() * imageData.length);
if (picked[i] == 0) {
document.write('<img src="'+imgRoot+imageData[i][1]+'" style="cursor:hand" alt="'+imageData[i][0]+'" onClick="showPopup('+i+')">');
picked[i] = 1;
p++;
document.close();
}
}
}
// -->
</script>
</head>

<body>

<script>
<!--
insertRandomImgs(1);
//-->
</script>


</body>
</html>

[trikota]

I did use the picked[picked.length] = 0 instead of picked.push (0),
picked[i]=0 is there now because i was trying both and that was the latest and they both work the same (ie6 yes, n4.7 no)

thanks

[realisis]

trikota:

Hmmm, you confused me a bit when you said that NS4 "puts an image but not the link", and I didn't realize what you meant until I tried your last posted script on NS4.7 at home, so here goes:

1) you actually haven't defined a true "link", you're just simulating one... I make this distinction not to be pedantic, but because it affects the following points

2) presently NS4 won't open the new window only because NS4 doesn't respond to onClick in an image tag... This is easily solved by changing onClick to onMousedown (which NS4 does register in the image tag).

In this case, your doc.write statement would look like this:

document.write('<img src="'+imgRoot+imageData[i][1]+'" style="cursor:hand" alt="'+imageData[i][0]+'" onMousedown="showPopup('+i+')">');

PROBLEM 1 SOLVED: window opens as intended

3) yes it's true, NS4 doesn't allow you to set cursor via styles... However, simply having the statement there isn't causing problems - NS4 just ignores it.

This leaves you with a quandary: NS4 can now open the window, but your cursor won't change to a "hand" to show the image can be clicked. So you can solve this, either by

a) having an instruction on the page itself "Click on image to enlarge" (or whatever), or you can

b) change the ALT attribute to display the necessary msg instead of showing the img name: alt="click on image to enlarge", or

c) wrap the img in a true link (which changes the cursor to "the hand"), in which case the doc.write statement for NS4 would look like this:

document.write('<a href="#" onClick="showPopup('+i+'); return false"><img src="'+imgRoot+imageData[i][1]+'" style="cursor:hand" alt="'+imageData[i][0]+'"></a>');

(note: we can revert to onClick here, cuz NS4 does register onClick in true links)

also note: many people might instead lodge the javascript statement into the href as follows:

document.write('<a href="javascript:void(showPopup('+i+'))"><img src="'+imgRoot+imageData[i][1]+'" style="cursor:hand" alt="'+imageData[i][0]+'"></a>');

While this might work if the user left-clicks, you get a BIG ERROR if perchance the user right-clicks, and tries to choose: Open Link in New Window. The first technique at least avoids the error.

Hopefully, this'll do the trick. If I've missed any problem details, fill us in...
...

btw, beetle, I was happy to discover that NS4.7 seems to handle literal notation without any problems (!) (don't know about 4.0 though)

[trikota]

Ok, ,that seemed to fix the problem.
Now I just have to check the MAc and see if it still crashes the whole computer with the script.

Thanks for your time, I greatly appreciate it.

[realisis]

Great! I have absolutely no experience with MACs, so I'd be interested in hearing about any problems you might encounter...

Thanks for acknowledging.