RSS feed for InstantSpot site Aaron Lynch

Combine and compress your javascript files: Scriptalizer.com

Thu, 10 Jul 2008 13:37:00 GMT

After creating a custom tag and minifier component (using YUICompressor) I decided it would be a pretty neat service to offer to everybody. Last night I scrounged up a website and called it Scriptalizer.com.

If you want to test what cf_scriptalizer does to your javascript before you actually use the tag, you can try out the generated script provided by Scriptalizer.com.

NOTE: All source files uploaded is immediately deleted once generated.

Problem: WAY too many javascript files. Solution: cf_scriptalizer

Wed, 09 Jul 2008 15:44:00 GMT

Information about a custom tag to combine and compress javascript files.

Making progress with GIMP

Tue, 29 Jan 2008 20:07:00 GMT

I ran across a tutorial on how to create "Vista" like buttons with GIMP. If you have ever tried to use GIMP to do anything, you know how much different it is than most other graphics editors out there. For the longest time I just thought it was just terrible...but that was before I found some examples on how to use it.

I'm happy to report that by following along with this tutorial (read it here) that I was able to duplicate these buttons. Ok, so GIMP might not be so bad...what else does it do?

I then dug some more and found another cool tutorial on created "old" photos.

Once again...success! I got reallly close on this one, with a pic of my son. In this tutorial (read it here), I realized that there is a whole world of add-ons for GIMP. Some brushes from here were used to create the distressed looking scratches on the image.

For more GIMP Tutorials, you can check out gimp-turorials.net

Peter Bell For Dummies : DSLs, Application Generation, and more.

Mon, 02 Jul 2007 13:10:42 GMT

Ok, so I need to get something off my chest. Reading Peter Bell (and now that I finally met him in person, listening to him) makes me feel a little dumb sometimes. I can clearly understand that he is speaking English, but sometimes it feels that I must have just skipped that day in word-learning class.

I have been intrigued by his application generation topics since he first started blogging just over a year ago, and until recently it was more of a mystical fantasy world that only Peter Bell had access to. Now, hopefully I am not too far off target in my understanding but I think things are beginning to sink in and light bulbs are beginning to click on in my head.

DSLs
Domain Specific Language? What the heck?! Just when I thought I was getting a handle on more advanced topics in CF, people (not just Peter by the way) have to start kicking this one around. The way I understand it, DSLs are a way to describe, lets say, your model. In other words, we should be able to describe the objects in our system without introducing the specifics of how this code will look in whatever language your application is generated in (ha! I am talking about generating applications).

Basically this concepts aids in separating What you mean, from how you say it.

For example: Lets say we want a Person object, and for this example I will use XML to write the DSL.
    <objects>
        <object name=”Person”>
            <attributes>
                <attribute name=”FirstName”>
                    <length value = “50”/>
                    <type value = “varchar”/>
                    <default value = “”/>
                </attribute>
                <attribute name=”LastName”>
                    <length value = “50”/>
                    <type value = “varchar”/>
                    <default value = “”/>
                </attribute>
                <attribute name=”DateTimeUpdated”>
                    <length value = “”/>
                    <type value = “datetime”/>
                    <default value = “Now”/>
                </attribute>
            </attributes>
            <relationships>
                <relationship name=”Group”>
                    <type value = ”OneToMany”/>
                    <key value = “GroupId”/>
                </relationship>
            </relationships>
        </object>
    </objects>

Now, obviously this is very simple and just written on the fly (literally...I am on an airplane right now), but it should show that we are describing things about this Person object without saying anything about a programming language that will eventually be used.
This example might look slightly familiar if you have used any of the ORM frameworks, that is because their configuration files are a good example of a DSL.

