Cutter's Crossing - Development

Introducing Sencha

Thu, 17 Jun 2010 17:31:00 -0400

Great things are coming. Great things are here! On June 14^th, Ext JS LLC rebranded as part of their announced partnership with the principles of the JQTouch and Raphael projects, creating Sencha. The Ext JS library is still one of their major offerings, but they have also created Sencha Labs as a repository of various Open Source Projects under the MIT License (Like JQTouch, Raphael, and Ext Core). Great things were on the way! Having David Kaneda (JQTouch) and Dmitry Baranovskiy (Raphael) join forces with the Ext JS crew is huge, and really plays well in understanding a series of recent blog posts around HTML5, CSS3, and what HTML5 means to developers today. But, it gets better. This morning, Sencha launched their first joint product in public beta, Sencha Touch. Sencha Touch is a cross-platform mobile application framework built to leverage HTML5, CSS3, and JavaScript. It gives you the same sort of consistent API that you've come to expect from the Ext JS team, with a familiar syntax, great documentation, user forums for support, and many samples included with the download to help you learn. I've had the opportunity to preview this code for a while, and it is outstanding work. There will be some interesting apps to come out of this. The future looks bright for Sencha, and I can't wait to see what they do next. Judging from their post on the rebranding, my prediction are changes to ExtDesigner (possibly to become SenchaDesigner), that would allow a developer to build both Ext JS and Sencha Touch interfaces from the same tool. My guess. (Man, that would be really cool.)

My CF + ExtJs Preso for cf.Objective() 2010

Sat, 24 Apr 2010 08:50:00 -0400

Attached to this is my slide deck and sample code from my ColdFusion + ExtJs presentation here at cf.Objective() 2010. Overall it seemed to go really well, despite the typical technical difficulties, and though Ray said I needed to be a little more introductory (Thanks Ray. I appreciate the feedback.) I heavily commented the JavaScript in my source code, so hopefully that will help to fill in the gaps for people. If anyone has any questions, feel free to use the contact link at the bottom of the page. I want to shout out to Aaron Conran of ExtJs, for providing me with a license for their new ExtDesigner to giveaway in my presentation. I pinged him last minute on this, and he really came through (Hope you like it Lance. Drop me your info to give back to Aaron.) For those who haven't checked it out yet, it's a fantastic tool, really well done, and more than worth the small price tag on it. On a side note, I'm using a "work-in-progress" version of CFQueryReader in this sample. I'm in the process of refactoring to support some advanced features of Ext.Direct, and the new version will only be compatible with 3.2 and above. When I put it into SVN I'll add some notes on which revision is the cutoff for previous versions of ExtJs. Update: I've added notes to the readme.txt file of the sample download with instructions on how to make the examples work in ColdFusion 8 as well.

I Am Speaking at cf.Objective() 2010

Wed, 06 Jan 2010 15:59:00 -0400

I'll be speaking on building applications with ColdFusion and ExtJs at cf.Objective 2010. I was very honored to be asked to submit a topic alongside so many fantastic speakers and developers. I'll post more as the details are refined.

Can We Extend the ColdFusion Server

Thu, 08 Oct 2009 15:22:00 -0400

I love playing around with new toys. So, I'm ecstatic now that ColdFusion 9 has been officially released to the world, and even more so after what I'm about to tell you. Oh sure, I've been playing around with the betas, but mostly in testing the cfajax/ExtJs 3 upgrades (and I'll be posting more on that in the coming months). Time has been somewhat limited for me, so playtime has had to take a back burner. But, I wish I had gotten into this a bit sooner. Yesterday I finally got around to working with some of the new cfscript implementations. I find these upgrades to be one of the key features for me personally. One, It's a faster coding style for me. Two, I was getting tired of bouncing between script and tags. Three, I really like the economy of code associated with script, finding it to be far less verbose. So, I'm lovin' the fact that I can write all of my CFC's, including my Application.cfc, in pure script. Now I can keep the tags with the display. But, as someone pointed out to me in a recent comment, there are still a few tags (anyone know which ones?) that haven't yet gotten script implementations. What can we do about that? So, in diving right into playing with script enhancements, I ran into a few roadblocks. Minor errors, stemming from me not properly understanding the implementation. Now, the first place I went was to the documentation. Ray Camden keeps saying to me "Why don't people read the documentation?" I'm one of those that agrees with him. Yes, the documentation has some holes, and even bad examples, but you would be surpised what you can learn. (Read on, you'll see where I'm going with this!) [More]

