Contact Doug!
Learn About Doug!
View Doug Boude's online resume
updated 11/18/2009

View Doug Boude's profile on LinkedIn
Link to me!

Follow Doug Boude on Twitter
Follow me!

Be Doug's friend on Facebook
Befriend me!
(I promise not to follow you home)
OO Lexicon
Chat with Doug!
Recent Entries
You may also be interested in...
Florida web site design



Czech your Page Rank!
Check Page Rank of any web site pages instantly:
This free page rank checking tool is powered by Page Rank Checker service
Surf's Up!
Visit Egosurf.org and massage YOUR web ego!
My Score: 9,001
Doug's Books

Read (and recommend)

  • Men are from Mars, Women are from Venus
  • The Wisdom of Crowds: Why the Many Are Smarter Than the Few and How Collective Wisdom Shapes Business, Economies, Societies and Nations
  • Blink: The Power of Thinking Without Thinking
  • Head First Design Patterns
  • Transact-SQL Programming
  • What's So Amazing About Grace?
  • Just So Stories (Rudyard Kipling collection)

Reading

  • Prayer: Does it Make Any Difference?
  • Data Mining (Practical Machine Learning Tools and Techniques)
<< March, 2010 >>
SMTWTFS
123456
78910111213
14151617181920
21222324252627
28293031
Search Blog

Recent Comments
Categories
Archives
Photo Albums
Funnies (5)
Family (3)
RSS

Powered by
BlogCFM v1.11

23 February 2010
Real World Benefits of Encapsulation
I, as most if not all of you do, realize that to do any new development and NOT encapsulate my code would border on absurdity and I would be painting myself into a very narrow corner with regard to maintenance and future project expansion. This post, however, is focused on those projects where you are thrown headlong into an existing codebase that is not based, even loosely, on any kind of object oriented principles, has little to no rhyme nor reason to its architecture, and yet you are tasked with making functional modifications to it without breaking it. A little like playing "pick up sticks", right? Good luck with that! But, by leveraging encapsulation, I was able to accomplish just such a task with relative ease.

For those who may not know, encapsulation is a term that means exactly what it says: containment and separation. Remember those plastic easter eggs that you put things inside as a kid? Whatever you put in there, be it a toy, candy, grasshopper, or whatever, immediately became encapsulated, separated from and unaffected by anything outside of itself (barring direct sunlight, but we'll assume your code will never be subjected to that).

It isn't difficult to port such a definition over to the programmer's world, as we soon learn that by encapsulating specific types of functionality, we can re-use and even share code, thus preventing us from having to waste time re-creating work. In the real world, however, as is often the case, theory doesn't always mesh well with reality. Due to time constraints, lack of experience, laziness, or the inability or lack of authority to modify certain aspects of existing codebases, we very often do not implement encapsulation as we could and should. In a recent project of mine involving an older codebase, the absolute benefits of encapsulation became more than apparent, so I thought I would share the experience.


The task was to modify the import process in the administrative area of a large, "pre-Object Oriented" CMS (which was now living on a ColdFusion 7, "Obect Oriented-friendly" server). In order to minimize the invasiveness of the surgery I was about to perform, I wrote a CFC/class to handle all of the major work, the plan being to isolate the individual switch statement in the thousand line template responsible for the old import process and inject my modifications there and there only. The import process was no simple task, either, and it took a LOT of trial and error to get my code solidified to account for all possible anomolies. But, by encapsulating all of the new functionality in a CFC, I was able to write a quick and dirty test template that utilized my CFC to perform the test imports in isolation from the rest of this app, thus ensuring that all of my code mods, hacks, dumps, and random outputs had NO impact whatsoever on the live app. Once I had my test imports running successfully, complete with statistics being compiled and code written to properly output those stats, all I had to do was drop the relevant portions of my test template into the live app, make sure I had a fast and bullet proof rollback strategy in case something went awry (ALWAYS have a rollback strategy...never trust your own code), and run one final test with my CFC implanted in the live app. Yes, the app I had to modify had no test or qa server; I had to operate directly on the live patient, with no anesthetic.

So, even though you may be often called upon to perform mods to existing, older codebases, if the app lives in an environment conducive to Object Oriented approaches (or even if it doesn't! Don't forget about the ability to encapsulate via Includes if you must!), your path of least potential fallout, self-documentation, and future modifications made easy, is to heavily leverage encapsulation.
Posted by dougboude at 11:46 AM | PRINT THIS POST! | Link | 1 comment



19 February 2010
Registered Ajax Responders Not Responding Properly
Ajax Fundamentals
If you use the Prototype Javascript library and you chain your Ajax calls together at times, you may have run into the issue that I just dealt with regarding your registered responders not responding correctly! Since I spent more time than I care to share trying to figure out why my global responders weren't working like I thought they should, I thought I'd share what I learned. Hope it saves somebody some time! :)

Prelude

You may not be familiar with some of the terms I have used already, or some that I will use. If you feel you already have a good grasp on the lexicon surrounding Ajax and JS libraries, skip ahead to The Scenario; but if not, then allow me to clear up some of the fog before we press on. Please excuse me if I spend time on things that you may feel are "common knowledge", but in my experience there really is no such thing and I want to make sure every reader is thinking in the same context.

The Basic Nutshell of Ajax Chaining

In Prototype and other similar libraries, an Ajax call is typically of one of two flavors: simple request, and an update request.

