Leave That Thing Alone Blog

Sean Corfield and Railo at Sacramento ColdFusion User Group

Join the Sacramento ColdFusion User Group on Tuesday June 9th 2009 for Sean Corfield who will be speaking about Railo's CFML engine.

For more details on the meeting visit the SacCFUG website.

CFCPhotoBlog Adds Railo Support

CFCPhotoBlog has been updated to support Railo

There were actually very few changes required to make Railo happy. The main problem was that I had used several Adobe ColdFusion specific cfform tags that were not really needed.

View a demo and download from CFCPhotoBlog project page

 

Example of Feature Rich Dynamic Item Renderers in Flex 3

In the last Flex 3 rich feature item renderer example we looked at item renderers that had some nice visual and functional features, in this example we will take it to the next step and introduce some dynamic abilities to the item renderers. By using dynamic item renderers you can create more flexible & reusable itemrenderers, you can also do neat stuff like pass callback functions to handle events in the itemrenderer.

Here are some of the things this dynamic item renderer example will demonstrate:

  • Reuse the same item renderer for a DataGrid and a List, each with a different data provider
  • Pass delete/click function into item renderer
  • Dynamically change icons
  • Dynamically change the label function
  • Set label title style


View Example (right click for source)

In this post we won't go over every detail of the code, so check out the source in the example.

To start of with the basics, here is how to setup a itemrenderer using ClassFactory:

private var personItemRendererFactory:ClassFactory;
private function onInitialize():void {
	personItemRendererFactory = new ClassFactory(MyItemRenderer);
	peopleColumn.itemRenderer = personItemRendererFactory;
}
...
<mx:DataGrid id="peopleDataGrid" dataProvider="{peopleDataProvider}">
	<mx:columns>
		<mx:DataGridColumn id="peopleColumn" />
	</mx:columns>
</mx:DataGrid>

The example above doesn't really do much more than setting in itemrenderer in the DataGrid tag itself would, so lets set a property of the itemrenderer:

private function onInitialize():void {
	personItemRendererFactory = new ClassFactory(MyItemRenderer);
	personItemRendererFactory.properties = {doStuff: true};
	peopleColumn.itemRenderer = personItemRendererFactory;
}

In the above example we are now creating an itemrenderer and setting the 'doStuff' property using the ClassFactory properties object. Using the class factory properties we can set many things at once including functions. Let's say we want to listen for a click event inside the itemrenderer we can pass in a callback function that gets called from the item renderer when clicked:

private function onInitialize():void {
	personItemRendererFactory = new ClassFactory(MyItemRenderer);
	personItemRendererFactory.properties = {clickFunction: itemrendererClick_handler};
	peopleColumn.itemRenderer = personItemRendererFactory;
}

private function itemrendererClick_handler(evt:MouseEvent):void { Alert.show('clicked'); }

/* this in item renderer */ //inside the itemrenderer we need to define the click function public var clickFunction:Function;

//and then for this example lets call the clickFunction when the canvas is clicked <mx:Canvas click="clickFunction(event)"...

The above example allows a function to set on the itemrenderer. When the itemrenderer is clicked the event is handled in the same component that the holds DataGrid, this can be very convenient.

When using the properties of ClassFactory there is a something to be aware of; your itemrenderer may require a property to be set, but the ClassFactory and properties will not enforce that property to be required. For example if a click handler function is required in the ItemRenderer but not set in the properties there will be a runtime error when the ItemRenderer is clicked.

View the example and right click for source to see more details on how to do things like dynamically change icons and label functions.
View Example (right click for source)

This example is not intended to be a best practices for the most efficient item renderers, for further reading: Efficient Item Renderers, Advanced visual components

Edmund Event-Driven Framework At SacCFUG

Join the Sacramento ColdFusion User Group Tuesday Feb. 10, 2009 for a presentation on the "Edmund" Event-Driven Framework by Patrick Santora.

For more details on the meeting visit the SacCFUG website.

Retrieve Exif Metadata from Camera RAW and TIFF in ColdFusion 8

This example demonstrates how to get Exif metadata from Camera RAW and TIFF files in ColdFusion. In this sample I'm using a raw CR2 file from a Canon D30. Please note this example only reads RAW exif metdata, it does not read/process the RAW image.

ColdFusion 8's image tags allow the retrieval of Exif metadata from only certain image types, ColdFusion actually uses Drew Noakes Metadata Extract library. There is now a beta version (metadata-extractor-2.4.0-beta-1.jar) that introduces code for processing camera RAW images and TIFF files.

One way to use this beta library is to go into the [coldfusion8]\lib\ folder and rename the 'metadata-extractor-2.2.2.jar' file to .bak then copy the latest metadata-extractor JAR file into that directory.

However, in this example i'm going to use Mark Mandel's JavaLoader so I can use the beta library separately from the stable version cfimage uses.

The code below reads a camera Raw image then iterates through all the metadata:

