A Google App Engine Prototype

This is a simple address book application written in Python and implemented via Google App Engine. I wanted to try something basic to get a feel for the Google App Engine development experience. I uses Googles web framework “webapp” and implements the Datastore and Users services.
http://kontactable.appspot.com/

Simple Entity Converter

An online tool to convert between extended characters, named entities and numbered entities. I found this tool helpful when working with large amounts of HTML content used within XML files (JSF/Facelet templates in my case). I decided to put a little polish on it and post it up for others.
http://www.lroot.com/tools/simple-entity-converter/

Zend Framework Exception Formatter

Handles the the formatting and display of exceptions thrown within the Zend Framework. This code came about by my frustration with the standard exception dump that PHP provides. I finally decided to take some time and pretty things up a bit.
http://code.google.com/p/zend-framework-exception-formatter/

PICX

PICX is a PHP based system for creating dynamic images using standard XML and CSS. It was a concept that I had been kicking around for awhile and began to flesh out a prototype. After implementing the initial class structure and getting basic image generating to work with custom fonts, I haven’t had a chance to take it much farther. Perhaps Ill get back to it at some point.
http://code.google.com/p/picx/

Mazda Mexico Configurator

An Ajax based configurator which also supports a dynamically updated print layout. It was implemented using Prototype, Scriptactulous and a custom built JavaScript package manager. I also had the opportunity to develop the supporting REST based web service definition (the URI specification and resource schema). The actual implementation was done by a proper Java engineer.

Configurator: http://www.mazdamexico.com.mx/mexico/configura/mazda3-sedan
Web service: http://www.mazdamexico.com.mx/webservices/mx/vehicles/current/m3s

Mazda Mexico Media Gallery

A picture and video gallery which uses a progressive enhancement approach to providing interactivity. View source and notice that it’s simply a list of HTML links that any rudimentary browser can use and that any search engine can index. Prototype is used to tie into the custom ‘dom:load’ and reformat the page into a interactive tabbed system.
http://www.mazdamexico.com.mx/mexico/mazda3-sedan/galeria

“spotlight” search prototype

The following is a functional prototype demonstrating the UI of a proposed web-based “spotlight” style search tool. It uses Ajax to send the query to multiple search providers and attempts to display the result in near-real-time. Users can use both the mouse and keyboard (try the arrow keys) to interact with it. Currently the back-end is returning fake data. It is implemented as a custom Dojo widget.
http://beta.lroot.net/poc_search.shtml

“smartimage” widget prototype

This is a functional prototype demonstrating how we could solve the common SEO issues that developers encounter when implementing tradition Ajax solutions. It leverages the concepts of microformats and embeds all the data that would normally be fetched via an XMLHttpRequest in the page itself, using standard HTML markup (view source and notice the data within the <ol class=”nnaData”> tag). A JavaScript based data accessor was created to query the page for content and return it as an object. The examples here show how a “smartimage” widget would utilize this system. The smart image is a traditional image with a small utility dynamically overlayed in the corner which, when activated by the user, displays further info about the car depicted in the image. It is built as a custom written dojo widget and supports the idea of Progressive Enhancement by using standard markup so that down-level browsers will see the image while up-level browsers will receive the advanced functionality.
http://www.lroot.net/_test/smartimage/test_smartimage.html

Client-side A/B testing framework

An A/B testing framework written in JavaScript. One of its main goals is to implement A/B tests without requiring developers to modify any page code to implement the tests. It uses XHR to dynamically load page fragments and replace portions of the page via the DOM.

The following is a link to a test page with no tests running. Notice the large image that is being loaded in the lower right. It is used to delay the onload event of the page so that a new DOM loading technique can be tested. This new technique allows content to be replaced almost instantly, imperceptible 99% of the time.
http://www.lroot.net/_test/abTesting/test_no_test.html

The following is a link to the test page where we are swapping out the content in the the gray box on the left. Hit reload or Enter on the URL to refresh the page and see the content change. Notice that this is a static HTML page, the underlying HTML code never changes. Its all JavaScript.
http://www.lroot.net/_test/abTesting/test_code.html

Tests are managed via an external JSON based configuration file:
http://www.lroot.net/_test/abTesting/config.js

XHTML template build-out for Big Interactive

Received PSDs and produced optimized assets, XHTML, CSS, JavaScript & PHP templates for integration by clients technical team.
Intranet: http://www.lroot.net/_Big/intranet/
(see full template list: http://www.lroot.net/_Big/intranet/_ls.php)
Extranet: http://www.lroot.net/_Big/extranet/
(see full template list: http://www.lroot.net/_Big/extranet/_ls.php)

Website for Identify FX

Received PSDs and produced optimized assets, XHTML, CSS, JavaScript & PHP
http://www.identityfx.com