How to Display Images by Day of week

Community Beginner ,
Sep 28, 2020 Sep 28, 2020

Copy link to clipboard

Copied

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

Views

135

Likes

Translate

Translate

Report

Report
Community Guidelines
Be kind and respectful, give credit to the original source of content, and search for duplicates before posting. Learn more
community guidelines

correct answers 1 Correct Answer

Community Beginner , Oct 04, 2020 Oct 04, 2020
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  

Likes

Translate

Translate
Adobe Community Professional ,
Sep 28, 2020 Sep 28, 2020

Copy link to clipboard

Copied

 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>

 

 

 

 

 

 

 

 

 

 

Likes

Translate

Translate

Report

Report
Community Guidelines
Be kind and respectful, give credit to the original source of content, and search for duplicates before posting. Learn more
community guidelines
Adobe Community Professional ,
Oct 02, 2020 Oct 02, 2020

Copy link to clipboard

Copied

Knight Raven, does that help?

Likes

Translate

Translate

Report

Report
Community Guidelines
Be kind and respectful, give credit to the original source of content, and search for duplicates before posting. Learn more
community guidelines
Community Beginner ,
Oct 02, 2020 Oct 02, 2020

Copy link to clipboard

Copied

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>

<body OnLoad="swapPic()">
<CFOUTPUT QUERY="Rushed" MAXROWS=7 startrow="1">
<CFSET Rush = #Left(Name, Len(#name#)-4)#>
<CFSET day = #DateFormat("#Now()#", "dddd")#>
<CFIF Rush EQ day>
<img src="Votd/#Rushed.name#" WIDTH="150" height="113" BORDER="0" ALT="">
</cfif>
</CFOUTPUT>

 

Likes

Translate

Translate

Report

Report
Community Guidelines
Be kind and respectful, give credit to the original source of content, and search for duplicates before posting. Learn more
community guidelines
Adobe Community Professional ,
Oct 04, 2020 Oct 04, 2020

Copy link to clipboard

Copied

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:

 

  1. A query has run and it contains the details of image files.
  2. 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.
  3. 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>

 

Likes

Translate

Translate

Report

Report
Community Guidelines
Be kind and respectful, give credit to the original source of content, and search for duplicates before posting. Learn more
community guidelines
Community Beginner ,
Oct 04, 2020 Oct 04, 2020

Copy link to clipboard

Copied

LATEST

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  

 

Likes

Translate

Translate

Report

Report
Community Guidelines
Be kind and respectful, give credit to the original source of content, and search for duplicates before posting. Learn more
community guidelines