<cfscript>
	//read Canon RAW CR2 file
	photoFile = createObject("java","java.io.File").init("#expandpath('IMG_7913.CR2')#");
	//set the path
	paths[1] = "D:\test\metadata-extractor-2.4.0-beta-1.jar";
	//create the loader
	javaLoader = createObject("component", "JavaLoader").init(paths);
	//create the TiffMetadataReader instace
	tiffMetadataReader = javaLoader.create("com.drew.imaging.tiff.TiffMetadataReader");
	//read metadata
	metadata = tiffMetadataReader.readMetadata(photoFile);
	//get directories
	directories = metadata.getDirectoryIterator();
</cfscript>

<cfoutput> <table cellspacing="0"> <cfloop condition="directories.hasNext()"> <cfset currentDirectory = directories.next() /> <cfset tags = currentDirectory.getTagIterator() /> <cfloop condition="tags.hasNext()"> <cfset currentTag = tags.next()> <tr> <td valign="top">#currentTag.getTagType()#</td> <td style="vertical-align:top;width:150px;">#currentTag.getTagName()#</td> <td valign="top">#currentTag.getDescription()# </td> <td>#currentTag.getTagTypeHex()#</td> </tr> </cfloop> </cfloop> </table> </cfoutput>

Sample output:

coldfusion raw tiff exif

CFCPhotoBlog 1.1 Update

CFCPhotoBlog has been updated to version 1.1. Here is what is new:

This is not a huge update mainly I wanted a new look on my photoblog, so I added two new skins 'moderndark' and 'modernlight'. For fun I added support for cooliris/piclens, this adds a special RSS feed that allows cooliris to view the photos.

As always suggestions and feature requests are welcomed. I am planning now for version 2.0.

CFCPhotoBlog project page

ColdBox Presentation at Sacramento ColdFusion User Group

Join the Sacramento ColdFusion User Group on January 13th 2009, Matt Graf will be talking about the ColdBox ColdFusion framework.

For more details and directions visit www.saccfug.com

Using Gumbo and itemRendererFunction to create multiple ItemRenderers

Gumbo has added an "itemRendererFunction" function that allows certain data containers to specify an itemRenderer based on the data item. In this example an FxDataContainer's dataProvider is set to an ArrayCollection that contains 2 different types of Value Objects. Depending on the type of Value Object the itemRendererFunction returns a different itemRenderer.


View Example (right click for source)

In this example there are two different Value Objects: PhotoVO and QuoteVO. An FxDataContainer's dataProvider is set to an ArrayCollection:

[Bindable]private var VODataProvider:ArrayCollection;

<FxDataContainer dataProvider="{VODataProvider}"...

The ArrayCollection is populated with 5 Value Objects, 2 PhotoVO and 3 QuoteVO.

In the FxDataContainer the itemRendererFunction is set to a function:

<FxDataContainer dataProvider="{VODataProvider}" 

itemRendererFunction="itemRendererFunction_handler"

In the itemRendererFunction a ClassFactory is passed back based on the type of data item in the itemRenderer. In this example there is a different itemRenderer for the PhotoVO and QuoteVO. We will also pass in a function to the itemRenderer to handle clicks:

private function itemRendererFunction_handler(item:Object):ClassFactory {

var classFactory:ClassFactory;

if (item is PhotoVO) {

//item is PhotoVO so use Photo ItemRenderer

classFactory = new ClassFactory(PhotoItemRenderer);

} else if (item is QuoteVO) {

//item is QuoteVO so use Quote ItemRenderer

classFactory = new ClassFactory(QuoteItemRenderer);

}

//pass callback click function

classFactory.properties = {clickFunction:itemRenderClick_handler};

return classFactory;

}

View Example with source enabled (flash 10 required)

Gumbo and Catalyst Photo Viewer Application

I've posted an example of a Flex application created with the MAX preview versions of Flash Catalyst and Gumbo. This small demo application was created to test out some of the new features in both Catalyst and Gumbo. It is not a perfect project, but a starting point for further projects.

Gumbo Catalyst Photo Application
View Example (right click for source)

The main goal of this project was to play with the new features in Catalyst and Gumbo using a close to real world example application, here is what was done:

  • Start with a photoshop layout (PhotoShop file located in PSD directory)
  • Use Catalyst to layout/components/skins and export FXG project
  • Import FXG to Gumbo project
  • In Gumbo add data/photo/etc functionality to the project
  • Take project back to Catalyst for small visual edits, then back to Gumbo
  • Use new Gumbo MXML tags/components
  • Play with new __AS3__.vec.Vector (using the new BitmapData.histogram)

Instead of detailing every step of the process there is great Gumbo Documentation and Catalyst Examples.

View Catalyst and Gumbo Photo Application (requires Flash 10 player)

Introduction to MVC at November Sacramento ColdFusion User Group

Sacramento ColdFusion User Group meets November 11th, this month Nolan Erck will be giving a presentation on "Introduction to Model View Controllers in ColdFusion". He will go over the basics of what MVC does, pros and cons, and give an introductory look at some code that uses this pattern.

This will be a non-framework-specific talk. No prior knowledge of Model-Glue, Mach-ii, etc required; none of the code samples will use a framework. However, some basic knowledge of CFCs will probably help tremendously

For more information and directions visit www.saccfug.com

More Entries