Scripting a ColdFusion Application

Thu, 08 Oct 2009 00:28:00 -0400

With the release of ColdFusion 9 this past week, at MAX, we finally have full parity for cfscript with all of the cf tags. I personally prefer script when writing data access and business logic. For some it might not appear to be the sexiest feature, but I can see it making CFML much more appealing to developers from other languages. [More]

ColdFusion Ajax and ExtJs Presentation Update

Wed, 23 Sep 2009 09:33:00 -0400

I've been asked to present to the KCDevCore on ColdFusion 9 Ajax and ExtJs. This will be an updated version of my ColdFusion Ajax presentation, with new content to cover the updates and new components presented in ColdFusion 9 and ExtJs 3.0. By request, I'm going to try to keep the slides to a minimum and get down to some code. That presentation will be next Tuesday, September 29th, at 7 PM CDT, and will be available via the KCDevCore Adobe Connect. For those who don't know (where have you been?), ColdFusion 9 is now in public beta on Adobe Labs.

ColdFusion for the Redmond Crowd

Tue, 18 Aug 2009 22:39:00 -0400

Some time back I started receiving Visual Studio Magazine. I'm not sure why. I didn't request it, and lord knows I've tried to stay away long enough (since the VB6 days). But, being a developer with a background in linguistics, I began to read through the issues. C# looks interesting, and I'll probably play with it some, but for the most part all of it just reminds me why I'm a ColdFusion developer with skills in related web type languages (XHTML, CSS, JavaScript, etc). Last week I received my August issue of VSM, and took a look when I got a chance. I got a number of surprises with this issue, the first one being the biggest. In the front of magazine is an 'Online Contents' section, where they list articles that are only available on the web from three Redmond Developer Network sites: Visual Studio Magazine, Redmond Developer News, and Application Development Trends. And, to my surprise, under the articles on ADT, the first heading read Adobe Releases First Beta of ColdFusion 9. Now, here's a magazine dedicated to .NET development, pointing to sites dedicated to .NET development, highlighting an article about ColdFusion. Nice! This was obviously part of the interview blitz that Adam Lehman did just before the public release. The article talks about ColdFusion Builder, quotes the recent Gartner Report, and talks about the great new features in ColdFusion 9, with emphasis on Hibernate, full scripted dev support, as well as the Office and Sharpoint integration features (it also reminds readers about the .NET and Exchange integration features added in to CF 8.) So, it was truly cool to see CF getting some love from the press. More so, being as the press targets a different developer market. But, it got cooler for Adobe with the rest of the issue. See, this issue of VSM was also the 2009 VSM Readers Choice Awards. Adobe took a few honors in several categories:

Help Authoring: Readers Choice Award Winner : RoboHelp and RoboHelp Server - Adobe Systems, Inc.
Web Design & Development Tools : Readers Choice Award Winner : Dreamweaver - Adobe Systems, Inc.
Web Design & Development Tools : Readers Choice Merit Award Winner : Creative Suite 4 - Adobe Systms, Inc.
Web & Mobile Development : Editors Choice Award Winner : Dreamweaver - Adobe Systems, Inc.

Great news for Adobe, and a nice shot over the MS bow. Looking over the other categories, I see potential with the release of ColdFusion 9. Here's some nice goals/targets for our favorite server:

Charting and Multimedia (should've been Flex hands down, but CF has it's own)
Data Editing, Reporting & Analysis Tools
Grid Components: Web (I can see it)
Imaging and Graphics
Middleware & Server Based Tools
PDF Tools
SharePoint Components & Tooling
Editors Choice: Most Valuable Tool
Editors Choice: Data Handling & Development

Thanks Adam, for pushing the tech press in areas that haven't historically gotten our message. Congrats to Adobe for it's new honors, and here's to hoping other dev communities begin to see, and recognize, the value of ColdFusion.

Request vs Variables - Which is right?

Mon, 10 Aug 2009 17:06:00 -0400

