    /** * This class implements the form that allows changing the field settings. */Ext.define('Ext.pivot.plugin.configurator.Form', {    extend: 'Ext.form.Panel',     requires: [        'Ext.pivot.plugin.configurator.store.Select',        'Ext.pivot.plugin.configurator.FormController',        'Ext.form.FieldSet',        'Ext.field.Toggle',        'Ext.field.Select',        'Ext.field.Radio',        'Ext.field.Text',        'Ext.field.Hidden',        'Ext.layout.VBox',        'Ext.layout.HBox',        'Ext.TitleBar'    ],     xtype: 'pivotconfigform',    controller: 'pivotconfigform',    viewModel: {        stores: {            sFormatters: {                type: 'pivotselect'            },            sAggregators: {                type: 'pivotselect'            },            sSorters: {                type: 'pivotselect'            },            sFilters: {                type: 'pivotselect'            },            sOperators: {                type: 'pivotselect'            },            sTopOrder: {                type: 'pivotselect'            },            sTopType: {                type: 'pivotselect'            },            sDimensions: {                type: 'pivotselect'            },            sAlign: {                type: 'pivotselect'            }        }    },     eventedConfig: {        fieldItem: null,        title: null    },     listeners: {        fielditemchange: 'onFieldItemChanged'    },     defaults: {        xtype:      'fieldset',        defaults: {            labelAlign: 'top'        }    },     showAnimation: {        type: 'slideIn',        duration: 250,        easing: 'ease-out',        direction: 'left'    },     /**     * @cfg     * @inheritdoc     */    hideAnimation: {        type: 'slideOut',        duration: 250,        easing: 'ease-in',        direction: 'right'    },     okText:                     'Ok',    cancelText:                 'Cancel',    formatText:                 'Format as',    summarizeByText:            'Summarize by',    customNameText:             'Custom name',    sourceNameText:             'The source name for this field is "{form.dataIndex}"',    sortText:                   'Sort',    filterText:                 'Filter',    sortResultsText:            'Sort results',    alignText:                  'Align',    alignLeftText:              'Left',    alignCenterText:            'Center',    alignRightText:             'Right',     caseSensitiveText:          'Case sensitive',    valueText:                  'Value',    fromText:                   'From',    toText:                     'To',    labelFilterText:            'Show items for which the label',    valueFilterText:            'Show items for which',    top10FilterText:            'Show',     sortAscText:                'Sort A to Z',    sortDescText:               'Sort Z to A',    sortClearText:              'Disable sorting',    clearFilterText:            'Disable filtering',    labelFiltersText:           'Label filters',    valueFiltersText:           'Value filters',    top10FiltersText:           'Top 10 filters',     equalsLText:                'equals',    doesNotEqualLText:          'does not equal',    beginsWithLText:            'begins with',    doesNotBeginWithLText:      'does not begin with',    endsWithLText:              'ends with',    doesNotEndWithLText:        'does not end with',    containsLText:              'contains',    doesNotContainLText:        'does not contain',    greaterThanLText:           'is greater than',    greaterThanOrEqualToLText:  'is greater than or equal to',    lessThanLText:              'is less than',    lessThanOrEqualToLText:     'is less than or equal to',    betweenLText:               'is between',    notBetweenLText:            'is not between',    topOrderTopText:            'Top',    topOrderBottomText:         'Bottom',    topTypeItemsText:           'Items',    topTypePercentText:         'Percent',    topTypeSumText:             'Sum',     updateFieldItem: function(item){        var me = this,            items, field;         me.removeAll(true, true);        if(!item){            return;        }         field = item.getField();        items = [{            xtype:      'titlebar',            docked:     'top',            titleAlign: 'left',            bind: {                title: '{form.header}'            },            items: [{                text:   me.cancelText,                align:  'right',                ui:     'decline',                handler:'cancelSettings'            },{                text:   me.okText,                align:  'right',                ui:     'confirm',                handler:'applySettings',                margin: '0 0 0 5'            }]        },{            bind: {                instructions: me.sourceNameText            },            items: [{                label:      me.customNameText,                xtype:      'textfield',                name:       'header',                bind:       '{form.header}'            }]        }];         if(field.isAggregate){            items.push({                items: [{                    label:          me.alignText,                    xtype:          'selectfield',                    autoSelect:     false,                    useClearIcon:   true,                    name:           'align',                    bind: {                        store:      '{sAlign}',                        value:      '{form.align}'                    }                },{                    label:          me.formatText,                    xtype:          'selectfield',                    autoSelect:     false,                    useClearIcon:   true,                    name:           'formatter',                    bind: {                        store:      '{sFormatters}',                        value:      '{form.formatter}'                    }                },{                    label:          me.summarizeByText,                    xtype:          'selectfield',                    autoSelect:     false,                    useClearIcon:   true,                    name:           'aggregator',                    bind: {                        store:      '{sAggregators}',                        value:      '{form.aggregator}'                    }                }]            });        }else{            items.push({                xtype:      'fieldset',                items: [{                    label:          me.sortText,                    labelAlign:     'top',                    xtype:          'selectfield',                    autoSelect:     false,                    useClearIcon:   true,                    name:           'sort',                    bind: {                        store:      '{sSorters}',                        value:      '{form.direction}'                    }                },{                    label:          me.filterText,                    labelAlign:     'top',                    xtype:          'selectfield',                    autoSelect:     false,                    useClearIcon:   true,                    name:           'filter',                    bind: {                        store:      '{sFilters}',                        value:      '{form.filter.type}'                    },                    listeners: {                        change: 'onChangeFilterType'                    }                }]            },{                itemId:         'commonFilters',                hidden:         true,                title:          me.labelFilterText,                defaults: {                    labelAlign: 'top'                },                items: [{                    role:           'dimensions',                    xtype:          'selectfield',                    autoSelect:     false,                    name:           'dimensionId',                    bind: {                        store:      '{sDimensions}',                        value:      '{form.filter.dimensionId}'                    }                },{                    xtype:          'selectfield',                    autoSelect:     false,                    name:           'operator',                    bind: {                        store:      '{sOperators}',                        value:      '{form.filter.operator}'                    },                    listeners: {                        change:     'onChangeFilterOperator'                    }                },{                    role:           'operator',                    xtype:          'textfield',                    placeHolder:    me.valueText,                    name:           'value',                    bind:           '{form.filter.value}'                },{                    role:           'between',                    xtype:          'textfield',                    placeHolder:    me.fromText,                    hidden:         true,                    name:           'from',                    bind:           '{form.filter.from}'                },{                    role:           'between',                    xtype:          'textfield',                    placeHolder:    me.toText,                    hidden:         true,                    name:           'to',                    bind:           '{form.filter.to}'                },{                    xtype:          'togglefield',                    label:          me.caseSensitiveText,                    name:           'caseSensitive',                    bind:           '{form.filter.caseSensitive}'                }]            },{                itemId:         'top10Filters',                xtype:          'fieldset',                hidden:         true,                title:          me.top10FilterText,                defaults: {                    labelAlign: 'top'                },                items: [{                    xtype:          'selectfield',                    autoSelect:     false,                    name:           'topOrder',                    bind: {                        store:      '{sTopOrder}',                        value:      '{form.filter.topOrder}'                    }                },{                    xtype:          'textfield',                    placeHolder:    me.valueText,                    name:           'topValue',                    bind:           '{form.filter.value}'                },{                    xtype:          'selectfield',                    autoSelect:     false,                    name:           'topType',                    bind: {                        store:      '{sTopType}',                        value:      '{form.filter.topType}'                    }                },{                    xtype:          'selectfield',                    autoSelect:     false,                    name:           'topDimensionId',                    bind: {                        store:      '{sDimensions}',                        value:      '{form.filter.dimensionId}'                    }                },{                    xtype:          'togglefield',                    label:          me.sortResultsText,                    name:           'topSort',                    bind:           '{form.filter.topSort}'                }]            });        }         me.add(items);    } });