Skip navigation

NEED HELP?|

Active Product Development

2 Posts tagged with the events tag

Optimized Event Details

Posted by JeremyGThomas Jul 14, 2011

Today I'm happy to announce that we've released an optimized version of the event details pages on Active.com.  About 60% of our events will have this new format, and we're working steadily in the background to get this number to 100%.

 

Old Version

event-details-old.png

The old version made use of tabs and had pertinent information scattered throughout the page.

 

New Version

event-details-new.png

The new version of the page completely does away with tabs, has all of the pertinent information needed to make a registration decision up at the top (including details on whether or not the event is almost full, and whether or not the price is going to change).  We also feel that the new design is much cleaner than the old and hope you have a better experience getting the information you need when signing up for an event!

2,536 Views 0 Comments Permalink Tags: active.com, design, events

Active Widgets

Posted by RobCameron.2.16b Mar 1, 2010

Hi, I'm Rob and I'm a Software Architect on the Light Engineering Group here at Active. LEG, as we call it, was modeled after the LED group at LinkedIn. LinkedIn was looking for a way to rapidly prototype new technologies and architectures with Ruby on Rails. Their first product was Bumper Sticker which at one point was the mostly highly trafficed Facebook application in existence! You can find many of the fruits of LEG's labor at http://labs.active.com

 

This morning we officially launched our new Active Widgets site at http://widgets.active.com This was a quick two week project to create an embeddable window into Active.com's thousands of registerable events. The idea being that the blog you write about running/cycling/baseball can show a list of upcoming marathons/track events/Little League games in your area. The widget is customizable as far as what activities it displays, where it displays them, whether or not the user can change those settings, as well as the size and color of the widget itself. Once your done just click a button and you're given a couple of simple Javascript tags to drop onto your site wherever you want the widget to appear. And since the widget is written out onto your page like any other HTML, you can further customize it using your own CSS.

 

widget.png

 

The Technical Stuff

This customization site (known as The Configurator) is a Sinatra application written in Ruby. There is no database—the data store is a single YAML file which defines a widget and what about it is customizable. The widget itself is written in Javascript and after minification with the YUI Compressor, the whole thing is 14K (for comparison, the Google homepage is 47K).

 

Since we planned on having the widget be embeddable on any website we couldn't use Ajax to pull in the event listings. Ajax is subject to strict cross-domain security policies set by your browser—you can only access servers in the same domain that the page itself was served from. This is quite a problem since search results are coming from http://search.active.com  The workaround for this issue is to make server calls with <script> tags and then wrap the resulting code in a function call known as a callback. When the <script> tag is added to the page the browser immediately executes it as valid Javascript. Since this Javascript contains a function call (the callback) it looks a function you've already defined with the same name and calls it, passing in the returned data.

 

The server itself is an Amazon EC2 instance running in their cloud infrastructure. This allows us to quickly react to any scaling needs by simply spinning up a new instance of the same server and deploying the code to it. Nearly half our division's products are now running on EC2 and we're moving more there every day. We've found it be an fast, secure and cost effective way to get our applications live.

 

Stay tuned for more exciting projects from the LEG team!

1,901 Views 0 Comments Permalink Tags: events, widgets, leg, cloud_computing, amazon, ec2, labs, ruby, sinatra