You can use Adobe ColdFusion to create slide presentations.

Contents

• About ColdFusion presentations
• Creating a slide presentation
• Adding presenters
• Adding slides
• Sample presentations

About ColdFusion presentations

ColdFusion lets you create dynamic slide presentations from source files and from CFML and HTML code on a ColdFusion page. You can use data extracted from a database to populate the slide content, including graphs and charts. Also, you can add images, audio tracks, and video clips to each slide in the presentation. ColdFusion provides three tags for creating slide presentations:

You specify at least one slide for the presentation and can assign each presenter to one or more slides. The following example shows a slide presentation with content from four different sources and two presenters:

<cfpresentation title="myPresentation">
    <cfpresenter name="Tuckerman" title="V.P. of Marketing" 
            email="tuckerman@company.com">
    <cfpresenter name="Anne" title="V.P. of Sales" email="anne@company.com">
    <cfpresentationslide src="slide1.swf" title="Overview" duration="10" 
            presenter="Anne"/>
    <cfpresentationslide src="slide2.htm" title="Q1 Sales" duration="30" 
            presenter="Anne"/>
    <cfpresentationslide src="http://www.markettrends.com/index.htm"     
            title="Market Trends" duration="30" presenter="Tuckerman"/>
    <cfpresentationslide title="Summary" duration="10">
        <h3>Summary</h3>
            <ul>
                <li>Projected Sales</li>
                <li>Challenges Ahead</li>
                <li>Long Term Goals</li>
            </ul>
    </cfpresentationslide>
</cfpresentation>

When the presentation runs, the slides appear in the order they are listed on the ColdFusion page for the duration specified in each slide. The presenter information is displayed in a control panel next to the slide to which it is assigned.

Creating a slide presentation

Use the cfpresentation tag to customize the look of the slide presentation, including where the controls appear and the colors used in the presentation interface, as the following example shows:

<cfpresentation title="Sales Presentation" controlLocation="left" primaryColor="##0000FF" shadowColor="###000033" textColor="##FFFF00" showNotes="yes">

The title appears at the top of the control panel. The color settings affect the presentation interface, but not the format of the slides within the presentation. Set the showNotes attribute to yes to display text notes that are defined for individual slides.

If you do not specify a directory, as in the previous example, ColdFusion runs the presentation directly in the client browser from files written to a temp directory on the server. To save the presentation, specify an absolute path or a directory relative to the CFM page. (ColdFusion does not create the directory; it must exist already.) In the following example, the presentation files are stored in the salesPresentation directory on the local drive:

<cfpresentation title="Sales Presentation" directory="c:\salesPresenation">

ColdFusion automatically generates the following files necessary to run the presentation and saves them in the specified directory:

• components.swf
• index.htm
• loadflash.js
• viewer.swf

Also, ColdFusion creates a subdirectory called data where it stores the following files:

• srchdata.xml (which creates the search interface)
• vconfig.xml
• viewer.xml
• A SWF file generated for each slide in the presentation
• Copies of the media files referenced in the presentation slides

Media files can include JPEG files, FLV and SWF video files, and MP3 audio files. To run the presentation that you saved to files, double-click the index.htm file.

Adding presenters

Optionally, you can add one or more presenters under the cfpresentation tag. ColdFusion displays the presenter information in the control panel for the current slide to which it is assigned. A slide does not require a presenter.

Use the cfpresenter tag to specify personal information, such as a title and an e-mail address, and JPEG images for a logo and the person's image, as the following code shows:

<cfpresentation title="Sales Presentation">
<cfpresenter name="Anne" title="V.P. of Sales" biography="Anne Taylor has been a top seller at Widgets R Us for five years." logo="images/logo.jpg" image="images/ataylor_empPhoto.jpg" email="ataylor@widgetsrus.com">

The name attribute is required. You use this value to assign the presenter to one or more slides. To assign a presenter to a slide, use the value of the name attribute defined in the cfpresenter tag as the value for the presenter attribute in the cfpresentationslide tag. The following example creates a presenter named Tuckerman and assigns him to a slide called Overview:

<cfpresentation title="Sales Presentation">
<cfpresenter name="Tuckerman" title="V.P. of Marketing">
<cfpresentationslide title="Overview" src="overview.swf" presenter="Tuckerman" duration="10"/>
...
</cfpresentation>

