PDA

Click to See Complete Forum and Search --> : Unique Random Images

wide_eyed
05-24-2005, 04:32 PM
I was hoping someone could help me with this. What I’m tiring to accomplish is to have several hyperlinked images with alt tags and no border, displayed in a table randomly but not repeated.

I found a script that will display unique random numbers:
<html>
<title>Codeave.com(Unique Random Numbers)</title>
<body bgcolor="#FFFFFF">
<%
' Determines how many unique random numbers to be produced
tot_unique=5

' Determines the highest value for any unique random number
top_number=5
dim random_number, counter, check, unique_numbers
' When passing a varible for an array use redim
redim random_number(tot_unique)
' begin random function
randomize
' Begin a for next loop from one to the max number of unique numbers
For counter = 1 to tot_unique
' select a number between 1 and the top number value
random_number(counter) = Int(Rnd * top_number)+1
' For next loop to compare the values stored in the array to
' the new random value being assigned
for check=1 to counter-1
if random_number(check)= random_number(counter) then
' If the current value is equal to a previous value
' subject
counter=counter-1
end if
next ' Repeat loop to check values
next ' Repeat loop to assign values to the array
%>

<p>
<ol><% 'write out the unique numbers in a list for display
For counter = 1 to tot_unique
response.write "<li>" & random_number(counter) & "</li>"

next
%>
</ol>

</body>
</html>


Does anyone know how to apply that concept to images?
I also found a script that will display a single random image:
<%
' Sets the upper limit for the random number
limit=7
' Redim allows for arrays to be setup by passing a numeric value
' rather than hardcoding the numeric value for the limit multiple times
redim link(limit)
redim image (limit)
redim alt(limit)

' List of images and links
link(1)="http://www.yahoo.com"
image(1)="http://us.yimg.com/images/yahoo.gif"
alt(1)="Alt Text"

link(2)="http://www.excite.com"
image(2)="http://www.excite.com/mesp/images/excite/new_logo-180.gif"
alt(2)="Alt Text"

link(3)="http://www.lycos.com"
image(3)="http://a284.g.akamai.net/7/284/987/000/lygo.com/ly/i/lyguide.gif"
alt(3)="Alt Text"

link(4)="http://www.cnet.com"
image(4)="http://cnet.com/Images/Headers/cnet-1-title.gif"
alt(4)="Alt Text"

link(5)="http://www.go.com"
image(5)="http://www.go.com/images/hp/go_logo_121_58.gif"
alt(5)="Alt Text"

link(6)="http://www.webcrawler.com"
image(6)="http://webcrawler.com/img/web/hdr/home_header.gif"
alt(6)="Alt Text"

link(7)="http://www.go.com"
image(7)="http://www.go.com/images/hp/go_logo_121_58.gif"
alt(7)="Alt Text"

' produces the randome number from 1 to the value of limit
randomize
random=int(rnd*limit)+1

'Writes the randomly selected hyperlink and image to the browser
%>
<center>
<a href="<%= link(random) %>">
<img src="<%= image(random) %>" border="0" alt="<%=alt(random) %>"></a>


The outcome I’m looking for is similar to the above but I want to display several images in a table at once randomly but not repeated.

Any help would be appreciated.
phpnovice
05-24-2005, 06:52 PM
You just have to create a matching array as you select images. If the selected image has already been chosen (by checking against the matching array), then you go pick again. If the selected image has not already been chosen, then you go display it.
wide_eyed
05-25-2005, 11:22 AM
Thanks phpnovice, I found a java script in one of the fourms that you had posted in. I tried to fit it to my needs but need a little help. Would it be possiable to convert this to asp or imbed it into an asp page? If so, any tips on how to do that?

Ok, now I know this doesn't work yet but I hope I'm on the right path. Also I would like to display the images in a 2 column table. Any help would be appreciated. :confused:
How about something like this:

So what should be going on here is to have 30 images, hyperlinked with Alt Text displayed randomly but not repeated.
var image_used = new Array("n", "n", "n", "n", "n", "n", "n", "n", "n", "n", "n", "n", "n", "n", "n", "n", "n", "n", "n", "n", "n", "n", "n", "n", "n", "n", "n", "n", "n", "n");
var images = new Array();
var hyper = new Array();
var alt = new Array();

