Wufoo Themes Revisited
January 4, 2008OK our wufoo-ifier is in a little better shape now. Improvements include:
- Theme preview — updates the Wufoo theme each time you select a new one from the dropdown
- Logo switcher — offers several icons to replace the “Wufoo” logo in the upper left hand corner.
- Multiple calendars — supports many date or date/time pop-up calendars on the same form
- Improved style for required fields — asterisks denoting Required fields now better match Wufoo’s style (still broken in Explorer)
- Better support for IE, Safari, and Opera
Just as an aside, I needed a way to dynamically generate a callback to Calendar.setup in a way that most browsers would support and AppJet came to the rescue in about 10 lines of code:
/* appjet:version 0.1 */
/* apject:server */
var qs = request.params;
response.setHeader('Content-type', 'text/javascript');
page.setMode("plain");
print(raw(
"""Calendar.setup({inputField : """ +
"\"" + qs.inputId + "\"" +
""", ifFormat : """ +
"\"" + qs.formatString + "\"" +
""", showsTime : true, button : """ +
"\"" + qs.buttonId + "\"" +
""", singleClick : true, step : 1});"""
));
Generating a callback with client-side JavaScript can go something like this:
//...
var queryString = '?inputId=' + escape(inputId) +
'&formatString=' + escape(formatString) +
'&buttonId=' + escape(buttonId) +
'&noCacheIE=' + escape(noCacheIE);
calScript.id = 'calendar-setup-' + jsonIds++;
calScript.src = 'http://calset.appjet.net/' + queryString;
calScript.type = 'text/javascript';
calScript.charset = 'utf-8';
// etc., etc..
No fuss, no muss. More on the woofuifier later.