When you assign a presenter to a slide, the presenter information is displayed in the control panel for the duration of the slide. Images must be in JPEG format and the files must be located in a pathname relative to the ColdFusion page. ColdFusion maps the value of the email attribute to the contact link in the control panel, which opens an e-mail message in the local e-mail application when you click on it.

The following code creates three presenters for a presentation and assigns two of the presenters to slides:

<cfpresentation title="Sales Presentation">
    <cfpresenter name="Hannah" title="V.P. of Marketing" image="hannah.jpg">
    <cfpresenter name="Anne" title="V.P. of Sales" image="Anne.jpg">
    <cfpresenter name="Wilson" title="V.P. of Engineering"
            image="Wilson.jpg">
    <cfpresentationslide title="Overview" presenter="Hannah" duration="30"
            src="slide1.htm"/>
    <cfpresentationslide title="Q1 Sales" presenter="Anne" duration="15"
            src="slide2.htm"/>
    <cfpresentationslide title="Projected Sales" presenter="Anne"
            duration="15" src="slide3.htm" video="promo.flv"/>
    <cfpresentationslide title="Conclusion" src="slide4.htm"/>
</cfpresentation>

The presenter Hannah is assigned to one slide and Anne is assigned to two slides. The last slide in the presentation has no presenter assigned to it. Because Wilson is not assigned to a slide, his information does not appear in the presentation. In the second slide, Anne's photo is displayed in the control panel. In the third slide, however, the video called promo.flv runs in place of Anne's photo in the control panel (not in the slide itself) for the duration of the slide.

Adding slides

Use one cfpresentationslide tag for each slide in the presentation. The presentation runs the slides in the order they are listed beneath the cfpresentation tag. You can create content for a slide in one of the following ways:

Creating content from source files

The following code creates a presentation with three slides from source files in different locations:

<cfpresentation title="Garden Mania" directory="gardenPresentation">
    <cfpresentationslide title="Seeds of Change" src="c:\gardening\seeds.html" audio="media\hendrix.mp3" duration="30"/>
    <cfpresentationslide title="Flower Power" src="shockwave\flowerPower.swf" duration="40"/>
    <cfpresentationslide title="Dig Deep" src="http://www.smartgarden.com/index.htm" duration="15"/>
</cfpresentation>

In this example, ColdFusion generates the files required to run the presentation in the gardenPresentation directory and a new SWF file from each of the slides in the data subdirectory. ColdFusion also copies the hendrix.mp3 file and saves it in the data subdirectory.

Creating content from HTML and CFML code

If you do not specify a source file for a slide, you must create the content by using HTML or CFML code in the cfpresentationslide start and end tags on the ColdFusion page. The following presentation contains one slide with content generated from HTML, one slide with content generated from HTML and CFML code, and one slide with content extracted from an HTML file from an external website:

<cfpresentation title="The Road Ahead">
<cfpresentationslide title="Yellow Bricks" audio="myaudio1.mp3" duration="10">
    <h3>Yellow Bricks</h3>
    <table cellpadding=10>
        <tr>
            <td>
                <ul>
                    <li>Way to go Dorothy</li>
                    <li>Making tracks</li>
                    <li>No place like home</li>
                </ul>
            </td>
            <td><img src="../cfdocs/images/artgallery/maxwell01.jpg"/>
            </td>
        </tr>
    </table>
    </cfpresentationslide>
<cfpresentationslide title="Wild Ride" duration="5">
    <h3>Wild Ride</h3>
    <cfchart format="jpg" title="Who's Ahead" show3D="yes" chartHeight=500 chartWidth=500>
        <cfchartseries type="pyramid">
            <cfchartdata item="Dorothy" value=10>
            <cfchartdata item="Tin Man" value=30>
            <cfchartdata item="Scarecrow" value=15>
            <cfchartdata item="Lion" value=50>
            <cfchartdata item="Toto" value=5>
        </cfchartseries>
    </cfchart>
</cfpresentationslide>
<cfpresentationslide title="The Golden Age of Ballooning" duration="10" src="http://www.balloning.com/index.htm"/>
</cfpresentation>

The content for slides is not limited to static data: you can generate content from information extracted from a database or a query of queries.

Sample presentations

This section provides two sample presentations.

Example 1

The following example creates a simple presentation that incorporates data retrieved from the cfdocexamples database. It shows how to perform the following tasks:

• Create slides generated from HTML and CFML.
• Add images to slides.
• Add charts and tables with data extracted from a database.
• Add audio tracks to individual slides.

<!--- The following query extracts employee data from the cfdocexamples 
            database. --->
<cfquery name="GetSalaryDetails" datasource="cfdocexamples">
    SELECT Departmt.Dept_Name,
        Employee.FirstName,
        Employee.LastName,
        Employee.StartDate,
        Employee.Salary,
        Employee.Contract
    From Departmt, Employee
    Where Departmt.Dept_ID = Employee.Dept_ID
    ORDER BY Employee.LastName, Employee.Firstname
</cfquery>

<!--- The following code creates a presentation with three presenters. --->
<cfpresentation title="Employee Satisfaction" primaryColor="##0000FF" glowColor="##FF00FF" lightColor="##FFFF00" showoutline="no">
    <cfpresenter name="Jeff" title="CFO" email="jeff@company.com"
            logo="../cfdocs/getting_started/photos/somewhere.jpg" 
            image="../cfdocs/images/artgallery/jeff01.jpg">
    <cfpresenter name="Lori" title="VP Marketing" email="lori@company.com"
            logo="../cfdocs/getting_started/photos/somewhere.jpg" 
            image="../cfdocs/images/artgallery/lori01.jpg">
    <cfpresenter name="Paul" title="VP Sales" email="paul@company.com"
            logo="../cfdocs/getting_started/photos/somewhere.jpg" 
            image="../cfdocs/images/artgallery/paul01.jpg">

<!--- The following code creates the first slide in the presentation 
            from HTML. --->
    <cfpresentationslide title="Introduction" presenter="Jeff"
            audio="myAudio1.mp3" duration="5">
    <h3>Introduction</h3>
    <table>
        <tr><td>
            <ul>
                <li>Company Overview</li>
                <li>Salary by Department</li>
                <li>Employee Salary Details</li>
            </ul>
        </td></tr>
    </table>
    </cfpresentationslide>

<!--- The following code creates the second slide in the presentation.
            The chart is populated with data from the database query. --->
    <cfpresentationslide title="Salary by Department" presenter="Lori"
            duration="5" audio="myAudio3.mp3">
        <h3>Salary by Department</h3>
        <cfchart format="jpg" xaxistitle="Department" yaxistitle="Salary">
            <cfchartseries type="bar" query="GetSalaryDetails" 
                    itemcolumn="Dept_Name" valuecolumn="salary">
            </cfchartseries>
        </cfchart>
    </cfpresentationslide>

<!--- The following code creates the third slide in the presentation. The table is populated with data from the query. The table also contains an image located relative to the CFM page on the server. --->
    <cfpresentationslide title="Salary Details" presenter="Paul" 
            duration="10" audio="myAudio1.mp3">
        <h3>Employee Salary Details</h3>
        <table border cellspacing=0 cellpadding=5 valign="top">
        <tr>
        <td>
        <table border cellspacing=0 cellpadding=5 valign="top">
        <tr>
            <th>Employee Name</th>
            <th>Start Date</th>
            <th>Salary</th>
            <th>Department</th>
            <th>Contract?</th>
        </tr>
        <cfoutput query="GetSalaryDetails">
        <tr>
            <td>#FirstName# #LastName#</td>
            <td>#dateFormat(StartDate, "mm/dd/yyyy")#</td>
            <td>#numberFormat(Salary, "$9999,9999")#</td>
            <td>#dept_name#</td>
            <td>#Contract#</td>
            </tr></cfoutput>
            </table>
        </td>
        <td width="200" >
            <img src="images/raquel02.jpg"/>
        </td>
    </table>
    </cfpresentationslide>
</cfpresentation>

Example 2

The following example shows how to create a simple sales presentation with data from the cfartgallery database. Specifically, it shows how to perform the following tasks:

• Create slides generated from HTML and CFML.
• Create a slide from a URL that returns HTML content.
• Add charts with data extracted from a database and a query of queries.
• Add video and audio tracks to individual slides.

<!--- The following query extracts data from the cfartgallery database. --->
<cfquery name="artwork" datasource="cfartgallery">
SELECT FIRSTNAME || ' '|| LASTNAME AS FULLNAME, ARTISTS.ARTISTID, ARTNAME, PRICE, ISSOLD
FROM ARTISTS, ART
WHERE ARTISTS.ARTISTID = ART.ARTISTID
ORDER BY LASTNAME
</cfquery>

