Demos
I created this javascript function because the development team had a need to be able to save the click event of an item after that item has been removed then added back to the page during an AJAX refresh. This function takes the current click event and saves it to a variable so that after the element is readded to the page it can bind to its original event.
View Demo
Download SourceThe Parallax demo was part of a demo package the web design team pitched to the marketing department to demonstrate what we are able to do using javascript. This example uses the jQuery parallax plugin to create an interactive logo banner. The parallax effect uses multiple transparent images in different layers that move independantly of each other to create a 3D effect. This was the same library I used to create the header on DanRegazzi.com
This was a simple javascript demo to present to the develpment team to demonstrate what could be done with CSS. We created a basic HTML structure and used two separate CSS files to change the look and feel of the page. I added a simple button to the page to show how the CSS could be swapped out on the fly without required a page refresh. This demo also showed a couple concept ideas we had for the new search results page for the Private Label project.
I created this jQuery plugin for the bidding page on the Dealer Direct site for ADESA. When you select the input box the plugin presents the user with a menu of options to select from. The plugin is configurable with number of rows, columns, minimum and maximum value, and increment.
This effort came out of the marketing pitch. Adesa.com had a flash based news banner on their logged out home page and had requested updates to it. I developed the news banner in javascript as a jQuery plugin that duplicates the flash version look and feel, while adding the requested features. This new version will also be easier to change should the marketing team have any future modifications they need done. Many of the elements are customizable by the marketing team by changing values in the javascript configuration file.
This demo is currently live on adesa.com
The physics menu demos were also part of the marketing pitch. The lite version was built for Internet Explorer browsers that do not support the HTML5 Canvas tag. It offers limited gravity simulation.
This is the advanced version of the physics menu that works on most modern browsers that support canvas. It uses the box2d javascript library for advanced physics simlation and the canvas tag to draw the objects to the page. Both physics menu examples were used to demostrate a menu system that could be used on Adesa.com to provide a more ineractive experience for the users.
The Private Label project is designed to give ADESA an easier to build framework for any future dealer specific site that uses jQuery for layout and jQuery UI for certain elements to present a web app feel. The web app is designed to bring a log of functionality to a single page using different page elements that can be loaded dynamically. The other main goal of this project is for the web design team to maintain control of the presentation whereas in prevous projects we could design the page and pass the html off to the developers who would rewrite it in java. This meant that a simple change to the structure of a page would require many more hours of development work and a rebuild of the site code.
I created this site using javascript, PHP and MySQL. I see it as a work in progress to create a mostly javascript based content management system. Currently I use jQuery AJAX to call PHP files on the server to fetch data from the MySQL database. The returned content is then rendered to the page using javascript. I originally created this system for the Deep Roads website. This site has an admin panel for adding, deleting or changing content and uses PHP for authentication on the server.
The web auction proof of concept was designed to create an advanced interface for dealers to bid and buy vehicles from the ADESA online auction website. This demo took a single sale event and allowed multiple vehicles to be auctioned simultaneously which increases the amount of vehicles that could be auctioned within a given period of time.
This proof of concept uses javascript objects to simulate vehicles being sold in a sale event and automates the process to simulate a real sale event auction. This POC was developed into a fully functional demo that used my front end code and interfaced with the Adesa test database using AJAX calls using dojo and cometd. This entire project was created by myself and a single java developer working together.
The total time logged was easily a half to a third of the estimated time it would have taken for the entire development team to fully develop this concept using java.
This proof of concept was designed to replace the outdated live physical auction interface currently in place at ADESA. This interface was intended to be able to watch and bid on vehicles live at multiple physical auctions around the United States and Canada. The app gives basic information for each vehicle up for auction as well as the audio and video feeds from the auction location so the user could follow along as the auction event happened live.
Much like the web auction demo, this demo uses simulated sale events and vehicles to automate the process. While the web auction demo used a single sale event and multilpe vehicles simultaneous, this demo uses multiple sale events simultaneous each auctioning a single vehicle at a time.
I worked closely with the VP of e-business on developing this POC into a working demo. As part of this process I also developed a control panel that the person running the auction on site would use to accept bids and move the auction along. Upon completion of this work he presented the demo to other senior level management of the company. Further progress on this progress was put on hold until after the current development efforts had been completed.