+/*
+
+This file is part of Ext JS 4
+
+Copyright (c) 2011 Sencha Inc
+
+Contact: http://www.sencha.com/contact
+
+GNU General Public License Usage
+This file may be used under the terms of the GNU General Public License version 3.0 as published by the Free Software Foundation and appearing in the file LICENSE included in the packaging of this file. Please review the following information to ensure the GNU General Public License version 3.0 requirements will be met: http://www.gnu.org/copyleft/gpl.html.
+
+If you are unsure which license is appropriate for your use, please contact the sales department at http://www.sencha.com/contact.
+
+*/
/**
- * @private
- * @class Ext.picker.Month
- * @extends Ext.Component
- * <p>A month picker component. This class is used by the {@link Ext.picker.Date DatePicker} class
- * to allow browsing and selection of year/months combinations.</p>
- * @constructor
- * Create a new MonthPicker
- * @param {Object} config The config object
- * @xtype monthpicker
- * @private
+ * A month picker component. This class is used by the {@link Ext.picker.Date Date picker} class
+ * to allow browsing and selection of year/months combinations.
*/
Ext.define('Ext.picker.Month', {
extend: 'Ext.Component',
alternateClassName: 'Ext.MonthPicker',
renderTpl: [
- '<div class="{baseCls}-body">',
+ '<div id="{id}-bodyEl" class="{baseCls}-body">',
'<div class="{baseCls}-months">',
'<tpl for="months">',
'<div class="{parent.baseCls}-item {parent.baseCls}-month"><a href="#" hidefocus="on">{.}</a></div>',
'</div>',
'<div class="{baseCls}-years">',
'<div class="{baseCls}-yearnav">',
- '<button class="{baseCls}-yearnav-prev"></button>',
- '<button class="{baseCls}-yearnav-next"></button>',
+ '<button id="{id}-prevEl" class="{baseCls}-yearnav-prev"></button>',
+ '<button id="{id}-nextEl" class="{baseCls}-yearnav-next"></button>',
'</div>',
'<tpl for="years">',
'<div class="{parent.baseCls}-item {parent.baseCls}-year"><a href="#" hidefocus="on">{.}</a></div>',
'</tpl>',
'</div>',
+ '<div class="' + Ext.baseCSSPrefix + 'clear"></div>',
'</div>',
- '<div class="' + Ext.baseCSSPrefix + 'clear"></div>',
'<tpl if="showButtons">',
- '<div class="{baseCls}-buttons"></div>',
+ '<div id="{id}-buttonsEl" class="{baseCls}-buttons"></div>',
'</tpl>'
],
/**
- * @cfg {String} okText The text to display on the ok button. Defaults to <tt>'OK'</tt>
+ * @cfg {String} okText The text to display on the ok button.
*/
okText: 'OK',
/**
- * @cfg {String} cancelText The text to display on the cancel button. Defaults to <tt>'Cancel'</tt>
+ * @cfg {String} cancelText The text to display on the cancel button.
*/
cancelText: 'Cancel',
baseCls: Ext.baseCSSPrefix + 'monthpicker',
/**
- * @cfg {Boolean} showButtons True to show ok and cancel buttons below the picker. Defaults to <tt>true</tt>.
+ * @cfg {Boolean} showButtons True to show ok and cancel buttons below the picker.
*/
showButtons: true,
*/
/**
- * @cfg {Date/Array} value The default value to set. See {#setValue setValue}
+ * @cfg {Date/Number[]} value The default value to set. See {@link #setValue}
*/
+ width: 178,
- width: 175,
-
- height: 195,
-
+ // used when attached to date picker which isnt showing buttons
+ smallCls: Ext.baseCSSPrefix + 'monthpicker-small',
// private
totalYears: 10,
*/
'yeardblclick'
);
-
+ if (me.small) {
+ me.addCls(me.smallCls);
+ }
me.setValue(me.value);
me.activeYear = me.getYear(new Date().getFullYear() - 4, -4);
this.callParent();
showButtons: me.showButtons
});
- Ext.apply(me.renderSelectors, {
- bodyEl: '.' + me.baseCls + '-body',
- prevEl: '.' + me.baseCls + '-yearnav-prev',
- nextEl: '.' + me.baseCls + '-yearnav-next',
- buttonsEl: '.' + me.baseCls + '-buttons'
- });
- this.callParent([ct, position]);
+ me.addChildEls('bodyEl', 'prevEl', 'nextEl', 'buttonsEl');
+
+ me.callParent(arguments);
},
// private, inherit docs
/**
* Set the value for the picker.
- * @param {Date/Array} value The value to set. It can be a Date object, where the month/year will be extracted, or
+ * @param {Date/Number[]} value The value to set. It can be a Date object, where the month/year will be extracted, or
* it can be an array, with the month as the first index and the year as the second.
* @return {Ext.picker.Month} this
*/
* Gets the selected value. It is returned as an array [month, year]. It may
* be a partial value, for example [null, 2010]. The month is returned as
* 0 based.
- * @return {Array} The selected value
+ * @return {Number[]} The selected value
*/
getValue: function(){
return this.value;
* Get an array of years to be pushed in the template. It is not in strict
* numerical order because we want to show them in columns.
* @private
- * @return {Array} An array of years
+ * @return {Number[]} An array of years
*/
getYears: function(){
var me = this,
/**
* Modify the year display by passing an offset.
- * @param {Number} offset The offset to move by. If not specified, it defaults to 10.
+ * @param {Number} [offset=10] The offset to move by.
*/
adjustYear: function(offset){
if (typeof offset != 'number') {
beforeDestroy: function(){
var me = this;
me.years = me.months = null;
- Ext.destroyMembers('backRepeater', 'nextRepeater', 'okBtn', 'cancelBtn');
- this.callParent();
+ Ext.destroyMembers(me, 'backRepeater', 'nextRepeater', 'okBtn', 'cancelBtn');
+ me.callParent();
}
});
+
git.ithinksw.org / extjs.git / blobdiff