Last week I stirred the pot a bit, stating that we've been improperly using the VARIABLES scope, and it's hurting our applications. Variables placed within the VARIABLES scope do not appear to have proper Garbage Collection performed on them when we're done with them, except in the case of the scope's usage within a CFC or a custom tag. This brought up some interesting discussion, where Ray Camden, Mike Brunt, and others chimed in. I, with very good success, have been using REQUEST where most people use the VARIABLES scope. Wait! Hold on! You have to let me finish first before you get bent. What I said was that, in the past, we placed variables into the VARIABLES scope within our base request templates, with no way of clearing those variables at the end of the request (if using Application.cfc). My thought is, if VARIABLES have no true (apparent) mechanism for release, in context of variables scoped this way in a base request, then they don't really belong in the VARIABLES scope, but rather in the REQUEST scope. This was met with some push back. The first argument was that this breaks encapsulation. I want to begin my response here by saying the first obvious thing that comes to mind: ColdFusion is not OO! Sure, your ColdFusion application can be written in an OO fashion, but ultimately it doesn't have to be. There are even some who seem that think that maybe it shouldn't be. All of that being said, I agree with OO principles, and think that proper encapsulation is very important when developing your applications, especially in terms of portability and reuse. Just because the REQUEST scope can be used directly within your custom tags or CFC's doesn't mean that you should. I would never suggest referencing the REQUEST scope directly within a CFC, with the exception of Application.cfc itself. So another argument was that the REQUEST scope should only be used "when (and only when) the variable must be accessible to all the elements composing the request...", going further to state that the REQUEST scope should be avoided if at all possible. Why? The rest of the argument once again comes back to encapsulation. My point is to use the REQUEST scope within the context of a request, paying attention to maintain encapsulation. Within that context, doesn't it make sense to use the REQUEST scope for variables that should only exist for the length of a request? The ColdFusion Jedi piped in to correct me on my timeline of scope introductions to ColdFusion, and we had some back and forth over declaration of scope to clearing of scope. I contended that onApplicationEnd() cleared the APPLICATION scope, that onSessiondEnd() cleared the SESSION scope, and that onRequestEnd() cleared the REQUEST scope. Ray reminded me that Application.cfc was about application process, and that the server handled when to 'clear' variables 'under the hood.' My point back was that something has to tell the server when to de-reference these variables, and that I had always assumed that was triggered by the execution of these methods. Mike Brunt chimed in on this, saying that the application must de-reference the variables prior to the server knowing it can perform Garbage Collection on them (Side Note: he didn't come out and agree with all of my conclusions here, only seeming to agree with the logic applied.) Possibly the largest argument overall relates to whether the apparent memory leak, when using the VARIABLES scope within a base request, is really a leak or just a byproduct? I've theorized that the intention of the VARIABLES scope was that it was to be used only within CFC's and custom tags, where it does appear to properly get de-referenced. I put out there that the only reason you were able to use VARIABLES within the base request was because custom tags were created from .cfm files as well, so there really isn't any way to restrict it's usage. Ray says that the VARIABLES scope was introduced to provide access (like StructKeyExists()) to the unscoped variables out there in the wild.I think our thoughts of 'best practice' usage should follow these lines: Using the REQUEST scope within the base request, while maintaining encapsulation. Ultimately, I just don't know. Maybe there's still an Adobe engineer out there who goes back that far, and can remember exactly what's what and why. I do know that, after migrating several high traffic applications to these guidelines I did get a higher return on application performance. I've gotten notes from others, after reading the original post, who have done similar changes to their systems with the same improvements. What other pluses or minuses do you, dear reader, think of when considering this practice of variable scoping? Is it right? Is it wrong? Is it a sin? What do you say? (You can follow the original comment thread by referencing the post linked below)

Scope Usage and Application Scaling

Thu, 06 Aug 2009 15:29:00 -0400

Mike Brunt has posted an excellent article called Good Practices For Scaling ColdFusion Applications, in which he speaks about the importance of memory management within ColdFusion applications, and calls out certain avenues of scope usage that every CF developer should pay attention too. Great post Mike! Another 'scope' issue that I've often seen (and abused myself) is the misuse of the VARIABLES scope. Back in the early days of CF, every example you saw showed an unscoped variable, placing it into the VARIABLES scope by default. This was fine, back then, as your view layers primarily consisted of Custom Tags. Use of the VARIABLES scope, within a custom tag, was permissable as those variables were then only available within that tag (or within a nested tag, if the nested tag used the CALLER scope). Once execution of the tag was completed, the memory space of those variables was cleared. But, since custom tags were made from .cfm templates, there is no constraint within CFML from placing VARIABLES scoped variables within any .cfm template. This, in itself, is bad, as the VARIABLES scope (in the case of a base template, not a custom tag) is not properly cleared from memory space. What I find people doing (and I've done it myself) is using the VARIABLES scope in place of the REQUEST scope. Memory allocated to REQUEST variables is properly recovered at the end of a request. Although variables in the VARIABLES scope are no longer available (except within a persistent CFC), their memory isn't properly released at the end of request execution. (For more information on this, see Jason Sheedy's post on the ColdFusion Memory Leak, and the accompanying comment thread and other referenced posts.) A technique that some used, to get around this issue, was to have a StructClear(VARIABLES) statement as the last line of their onRequestEnd.cfm. This would explicitly clear out the VARIABLES scope at the end of a request. But, with the advent of Application.cfc, this no longer became an option (if you use Application.cfc.) If you tried to use that statement within the onRequestEnd() method of Application.cfc, you would only be clearing the VARIABLES scope of the CFC itself, and not the request. That's actually a good pointer at the true underlying issue: proper scope usage. Use of the VARIABLES scope within a CFC makes variables within that scope only available directly by all methods of that CFC. Use of the VARIABLES scope within a custom tag makes variables within that scope only available within that tag (or a nested tag using the CALLER scope to access them.) Within a custom tag, you can not access variables of the calling template's VARIABLES scope, unless you use the CALLER scope to do so (which should only be in the case of a nested custom tag). You can, however, access REQUEST variables through out the request, from within a custom tag, an include file, or even within a CFC (though I wouldn't suggest doing that one.) By confining the usage of the VARIABLES scope to within custom tags and CFC's, and properly setting request level variables within the REQUEST scope, you could better manage your memory usage and application performance. I've personally seen major differences in application performance, both through Mike's advice on persistent scope usage, as well as what I've outlined above. Unlike Jason Sheedy though, I'm not very familiar with Java profiling tools, so I'll have to leave it up to someone else to test all of this for the scientific proof. I only know that it appears my applications are running better as I migrate them to this paradigm. What are your thoughts? *** Post Revision 080609: 2230 hrs *** More revision to my comments than the post itself, but Ray, the ColdFusion Jedi himself, corrected me. According to Ray, the VARIABLES scope wasn't added until CFMX, so my supposition on the 'intention' of the VARIABLES scope was incorrect. You really have to read the comment thread to see the fun we're having;) Hopefully we'll find an answer. Cutter

CFQueryReader v1.2 - Critical Update Supporting ExtJS 3.x

Wed, 29 Jul 2009 16:04:14 -0400

I have updated CFQueryReader, addressing issues that had arisen with new builds of ExtJs 3.x. This new build should cover sporadic issues with loading a new Ext.data.Store. There is also a simple example of using Aaron Conran's DirectCFM Ext.Direct ColdFusion API stack. The CFQueryReader Example Site has been updated as well. You can update CFQueryReader from RIAForge.

Ext Js 3.0 is Finally Released!

Mon, 06 Jul 2009 23:08:00 -0400

Yes, Ext Js 3.0 has finally arrived! This long awaited update to the popular library has finally hit the download page as a production ready build (though the Release Candidates have been pretty stable as it is). There are many great enhancements to Ext, including an even more consistent underlying model (how could it get more consistent?), and some exciting new data marshalling features. A quick perusal of the updated Samples & Demos page gives us immediate insight into some of the new features that are available:

Row Editor Grid - for full record edits
Buffered Grid View - for faster rendering of large datasets
Tab Panel Scroller Menu - for Tab Panels with lots of tabs
Group Tabs - a vertical tab implementation
Charts - several different chart types
Check Tree - a tree view with a twist
HBox and VBox layouts
Toolbar Overflow
Toolbar Button Groups
ListView - a very lightweight grid implementation
Updated QuickTips

There's a lot more that you'll have to dig to see, like improved browser support, a better container model, and (experimental) ARIA support (for accessabiltiy). Some of the greatest enhancements come in the way of the data marshalling capabilities added via the new Ext Direct. With Direct, Ext is providing the remoting specifications so that anyone can write data marshalling services around their favorite backend language. Ext has even published Example Server Side Stacks as a jumping off point to beginning with data marshalling via Direct. [Side Note: Aaron Conran, the team lead on the Ext Js team, is a long time ColdFusion guy, and he wrote the example CF stack.) By configuring your Direct API, you can utilize data readers and writers (they're new!) easily, even passing multiple requests within a single Ajax request. [Another Side Note: CFQueryReader is fully functional with and without Direct.] One of the nicest features of this release is the backwards compatability. There are little to few changes that most will have to make, to upgrade their applications from 2.x to 3.0. And, it was announced, on a recent User Group Tour stop, that Adobe is including Ext Js 3.0 in ColdFusion 9. This opens up the possability of some very nice, new CFAjax components to come. All in all a fantastic release. I've had the opportunity to play with 3.0 for a while now, watching the SVN updates daily, and my hat's off to the Ext Js crew for another excellent release.

ColdFusion PreRelease Tour Coming to Nashville

Wed, 10 Jun 2009 09:43:00 -0400

Greg Wilson, Adobe Platform Evangelist, is coming to Nashville to give us a sneak peak at ColdFusion 9, Codename: Centaur, and Bolt, the new ColdFusion IDE. According to various posts from cf.Objective, and other tour dates, there appear to be some major enhancements in integration capabilities, Flex and AIR interaction, and more. You don't want to miss out on this special event, giving you the inside scoop! Click on the link above to register.

Ext JS 3.0 RC2 Released

Wed, 03 Jun 2009 11:53:00 -0400

The Ext JS team has announced the release of 3.0 RC2. This latest Release Candidate is considered to be very stable, with many new examples to show you how to do what you need to do. From someone that updates from the repository every day, I can tell you that these guys have been working hard to get 3.0 ready for full release, and there's a ton of new material there (in the examples) to learn from.

Placement of the PagingToolbar on a Grid

Fri, 22 May 2009 10:33:00 -0400

This morning I found I was courtesy copied by Ray Camden, on a reply that he was making to a message he had received from his Blog Contact form from Mike Knox. Mike was trying to find out if it was possible to place the PagingToolbar, used in cfgrid, at the top of the grid rather than the bottom. Ray had told Mike that he had Googled it and not found on obvious solution, and that he was CCing me for my feedback. Like any padawan, it's pretty humbling for me to be asked advice from the Jedi Master. I've been taking Ray's advice on ColdFusion since the 4.x days, so I try to be pretty diligent when he includes me in helping others with their queries. I've always held that the use of the CF Ajax components are primarily for rapid application prototyping. They are fantastic for putting up some very basic functionality, but when you need more advanced configuration it is then time to dig in, and go straight to Ext JS itself. Mike's question is a prime example of this. We have nearly no control over a cfgrid's configuration prior to render, and the configuration options that we do have (through the cfgrid and cfgridcolumn attributes) barely scratch the surface to what one can do with an Ext Grid. The PagingToolbar is a class object of Ext and, as such, you should be able to add it to any toolbar of a grid: top, bottom, or both. I fired up Eclipse, booted up my CF and Apache, and pulled up the Ext examples from my local copy of the latest 3.0 download. All of the examples that you can see in the Samples & Demos section of the Ext site are given to you in the download of the library, so that you can run them locally and pick them apart. So, my quest was on. I went to the Paging Grid Example, and examined the source code of the paging.js file. I quickly found the configuration object for the paging toolbar:


    var pagingBar = new Ext.PagingToolbar({
        pageSize: 25,
        store: store,
        displayInfo: true,
        displayMsg: 'Displaying topics {0} - {1} of {2}',
        emptyMsg: "No topics to display",
        
        items:[
            '-', {
            pressed: true,
            enableToggle:true,
            text: 'Show Preview',
            cls: 'x-btn-text-icon details',
            toggleHandler: function(btn, pressed){
                var view = grid.getView();
                view.showPreview = pressed;
                view.refresh();
            }
        }]
    });

The PagingToolbar instance is then applied to the Grid, placing the object in the 'bbar' (bottom bar) attribute:


        // paging bar on the bottom
        bbar: pagingBar

After seeing this in the online demo, I went to my local (3.0) demo to see if I could change it. The Ext team rewrote the demo for the upcoming 3.0 release, placing the instance initialization directly in the attribute:


        // paging bar on the bottom
        bbar: new Ext.PagingToolbar({
            pageSize: 25,
            store: store,
            displayInfo: true,
            displayMsg: 'Displaying topics {0} - {1} of {2}',
            emptyMsg: "No topics to display",
            items:[
                '-', {
                pressed: true,
                enableToggle:true,
                text: 'Show Preview',
                cls: 'x-btn-text-icon details',
                toggleHandler: function(btn, pressed){
                    var view = grid.getView();
                    view.showPreview = pressed;
                    view.refresh();
                }
            }]
        })

So, I changed 'bbar' to 'tbar' (top bar) and reloaded the page. Success! The PagingToolbar was now in the top toolbar of the Grid, and fully functional. After reviewing all of this, I decided to go a step further. Could you have two separate PagingToolbar configs on the grid? One at the top and one at the bottom? So, I tried this:


        // paging bar on the bottom
        bbar: new Ext.PagingToolbar({
            pageSize: 25,
            store: store,
            displayInfo: true,
            displayMsg: 'Displaying topics {0} - {1} of {2}',
            emptyMsg: "No topics to display",
            items:[
                '-', {
                pressed: true,
                enableToggle:true,
                text: 'Show Preview',
                cls: 'x-btn-text-icon details',
                toggleHandler: function(btn, pressed){
                    var view = grid.getView();
                    view.showPreview = pressed;
                    view.refresh();
                }
            }]
        }),
        // paging bar on the top
        tbar: new Ext.PagingToolbar({
            pageSize: 25,
            store: store,
            displayInfo: true,
            displayMsg: 'Displaying topics {0} - {1} of {2}',
            emptyMsg: "No topics to display",
            items:[
                '-', {
                pressed: true,
                enableToggle:true,
                text: 'Show Preview',
                cls: 'x-btn-text-icon details',
                toggleHandler: function(btn, pressed){
                    var view = grid.getView();
                    view.showPreview = pressed;
                    view.refresh();
                }
            }]
        })

That's part of what I love about development, I get to play, experiment, have some (geek) fun. After refreshing the page, I now had two toolbars, at both the top and bottom of the page. Both worked perfectly, and stayed in sync during paging. That's what I love about the Jack Slocum and the Ext Team, they think about things like having more than one paging bar and how they would need to stay in sync, and they've already written it in to the library. And so, on rare occasion, the student has the opportunity to become the master, though I'm sure there's still plenty more I can learn from Master Camden;)

CFQueryReader v1.1

Wed, 13 May 2009 14:08:00 -0400

A while back, Justin Carter contacted me about some updates he was making to the ColdExt, a wrapper for the Ext JS library for ColdFusion. He had been looking at my CFQueryReader, as a reader for ColdFusion's JSON data return, and had noticed that there was no support for the 'root' attribute that's associated with most JSON readers in Ext. CFQueryReader is specifically designed for use with Query objects of ColdFusion 8's native JSON return type. When I first wrote CFQueryReader, I was replacing the CFJsonReader with something better suited to the array structure used in the ColdFusion JSON return of a Query Object, and really did a one-for-one port. So, I took a deeper look at the issue Justin wanted resolved. I did a deep comparison of Ext's ArrayReader and JsonReader source code, following everything that was being accomplished. What I found was how it used an internal accessor method to pull certain information on demand. I was able to refactor the reader to now support all of the base level meta attributes that are currently available to the ArrayReader: id, root, successProperty, and totalProperty. In the previous version of CFQueryReader, when defining your fieldsets you were also required to uppercase the entire value of the column names. This is no longer a requirement either, although casing is important in identifying your 'root' and 'totalProperty' attributes. The download below includes the reader, as well as some sample code showing how to implement it. I also setup these sample in a subdomain to show it working (requires Firefox with Firebug for full effect). There is a fair amount of comment documentation directly within the CFQueryReader.js file. A big shout out to Justin, Adam Bellas, and a few others, for helping me out with the testing.