<!--- The following query of queries determines the total dollar amount of 
            sales per artist. --->
<cfquery dbtype="query" name="artistname">
SELECT FULLNAME,
SUM(PRICE) AS totalSale
FROM ARTWORK
WHERE ISSOLD = 1
GROUP BY FULLNAME 
ORDER BY totalSale
</cfquery>

<!--- The following code determines the look of the slide presentation. ColdFusion displays the slide presentation directly in the browser because no destination is specified. The title appears above the presenter information. --->
<cfpresentation title="Art Sales Presentation" primaryColor="##0000FF" glowColor="##FF00FF" lightColor="##FFFF00" showOutline="yes" showNotes="yes">

<!--- The following code defines the presenter information. You can assign each presenter to one or more slides. --->
    <cfpresenter name="Aiden" title="Artist" email="Aiden@artgallery.com" image="../cfdocs/images/artgallery/aiden01.jpg">
    <cfpresenter name="Raquel" title="Artist" email="raquel@artgallery.com" image="../cfdocs/images/artgallery/raquel05.jpg">
    <cfpresenter name="Paul" title="Artist" email="paul@artgallery.com" image="../cfdocs/images/artgallery/paul01.jpg">

<!--- The following code defines the content for the first slide in the presentation. The duration of the slide determines how long the slide plays before proceeding to the next slide. The audio plays for the duration of the slide. --->
    <cfpresentationslide title="Introduction" presenter="Aiden" duration="5" audio="myAudio1.mp3">
    <h3>Introduction</h3>
    <table>
        <tr><td>
            <ul>
                <li>Art Sales Overview</li>
                <li>Total Sales</li>
                <li>Total Sales by Artist</li>
                <li>Conclusion</li>
            </ul>
        </td>
        <td><img src="../cfdocs/images/artgallery/maxwell01.jpg"/></td></tr>
    </table>
    </cfpresentationslide>
    
<!--- The following code generates the second slide in the presentation from an HTML file located on an external website. --->
    <cfpresentationslide title="Artwork Sales Overview" presenter="Raquel" audio="myAudio2.mp3" duration="5" src="http://www.louvre.com/index.html"/>

<!--- The following code generates the third slide in the presentation, which contains a pie chart with data extracted from the initial database query. Although the presenter is the same as in the first slide, ColdFusion runs the video defined in the cfpresentationslide tag in place of the image defined in the cfpresenter tag. --->
    <cfpresentationslide title="Total Artwork Sold" presenter="Aiden"
            duration="5" video="video1.flv">
        <h3>Total Sales</h3>
        <cfchart format="jpg" chartwidth="500" show3d="yes">
            <cfchartseries type="pie" query="artwork"
                    colorlist="##00FFFF,##FF00FF" itemcolumn="issold"
                    valuecolumn="price"/>
            </cfchart>
        </cfpresentationslide>

<!--- The following code generates the fourth slide in the presentation with 
                data extracted from the query of queries. --->
    <cfpresentationslide title="Sales by Artist" presenter="Paul" 
            duration="5" audio="myAudio3.mp3">
        <h3>Total Sales by Artist</h3>
        <table border cellspacing=10 cellpadding=0>
        <TR>
        <TD>
            <table border cellspacing=0 cellpadding=5>
                <tr>
                    <th>Artist Name</th>
                    <th>Total Sales</th>
                </tr>
                <tr>
                <cfoutput query="artistname">
                <td>#FULLNAME#</td>
                <td>#dollarFormat(totalSale)#</td>
                </tr>
                </cfoutput>
            </table>
            </td>
            <td>
                <cfchart format="jpg" xaxistitle="Artist" yaxistitle="Total Sales"
                        chartwidth="400">
                    <cfchartseries type="bar" query="artistname"
                            itemcolumn="fullname" valuecolumn="totalSale"/>
                </cfchart>
            </td>
            </tr>
        </table>
    </cfpresentationslide>

<!--- The following code defines the final slide in the presentation. This slide does not have a presenter assigned to it. --->
    <cfpresentationslide title="Conclusion" duration="1" notes="Special thanks to Lori and Jeff for contributing their art and expertise.">
    <h1>Great Job Team!</h1>
    <p><img src="../cfdocs/images/artgallery/paul05.jpg"></p>
    </cfpresentationslide>
</cfpresentation>