Widget implementation in PureMVC

Command.js

Object.declare('base.widget.sampleWidget.Command');

base.widget.sampleWidget.Command = function ()
{
    base.widget.Command.call(this);
};

Object.extend(base.widget.sampleWidget.Command, base.widget.Command);

var _p = base.widget.sampleWidget.Command.prototype;

_p.execute = function (notification)
{
    var $document     = notification.getBody(),
        viewComponent = new base.widget.sampleWidget.ViewComponent($document.find('#form-add')),
        mediator      = new base.widget.sampleWidget.Mediator(viewComponent);

    // Since proxies may be used by mediators, they are registered first
    // Here I should have a Factory for EntityProxies, avoiding duplications
    this._facade.registerProxy(new base.widget.EntityProxy('Entity', { endpoint: '/rest/v1/endpoint/' }));

    this._facade.registerMediator(mediator);
};

Mediator.js

Object.declare('base.widget.sampleWidget.Mediator');

base.widget.sampleWidget.Mediator = function (view) 
{
    base.widget.Mediator.call(this, 'SampleWidgetMediator', view);
}

Object.extend(base.widget.sampleWidget.Mediator, base.widget.Mediator);

var _p = base.widget.sampleWidget.Mediator.prototype;

_p.onRegisterInitialize = function ()
{
    this.bind('ENTITY_ADD', this._onEntityAdd, this);
    this.bind('ENTITY_ADD_ERROR', this._onEntityAddError, this);
    this.bind('ENTITY_ADD_SUCCESS', this._onEntityAddSuccess, this);
};

_p._onEntityAdd = function (notification)
{
    var entityProxy = this.getFacade().retrieveProxy('Entity'),
        entity      = notification.getBody();
    
    entityProxy.post(entity);
};

_p._onEntityAddError = function (notification)
{
    var message = 'There was an error ...';
    
    this.getFacade().sendNotification('SHOW_UI_MESSAGE', message, 'error');
};

_p._onEntityAddSuccess = function (notification)
{
    var viewComponent = this.getViewComponent(),
        message       = 'Entity added successfully';
    
    this.getFacade().sendNotification('SHOW_UI_MESSAGE', message, 'success');
    
    viewComponent.resetForm();
};

ViewComponent.js

Object.declare('base.widget.sampleWidget.ViewComponent');

base.widget.sampleWidget.ViewComponent = function (component) 
{
    base.widget.ViewComponent.call(this, component);
    
    this._initialize();
};

Object.extend(base.widget.sampleWidget.ViewComponent, base.widget.ViewComponent);

var _p = base.widget.sampleWidget.ViewComponent.prototype;

_p._initialize = function ()
{
    this._component.bind('submit', function () {return false;});
    
    // This could be optimized also into a ViewComponent private function
    this._component.find('input[type="submit"],input[type="image"]').bind(
        'click', Relegate.create(this, this._onFormSubmit)
    );
};

_p._onFormSubmit = function ()
{
    var $form    = this.getComponent(),
        formData = $form.serializeJSON();

    this.getFacade().sendNotification('ENTITY_ADD', formData, 'view');
    
    return false;
};

_p.resetForm = function ()
{
    var $form = this.getComponent();
    
    $form[0].reset();
};