document.observe("dom:loaded", function() {
                    
    $$('#events .shout a').invoke('observe', 'click', handleShoutClick);
    
    new Bauer.Controls.PreviewBox({

        previewItems: '#celebs img',

        getCallbackUrl: function(item) {
            return '/Ajax/CelebrityPreview';
        },

        getCallbackParams: function(item) {

            return {
                celebrityId: $F(item.up('li').down('input'))
            };
        }
    });    
});

var handleShoutClick = function(e) {
    e.stop();

    var url = '/Ajax/Shout';
    var eventId = $F(Event.element(e).up('li').down('input'));
    var params = { eventId: eventId };

    new Ajax.Request(url, {
        method: 'get',
        parameters: params,
        onSuccess: function(transport) {

            new Bauer.Controls.Dialog({
                parentElement: $('mainCol'),
                html: transport.responseText,
                dialogDisplayed: dialogDisplayed
            });
        }
    });
}

var dialogDisplayed = function() {
    new Bauer.Controls.DefaultText({ element: $('name'), defaultText: 'Your Name' });
    new Bauer.Controls.DefaultText({ element: $('mobile'), defaultText: 'Your Mobile Number' });
}