//List of random images below.
images[0]="assets/image01.jpg";
images[1]="assets/image02.jpg";
images[2]="assets/image03.jpg";
images[3]="assets/image04.jpg";
images[4]="assets/image05.jpg";
images[5]="assets/image06.jpg";
images[6]="assets/image07.jpg";
images[7]="assets/image08.jpg";
images[8]="assets/image09.jpg";
images[9]="assets/image10.jpg";
images[10]="assets/image11.jpg";
images[11]="assets/image12.jpg";
images[12]="assets/image13.jpg";
images[13]="assets/image14.jpg";
images[14]="assets/image15.jpg";
images[15]="assets/image16.jpg";
images[16]="assets/image17.jpg";
images[17]="assets/image18.jpg";
images[18]="assets/image19.jpg";
images[19]="assets/image20.jpg";
images[20]="assets/image21.jpg";
images[21]="assets/image22.jpg";
images[22]="assets/image23.jpg";
images[23]="assets/image24.jpg";
images[24]="assets/image25.jpg";
images[25]="assets/image26.jpg";
images[26]="assets/image27.jpg";
images[27]="assets/image28.jpg";
images[28]="assets/image29.jpg";
images[29]="assets/image30.jpg";

//List of image links.
hyper[0]="http://www.URL.com/1";
hyper[1]="http://www.URL.com/2";
hyper[2]="http://www.URL.com/3";
hyper[3]="http://www.URL.com/4";
hyper[4]="http://www.URL.com/5";
hyper[5]="http://www.URL.com/6";
hyper[6]="http://www.URL.com/7";
hyper[7]="http://www.URL.com/8";
hyper[8]="http://www.URL.com/9";
hyper[9]="http://www.URL.com/10";;
hyper[10]="http://www.URL.com/11";
hyper[11]="http://www.URL.com/12";
hyper[12]="http://www.URL.com/13";
hyper[13]="http://www.URL.com/14";
hyper[14]="http://www.URL.com/15";
hyper[15]="http://www.URL.com/16";
hyper[16]="http://www.URL.com/17";
hyper[17]="http://www.URL.com/18";
hyper[18]="http://www.URL.com/19";
hyper[19]="http://www.URL.com/20";
hyper[20]="http://www.URL.com/21";
hyper[21]="http://www.URL.com/22";
hyper[22]="http://www.URL.com/23";
hyper[23]="http://www.URL.com/24";
hyper[24]="http://www.URL.com/25";
hyper[25]="http://www.URL.com/26";
hyper[26]="http://www.URL.com/27";
hyper[27]="http://www.URL.com/28";
hyper[28]="http://www.URL.com/29";
hyper[29]="http://www.URL.com/30";

//List of image alt text.
alt[0]="Alt Text 1"
alt[1]="Alt Text 2"
alt[2]="Alt Text 3"
alt[3]="Alt Text 4"
alt[4]="Alt Text 5"
alt[5]="Alt Text 6"
alt[6]="Alt Text 7"
alt[7]="Alt Text 8"
alt[8]="Alt Text 9"
alt[9]="Alt Text 10"
alt[10]="Alt Text 11"
alt[11]="Alt Text 12"
alt[12]="Alt Text 13"
alt[13]="Alt Text 14"
alt[14]="Alt Text 15"
alt[15]="Alt Text 16"
alt[16]="Alt Text 17"
alt[17]="Alt Text 18"
alt[18]="Alt Text 19"
alt[19]="Alt Text 20"
alt[20]="Alt Text 21"
alt[21]="Alt Text 22"
alt[22]="Alt Text 23"
alt[23]="Alt Text 24"
alt[24]="Alt Text 25"
alt[25]="Alt Text 26"
alt[26]="Alt Text 27"
alt[27]="Alt Text 28"
alt[28]="Alt Text 29"
alt[29]="Alt Text 30"

