Greetings from the chilly south of NZ,
A little background, and I apologise in advance for the length of this
post:
I have a query which grabs all sponsors from the appropriate tables.
There are 8 categories but two different sponsor types - those with
images and those that display as text only. Unfortunately on this one I
have to meet a specific layout provided by a designer; all the image
sponsors need to be on a white background with rounded corners, while
all text sponsors are on a black background with white text etc. etc.
Without getting into too much more detail on the why and how and the
fact that the display has to very accurate (not pixel perfect but pretty
close), here's some code to help explain what I'm doing. This works ok,
but I'm thinking there may (must??) be an easier way:
<code_snippet>
<!--- The Query --- >
<cfquery name="qGetSponsors" datasource="#request.dsn#">
SELECT
S.ID,
S.Category_ID,
S.Name,
S.URL,
S.Image,
S.Image_Width,
S.Image_Height,
SC.Category,
SC.Display_Type,
SC.FolderName
FROM
tbl_sponsor_categories SC
INNER JOIN
tbl_sponsors S
ON
SC.ID = S.Category_ID
WHERE
S.Active = Yes
ORDER BY
S.Category_ID,
SC.Display_Type;
</cfquery>
<!---
Set a variable to keep track of the combined width total of all images
inside the row wrapper so we can close it when the total exceeds
allowable content width. If I had it my way I'd just float these
bastards and allow them to line wrap naturally, placing some spacing
between each image. Not as pretty, but an acceptable trade off in my
opinion. Rant done.
--->
<cfset attributes.aggregateImgWidth = 0 />
<!--- variable to determine start of new rowwrapper div ---->
<cfset attributes.newRow = true />
<cfoutput query="qGetSponsors" group="Category_ID">
<h3>#Category#</h3>
<cfif Display_Type EQ "Images">
<div class="sponsorimgcontainer">
<div class="sponsorimgbox">
<cfoutput>
<cfset attributes.currentCat =
qGetSponsors["Category"][qGetSponsors.currentRow]/>
<cfset attributes.nextCat =
qGetSponsors["Category"][qGetSponsors.currentRow + 1]/>
<cfif attributes.newRow EQ true>
<div class="rowwrapper">
</cfif>
<img src="#sponsorsImagePath##FolderName#/#Image#"
width="#Image_Width#"
height="#Image_Height#"
alt="#Name#" />
<cfset attributes.aggregateImgWidth = attributes.aggregateImgWidth +
Image_Width />
<cfif attributes.aggregateImgWidth GT 450 OR
attributes.currentCat NEQ attributes.nextCat>
<!--- width reached or last item in cat group so close div and reset
--- >
</div>
<cfset attributes.aggregateImgWidth = 0 />
<cfset attributes.newRow = true>
<cfelse>
<!--- Not there yet so don't close the row --->
<cfset attributes.newRow = false>
</cfif>
</cfoutput>
</div>
</div>
<cfelse>
<div class="sponsorlist">
<cfoutput>
Stuff for text sponsors here
</cfoutput>
</div>
</cfif>
</cfoutput>
</code_snippet>
I think the above is reasonably self explanatory with the commenting so
I wont repeat myself here.
This is all fine and is working, but seems ugly to me. If anyone has an
alternative solution to laying out the content, or perhaps even the way
I'm grouping or querying, I'm interested to hear from you. Hardly
mission critical, but I'm curious.
TIA
Regards
Mark
~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~|
Adobe® ColdFusion® 8 software 8 is the most important and dramatic release to
date
Get the Free Trial
http://ad.doubleclick.net/clk;207172674;29440083;f
Archive:
http://www.houseoffusion.com/groups/cf-talk/message.cfm/messageid:320496
Subscription: http://www.houseoffusion.com/groups/cf-talk/subscribe.cfm
Unsubscribe: http://www.houseoffusion.com/cf_lists/unsubscribe.cfm?user=89.70.4
