Just a simple code to grab the image from a specfied folder without using any type of databaseThen Parse it to the page by day of the week having named each image by day and changing out by day

Knight Raven

Participant

Answered

How to Display Images by Day of week

5 replies
508 views
Translate

Just a simple code to grab the image from a specfied folder without using any type of database
Then Parse it to the page by day of the week having named each image by day and changing out by day

This topic is closed to new replies. Start a new post to keep the conversation going.

Knight RavenCorrect answer

Participant

Ah, that won't work. That's because you are mixing 2 separate environments.

Javascript code runs on the client's browser, of which there could be millions. Whereas ColdFusion code runs on ColdFusion server, of which there is usually just one. In particular, the ColdFusion server know nothing of the Javascript code.

Those are the generalities. Now, on to the specifics to help you to get this to work.

From this code, I am assuming the following:

A query has run and it contains the details of image files.
The name of each image is a day of the week, that is, it is from the set {Monday, Tuesday, Wednesday, ..., Sunday}. In general, the query may contain multiple images named Monday, multiple images named Tuesday, and so on.
You want code that will pick out a picture at random, whose name matches the name of the current day, and display it.

Here is some code that will do just that. It is 100% ColdFusion, involving no Javascript. 🙂

<body>
	
<!--- Query to fetch images and their properties --->
<cfquery name="rushedPics" datasource="myDSN">
	select *
	from myImgTBL
</cfquery>

<!--- 
Query of a query to fetch images whose name matches 
today's name. There may be multiple images having a given
name.
 --->
<cfquery name="rushed" dbtype="query">
	select name
	from rushedPics
	where name like '#dateformat(now(), "dddd")#%'
</cfquery>

<cfset nrOfPics = rushed.recordcount>

<cfif nrOfPics gte 1>
	<!--- Pick a random number between 1 and the total number of pictures--->
	<cfset randNumber = randRange(1, nrOfPics,  "SHA1PRNG")>
	
	<!--- Relative path of randomly selected picture --->
	<cfset relativePathImg = "votd/#rushed['name'][randNumber]#">
	
        <!--- Display randomly selected picture --->
	<cfoutput><img src="#relativePathImg#" width="150" height="113" border="0" alt=""></cfoutput>

</cfif>	

</body>

Thanks for all the assistance I got it work now just added a table Named Banners into my own database for news etc..

Its just been awhile since I've coded in Cold Fusion

BKBK

Community Expert

1) Simple code to grab the images from a specfied folder:

<!--- List files of type PNG or JPG from a directory--->
<cfdirectory
directory = "full\path\to\image\directory"
action = "list"
filter = "*.png|*.jpg"
name = "imagesDir"
type = "file">
<!--- uncomment the dump to see the list of files --->
<!--- <cfdump var="#imagesDir#"> --->

2) I don't quite understand what you mean by "parse it to the page" and by "changing out by day". I shall assume you want to extract files from the list, ordering them by name.

As imagesDir is a query object, you can use query of a query. For example as follows:

<!--- List of images whose name contains '_20190507' --->
<cfquery dbtype="query" name="getImagesByDay">
	select * 
	from imagesDir
	where name like '%_20190507%'
</cfquery>
<!---<cfdump var="#getImagesByDay#">--->

<!--- Loop across the list of images, extracting and collecting the names that correspond to a particular date --->
<cfset img20180507 = arrayNew(1)>
<cfset mondayImages = arrayNew(1)>
<cfset tuesdayImages = arrayNew(1)>
<cfloop query="imagesDir">
	<!---If a name matches, add it to the array --->
	<cfif findNoCase('20180507', imagesDir.name) gt 0>
		<cfset arrayAppend(img20180507, imagesDir.name)>
	</cfif>	
        <cfif findNoCase('monday', imagesDir.name) gt 0>
		<cfset arrayAppend(mondayImages, imagesDir.name)>
	</cfif>
        <cfif findNoCase('tuesday', imagesDir.name) gt 0>
		<cfset arrayAppend(tuesdayImages, imagesDir.name)>
	</cfif>
</cfloop>

<!---<cfdump var="#img20180507#" label="20180507 images"><br>--->
List of 20180507 images: <cfoutput>#arrayToList(img20180507)#</cfoutput>

Translate

BKBK

Community Expert

Knight Raven, does that help?

Translate

Knight RavenAuthor

Participant

I was thinking more like this javascript example to clarify things a bit more

http://demo.dougv.com/js_random_image_time/dayofweek.html

this is the code I was working with but throws and error

<SCRIPT LANGUAGE="JavaScript">
var rand1 = 0;
var useRand = 0;

images = new Array;
images[1] = new Image();
images[1].src="Rushed/Monday.jpg";
images[2] = new Image();
images[2].src="Rushed/Tuesday.jpg";
images[3] = new Image();
images[3].src="Rushed/Wednesday.jpg";
images[4] = new Image();
images[4].src="Rushed/Thursday.jpg";
images[5] = new Image();
images[5].src="Rushed/Friday.jpg";
images[6] = new Image();
images[6].src="Rushed/Saturday.jpg";
images[7] = new Image();
images[7].src="Rushed/Sunday.jpg";

function swapPic() {
var imgnum = images.length - 1;
do {
var randnum = Math.random();
rand1 = Math.round((imgnum - 1) * randnum) + 1;
} while (rand1 == useRand);
useRand = rand1;
document.randimg.src=images[useRand].src;
}
</script>

Translate

Sign up

To post, reply, or follow discussions, please sign in with your Adobe ID.

Sign in to Adobe Community

To post, reply, or follow discussions, please sign in with your Adobe ID.