Solved

Coldfusion photogallery

Posted on 2009-04-05
5
825 Views
Last Modified: 2013-12-24
Hello experts.
On www.coldfusionjedi.com i found a link to Spry photo gallery Demo :http://www.dbooth.net/photos/index.htm#
This needs the simpleviewer from http://www.airtightinteractive.com/simpleviewer/.
I have downloaded all the files and i'm asking how can i use the code getting the photos dynamically with a query.
The query is:
 <cfquery name="WADAphoto" datasource="#request.dsn#">
 SELECT a.Photo1, a.Photo2, a.Photo3, a.Photo4,a.Photo5, a.Photo6, a.Photo7, a.Photo8
 From dbo.artikel a
 WHERE Art_ID = <cfqueryparam value="#URL.Art_ID#" cfsqltype="cf_sql_numeric">
 </cfquery>
(there is a folder images/big and images/thumbs
Here are all the downloaded files:
index:
<!-- saved from url=(0014)about:internet -->
<html xmlns="http://www.w3.org/1999/xhtml" xml:lang="en" lang="en">
<head>
<meta http-equiv="Content-Type" content="text/html; charset=iso-8859-1" />
<title>SimpleViewer</title>
<!-- Download SimpleViewer at www.airtightinteractive.com/simpleviewer -->
<script type="text/javascript" src="swfobject.js"></script>
<style type="text/css">	
	/* hide from ie on mac \*/
	html {
		height: 100%;
		overflow: hidden;
	}
	
	#flashcontent {
		height: 100%;
	}
	/* end hide */
 
	body {
		height: 100%;
		margin: 0;
		padding: 0;
		background-color: #181818;
		color:#ffffff;
		font-family:sans-serif;
		font-size:20;
	}
	
	a {	
		color:#cccccc;
	}
</style>
</head>
<body>
	<div id="flashcontent">SimpleViewer requires JavaScript and the Flash Player. <a href="http://www.macromedia.com/go/getflashplayer/">Get Flash.</a></div>	
	<script type="text/javascript">
	
		var fo = new SWFObject("viewer.swf", "viewer", "100%", "100%", "8", "#181818");
		
		// SIMPLEVIEWER CONFIGURATION OPTIONS
		// To use an option, uncomment it by removing the "//" at the start of the line
		// For a description of config options, go to: 
		// http://www.airtightinteractive.com/simpleviewer/options.html
		
		//fo.addVariable("xmlDataPath", "gallery.xml");
		//fo.addVariable("firstImageIndex", "5");	
		//fo.addVariable("langOpenImage", "Open Image in New Window");
		//fo.addVariable("langAbout", "About");	
		//fo.addVariable("preloaderColor", "0xFFFFFF");
		
		fo.write("flashcontent");	
	</script>	
</body>
</html>
gallery:
<?xml version="1.0" encoding="UTF-8"?>
<simpleviewergallery maxImageWidth="480" maxImageHeight="480" textColor="0xFFFFFF" frameColor="0xFFFFFF" frameWidth="20" stagePadding="40" navPadding="40" thumbnailColumns="3" thumbnailRows="3" navPosition="left" vAlign="center" hAlign="center" title="SimpleViewer Gallery" enableRightClickOpen="true" backgroundImagePath="" imagePath="" thumbPath="">
<image>
	<filename>wide.jpg</filename>
	<caption><![CDATA[Captions can be HTML formatted. Supported tags are <b>bold</b>, <u>underline</u>, <i>italics</i>, <u><a href="http://www.google.com" target="_blank">hyperlinks</a></u>, linebreaks<br> and <font color="#ffff00" size="30">font tags</font>.]]></caption>	
</image>
<image>
	<filename>tall.jpg</filename>
	<caption>One morning, when Gregor Samsa woke from troubled dreams, he found himself transformed in his bed into a horrible vermin. He lay on his armour-like back, and if he lifted his head a little he could see his brown belly, slightly domed and divided by arches into stiff sections.</caption>	
</image>
<image>
	<filename>wide.jpg</filename>
	<caption>The bedding was hardly able to cover it and seemed ready to slide off any moment. His many legs, pitifully thin compared with the size of the rest of him, waved about helplessly as he looked. "What's happened to me? " he thought. It wasn't a dream.</caption>	
</image>
<image>
	<filename>tall.jpg</filename>
	<caption>Caption 4</caption>	
</image>
<image>
	<filename>wide.jpg</filename>
	<caption>Caption 5</caption>	
</image>
<image>
	<filename>tall.jpg</filename>
	<caption>Caption 6</caption>	
</image>
<image>
	<filename>wide.jpg</filename>
	<caption>Caption 7</caption>	
</image>
<image>
	<filename>tall.jpg</filename>
	<caption>Caption 8</caption>	
</image>
<image>
	<filename>wide.jpg</filename>
	<caption>Caption 9</caption>	
</image>
<image>
	<filename>tall.jpg</filename>
	<caption>Caption 10</caption>	
</image>
<image>
	<filename>wide.jpg</filename>
	<caption>Caption 11</caption>	
</image>
<image>
	<filename>tall.jpg</filename>
	<caption>Caption 12</caption>	