Simple Requests

A simple request is one in which you ask your JS to make an http call to the server and hand you back the results that were delivered, whatever they be. At that point you will have written more Javascript to actually deal with those results manually. For example, let's say you display a select list containing possible food categories to your user. When the user selects a category, an Ajax request is made passing in the selected category, and a JSON representation of a record set containing foods in that category is returned. That JSON object is handed off to another function you wrote which will 'walk' through the foods and populate yet another select list with the specific items.

Update Requests

An update request is one in which you are asking your JS to make an http call to the server and stuff the results, whatever they be, directly into a DOM element (a DIV tag, a SPAN tag, etc.). Let's make a slight change to the example cited above. In this scenario, we already have a DIV tag in our html that we have designated as the place where our select list should appear. So, instead of having our server code return a raw JSON representation of the data, we write our server code to produce the HTML for the fully populated select list ("<select name='selFoods'><option value='1'>Crescent Rolls</option><option value='2'>Dog Biscuits</option>....</select>"). It is this string that our Ajax call receives, and this returned value is stuffed directly in to the DIV tag we designated as the recipient. Make sense?

Registering Responders

It is quite typical (and useful) to show to your users some kind of "working" image to indicate that the Ajax call is in progress. We may also wish to disable certain items on the user interface while calls are in progress, or overlay an opaque div to prevent the user from clicking anything. The thing we want to do and/or display while an Ajax call is in progress is what we refer to as our "Responder". Within our Javascript, we will tell our library something along the lines of "hey, anytime an Ajax call is created (started), I want you to do this; and anytime you see an Ajax call finish, I want you to do this". The act of telling our library what we want to happen automatically regardless of the Ajax call is called "registering responders". You define (register) them one time, and they just work. :)

Why Would I Ever Want to Chain My Calls?

I'm glad I asked! Let me just give you a working example to help illustrate why we might do this on occasion, and how we do it.
In my application, I am allowing a user to upload a data file. When the upload of the file is complete, I then need to kick off a series of things to occur, and I want to update a DIV with the current status of each call as they happen. The first call is to validate the uploaded file, so I write an Ajax simple request that tells the server where the file was uploaded and what kind of file it is supposed to be. This call will either return a true or false, depending on whether the file passed or not. If it failed, I want to tell the user that the file was bogus and cease any further processing. If it passed, I want to kick off another Ajax simple request that tells my app to go ahead and proceed with step 1 of the file processing. That call will return success or failure along with status messages, and then will kick off the third step in the processing.

Now, the way we "connect", or "chain" these calls together is by taking advantage of the fact that our library knows when a call is finished. When we write the JS for call 1, we tell it "when you receive a response from the server, pass that response on to Call 2 for evaluation". Call 2 is written to check the success status, and if all is well will make an Ajax simple request which itself has been told to pass its results on to Call 3. Here's an abbreviated example of what I'm talking about (some code ommitted for brevity):

function Call1(){
   new Ajax.Request(validateUploadURL,{parameters:params,method:'post',onSuccess:Call2});
}

function Call2(response){
   var objRetval = response.responseJSON;
   if(!objRetval.success){
        $('status').update(objRetval.msg);
        return;
   } else {//call successful! carry on
     new Ajax.Request(fileProcess1URL,{parameters:params,method:'post',onSuccess:Call3});
   }
  
}

function Call3(response){
   var objRetval = response.responseJSON;
   if(!objRetval.success){
        $('status').update(objRetval.msg);
        return;
   } else {//call successful! carry on
     new Ajax.Request(fileProcess2URL,{parameters:params,method:'post',onSuccess:TheEnd});
   }
  
}

function TheEnd(response){
  var objRetval = response.responseJSON;
  $('status').update(objRetval.msg);
}

See how they're all connected? Chain Chain Chaaaaaaainnnnnn... yeah.

The Scenario

In my scenario, I have a file upload process that is composed of three different Ajax requests, all chained together in a conditional, synchronous fashion (I know there are other ways to approach it, but this is the one that fit my needs the best). I have registered global responders to show/hide an animated spinner to indicate when a request has started and finished (I 'show' it when the request starts, I 'hide' it when its finished). Now, in my mind, these global responders should toggle that gif every time a request starts or stops, so in this scenario, it should show/hide three different times. But, that isn't how it worked. The gif would show during the initial call, and hide after that call was finished; Then it never showed again, despite the fact that there were multiple additional calls made! Here is how I registered my responders:

    Ajax.Responders.register({
          onCreate: function() {
            showUploadWorking();
          },
          onComplete: function() {
            hideUploadWorking();
          }
        });


After much experimentation, it occurred to me that perhaps even though the responder was global, maybe I needed to be concerned with manually 'watching' the active request count variable. I don't understand why I SHOULD have to, but that did turn out to be the solution. Here is the properly working responder registrations:

    Ajax.Responders.register({
          onCreate: function() {
            showUploadWorking();
          },
          onComplete: function() {
              if(Ajax.activeRequestCount == 0){
                  hideUploadWorking();
              }
          }
        });

Notice the only difference is in the onComplete function...I am 'watching' the activeRequestCount variable (which as you may have guessed is simply a counter telling us how many requests are currently not yet finished) and conditionally hiding my responder.

Doug out :0)
Posted by dougboude at 11:20 AM | PRINT THIS POST! | Link | 1 comment