1
2
3
4
5
6
7
8
9
10
11
12
13
14
15
16
17
18
19
20
21
22
23
24
25
26
27
28
29
30
31
32
33
34
35
36
37
38
39
40
41
42
43
44
45
46
47
48
49
50
51
52
53
54
55
56
57
58
59
60
61
62
63
64
65
66
67
68
69
70
71
72
|
/**
* Ext.ux.form.ToggleField.js
*
* Copyright (c) Damien Churchill 2009-2010 <damoxc@gmail.com>
*
* This file is part of Deluge and is licensed under GNU General Public License 3.0, or later, with
* the additional special exception to link portions of this program with the OpenSSL library.
* See LICENSE for more details.
*/
Ext.namespace('Ext.ux.form');
/**
* Ext.ux.form.ToggleField class
*
* @author Damien Churchill
* @version v0.1
*
* @class Ext.ux.form.ToggleField
* @extends Ext.form.TriggerField
*/
Ext.ux.form.ToggleField = Ext.extend(Ext.form.Field, {
cls: 'x-toggle-field',
initComponent: function () {
Ext.ux.form.ToggleField.superclass.initComponent.call(this);
this.toggle = new Ext.form.Checkbox();
this.toggle.on('check', this.onToggleCheck, this);
this.input = new Ext.form.TextField({
disabled: true,
});
},
onRender: function (ct, position) {
if (!this.el) {
this.panel = new Ext.Panel({
cls: this.groupCls,
layout: 'table',
layoutConfig: {
columns: 2,
},
border: false,
renderTo: ct,
});
this.panel.ownerCt = this;
this.el = this.panel.getEl();
this.panel.add(this.toggle);
this.panel.add(this.input);
this.panel.doLayout();
this.toggle.getEl().parent().setStyle('padding-right', '10px');
}
Ext.ux.form.ToggleField.superclass.onRender.call(this, ct, position);
},
// private
onResize: function (w, h) {
this.panel.setSize(w, h);
this.panel.doLayout();
// we substract 10 for the padding :-)
var inputWidth = w - this.toggle.getSize().width - 25;
this.input.setSize(inputWidth, h);
},
onToggleCheck: function (toggle, checked) {
this.input.setDisabled(!checked);
},
});
Ext.reg('togglefield', Ext.ux.form.ToggleField);
|