</image>
</simpleviewergallery>
photindex:
<!-- saved from url=(0014)about:internet -->
<html xmlns="http://www.w3.org/1999/xhtml" xml:lang="en" lang="en">
<head>
<meta http-equiv="Content-Type" content="text/html; charset=iso-8859-1" />
<title>SimpleViewer</title>
<!-- Download SimpleViewer at www.airtightinteractive.com/simpleviewer -->
<script type="text/javascript" src="swfobject.js"></script>
<style type="text/css">	
	/* hide from ie on mac \*/
	html {
		height: 100%;
		overflow: hidden;
	}
	
	#flashcontent {
		height: 100%;
	}
	/* end hide */
 
	body {
		height: 100%;
		margin: 0;
		padding: 0;
		background-color: #181818;
		color:#ffffff;
		font-family:sans-serif;
		font-size:20;
	}
	
	a {	
		color:#cccccc;
	}
</style>
</head>
<body>
	<div id="flashcontent">SimpleViewer requires JavaScript and the Flash Player. <a href="http://www.macromedia.com/go/getflashplayer/">Get Flash.</a></div>	
	<script type="text/javascript">
	
		var fo = new SWFObject("viewer.swf", "viewer", "100%", "100%", "8", "#181818");
		
		// SIMPLEVIEWER CONFIGURATION OPTIONS
		// To use an option, uncomment it by removing the "//" at the start of the line
		// For a description of config options, go to: 
		// http://www.airtightinteractive.com/simpleviewer/options.html
		
		//fo.addVariable("xmlDataPath", "gallery.xml");
		//fo.addVariable("firstImageIndex", "5");	
		//fo.addVariable("langOpenImage", "Open Image in New Window");
		//fo.addVariable("langAbout", "About");	
		//fo.addVariable("preloaderColor", "0xFFFFFF");
		
		fo.write("flashcontent");	
	</script>	
</body>
</html>

Open in new window

0
Comment
Question by:Panos
[X]
Welcome to Experts Exchange

Add your voice to the tech community where 5M+ people just like you are talking about what matters.

  • Help others & share knowledge
  • Earn cash & points
  • Learn & ask questions
  • 3
  • 2
5 Comments
 
LVL 16

Accepted Solution

by:
duncancumming earned 500 total points
ID: 24071172
So your gallery page is an XML file of the form:
<image>
        <filename></filename>
        <caption></caption>
</image>

All you need to do is create a .cfm page that includes your query, outputs the query in an xml format, and uses cfcontent to say the page is an XML document.


<cfquery name="WADAphoto" datasource="#request.dsn#">
SELECT a.Photo1, a.Photo2, a.Photo3, a.Photo4,a.Photo5, a.Photo6, a.Photo7, a.Photo8
From dbo.artikel a
WHERE Art_ID = <cfqueryparam value="#URL.Art_ID#" cfsqltype="cf_sql_numeric">
</cfquery>
 
<cfcontent type="text/XML">
<?xml version="1.0" encoding="UTF-8"?>
<simpleviewergallery maxImageWidth="480" maxImageHeight="480" textColor="0xFFFFFF" frameColor="0xFFFFFF" frameWidth="20" stagePadding="40" navPadding="40" thumbnailColumns="3" thumbnailRows="3" navPosition="left" vAlign="center" hAlign="center" title="SimpleViewer Gallery" enableRightClickOpen="true" backgroundImagePath="" imagePath="" thumbPath="">
<cfoutput query="WADAphoto">
    <cfloop index="i" from="1" to="8">
        <image>
                <filename>#WADAphoto["Photo" & i]#</filename>
                <caption>???</caption>    
        </image>
    </cfloop>
</cfoutput>
</simpleviewergallery>
</cfcontent>

Open in new window

0
 
LVL 16

Expert Comment

by:duncancumming
ID: 24071177
of course the closing </cfcontent> isn't required!
0
 
LVL 2

Author Comment

by:Panos
ID: 24071215
Hi duncancumming:
the name of this page will be gallery.cfm?
0
 
LVL 2

Author Closing Comment

by:Panos
ID: 31566738
Thank you for your help
regards
panos
0
 
LVL 16

Expert Comment

by:duncancumming
ID: 24072747
yes.  I couldn't see where in your sample code you actually specify the name of the gallery XML file.  However I assume that is trivial.  When it comes to that part, just specify it as gallery.cfm.  

It'll need to be a .cfm page if you want ColdFusion code to execute (i.e your query).
 [not strictly true, but for simplicity's sake let's say it is]
0

Featured Post

Create the perfect environment for any meeting

You might have a modern environment with all sorts of high-tech equipment, but what makes it worthwhile is how you seamlessly bring together the presentation with audio, video and lighting. The ATEN Control System provides integrated control and system automation.

Question has a verified solution.

If you are experiencing a similar issue, please ask a related question

Most ColdFusion developers get confused between the CFSet, Duplicate, and Structcopy methods of copying a Structure, especially which one to use when. This Article will explain the differences in the approaches with examples; therefore, after readin…
Introduction This article explores the design of a cache system that can improve the performance of a web site or web application.  The assumption is that the web site has many more “read” operations than “write” operations (this is commonly the ca…
Monitoring a network: why having a policy is the best policy? Michael Kulchisky, MCSE, MCSA, MCP, VTSP, VSP, CCSP outlines the enormous benefits of having a policy-based approach when monitoring medium and large networks. Software utilized in this v…
In this brief tutorial Pawel from AdRem Software explains how you can quickly find out which services are running on your network, or what are the IP addresses of servers responsible for each service. Software used is freeware NetCrunch Tools (https…

626 members asked questions and received personalized solutions in the past 7 days.

Join the community of 500,000 technology professionals and ask your questions.

Join & Ask a Question