Ext JS 4.1.1 paging toolbar override which aligns the paging buttons to the right side of the toolbar

Paging.js

// Ext JS 4.1.1 paging toolbar override which aligns the paging buttons 
// to the right side of the toolbar.  New config "alignPagingRight" set
// to true will cause the paging buttons to align right.
Ext.define('overrides.toolbar.Paging', {
  override: 'Ext.toolbar.Paging',

  initComponent : function() {
    var me = this,
        pagingItems = me.getPagingItems(),
        userItems   = me.items || me.buttons || [];

    // BEGIN OVERRIDE
    if (this.alignPagingRight) {
        userItems.push('->');
    }
    // END OVERRIDE

    if (me.prependButtons) {
        me.items = userItems.concat(pagingItems);
    } else {
        me.items = pagingItems.concat(userItems);
    }
    delete me.buttons;

    if (me.displayInfo) {
      // BEGIN OVERRIDE
      if (!this.alignPagingRight) {
        me.items.push('->');
      }
      // END OVERRIDE
      me.items.push({xtype: 'tbtext', itemId: 'displayItem'});
    }

    me.superclass.initComponent.call(this);

    me.addEvents(
         /**
          * @event change
          * Fires after the active page has been changed.
          * @param {Ext.toolbar.Paging} this
          * @param {Object} pageData An object that has these properties:
          *
          * - `total` : Number
          *
          *   The total number of records in the dataset as returned by the server
          *
          * - `currentPage` : Number
          *
          *   The current page number
          *
          * - `pageCount` : Number
          *
          *   The total number of pages (calculated from the total number of records in the dataset as returned by the
          *   server and the current {@link Ext.data.Store#pageSize pageSize})
          *
          * - `toRecord` : Number
          *
          *   The starting record index for the current page
          *
          * - `fromRecord` : Number
          *
          *   The ending record index for the current page
          */
         'change',

         /**
          * @event beforechange
          * Fires just before the active page is changed. Return false to prevent the active page from being changed.
          * @param {Ext.toolbar.Paging} this
          * @param {Number} page The page number that will be loaded on change
          */
         'beforechange'
    );
    me.on('beforerender', me.onLoad, me, {single: true});

    me.bindStore(me.store || 'ext-empty-store', true);
  }
});