Ext.define('Ext.calendar.form.field.CalendarCombo', {
extend: 'Ext.form.field.ComboBox',
alias: 'widget.calendarpicker',
fieldLabel: 'Calendar',
triggerAction: 'all',
queryMode: 'local',
forceSelection: true,
selectOnFocus: true,
defaultCls: 'ext-color-default',
initComponent: function(){
this.valueField = Ext.calendar.data.CalendarMappings.CalendarId.name;
this.displayField = Ext.calendar.data.CalendarMappings.Title.name;
this.listConfig = Ext.apply(this.listConfig || {}, {
getInnerTpl: this.getListItemTpl
});
this.callParent(arguments);
},
getListItemTpl: function(displayField) {
return '<div class="x-combo-list-item ext-color-{' + Ext.calendar.data.CalendarMappings.CalendarId.name +
'}"><div class="ext-cal-picker-icon"> </div>{' + displayField + '}</div>';
},
afterRender: function(){
this.callParent(arguments);
this.wrap = this.el.down('.x-form-item-body');
this.wrap.addCls('ext-calendar-picker');
this.icon = Ext.core.DomHelper.append(this.wrap, {
tag: 'div', cls: 'ext-cal-picker-icon ext-cal-picker-mainicon'
});
},
getStyleClass: function(value){
var val = value;
if (!Ext.isEmpty(val)) {
if (Ext.isArray(val)) {
val = val[0];
}
return 'ext-color-' + (val.data ? val.data[Ext.calendar.data.CalendarMappings.CalendarId.name] : val);
}
return '';
},
setValue: function(value) {
if (!value && this.store.getCount() > 0) {
value = this.store.getAt(0).data[Ext.calendar.data.CalendarMappings.CalendarId.name];
}
if (this.wrap && value) {
var currentClass = this.getStyleClass(this.getValue()),
newClass = this.getStyleClass(value);
this.wrap.replaceCls(currentClass, newClass);
}
this.callParent(arguments);
}
});