To extend the White Paper Bible site, I asked Kerry Layton to design a calendar for the Advent season. You can view it here: http://www.whitepaperbible.org/advent.

Initially I was thinking Advent Sausage (http://lovelypackage.com/konecke-advent-sausage/), but I’m glad Kerry designed a beautiful, clean calendar. Kerry, btw, loves to design calendars and you can see some of his work over at Design Audit (http://www.designaudit.net).

I only had a few days to pull it together. Like everything else, it was a last minute idea. I wanted simple, feature Bible passages relevant to Advent, and a cool reveal animation.

So, I went on the hunt. First up, what in the world is Advent and what does that have to do with an Advent Calendar?! I’m not overly religious in the liturgical sense, so Wikipedia to the rescue.

Advent: http://en.wikipedia.org/wiki/Advent
Advent Calendar: http://en.wikipedia.org/wiki/Advent_calendar

To do the flip animation I new I wanted jQuery. I needed to both flip and resize the tile to display the passage. I found a bunch of stuff out there, but the one that really did the trick is the Flip! jQuery plugin found here: http://lab.smashup.it/flip/.

The recipe for the flip plus the scale I found over on the Work [at] Play blog: http://think.workatplay.com/content/workatplaycom-how-it-was-made-flip-and-scale-effect. Great stuff!

As I added the content, I either needed to add a scrollbar or let the content run. The scrollbar proved to be the best solution, so I went with my favorite, the jScrollPane plugin (http://www.kelvinluck.com/assets/jquery/jScrollPane/jScrollPane.html). Make sure to use the source on Google code (http://code.google.com/p/jscrollpane/) or the examples. The ZIP file is somewhat outdated. For adding mousescroll functionality, I use the same plugin posted with the jScrollPane examples, but the updated version at http://plugins.jquery.com/project/mousewheel.

I should also mention that this site is Ruby on Rails, and the advent calendar is really just a static html. The way I implemented this is using my Pages controller which serves up the less dynamic content on the site (like the About page). I added a route for /advent and then put all my advent specific assets (js, css, images) into public/advent to keep things a bit cleaner. I could probably keep the js all together with my core js files. Then in my view/advent.html I updated all the asset references to pull from the /advent sub dir. Merging static content into a Rails app isn’t really hard, it’s just that Rails developers like do know the right or approved way, and there doesn’t seem to be much consensus on that for static content. If you have a better way, let me know.

And that’s about it. Checkout the final result (well…final until I think of something to enhance it). http://www.whitepaperbible.org/advent.

Enjoy.

import fl.motion.easing.*;
import com.gskinner.motion.GTweenFilter;
import com.gskinner.motion.GTween;
 
var coltw:GTween = new GTween(foo.transform.colorTransform, 4, { redOffset:255, greenOffset:0, blueOffset:0 }, { ease:Circular.easeOut } );
coltw.setAssignment(foo.transform, "colorTransform");
 

GTween: http://gskinner.com/libraries/gtween/
FLA: http://www.davidortinau.com/exhibits/gtween_color/colorTransform.fla

In addition to a Date Range Validator control for a recent project, I also need to compare to user input fields for confirm email address and confirm password. Since I’d just extended the DateValidator, I figured the same approach would work for comparing two controls.

Class: FieldComparisonValidator.as

Disclosure: this was evidently something Adobe Consulting had in their bag of tricks for Flex 2, but namespaces had changes and the code I found burried in a mailing list didn’t work. I made some quick updates to what I saw there, and this works fine for comparing mx:TextInput.

To see how the entire form validation plays out in my forms, check out the previous post How to Validate a Date Range in Flex.

To validator implemntation is:

<validators:FieldComparisonValidator id="valConfirmEmail" source="{txtEmailAddressConfirm}" property="text" destination="{txtEmailAddress}" destinationProperty="text" required="true" />

I’ll be using this thing aplenty, so if it breaks down I’ll be sure to update it. If you have a better validator for this scenario, or an improvement, please let me know.

I had the need to validate a date based on a range of allowed dates, and I couldn’t find this validation control anywhere for Flex. The reason is probably because it’s just so easy to write.

The solution is to write a custom validator that extends DateValidator, pass in the start and end dates, and then perform the validation. This way I can benefit from the nice inline validation Flex gives us.

The actual validation code to compare dates is based on the Date.parse() which you can see in the class code.

The class: DateRangeValidator.as

In my form I’ve been using a form validator that checks all the validation controls in the array and when it’s all good enables the form button. The Flex code for my form looks basically like this:

<mx:Form>
... other fields ...
            <mx:FormItem label="Date of Birth" required="true" labelStyleName="fieldLabel">
	    	<mx:DateField disabledRanges="{[ {rangeStart: new Date(1988,0,1), rangeEnd: new Date(2025,11,30)} ]}" id="dateOfBirth" yearNavigationEnabled="true" editable="true" formatString="MM/DD/YYYY" minYear="1900" maxYear="1988" change="this.formValidator.validateForm(event);"/>
	    </mx:FormItem>
... other fields ...
            <mx:FormItem horizontalAlign="right" width="349">
	    	<mx:Button id="btnSubmit" click="submit()" label="NEXT"
				enabled="{this.formValidator.formIsValid}" />
	    </mx:FormItem>
</mx:Form>

Then I have my array of validators:

<mx:Array id="validators">
... some validators ...
	<validators:DateRangeValidator id="valDateRange" source="{dateOfBirth}" property="text" StartDate="{new Date(1900,0,1)}" EndDate="{new Date(1988,0,1)}" required="true"/>
</mx:Array>

And the custom form validator that checks all fields to make sure it’s all valid before enabling the button. For more info on this, check out this article and code from Joel Hooks.

<validators:FormValidator id="formValidator" validators="{this.validators}"/>

And that’s it. I hope this saves someone a little time. If you have any comments or improvements, please let me know.

My first 360|Flex experience began Monday morning with Mike Labriola (@mlabriola, slides) stalking back and forth in front of a standing room only crowd. Shirt un-tucked, one hand thrust into a pocket he held a goblet of water in the other from which he alternately took sips and gestured to his listeners. Delivering his best Sean Astin, Mike transformed the room into his private cigar study. We were all in audience to savor his cognac and digest the divine merits of unit testing Flex applications.

“Welcome to 360|Flex,” I thought. The session was fantastic and Mike was entertaining all the way through the final “ok, get out of here” as he waved his empty goblet and turned his back.

Bookend that session with my final session Wednesday afternoon on Design Patterns delivered by Yakov Fain (@yfain). I whispered to @dmatchack sitting in front of me, “I hope we finally talk about something over than MVC”. He said, “no kidding” and chuckled.

What we received in the next 1 hr and 20 minutes was a much more than that.

Though likely not the whole story on Yakov, I left with the distinct impression that Yakov HATES Cairngorm and PureMVC (mate didn’t garner a sneer) in favor of implementing good design patterns in a more appropriate manner. Yakov gave away a book to an attendee, “though I’m not really satisfied with that answer”. Halfway through the session we were treated to a gratuitous (though clean) slide of Angelina Jolie. The half filled room erupted in laughter and applause.

I attended as many non-developer related sessions as were of interest to me. This strategy yielded my favorite sessions from the conference:

Joe Johnston (@merhl)
FLEXperience - Putting the Flex in UX
http://www.slideshare.net/merhl/flexperience

Francisco Inchauste (@iamfinch)
RIA Mojo - Making Your Flex Application Stand Out with a Great UX
http://www.davidortinau.com/presos/RIA_Mojo.pdf

Joe Olsen (@joeolsen, @phenomblue)
Creativity is the Fuel, Process is the Engine: Building a Scalable Interactive Production Environment

All said, it was a great 3 days of meeting or at least experiencing great people (@jprevel, @randytroppmann, @lordb8r, @kremdela, @visualrinse, http://coenraets.org/), learning a new tip here and there, and overall being reminded why I do what I do building interactive experiences.

Thanks to @lordbron and @jwilker and everyone else that made this a great conference.

I’ve been seeing quite a few blogs and tweets lately about the church’s struggle between relevance and message. This topic is at the forefront of many minds perhaps in response to the recent national chatter about churches experimenting with Twitter and other social technologies.

That’s the connection I see anyway, but I’m sure it runs deeper to a larger discussion of the emerging and emergent church movements.

Whether it’s maintaining cultural relevance or implementing some crazy new social media technology, the question needs to first be “why?” If you don’t know why you’re attempting to be relevant (some people just don’t give a hoot), and you don’t know why you’re evangelizing your church for Twitter, then you’re operating at the behest of an agenda not your own. Someone’s advertising is working on you.

Romans 12:2 ESV
Do not be conformed to this world, but be transformed by the renewal of your mind, that by testing you may discern what is the will of God, what is good and acceptable and perfect.

Brad Abare of churchmarketingsucks.com has some good comments in a recent Advertising Age article “Churches Get Religion on Marketing”. The winning quote for me, though, goes to United Methodist Church General Secretary Rev. Larry Hollon: “Advertising makes a promise, and if you live up to that promise with integrity, that’s as much as you can do.”

Craig Groeschel
Cool is No Longer Cool
http://swerve.lifechurch.tv/2009/05/13/cool-is-no-longer-cool/

Jonathan Foster
Medium is the Message
http://discoverj.blogspot.com/2009/04/medium-is-message.html

the same blog post got a new title (The Failure of Church Marketing) and re-posted here:
http://church.wrecked.org/?filename=the-failure-of-church-marketing

And that article was picked up here and there with some commentary:

Catalyst - The Failure of Church Marketing
http://www.catalystspace.com/catablog/full/the_failure_of_church_marketing/

Church Marketing Sucks
http://www.churchmarketingsucks.com/archives/2009/05/the_failure_of.html

Mark Driscoll
Vintage Church: How Can a Church Utilize Technology
http://theresurgence.com/Vintage-Church-How-Can-a-Church-Utilize-Technology

A recent Twitter exchange between @DavidAndGoliath and @tonymorganlive:

DavidAndGoliath says:
@tonymorganlive Faith isn’t a product. Stop trying to sell it like it’s McDs. 5:02 PM May 10th

tonymorganlive says:
@DavidAndGoliath so do you think we should keep our faith to ourselves? (just trying to understand your perspective.) 5:04 PM May 10th

DavidAndGoliath says:
@TonyMorganLive No, of course not. But orgs. are increasing the box size and reducing the content in order to market2masses. 5:12 PM May 10th

tonymorganlive says:
@DavidAndGoliath maybe some are. but the Gospel leads to life change which leads to people spreading that good news. that’s “marketing.” 5:31 PM May 10th