So, Ok I have an XML document that details every last object in my system, so what? Well, one thing that I know I lose sight of is that there are other programming languages out there in this world (or so I've heard) and we may want to document our model language agnostic, so that if we ever need to generate this application in some other, more inferior, language we could.

Two things that this application generator are going to do is:

Create the model - in our case the bean, DAO, gateway, service. In my case, it would be all CFC's, but what if you wanted Ruby or .Net or ____.
Generate database creation scripts. Another good example of why we want to create generic documentation about our objects. We will need to create different db scripts based on the DBRMS of our choice.

Hopefully I am not dumbing this down too much, but I am positive I am still missing some of the major concepts that Peter Bell has been laying down on this topic. But I think the general idea, is that we create this meta-data about our objects and then use that information to generate code/db scripts/etc using our “Translators” “Generators” etc for our specific needs or language.

So, to extend just our basic model, table creation concepts. Lets say we now need to document functionality in a way that avoids being language specific.

Maybe as part of our object definitions we might have a functions node:
    <object name=”Person”>
        <attributes>
            <attribute />
        </attributes>
        <methods>
            <method name=”Authenticate”>
                <validate attribute=”Firstname”/>
                <validate attribute=”LastName”/>
            </method>
        </methods>
    </object>

(Obviously we probably wouldn't need a way to authenticate a Person by their first and last name, but I just stayed with the same object we talked about above. )

So, in this case could assume that we translate this new optional method node and create a method in our PersonService.cfc perhaps called “AuthenticatePerson” or maybe just “Authenticate” whatever. If you decide to read up on Peter's stuff on extending a Base class, we could use a generic method called “authenticate” and since we are passing in the things to validate against, it would be easy to create a generic Authenticate method.

If you want to find out more on this topic, be sure to check out Peter Bell's Blog on Application Generation.

Transparent images with CSS

Thu, 24 May 2007 16:10:16 GMT

I have seen style="opacity:so and so" etc in a few places, but never really took the time to look into it. But I just recently looked into it a little further and I am pretty wowed with how cool this 'little' style attribute is

Basically, we have the ability to take an image, text, (maybe other stuff that I don't know about) and change its opacity via CSS.

Opacity values range from 0 to 1. 1 being fully opaque, 0 being transparent. So I guess the comparison would go 25% Opaque = 75% Transparent.

In order for this to work in IE, I had to add filter:alpha(opacity=75) in addition to the opacity:.75 style attribute.

Examples...

Code used to create the example:

[codeShare maya81c7]

NOTE: I have not yet used this other than to create this blog post since I thought it was "awesome". I have no idea about other browser's support of this attribute.

Keep your users on your page. window.onbeforeunload

Thu, 29 Mar 2007 18:50:52 GMT

Here at the day job we have a very large mortgage loan application form that, now that we have rewritten it, makes AJAX calls to the bean onChange of each field.

These calls are made asynchronously, which means the user really has no idea that the post is being performed. (unless they happen to be watching their firebug console) But, if they ever decided to log out, click on some other link, close their tab, etc...any data being posted at that time could (and probably would) be lost forever.

The challenge: Make sure the users don't leave the page, or submit the application mid AJAX post.

Now, there is no real way to lock a user to the computer and make them wait until the saves are completed. But we can monitor the state of the AJAX request and, based off of that, decide whether or not to alert the user that they shouldn't leave the page.

The solution: (well part of it anyways) window.onbeforeunload

Now, as part of the AJAX call we monitor the readystate and look for a '4' value. A value of 4 represents a completed request. (here are the readyState status codes)

[codeshare mar506b7]

As we monitor the readyState and watch for that '4', we flag a variable I called 'completionIndicator'. False on the initial AJAX request, set to True ones a readyState of 4 is returned.

Now that we know whats going on with AJAX, we can decide whether or not to "lock" the user to the form. What I came up with was the use of window.onbeforeunload which is used to execute statements whenever the user exits the document.

So, anytime the users tries to exit the document, we run a method I called checkProgressState(). There I conditionally return a message to window.onbeforeunload. If nothing is returned, no message (confirmation window) will be displayed.

[codeshare marda376]

You will notice I am return a string in that call. If you return a message to window.onbeforeunload it will insert the text between to two default messages on the confirmation box.

All done right?... Um, no. Now we have to deal with Internet Explorer. (dear bill gates, please stop making my job harder)

Our super cool AJAX'y mortgage loan application form is a super huge form. All said and done there are now 9 tabs full of questions which we swap in and out all client-side, cool right? Not if you ask Mr. Gates.

Each of our tabs has an anchor tag which fires a few routines onclick to swap out the current content, with the desired tab's form content. And luckily for me, IE (both 6 and 7) treated that as a page exit and would thus fire the window.onbeforeunload stuff I had working so sweetly in Firefox.

Hey, I like challenges: What can we do to stop IE from being so IE about this?

In order to stop IE from running my "Are you sure you want to leave.?!" stuff each tab click, I had to flag a new variable that would allow me to turn on and off the function from above. So onclick of a tab, we set a new variable I called 'checkProgressFlag' to FALSE, then once my new tab/content were done swapping, set the value back to TRUE.

[codeshare mard6b4b]

Now all of our users filling out the application will at least be warned about why they shouldn't leave just quite yet.

InstantSpot...why have I forsaken thee?!

Fri, 09 Mar 2007 16:14:23 GMT

Ok, not really forsaken...but all of my "fun" development has really suffered lately. Unfortunately InstantSpot is not my full time job (yet!), and as such the whole "work" thing kinda absorbs my time/energy/brain/etc :).

We (we at the day job) just rolled the application we have been grinding out so hopefully my brain will have a little bit of juice left at the end of the day now.

We (the good we this time :)) should be rolling a new InstantSpot spin-off site in the very near future leveraging a great deal of the InstantSpot "framework" for lack of a better term.

Thanks to Todd Sharp of cfsilence for this blurb... "InstantSpot is a next generation Social Blogging/Networking site - but it's not just a profile page or a blog - it's much more. InstantSpot is a completely free entire website for you and your family/friends. You can blog, interact with your friends via messaging, post photo galleries, manage an online calendar, even customize the look and feel of your Spot via the Style Manager. Don't know CSS? No problem! Head over to the InstantSpot Design Exchange at http://www.isdx.net and check out some of the cool custom CSS templates that our users have uploaded. There's a growing library of templates to choose from, and if you sign up at ISDX you can even preview any of the designs live on your Spot before taking the plunge and installing it."

3 ways to become a better _______ (programmer)

Tue, 09 Jan 2007 13:50:51 GMT

1. Love what you do: I put this as the #1 thing you must do if you want to really increase your skillset. If you are just trying to do it for your job, or to get a raise, then I don't know the answer for you. But this is THE essential ingredient in this process.

2. Do a lot of it: This one is probably the most difficult one of the bunch. Nobody really wants to sacrifice their free time or miss their favorite TV show. But, there is just no replacement for experience. If you are new to ColdFusion don't worry...there are a lot of "experienced" developers out there who just mail it in on a daily basis. Give yourself 6 months of intense programming and you will begin to feel like not such a noob after all.

3. Finally, do to the hard stuff: Pretty soon (after step 2) things are going to start feeling easy. At this point, many people will plateau and just stop progressing past their comfort level. And for many, this is fine and might actually be a very advanced level. I know I am guilty of not always pushing myself because I am (insert excuse here).

My #3 stuff: I hope to get my hands dirty with Flex this year, and continue to sharpen my Javascript skills.

IE7 caching dynamic XML (for use with SPRY)

Fri, 05 Jan 2007 14:18:57 GMT

I have only used Spry a few times so this might be a common issue. I have recently started doing the cross-browser testing for this latest code, I noticed that IE7 is caching the XML I am generating for my Spry datasources. I even tried using the whole cfheader no-cache routine...

What I ended up doing to prevent this from happening was to append the tickCount to the XML call as such: var MySpryDS = new Spry.Data.XMLDataSet(""/index.cfm/event/Data.xml/#getTickCount()#"", ""loanapps/loanapp"");

Is there any better trick to prevent IE from being so "IE" about this?

One super easy way to improve user feel

Thu, 28 Dec 2006 22:10:52 GMT

Lately I have been developing a ton of user control panels and I have started using a very simple technique to improve the user's impression of said control panel.

(Note: This is by no means a technological breakthrough, but it happens to create a really nice feel as you click through the app.)

The most recent administrative control panel I have developed makes use of this technique and it, in my opinion, does a really nice job of adding some perceived quickness/responsiveness on some events that do a lot of crunching behind the scenes.

Basically in the main template page-view (using Mach-II here), where I would normally output the contentArg of the page's content, I have a swappable div there along with an AJAX loading gif image.

   Loading...

     #event.getArg("bodycontent")#

So, on any click within the control panel, I do an onclick event to swap the two divs. This gives the impression of immediate response to my action (the click).

Edit Rates

Robots and main page accessibility

Tue, 15 Nov 2005 06:00:00 GMT

On my quest towards e-stardom (aka a relevant and content-rich website), I realized that the navigation towards my older "news items" was somewhat lacking. My solution for this problem was to create a side bar menu that would contain all of the news item titles in descending date order (aka newest first).

A day or two after this change, I began to notice a positive side-effect to including all of these titles as links on the main page...The robots (spiders) were crawling all through my site! I'm not 100% sure, but I can't imagine how this increased indexing would hurt my chances of being returned in some search results.

In a possibly related subject, a Google search for 'Aaron Lynch' now returns this page in the top 10 search results (#6 as of this entry) and an MSN search returns www.AaronJLynch.com as #3!

Does anybody want my autograph?

UPDATE 1/25/06: Either Google has changed my ranking somehow, or my switch to BlogCFC has harmed my accessibility somehow. I now turn up on like page 5 or something terrible. Back to the drawing board!