Displaying Content

Open the Sydney Jabiru sample application home page in your browser (i.e. http://<server>/default.cfm). The first time you load the page; it might take some time so please be patient. This is because not only might CFMX have to compile the templates for the application and Speck API tags, but also because when a Speck application is initialised, configuration files are read, database tables are created if necessary and so on. If you reload the page after the application has initialised, you'll notice it load much, much faster.

When the page loads you should see something like this...

Application.cfm
In /webapps/sydneyjabiru/www/Application.cfm we have:
<cf_spApp name="sydneyjabiru" refresh="No">

This tag sets up the Speck application, the eventual result is that a structure is set up in request.speck with all the contextual information required for other Speck tags to work. Much of this information comes from configuration files under /speck/config. The tag stores as much information as possible in the server and application scopes to be as efficient as possible. It also handles logins and security, and sets up session.speck with all the user information available. If the refresh attribute is set to "yes" all configuration information is re-read from the config directory.

default.cfm
<cfinclude template="header.cfm">

<cfoutput>
<div id="column1">
</cfoutput>

<cf_spCacheThis cacheName="home_blurb">

    <cf_spContent type="Blurb" label="home" method="display">

</cf_spCacheThis>

<cfoutput>
</div>
<div id="column2">
</cfoutput>

<cf_spCacheThis cacheName="home_images">

    <cf_spContent type="ImageContainer" label="home">

</cf_spCacheThis>

<cfoutput>
</div>
</cfoutput>

<cfinclude template="footer.cfm">

Nice and simple isn't it! The default.cfm file contains a Sydney Jabiru specific header and footer, the rest of the content on the page is created using the cf_spContent tag. This tag is like a cfquery select and a cfoutput rolled into one. It gets Speck content and outputs it.

Some attributes of the tag tell it what content to select. In the case of the first call to cf_spContent, we want a content item labelled "home" that is of type "Blurb". Other attributes tell it what to display and how to display it, in this case we want to use the "display" method to output the selected content.

The resulting output from cf_spContent is cached in memory using the cf_spCacheThis tag. The second time you load the page it is extremely fast because of this. If you have debugging turned on, you will also notice that no database queries are executed the second time you load the page.

The second call to cf_spContent retrieves a content item also labelled "home", but of type "ImageContainer". Note that this call to cf_spContent contains no method attribute. This is because the default method for the cf_spContent tag is "display". You could also remove the method attribute from the first call to cf_spContent, without any effect on the output.

Now let's take a look at one of those content types, "Blurb". You'll find the Blurb.cfm file in /webapps/speck/tags/types/. You might notice that you won't find an ImageContainer.cfm in this directory. This is because Speck allows for system wide content types and content types that are application specific. The ImageContainer content type is only defined for the sydneyjabiru application. More on this later. Anyway, back to the Blurb content type...

Blurb.cfm
<cf_spType
    name="Blurb"
    description="HTML Blurb">

    <cf_spProperty
        name="Blurb"
        caption="Blurb"
        type="Html"
        required="no"
        displaySize="120,30"
        maxlength="8000"
        richEdit="yes">

    <cf_spHandler method="display">

        <cfoutput>#content.blurb#</cfoutput>

    </cf_spHandler>

</cf_spType>

The display handler for blurb content items is part of the blurb content type definition template in /speck/tags/types/Blurb.cfm

You can see that the blurb content type has one property that is of type "Html" and it also has just one display handler, which simply outputs the value of the blurb property. A call to the cf_spContent tag with type="Blurb" and method="display" will result in the code of the display method being executed for each content item retrieved by cf_spContent.

Browse the page code and content type handlers to get an end-to-end view of how easy it is to display content with Speck. If you really want to get your hands dirty and understand how Speck works, you can dive into the property type handlers for a deeper understanding of how you can extend Speck. Have a look at /webapps/speck/types/properties/Html.cfm for example, you'll notice that it has methods for rendering and reading form fields, validating values and so on. These methods are used when managing content in Speck, to render the form field, validate values before saving etc.