function pickimage() {
//keep picking at random until a new image is found
do {
var ran = Math.floor(Math.random() * images.length);

if (ran == 0) ran = 1;
} until (image_used[ran] == "n");

image_used[ran] = "y"; //record that the image was used

document.write('<a href="' + hyper[ran] + '" target="_blank"><img src="' + images[ran] + '" alt="' + alt[ran] + '" border=0 ></a>'); //display the image



}

//called from within the main code on loading
function startshow() {
for (var i = 1; i < 31; i++) {
pickimage();


}
phpnovice
05-25-2005, 07:12 PM
Actually, now that I think about it, you could combine both arrays into one. Also, in your case, you can combine all three data arrays into one. The result is a format such as the following -- using ASP/JScript for ease of specification of the nested arrays:

<% @Language=JScript %>
<%
myList = new Array(
new Array(false, url, link, alt),
new Array(false, url, link, alt),
...etc...
new Array(false, url, link, alt)
); // no comma after last entry above
%>

The first element in each sub array would be your flag for whether that sub array had been selected yet for display. Get it? ;)
wide_eyed
05-26-2005, 10:03 AM
:confused: Ok I'm just tring to understand here, would it be something like this?

<% @Language=JScript %>
<%
myList = new Array(
new Array(false, http://www.url.com/1, assests/pic01, alt text 1),
new Array(false, http://www.url.com/2, assests/pic02, alt text 2),
...etc...
new Array(false, http://www.url.com/30, assests/pic30, alt text 30)
); // no comma after last entry above

function pickimage() {
//keep picking at random until a new image is found
do {
var ran = Math.floor(Math.random() * myList.length);

if (ran == 0) ran = 1;
} until (myList[ran] == "false");

myList[ran] = "true"; //record that the image was used

//Ok this is where I get confused, how do you pull out the values it they are all together?
document.write('<td><a href="' + hyper[ran] + '" target="_blank"><img src="' + images[ran] + '" alt="' + alt[ran] + '" border=0 ></a></td>'); //display the image



}

//called from within the main code on loading
function startshow() {
for (var i = 1; i < 31; i++) {
pickimage();


}

%>
wide_eyed
05-26-2005, 10:20 AM
:confused: All right so I'm getting an error when I run this code. It's saved as an asp file.
Error:
Microsoft JScript compilation error '800a0400'

Expected 'while'

/stilltesting.asp, line 113

} until (image_used[ran] == "n");
--^


<% @Language=JScript %>
<%
var image_used = new Array("n", "n", "n", "n", "n", "n", "n", "n", "n", "n", "n", "n", "n", "n", "n", "n", "n", "n", "n", "n", "n", "n", "n", "n", "n", "n", "n", "n", "n", "n");
var images = new Array();
var hyper = new Array();
var alt = new Array();

//List of random images below.
images[0]="assets/pic01.jpg";
images[1]="assets/pic02.jpg";
images[2]="assets/pic03.jpg";
//etc
images[30]="assets/pic30";

//List of image links.
hyper[0]="http://www.url.com/01";
hyper[1]="http://www.url.com/02";
//etc
hyper[30]="http://www.url.com/30";

//List of image alt text.
alt[0]="Alt Text 01"
alt[1]="Alt Text 02"
//etc
alt[30]="Alt Text 30"

function pickimage() {
//keep picking at random until a new image is found
do {
var ran = Math.floor(Math.random() * images.length);

if (ran == 0) ran = 1;
} until (image_used[ran] == "n"); //line with the error

image_used[ran] = "y"; //record that the image was used


document.write('<td><a href="' + hyper[ran] + '" target="_blank"><img src="' + images[ran] + '" alt="' + alt[ran] + '" border=0 ></a></td>'); //display the image



}

//called from within the main code on loading
function startshow() {
for (var i = 1; i < 32; i++) {
pickimage();


}

%>
phpnovice
05-26-2005, 11:23 AM
:confused: Ok I'm just tring to understand here, would it be something like this?
Your array would go like this -- added quotes:

myList = new Array(
new Array(false, "http://www.url.com/1", "assests/pic01", "alt text 1"),
new Array(false, "http://www.url.com/2", "assests/pic02", "alt text 2"),
...etc...
new Array(false, "http://www.url.com/30", "assests/pic30", "alt text 30")
); // no comma after last entry above