82547ff77c9e464458d9c7c85ec214fe336e274b
[roojs1] / docs / src / Roo_bootstrap_form_TimeField.js.html
1 <html><head><title>Roo/bootstrap/form/TimeField.js</title><link rel="stylesheet" type="text/css" href="../../css/highlight-js.css"/></head><body class="highlightpage"><code class="jsdoc-pretty"><span class="jsdoc-comment">/*
2  * - LGPL
3  *
4  * TimeField
5  * 
6  */
7
8 /**
9  * @class Roo.bootstrap.form.TimeField
10  * @extends Roo.bootstrap.form.Input
11  * Bootstrap DateField class
12  * @cfg {Number} minuteStep the minutes is always the multiple of a fixed number, default 1
13  * 
14  * 
15  * @constructor
16  * Create a new TimeField
17  * @param {Object} config The config object
18  */
19
20 </span><span class="jsdoc-var">Roo.bootstrap.form.TimeField </span><span class="jsdoc-syntax">= </span><span class="jsdoc-keyword">function</span><span class="jsdoc-syntax">(</span><span class="jsdoc-var">config</span><span class="jsdoc-syntax">){
21     </span><span class="jsdoc-var">Roo.bootstrap.form.TimeField.superclass.constructor.call</span><span class="jsdoc-syntax">(</span><span class="jsdoc-var">this</span><span class="jsdoc-syntax">, </span><span class="jsdoc-var">config</span><span class="jsdoc-syntax">);
22     </span><span class="jsdoc-var">this.addEvents</span><span class="jsdoc-syntax">({
23             </span><span class="jsdoc-comment">/**
24              * @event show
25              * Fires when this field show.
26              * @param {Roo.bootstrap.form.DateField} thisthis
27              * @param {Mixed} date The date value
28              */
29             </span><span class="jsdoc-var">show </span><span class="jsdoc-syntax">: </span><span class="jsdoc-keyword">true</span><span class="jsdoc-syntax">,
30             </span><span class="jsdoc-comment">/**
31              * @event show
32              * Fires when this field hide.
33              * @param {Roo.bootstrap.form.DateField} this
34              * @param {Mixed} date The date value
35              */
36             </span><span class="jsdoc-var">hide </span><span class="jsdoc-syntax">: </span><span class="jsdoc-keyword">true</span><span class="jsdoc-syntax">,
37             </span><span class="jsdoc-comment">/**
38              * @event select
39              * Fires when select a date.
40              * @param {Roo.bootstrap.form.DateField} this
41              * @param {Mixed} date The date value
42              */
43             </span><span class="jsdoc-var">select </span><span class="jsdoc-syntax">: </span><span class="jsdoc-keyword">true
44         </span><span class="jsdoc-syntax">});
45 };
46
47 </span><span class="jsdoc-var">Roo.extend</span><span class="jsdoc-syntax">(</span><span class="jsdoc-var">Roo.bootstrap.form.TimeField</span><span class="jsdoc-syntax">, </span><span class="jsdoc-var">Roo.bootstrap.form.Input</span><span class="jsdoc-syntax">,  {
48
49     </span><span class="jsdoc-comment">/**
50      * @cfg {String} format
51      * The default time format string which can be overriden for localization support.  The format must be
52      * valid according to {@link Date#parseDate} (defaults to 'H:i').
53      */
54     </span><span class="jsdoc-var">format </span><span class="jsdoc-syntax">: </span><span class="jsdoc-string">&quot;H:i&quot;</span><span class="jsdoc-syntax">,
55     </span><span class="jsdoc-var">minuteStep </span><span class="jsdoc-syntax">: 1,
56
57     </span><span class="jsdoc-var">getAutoCreate </span><span class="jsdoc-syntax">: </span><span class="jsdoc-keyword">function</span><span class="jsdoc-syntax">()
58     {
59         </span><span class="jsdoc-var">this.after </span><span class="jsdoc-syntax">= </span><span class="jsdoc-string">'&lt;i class=&quot;fa far fa-clock&quot;&gt;&lt;/i&gt;'</span><span class="jsdoc-syntax">;
60         </span><span class="jsdoc-keyword">return </span><span class="jsdoc-var">Roo.bootstrap.form.TimeField.superclass.getAutoCreate.call</span><span class="jsdoc-syntax">(</span><span class="jsdoc-var">this</span><span class="jsdoc-syntax">);
61
62
63     },
64     </span><span class="jsdoc-var">onRender</span><span class="jsdoc-syntax">: </span><span class="jsdoc-keyword">function</span><span class="jsdoc-syntax">(</span><span class="jsdoc-var">ct</span><span class="jsdoc-syntax">, </span><span class="jsdoc-var">position</span><span class="jsdoc-syntax">)
65     {
66
67         </span><span class="jsdoc-var">Roo.bootstrap.form.TimeField.superclass.onRender.call</span><span class="jsdoc-syntax">(</span><span class="jsdoc-var">this</span><span class="jsdoc-syntax">, </span><span class="jsdoc-var">ct</span><span class="jsdoc-syntax">, </span><span class="jsdoc-var">position</span><span class="jsdoc-syntax">);
68
69         </span><span class="jsdoc-var">this.pickerEl </span><span class="jsdoc-syntax">= </span><span class="jsdoc-var">Roo.get</span><span class="jsdoc-syntax">(</span><span class="jsdoc-var">document.body</span><span class="jsdoc-syntax">)</span><span class="jsdoc-var">.createChild</span><span class="jsdoc-syntax">(</span><span class="jsdoc-var">Roo.bootstrap.form.TimeField.template</span><span class="jsdoc-syntax">);
70
71         </span><span class="jsdoc-var">this.picker</span><span class="jsdoc-syntax">()</span><span class="jsdoc-var">.setVisibilityMode</span><span class="jsdoc-syntax">(</span><span class="jsdoc-var">Roo.Element.DISPLAY</span><span class="jsdoc-syntax">)</span><span class="jsdoc-var">.originalDisplay </span><span class="jsdoc-syntax">= </span><span class="jsdoc-string">'block'</span><span class="jsdoc-syntax">;
72
73         </span><span class="jsdoc-var">this.pop </span><span class="jsdoc-syntax">= </span><span class="jsdoc-var">this.picker</span><span class="jsdoc-syntax">()</span><span class="jsdoc-var">.select</span><span class="jsdoc-syntax">(</span><span class="jsdoc-string">'&gt;.datepicker-time'</span><span class="jsdoc-syntax">,</span><span class="jsdoc-keyword">true</span><span class="jsdoc-syntax">)</span><span class="jsdoc-var">.first</span><span class="jsdoc-syntax">();
74         </span><span class="jsdoc-var">this.pop.setVisibilityMode</span><span class="jsdoc-syntax">(</span><span class="jsdoc-var">Roo.Element.DISPLAY</span><span class="jsdoc-syntax">)</span><span class="jsdoc-var">.originalDisplay </span><span class="jsdoc-syntax">= </span><span class="jsdoc-string">'block'</span><span class="jsdoc-syntax">;
75
76         </span><span class="jsdoc-var">this.picker</span><span class="jsdoc-syntax">()</span><span class="jsdoc-var">.on</span><span class="jsdoc-syntax">(</span><span class="jsdoc-string">'mousedown'</span><span class="jsdoc-syntax">, </span><span class="jsdoc-var">this.onMousedown</span><span class="jsdoc-syntax">, </span><span class="jsdoc-var">this</span><span class="jsdoc-syntax">);
77         </span><span class="jsdoc-var">this.picker</span><span class="jsdoc-syntax">()</span><span class="jsdoc-var">.on</span><span class="jsdoc-syntax">(</span><span class="jsdoc-string">'click'</span><span class="jsdoc-syntax">, </span><span class="jsdoc-var">this.onClick</span><span class="jsdoc-syntax">, </span><span class="jsdoc-var">this</span><span class="jsdoc-syntax">);
78
79         </span><span class="jsdoc-var">this.picker</span><span class="jsdoc-syntax">()</span><span class="jsdoc-var">.addClass</span><span class="jsdoc-syntax">(</span><span class="jsdoc-string">'datepicker-dropdown'</span><span class="jsdoc-syntax">);
80
81         </span><span class="jsdoc-var">this.fillTime</span><span class="jsdoc-syntax">();
82         </span><span class="jsdoc-var">this.update</span><span class="jsdoc-syntax">();
83
84         </span><span class="jsdoc-var">this.pop.select</span><span class="jsdoc-syntax">(</span><span class="jsdoc-string">'.hours-up'</span><span class="jsdoc-syntax">, </span><span class="jsdoc-keyword">true</span><span class="jsdoc-syntax">)</span><span class="jsdoc-var">.first</span><span class="jsdoc-syntax">()</span><span class="jsdoc-var">.on</span><span class="jsdoc-syntax">(</span><span class="jsdoc-string">'click'</span><span class="jsdoc-syntax">, </span><span class="jsdoc-var">this.onIncrementHours</span><span class="jsdoc-syntax">, </span><span class="jsdoc-var">this</span><span class="jsdoc-syntax">);
85         </span><span class="jsdoc-var">this.pop.select</span><span class="jsdoc-syntax">(</span><span class="jsdoc-string">'.hours-down'</span><span class="jsdoc-syntax">, </span><span class="jsdoc-keyword">true</span><span class="jsdoc-syntax">)</span><span class="jsdoc-var">.first</span><span class="jsdoc-syntax">()</span><span class="jsdoc-var">.on</span><span class="jsdoc-syntax">(</span><span class="jsdoc-string">'click'</span><span class="jsdoc-syntax">, </span><span class="jsdoc-var">this.onDecrementHours</span><span class="jsdoc-syntax">, </span><span class="jsdoc-var">this</span><span class="jsdoc-syntax">);
86         </span><span class="jsdoc-var">this.pop.select</span><span class="jsdoc-syntax">(</span><span class="jsdoc-string">'.minutes-up'</span><span class="jsdoc-syntax">, </span><span class="jsdoc-keyword">true</span><span class="jsdoc-syntax">)</span><span class="jsdoc-var">.first</span><span class="jsdoc-syntax">()</span><span class="jsdoc-var">.on</span><span class="jsdoc-syntax">(</span><span class="jsdoc-string">'click'</span><span class="jsdoc-syntax">, </span><span class="jsdoc-var">this.onIncrementMinutes</span><span class="jsdoc-syntax">, </span><span class="jsdoc-var">this</span><span class="jsdoc-syntax">);
87         </span><span class="jsdoc-var">this.pop.select</span><span class="jsdoc-syntax">(</span><span class="jsdoc-string">'.minutes-down'</span><span class="jsdoc-syntax">, </span><span class="jsdoc-keyword">true</span><span class="jsdoc-syntax">)</span><span class="jsdoc-var">.first</span><span class="jsdoc-syntax">()</span><span class="jsdoc-var">.on</span><span class="jsdoc-syntax">(</span><span class="jsdoc-string">'click'</span><span class="jsdoc-syntax">, </span><span class="jsdoc-var">this.onDecrementMinutes</span><span class="jsdoc-syntax">, </span><span class="jsdoc-var">this</span><span class="jsdoc-syntax">);
88         </span><span class="jsdoc-var">this.pop.select</span><span class="jsdoc-syntax">(</span><span class="jsdoc-string">'button.period'</span><span class="jsdoc-syntax">, </span><span class="jsdoc-keyword">true</span><span class="jsdoc-syntax">)</span><span class="jsdoc-var">.first</span><span class="jsdoc-syntax">()</span><span class="jsdoc-var">.on</span><span class="jsdoc-syntax">(</span><span class="jsdoc-string">'click'</span><span class="jsdoc-syntax">, </span><span class="jsdoc-var">this.onTogglePeriod</span><span class="jsdoc-syntax">, </span><span class="jsdoc-var">this</span><span class="jsdoc-syntax">);
89         </span><span class="jsdoc-var">this.pop.select</span><span class="jsdoc-syntax">(</span><span class="jsdoc-string">'button.ok'</span><span class="jsdoc-syntax">, </span><span class="jsdoc-keyword">true</span><span class="jsdoc-syntax">)</span><span class="jsdoc-var">.first</span><span class="jsdoc-syntax">()</span><span class="jsdoc-var">.on</span><span class="jsdoc-syntax">(</span><span class="jsdoc-string">'click'</span><span class="jsdoc-syntax">, </span><span class="jsdoc-var">this.setTime</span><span class="jsdoc-syntax">, </span><span class="jsdoc-var">this</span><span class="jsdoc-syntax">);
90
91     },
92
93     </span><span class="jsdoc-var">fireKey</span><span class="jsdoc-syntax">: </span><span class="jsdoc-keyword">function</span><span class="jsdoc-syntax">(</span><span class="jsdoc-var">e</span><span class="jsdoc-syntax">){
94         </span><span class="jsdoc-keyword">if </span><span class="jsdoc-syntax">(!</span><span class="jsdoc-var">this.picker</span><span class="jsdoc-syntax">()</span><span class="jsdoc-var">.isVisible</span><span class="jsdoc-syntax">()){
95             </span><span class="jsdoc-keyword">if </span><span class="jsdoc-syntax">(</span><span class="jsdoc-var">e.keyCode </span><span class="jsdoc-syntax">== 27) { </span><span class="jsdoc-comment">// allow escape to hide and re-show picker
96                 </span><span class="jsdoc-var">this.show</span><span class="jsdoc-syntax">();
97             }
98             </span><span class="jsdoc-keyword">return</span><span class="jsdoc-syntax">;
99         }
100
101         </span><span class="jsdoc-var">e.preventDefault</span><span class="jsdoc-syntax">();
102
103         </span><span class="jsdoc-keyword">switch</span><span class="jsdoc-syntax">(</span><span class="jsdoc-var">e.keyCode</span><span class="jsdoc-syntax">){
104             </span><span class="jsdoc-keyword">case </span><span class="jsdoc-syntax">27: </span><span class="jsdoc-comment">// escape
105                 </span><span class="jsdoc-var">this.hide</span><span class="jsdoc-syntax">();
106                 </span><span class="jsdoc-keyword">break</span><span class="jsdoc-syntax">;
107             </span><span class="jsdoc-keyword">case </span><span class="jsdoc-syntax">37: </span><span class="jsdoc-comment">// left
108             </span><span class="jsdoc-keyword">case </span><span class="jsdoc-syntax">39: </span><span class="jsdoc-comment">// right
109                 </span><span class="jsdoc-var">this.onTogglePeriod</span><span class="jsdoc-syntax">();
110                 </span><span class="jsdoc-keyword">break</span><span class="jsdoc-syntax">;
111             </span><span class="jsdoc-keyword">case </span><span class="jsdoc-syntax">38: </span><span class="jsdoc-comment">// up
112                 </span><span class="jsdoc-var">this.onIncrementMinutes</span><span class="jsdoc-syntax">();
113                 </span><span class="jsdoc-keyword">break</span><span class="jsdoc-syntax">;
114             </span><span class="jsdoc-keyword">case </span><span class="jsdoc-syntax">40: </span><span class="jsdoc-comment">// down
115                 </span><span class="jsdoc-var">this.onDecrementMinutes</span><span class="jsdoc-syntax">();
116                 </span><span class="jsdoc-keyword">break</span><span class="jsdoc-syntax">;
117             </span><span class="jsdoc-keyword">case </span><span class="jsdoc-syntax">13: </span><span class="jsdoc-comment">// enter
118             </span><span class="jsdoc-keyword">case </span><span class="jsdoc-syntax">9: </span><span class="jsdoc-comment">// tab
119                 </span><span class="jsdoc-var">this.setTime</span><span class="jsdoc-syntax">();
120                 </span><span class="jsdoc-keyword">break</span><span class="jsdoc-syntax">;
121         }
122     },
123
124     </span><span class="jsdoc-var">onClick</span><span class="jsdoc-syntax">: </span><span class="jsdoc-keyword">function</span><span class="jsdoc-syntax">(</span><span class="jsdoc-var">e</span><span class="jsdoc-syntax">) {
125         </span><span class="jsdoc-var">e.stopPropagation</span><span class="jsdoc-syntax">();
126         </span><span class="jsdoc-var">e.preventDefault</span><span class="jsdoc-syntax">();
127     },
128
129     </span><span class="jsdoc-var">picker </span><span class="jsdoc-syntax">: </span><span class="jsdoc-keyword">function</span><span class="jsdoc-syntax">()
130     {
131         </span><span class="jsdoc-keyword">return </span><span class="jsdoc-var">this.pickerEl</span><span class="jsdoc-syntax">;
132     },
133
134     </span><span class="jsdoc-var">fillTime</span><span class="jsdoc-syntax">: </span><span class="jsdoc-keyword">function</span><span class="jsdoc-syntax">()
135     {
136         </span><span class="jsdoc-keyword">var </span><span class="jsdoc-var">time </span><span class="jsdoc-syntax">= </span><span class="jsdoc-var">this.pop.select</span><span class="jsdoc-syntax">(</span><span class="jsdoc-string">'tbody'</span><span class="jsdoc-syntax">, </span><span class="jsdoc-keyword">true</span><span class="jsdoc-syntax">)</span><span class="jsdoc-var">.first</span><span class="jsdoc-syntax">();
137
138         </span><span class="jsdoc-var">time.dom.innerHTML </span><span class="jsdoc-syntax">= </span><span class="jsdoc-string">''</span><span class="jsdoc-syntax">;
139
140         </span><span class="jsdoc-var">time.createChild</span><span class="jsdoc-syntax">({
141             </span><span class="jsdoc-var">tag</span><span class="jsdoc-syntax">: </span><span class="jsdoc-string">'tr'</span><span class="jsdoc-syntax">,
142             </span><span class="jsdoc-var">cn</span><span class="jsdoc-syntax">: [
143                 {
144                     </span><span class="jsdoc-var">tag</span><span class="jsdoc-syntax">: </span><span class="jsdoc-string">'td'</span><span class="jsdoc-syntax">,
145                     </span><span class="jsdoc-var">cn</span><span class="jsdoc-syntax">: [
146                         {
147                             </span><span class="jsdoc-var">tag</span><span class="jsdoc-syntax">: </span><span class="jsdoc-string">'a'</span><span class="jsdoc-syntax">,
148                             </span><span class="jsdoc-var">href</span><span class="jsdoc-syntax">: </span><span class="jsdoc-string">'#'</span><span class="jsdoc-syntax">,
149                             </span><span class="jsdoc-var">cls</span><span class="jsdoc-syntax">: </span><span class="jsdoc-string">'btn'</span><span class="jsdoc-syntax">,
150                             </span><span class="jsdoc-var">cn</span><span class="jsdoc-syntax">: [
151                                 {
152                                     </span><span class="jsdoc-var">tag</span><span class="jsdoc-syntax">: </span><span class="jsdoc-string">'i'</span><span class="jsdoc-syntax">,
153                                     </span><span class="jsdoc-var">cls</span><span class="jsdoc-syntax">: </span><span class="jsdoc-string">'hours-up fa fas fa-chevron-up'
154                                 </span><span class="jsdoc-syntax">}
155                             ]
156                         }
157                     ]
158                 },
159                 {
160                     </span><span class="jsdoc-var">tag</span><span class="jsdoc-syntax">: </span><span class="jsdoc-string">'td'</span><span class="jsdoc-syntax">,
161                     </span><span class="jsdoc-var">cls</span><span class="jsdoc-syntax">: </span><span class="jsdoc-string">'separator'
162                 </span><span class="jsdoc-syntax">},
163                 {
164                     </span><span class="jsdoc-var">tag</span><span class="jsdoc-syntax">: </span><span class="jsdoc-string">'td'</span><span class="jsdoc-syntax">,
165                     </span><span class="jsdoc-var">cn</span><span class="jsdoc-syntax">: [
166                         {
167                             </span><span class="jsdoc-var">tag</span><span class="jsdoc-syntax">: </span><span class="jsdoc-string">'a'</span><span class="jsdoc-syntax">,
168                             </span><span class="jsdoc-var">href</span><span class="jsdoc-syntax">: </span><span class="jsdoc-string">'#'</span><span class="jsdoc-syntax">,
169                             </span><span class="jsdoc-var">cls</span><span class="jsdoc-syntax">: </span><span class="jsdoc-string">'btn'</span><span class="jsdoc-syntax">,
170                             </span><span class="jsdoc-var">cn</span><span class="jsdoc-syntax">: [
171                                 {
172                                     </span><span class="jsdoc-var">tag</span><span class="jsdoc-syntax">: </span><span class="jsdoc-string">'i'</span><span class="jsdoc-syntax">,
173                                     </span><span class="jsdoc-var">cls</span><span class="jsdoc-syntax">: </span><span class="jsdoc-string">'minutes-up fa fas fa-chevron-up'
174                                 </span><span class="jsdoc-syntax">}
175                             ]
176                         }
177                     ]
178                 },
179                 {
180                     </span><span class="jsdoc-var">tag</span><span class="jsdoc-syntax">: </span><span class="jsdoc-string">'td'</span><span class="jsdoc-syntax">,
181                     </span><span class="jsdoc-var">cls</span><span class="jsdoc-syntax">: </span><span class="jsdoc-string">'separator'
182                 </span><span class="jsdoc-syntax">}
183             ]
184         });
185
186         </span><span class="jsdoc-var">time.createChild</span><span class="jsdoc-syntax">({
187             </span><span class="jsdoc-var">tag</span><span class="jsdoc-syntax">: </span><span class="jsdoc-string">'tr'</span><span class="jsdoc-syntax">,
188             </span><span class="jsdoc-var">cn</span><span class="jsdoc-syntax">: [
189                 {
190                     </span><span class="jsdoc-var">tag</span><span class="jsdoc-syntax">: </span><span class="jsdoc-string">'td'</span><span class="jsdoc-syntax">,
191                     </span><span class="jsdoc-var">cn</span><span class="jsdoc-syntax">: [
192                         {
193                             </span><span class="jsdoc-var">tag</span><span class="jsdoc-syntax">: </span><span class="jsdoc-string">'span'</span><span class="jsdoc-syntax">,
194                             </span><span class="jsdoc-var">cls</span><span class="jsdoc-syntax">: </span><span class="jsdoc-string">'timepicker-hour'</span><span class="jsdoc-syntax">,
195                             </span><span class="jsdoc-var">html</span><span class="jsdoc-syntax">: </span><span class="jsdoc-string">'00'
196                         </span><span class="jsdoc-syntax">}
197                     ]
198                 },
199                 {
200                     </span><span class="jsdoc-var">tag</span><span class="jsdoc-syntax">: </span><span class="jsdoc-string">'td'</span><span class="jsdoc-syntax">,
201                     </span><span class="jsdoc-var">cls</span><span class="jsdoc-syntax">: </span><span class="jsdoc-string">'separator'</span><span class="jsdoc-syntax">,
202                     </span><span class="jsdoc-var">html</span><span class="jsdoc-syntax">: </span><span class="jsdoc-string">':'
203                 </span><span class="jsdoc-syntax">},
204                 {
205                     </span><span class="jsdoc-var">tag</span><span class="jsdoc-syntax">: </span><span class="jsdoc-string">'td'</span><span class="jsdoc-syntax">,
206                     </span><span class="jsdoc-var">cn</span><span class="jsdoc-syntax">: [
207                         {
208                             </span><span class="jsdoc-var">tag</span><span class="jsdoc-syntax">: </span><span class="jsdoc-string">'span'</span><span class="jsdoc-syntax">,
209                             </span><span class="jsdoc-var">cls</span><span class="jsdoc-syntax">: </span><span class="jsdoc-string">'timepicker-minute'</span><span class="jsdoc-syntax">,
210                             </span><span class="jsdoc-var">html</span><span class="jsdoc-syntax">: </span><span class="jsdoc-string">'00'
211                         </span><span class="jsdoc-syntax">}
212                     ]
213                 },
214                 {
215                     </span><span class="jsdoc-var">tag</span><span class="jsdoc-syntax">: </span><span class="jsdoc-string">'td'</span><span class="jsdoc-syntax">,
216                     </span><span class="jsdoc-var">cls</span><span class="jsdoc-syntax">: </span><span class="jsdoc-string">'separator'
217                 </span><span class="jsdoc-syntax">},
218                 {
219                     </span><span class="jsdoc-var">tag</span><span class="jsdoc-syntax">: </span><span class="jsdoc-string">'td'</span><span class="jsdoc-syntax">,
220                     </span><span class="jsdoc-var">cn</span><span class="jsdoc-syntax">: [
221                         {
222                             </span><span class="jsdoc-var">tag</span><span class="jsdoc-syntax">: </span><span class="jsdoc-string">'button'</span><span class="jsdoc-syntax">,
223                             </span><span class="jsdoc-var">type</span><span class="jsdoc-syntax">: </span><span class="jsdoc-string">'button'</span><span class="jsdoc-syntax">,
224                             </span><span class="jsdoc-var">cls</span><span class="jsdoc-syntax">: </span><span class="jsdoc-string">'btn btn-primary period'</span><span class="jsdoc-syntax">,
225                             </span><span class="jsdoc-var">html</span><span class="jsdoc-syntax">: </span><span class="jsdoc-string">'AM'
226
227                         </span><span class="jsdoc-syntax">}
228                     ]
229                 }
230             ]
231         });
232
233         </span><span class="jsdoc-var">time.createChild</span><span class="jsdoc-syntax">({
234             </span><span class="jsdoc-var">tag</span><span class="jsdoc-syntax">: </span><span class="jsdoc-string">'tr'</span><span class="jsdoc-syntax">,
235             </span><span class="jsdoc-var">cn</span><span class="jsdoc-syntax">: [
236                 {
237                     </span><span class="jsdoc-var">tag</span><span class="jsdoc-syntax">: </span><span class="jsdoc-string">'td'</span><span class="jsdoc-syntax">,
238                     </span><span class="jsdoc-var">cn</span><span class="jsdoc-syntax">: [
239                         {
240                             </span><span class="jsdoc-var">tag</span><span class="jsdoc-syntax">: </span><span class="jsdoc-string">'a'</span><span class="jsdoc-syntax">,
241                             </span><span class="jsdoc-var">href</span><span class="jsdoc-syntax">: </span><span class="jsdoc-string">'#'</span><span class="jsdoc-syntax">,
242                             </span><span class="jsdoc-var">cls</span><span class="jsdoc-syntax">: </span><span class="jsdoc-string">'btn'</span><span class="jsdoc-syntax">,
243                             </span><span class="jsdoc-var">cn</span><span class="jsdoc-syntax">: [
244                                 {
245                                     </span><span class="jsdoc-var">tag</span><span class="jsdoc-syntax">: </span><span class="jsdoc-string">'span'</span><span class="jsdoc-syntax">,
246                                     </span><span class="jsdoc-var">cls</span><span class="jsdoc-syntax">: </span><span class="jsdoc-string">'hours-down fa fas fa-chevron-down'
247                                 </span><span class="jsdoc-syntax">}
248                             ]
249                         }
250                     ]
251                 },
252                 {
253                     </span><span class="jsdoc-var">tag</span><span class="jsdoc-syntax">: </span><span class="jsdoc-string">'td'</span><span class="jsdoc-syntax">,
254                     </span><span class="jsdoc-var">cls</span><span class="jsdoc-syntax">: </span><span class="jsdoc-string">'separator'
255                 </span><span class="jsdoc-syntax">},
256                 {
257                     </span><span class="jsdoc-var">tag</span><span class="jsdoc-syntax">: </span><span class="jsdoc-string">'td'</span><span class="jsdoc-syntax">,
258                     </span><span class="jsdoc-var">cn</span><span class="jsdoc-syntax">: [
259                         {
260                             </span><span class="jsdoc-var">tag</span><span class="jsdoc-syntax">: </span><span class="jsdoc-string">'a'</span><span class="jsdoc-syntax">,
261                             </span><span class="jsdoc-var">href</span><span class="jsdoc-syntax">: </span><span class="jsdoc-string">'#'</span><span class="jsdoc-syntax">,
262                             </span><span class="jsdoc-var">cls</span><span class="jsdoc-syntax">: </span><span class="jsdoc-string">'btn'</span><span class="jsdoc-syntax">,
263                             </span><span class="jsdoc-var">cn</span><span class="jsdoc-syntax">: [
264                                 {
265                                     </span><span class="jsdoc-var">tag</span><span class="jsdoc-syntax">: </span><span class="jsdoc-string">'span'</span><span class="jsdoc-syntax">,
266                                     </span><span class="jsdoc-var">cls</span><span class="jsdoc-syntax">: </span><span class="jsdoc-string">'minutes-down fa fas fa-chevron-down'
267                                 </span><span class="jsdoc-syntax">}
268                             ]
269                         }
270                     ]
271                 },
272                 {
273                     </span><span class="jsdoc-var">tag</span><span class="jsdoc-syntax">: </span><span class="jsdoc-string">'td'</span><span class="jsdoc-syntax">,
274                     </span><span class="jsdoc-var">cls</span><span class="jsdoc-syntax">: </span><span class="jsdoc-string">'separator'
275                 </span><span class="jsdoc-syntax">}
276             ]
277         });
278
279     },
280
281     </span><span class="jsdoc-var">update</span><span class="jsdoc-syntax">: </span><span class="jsdoc-keyword">function</span><span class="jsdoc-syntax">()
282     {
283         </span><span class="jsdoc-comment">// default minute is a multiple of minuteStep
284         </span><span class="jsdoc-keyword">if</span><span class="jsdoc-syntax">(</span><span class="jsdoc-keyword">typeof</span><span class="jsdoc-syntax">(</span><span class="jsdoc-var">this.time</span><span class="jsdoc-syntax">) === </span><span class="jsdoc-string">'undefined'</span><span class="jsdoc-syntax">) {
285             </span><span class="jsdoc-var">this.time </span><span class="jsdoc-syntax">= </span><span class="jsdoc-keyword">new </span><span class="jsdoc-var">Date</span><span class="jsdoc-syntax">();
286             </span><span class="jsdoc-var">this.time </span><span class="jsdoc-syntax">= </span><span class="jsdoc-var">this.time.add</span><span class="jsdoc-syntax">(</span><span class="jsdoc-var">Date.MINUTE</span><span class="jsdoc-syntax">, </span><span class="jsdoc-var">Math.round</span><span class="jsdoc-syntax">(</span><span class="jsdoc-var">parseInt</span><span class="jsdoc-syntax">(</span><span class="jsdoc-var">this.time.format</span><span class="jsdoc-syntax">(</span><span class="jsdoc-string">'i'</span><span class="jsdoc-syntax">)) / </span><span class="jsdoc-var">this.minuteStep</span><span class="jsdoc-syntax">) * </span><span class="jsdoc-var">this.minuteStep </span><span class="jsdoc-syntax">- </span><span class="jsdoc-var">parseInt</span><span class="jsdoc-syntax">(</span><span class="jsdoc-var">this.time.format</span><span class="jsdoc-syntax">(</span><span class="jsdoc-string">'i'</span><span class="jsdoc-syntax">)));
287         }
288         </span><span class="jsdoc-var">this.time </span><span class="jsdoc-syntax">= (</span><span class="jsdoc-keyword">typeof</span><span class="jsdoc-syntax">(</span><span class="jsdoc-var">this.time</span><span class="jsdoc-syntax">) === </span><span class="jsdoc-string">'undefined'</span><span class="jsdoc-syntax">) ? </span><span class="jsdoc-keyword">new </span><span class="jsdoc-var">Date</span><span class="jsdoc-syntax">() : </span><span class="jsdoc-var">this.time</span><span class="jsdoc-syntax">;
289
290         </span><span class="jsdoc-var">this.fill</span><span class="jsdoc-syntax">();
291     },
292
293     </span><span class="jsdoc-var">fill</span><span class="jsdoc-syntax">: </span><span class="jsdoc-keyword">function</span><span class="jsdoc-syntax">()
294     {
295         </span><span class="jsdoc-keyword">var </span><span class="jsdoc-var">hours </span><span class="jsdoc-syntax">= </span><span class="jsdoc-var">this.time.getHours</span><span class="jsdoc-syntax">();
296         </span><span class="jsdoc-keyword">var </span><span class="jsdoc-var">minutes </span><span class="jsdoc-syntax">= </span><span class="jsdoc-var">this.time.getMinutes</span><span class="jsdoc-syntax">();
297         </span><span class="jsdoc-keyword">var </span><span class="jsdoc-var">period </span><span class="jsdoc-syntax">= </span><span class="jsdoc-string">'AM'</span><span class="jsdoc-syntax">;
298
299         </span><span class="jsdoc-keyword">if</span><span class="jsdoc-syntax">(</span><span class="jsdoc-var">hours </span><span class="jsdoc-syntax">&gt; 11){
300             </span><span class="jsdoc-var">period </span><span class="jsdoc-syntax">= </span><span class="jsdoc-string">'PM'</span><span class="jsdoc-syntax">;
301         }
302
303         </span><span class="jsdoc-keyword">if</span><span class="jsdoc-syntax">(</span><span class="jsdoc-var">hours </span><span class="jsdoc-syntax">== 0){
304             </span><span class="jsdoc-var">hours </span><span class="jsdoc-syntax">= 12;
305         }
306
307
308         </span><span class="jsdoc-keyword">if</span><span class="jsdoc-syntax">(</span><span class="jsdoc-var">hours </span><span class="jsdoc-syntax">&gt; 12){
309             </span><span class="jsdoc-var">hours </span><span class="jsdoc-syntax">= </span><span class="jsdoc-var">hours </span><span class="jsdoc-syntax">- 12;
310         }
311
312         </span><span class="jsdoc-keyword">if</span><span class="jsdoc-syntax">(</span><span class="jsdoc-var">hours </span><span class="jsdoc-syntax">&lt; 10){
313             </span><span class="jsdoc-var">hours </span><span class="jsdoc-syntax">= </span><span class="jsdoc-string">'0' </span><span class="jsdoc-syntax">+ </span><span class="jsdoc-var">hours</span><span class="jsdoc-syntax">;
314         }
315
316         </span><span class="jsdoc-keyword">if</span><span class="jsdoc-syntax">(</span><span class="jsdoc-var">minutes </span><span class="jsdoc-syntax">&lt; 10){
317             </span><span class="jsdoc-var">minutes </span><span class="jsdoc-syntax">= </span><span class="jsdoc-string">'0' </span><span class="jsdoc-syntax">+ </span><span class="jsdoc-var">minutes</span><span class="jsdoc-syntax">;
318         }
319
320         </span><span class="jsdoc-var">this.pop.select</span><span class="jsdoc-syntax">(</span><span class="jsdoc-string">'.timepicker-hour'</span><span class="jsdoc-syntax">, </span><span class="jsdoc-keyword">true</span><span class="jsdoc-syntax">)</span><span class="jsdoc-var">.first</span><span class="jsdoc-syntax">()</span><span class="jsdoc-var">.dom.innerHTML </span><span class="jsdoc-syntax">= </span><span class="jsdoc-var">hours</span><span class="jsdoc-syntax">;
321         </span><span class="jsdoc-var">this.pop.select</span><span class="jsdoc-syntax">(</span><span class="jsdoc-string">'.timepicker-minute'</span><span class="jsdoc-syntax">, </span><span class="jsdoc-keyword">true</span><span class="jsdoc-syntax">)</span><span class="jsdoc-var">.first</span><span class="jsdoc-syntax">()</span><span class="jsdoc-var">.dom.innerHTML </span><span class="jsdoc-syntax">= </span><span class="jsdoc-var">minutes</span><span class="jsdoc-syntax">;
322         </span><span class="jsdoc-var">this.pop.select</span><span class="jsdoc-syntax">(</span><span class="jsdoc-string">'button'</span><span class="jsdoc-syntax">, </span><span class="jsdoc-keyword">true</span><span class="jsdoc-syntax">)</span><span class="jsdoc-var">.first</span><span class="jsdoc-syntax">()</span><span class="jsdoc-var">.dom.innerHTML </span><span class="jsdoc-syntax">= </span><span class="jsdoc-var">period</span><span class="jsdoc-syntax">;
323
324     },
325
326     </span><span class="jsdoc-var">place</span><span class="jsdoc-syntax">: </span><span class="jsdoc-keyword">function</span><span class="jsdoc-syntax">()
327     {
328         </span><span class="jsdoc-var">this.picker</span><span class="jsdoc-syntax">()</span><span class="jsdoc-var">.removeClass</span><span class="jsdoc-syntax">([</span><span class="jsdoc-string">'bottom-left'</span><span class="jsdoc-syntax">, </span><span class="jsdoc-string">'bottom-right'</span><span class="jsdoc-syntax">, </span><span class="jsdoc-string">'top-left'</span><span class="jsdoc-syntax">, </span><span class="jsdoc-string">'top-right'</span><span class="jsdoc-syntax">]);
329
330         </span><span class="jsdoc-keyword">var </span><span class="jsdoc-var">cls </span><span class="jsdoc-syntax">= [</span><span class="jsdoc-string">'bottom'</span><span class="jsdoc-syntax">];
331
332         </span><span class="jsdoc-keyword">if</span><span class="jsdoc-syntax">((</span><span class="jsdoc-var">Roo.lib.Dom.getViewHeight</span><span class="jsdoc-syntax">() + </span><span class="jsdoc-var">Roo.get</span><span class="jsdoc-syntax">(</span><span class="jsdoc-var">document.body</span><span class="jsdoc-syntax">)</span><span class="jsdoc-var">.getScroll</span><span class="jsdoc-syntax">()</span><span class="jsdoc-var">.top</span><span class="jsdoc-syntax">) - (</span><span class="jsdoc-var">this.inputEl</span><span class="jsdoc-syntax">()</span><span class="jsdoc-var">.getBottom</span><span class="jsdoc-syntax">() + </span><span class="jsdoc-var">this.picker</span><span class="jsdoc-syntax">()</span><span class="jsdoc-var">.getHeight</span><span class="jsdoc-syntax">()) &lt; 0){ </span><span class="jsdoc-comment">// top
333             </span><span class="jsdoc-var">cls.pop</span><span class="jsdoc-syntax">();
334             </span><span class="jsdoc-var">cls.push</span><span class="jsdoc-syntax">(</span><span class="jsdoc-string">'top'</span><span class="jsdoc-syntax">);
335         }
336
337         </span><span class="jsdoc-var">cls.push</span><span class="jsdoc-syntax">(</span><span class="jsdoc-string">'right'</span><span class="jsdoc-syntax">);
338
339         </span><span class="jsdoc-keyword">if</span><span class="jsdoc-syntax">((</span><span class="jsdoc-var">Roo.lib.Dom.getViewWidth</span><span class="jsdoc-syntax">() + </span><span class="jsdoc-var">Roo.get</span><span class="jsdoc-syntax">(</span><span class="jsdoc-var">document.body</span><span class="jsdoc-syntax">)</span><span class="jsdoc-var">.getScroll</span><span class="jsdoc-syntax">()</span><span class="jsdoc-var">.left</span><span class="jsdoc-syntax">) - (</span><span class="jsdoc-var">this.inputEl</span><span class="jsdoc-syntax">()</span><span class="jsdoc-var">.getLeft</span><span class="jsdoc-syntax">() + </span><span class="jsdoc-var">this.picker</span><span class="jsdoc-syntax">()</span><span class="jsdoc-var">.getWidth</span><span class="jsdoc-syntax">()) &lt; 0){ </span><span class="jsdoc-comment">// left
340             </span><span class="jsdoc-var">cls.pop</span><span class="jsdoc-syntax">();
341             </span><span class="jsdoc-var">cls.push</span><span class="jsdoc-syntax">(</span><span class="jsdoc-string">'left'</span><span class="jsdoc-syntax">);
342         }
343         </span><span class="jsdoc-comment">//this.picker().setXY(20000,20000);
344         </span><span class="jsdoc-var">this.picker</span><span class="jsdoc-syntax">()</span><span class="jsdoc-var">.addClass</span><span class="jsdoc-syntax">(</span><span class="jsdoc-var">cls.join</span><span class="jsdoc-syntax">(</span><span class="jsdoc-string">'-'</span><span class="jsdoc-syntax">));
345
346         </span><span class="jsdoc-keyword">var </span><span class="jsdoc-var">_this </span><span class="jsdoc-syntax">= </span><span class="jsdoc-var">this</span><span class="jsdoc-syntax">;
347
348         </span><span class="jsdoc-var">Roo.each</span><span class="jsdoc-syntax">(</span><span class="jsdoc-var">cls</span><span class="jsdoc-syntax">, </span><span class="jsdoc-keyword">function</span><span class="jsdoc-syntax">(</span><span class="jsdoc-var">c</span><span class="jsdoc-syntax">){
349             </span><span class="jsdoc-keyword">if</span><span class="jsdoc-syntax">(</span><span class="jsdoc-var">c </span><span class="jsdoc-syntax">== </span><span class="jsdoc-string">'bottom'</span><span class="jsdoc-syntax">){
350                 (</span><span class="jsdoc-keyword">function</span><span class="jsdoc-syntax">() {
351                  </span><span class="jsdoc-comment">//  
352                 </span><span class="jsdoc-syntax">})</span><span class="jsdoc-var">.defer</span><span class="jsdoc-syntax">(200);
353                  </span><span class="jsdoc-var">_this.picker</span><span class="jsdoc-syntax">()</span><span class="jsdoc-var">.alignTo</span><span class="jsdoc-syntax">(</span><span class="jsdoc-var">_this.inputEl</span><span class="jsdoc-syntax">(),   </span><span class="jsdoc-string">&quot;tr-br&quot;</span><span class="jsdoc-syntax">, [0, 10], </span><span class="jsdoc-keyword">false</span><span class="jsdoc-syntax">);
354                 </span><span class="jsdoc-comment">//_this.picker().setTop(_this.inputEl().getHeight());
355                 </span><span class="jsdoc-keyword">return</span><span class="jsdoc-syntax">;
356             }
357             </span><span class="jsdoc-keyword">if</span><span class="jsdoc-syntax">(</span><span class="jsdoc-var">c </span><span class="jsdoc-syntax">== </span><span class="jsdoc-string">'top'</span><span class="jsdoc-syntax">){
358                  </span><span class="jsdoc-var">_this.picker</span><span class="jsdoc-syntax">()</span><span class="jsdoc-var">.alignTo</span><span class="jsdoc-syntax">(</span><span class="jsdoc-var">_this.inputEl</span><span class="jsdoc-syntax">(),   </span><span class="jsdoc-string">&quot;br-tr&quot;</span><span class="jsdoc-syntax">, [0, 10], </span><span class="jsdoc-keyword">false</span><span class="jsdoc-syntax">);
359
360                 </span><span class="jsdoc-comment">//_this.picker().setTop(0 - _this.picker().getHeight());
361                 </span><span class="jsdoc-keyword">return</span><span class="jsdoc-syntax">;
362             }
363             </span><span class="jsdoc-comment">/*
364             if(c == 'left'){
365                 _this.picker().setLeft(_this.inputEl().getLeft() + _this.inputEl().getWidth() - _this.el.getLeft() - _this.picker().getWidth());
366                 return;
367             }
368             if(c == 'right'){
369                 _this.picker().setLeft(_this.inputEl().getLeft() - _this.el.getLeft());
370                 return;
371             }
372             */
373         </span><span class="jsdoc-syntax">});
374
375     },
376
377     </span><span class="jsdoc-var">onFocus </span><span class="jsdoc-syntax">: </span><span class="jsdoc-keyword">function</span><span class="jsdoc-syntax">()
378     {
379         </span><span class="jsdoc-var">Roo.bootstrap.form.TimeField.superclass.onFocus.call</span><span class="jsdoc-syntax">(</span><span class="jsdoc-var">this</span><span class="jsdoc-syntax">);
380         </span><span class="jsdoc-var">this.show</span><span class="jsdoc-syntax">();
381     },
382
383     </span><span class="jsdoc-var">onBlur </span><span class="jsdoc-syntax">: </span><span class="jsdoc-keyword">function</span><span class="jsdoc-syntax">()
384     {
385         </span><span class="jsdoc-var">Roo.bootstrap.form.TimeField.superclass.onBlur.call</span><span class="jsdoc-syntax">(</span><span class="jsdoc-var">this</span><span class="jsdoc-syntax">);
386         </span><span class="jsdoc-var">this.hide</span><span class="jsdoc-syntax">();
387     },
388
389     </span><span class="jsdoc-var">show </span><span class="jsdoc-syntax">: </span><span class="jsdoc-keyword">function</span><span class="jsdoc-syntax">()
390     {
391         </span><span class="jsdoc-var">this.picker</span><span class="jsdoc-syntax">()</span><span class="jsdoc-var">.show</span><span class="jsdoc-syntax">();
392         </span><span class="jsdoc-var">this.pop.show</span><span class="jsdoc-syntax">();
393         </span><span class="jsdoc-var">this.update</span><span class="jsdoc-syntax">();
394         </span><span class="jsdoc-var">this.place</span><span class="jsdoc-syntax">();
395
396         </span><span class="jsdoc-var">this.fireEvent</span><span class="jsdoc-syntax">(</span><span class="jsdoc-string">'show'</span><span class="jsdoc-syntax">, </span><span class="jsdoc-var">this</span><span class="jsdoc-syntax">, </span><span class="jsdoc-var">this.date</span><span class="jsdoc-syntax">);
397     },
398
399     </span><span class="jsdoc-var">hide </span><span class="jsdoc-syntax">: </span><span class="jsdoc-keyword">function</span><span class="jsdoc-syntax">()
400     {
401         </span><span class="jsdoc-var">this.picker</span><span class="jsdoc-syntax">()</span><span class="jsdoc-var">.hide</span><span class="jsdoc-syntax">();
402         </span><span class="jsdoc-var">this.pop.hide</span><span class="jsdoc-syntax">();
403
404         </span><span class="jsdoc-var">this.fireEvent</span><span class="jsdoc-syntax">(</span><span class="jsdoc-string">'hide'</span><span class="jsdoc-syntax">, </span><span class="jsdoc-var">this</span><span class="jsdoc-syntax">, </span><span class="jsdoc-var">this.date</span><span class="jsdoc-syntax">);
405     },
406
407     </span><span class="jsdoc-var">setTime </span><span class="jsdoc-syntax">: </span><span class="jsdoc-keyword">function</span><span class="jsdoc-syntax">()
408     {
409         </span><span class="jsdoc-var">this.hide</span><span class="jsdoc-syntax">();
410         </span><span class="jsdoc-var">this.setValue</span><span class="jsdoc-syntax">(</span><span class="jsdoc-var">this.time.format</span><span class="jsdoc-syntax">(</span><span class="jsdoc-var">this.format</span><span class="jsdoc-syntax">));
411
412         </span><span class="jsdoc-var">this.fireEvent</span><span class="jsdoc-syntax">(</span><span class="jsdoc-string">'select'</span><span class="jsdoc-syntax">, </span><span class="jsdoc-var">this</span><span class="jsdoc-syntax">, </span><span class="jsdoc-var">this.date</span><span class="jsdoc-syntax">);
413
414
415     },
416
417     </span><span class="jsdoc-var">onMousedown</span><span class="jsdoc-syntax">: </span><span class="jsdoc-keyword">function</span><span class="jsdoc-syntax">(</span><span class="jsdoc-var">e</span><span class="jsdoc-syntax">){
418         </span><span class="jsdoc-var">e.stopPropagation</span><span class="jsdoc-syntax">();
419         </span><span class="jsdoc-var">e.preventDefault</span><span class="jsdoc-syntax">();
420     },
421
422     </span><span class="jsdoc-var">onIncrementHours</span><span class="jsdoc-syntax">: </span><span class="jsdoc-keyword">function</span><span class="jsdoc-syntax">()
423     {
424         </span><span class="jsdoc-var">Roo.log</span><span class="jsdoc-syntax">(</span><span class="jsdoc-string">'onIncrementHours'</span><span class="jsdoc-syntax">);
425         </span><span class="jsdoc-var">this.time </span><span class="jsdoc-syntax">= </span><span class="jsdoc-var">this.time.add</span><span class="jsdoc-syntax">(</span><span class="jsdoc-var">Date.HOUR</span><span class="jsdoc-syntax">, 1);
426         </span><span class="jsdoc-var">this.update</span><span class="jsdoc-syntax">();
427
428     },
429
430     </span><span class="jsdoc-var">onDecrementHours</span><span class="jsdoc-syntax">: </span><span class="jsdoc-keyword">function</span><span class="jsdoc-syntax">()
431     {
432         </span><span class="jsdoc-var">Roo.log</span><span class="jsdoc-syntax">(</span><span class="jsdoc-string">'onDecrementHours'</span><span class="jsdoc-syntax">);
433         </span><span class="jsdoc-var">this.time </span><span class="jsdoc-syntax">= </span><span class="jsdoc-var">this.time.add</span><span class="jsdoc-syntax">(</span><span class="jsdoc-var">Date.HOUR</span><span class="jsdoc-syntax">, -1);
434         </span><span class="jsdoc-var">this.update</span><span class="jsdoc-syntax">();
435     },
436
437     </span><span class="jsdoc-var">onIncrementMinutes</span><span class="jsdoc-syntax">: </span><span class="jsdoc-keyword">function</span><span class="jsdoc-syntax">()
438     {
439         </span><span class="jsdoc-var">Roo.log</span><span class="jsdoc-syntax">(</span><span class="jsdoc-string">'onIncrementMinutes'</span><span class="jsdoc-syntax">);
440         </span><span class="jsdoc-keyword">var </span><span class="jsdoc-var">minutesToAdd </span><span class="jsdoc-syntax">= </span><span class="jsdoc-var">Math.round</span><span class="jsdoc-syntax">((</span><span class="jsdoc-var">parseInt</span><span class="jsdoc-syntax">(</span><span class="jsdoc-var">this.time.format</span><span class="jsdoc-syntax">(</span><span class="jsdoc-string">'i'</span><span class="jsdoc-syntax">)) + </span><span class="jsdoc-var">this.minuteStep</span><span class="jsdoc-syntax">) / </span><span class="jsdoc-var">this.minuteStep</span><span class="jsdoc-syntax">) * </span><span class="jsdoc-var">this.minuteStep </span><span class="jsdoc-syntax">- </span><span class="jsdoc-var">parseInt</span><span class="jsdoc-syntax">(</span><span class="jsdoc-var">this.time.format</span><span class="jsdoc-syntax">(</span><span class="jsdoc-string">'i'</span><span class="jsdoc-syntax">));
441         </span><span class="jsdoc-var">this.time </span><span class="jsdoc-syntax">= </span><span class="jsdoc-var">this.time.add</span><span class="jsdoc-syntax">(</span><span class="jsdoc-var">Date.MINUTE</span><span class="jsdoc-syntax">, </span><span class="jsdoc-var">minutesToAdd</span><span class="jsdoc-syntax">);
442         </span><span class="jsdoc-var">this.update</span><span class="jsdoc-syntax">();
443     },
444
445     </span><span class="jsdoc-var">onDecrementMinutes</span><span class="jsdoc-syntax">: </span><span class="jsdoc-keyword">function</span><span class="jsdoc-syntax">()
446     {
447         </span><span class="jsdoc-var">Roo.log</span><span class="jsdoc-syntax">(</span><span class="jsdoc-string">'onDecrementMinutes'</span><span class="jsdoc-syntax">);
448         </span><span class="jsdoc-keyword">var </span><span class="jsdoc-var">minutesToSubtract </span><span class="jsdoc-syntax">= </span><span class="jsdoc-var">parseInt</span><span class="jsdoc-syntax">(</span><span class="jsdoc-var">this.time.format</span><span class="jsdoc-syntax">(</span><span class="jsdoc-string">'i'</span><span class="jsdoc-syntax">)) - </span><span class="jsdoc-var">Math.round</span><span class="jsdoc-syntax">((</span><span class="jsdoc-var">parseInt</span><span class="jsdoc-syntax">(</span><span class="jsdoc-var">this.time.format</span><span class="jsdoc-syntax">(</span><span class="jsdoc-string">'i'</span><span class="jsdoc-syntax">)) - </span><span class="jsdoc-var">this.minuteStep</span><span class="jsdoc-syntax">) / </span><span class="jsdoc-var">this.minuteStep</span><span class="jsdoc-syntax">) * </span><span class="jsdoc-var">this.minuteStep</span><span class="jsdoc-syntax">;
449         </span><span class="jsdoc-var">this.time </span><span class="jsdoc-syntax">= </span><span class="jsdoc-var">this.time.add</span><span class="jsdoc-syntax">(</span><span class="jsdoc-var">Date.MINUTE</span><span class="jsdoc-syntax">, -1 * </span><span class="jsdoc-var">minutesToSubtract</span><span class="jsdoc-syntax">);
450         </span><span class="jsdoc-var">this.update</span><span class="jsdoc-syntax">();
451     },
452
453     </span><span class="jsdoc-var">onTogglePeriod</span><span class="jsdoc-syntax">: </span><span class="jsdoc-keyword">function</span><span class="jsdoc-syntax">()
454     {
455         </span><span class="jsdoc-var">Roo.log</span><span class="jsdoc-syntax">(</span><span class="jsdoc-string">'onTogglePeriod'</span><span class="jsdoc-syntax">);
456         </span><span class="jsdoc-var">this.time </span><span class="jsdoc-syntax">= </span><span class="jsdoc-var">this.time.add</span><span class="jsdoc-syntax">(</span><span class="jsdoc-var">Date.HOUR</span><span class="jsdoc-syntax">, 12);
457         </span><span class="jsdoc-var">this.update</span><span class="jsdoc-syntax">();
458     }
459
460
461 });
462
463
464 </span><span class="jsdoc-var">Roo.apply</span><span class="jsdoc-syntax">(</span><span class="jsdoc-var">Roo.bootstrap.form.TimeField</span><span class="jsdoc-syntax">,  {
465
466     </span><span class="jsdoc-var">template </span><span class="jsdoc-syntax">: {
467         </span><span class="jsdoc-var">tag</span><span class="jsdoc-syntax">: </span><span class="jsdoc-string">'div'</span><span class="jsdoc-syntax">,
468         </span><span class="jsdoc-var">cls</span><span class="jsdoc-syntax">: </span><span class="jsdoc-string">'datepicker dropdown-menu'</span><span class="jsdoc-syntax">,
469         </span><span class="jsdoc-var">cn</span><span class="jsdoc-syntax">: [
470             {
471                 </span><span class="jsdoc-var">tag</span><span class="jsdoc-syntax">: </span><span class="jsdoc-string">'div'</span><span class="jsdoc-syntax">,
472                 </span><span class="jsdoc-var">cls</span><span class="jsdoc-syntax">: </span><span class="jsdoc-string">'datepicker-time'</span><span class="jsdoc-syntax">,
473                 </span><span class="jsdoc-var">cn</span><span class="jsdoc-syntax">: [
474                 {
475                     </span><span class="jsdoc-var">tag</span><span class="jsdoc-syntax">: </span><span class="jsdoc-string">'table'</span><span class="jsdoc-syntax">,
476                     </span><span class="jsdoc-var">cls</span><span class="jsdoc-syntax">: </span><span class="jsdoc-string">'table-condensed'</span><span class="jsdoc-syntax">,
477                     </span><span class="jsdoc-var">cn</span><span class="jsdoc-syntax">:[
478                         {
479                             </span><span class="jsdoc-var">tag</span><span class="jsdoc-syntax">: </span><span class="jsdoc-string">'tbody'</span><span class="jsdoc-syntax">,
480                             </span><span class="jsdoc-var">cn</span><span class="jsdoc-syntax">: [
481                                 {
482                                     </span><span class="jsdoc-var">tag</span><span class="jsdoc-syntax">: </span><span class="jsdoc-string">'tr'</span><span class="jsdoc-syntax">,
483                                     </span><span class="jsdoc-var">cn</span><span class="jsdoc-syntax">: [
484                                     {
485                                         </span><span class="jsdoc-var">tag</span><span class="jsdoc-syntax">: </span><span class="jsdoc-string">'td'</span><span class="jsdoc-syntax">,
486                                         </span><span class="jsdoc-var">colspan</span><span class="jsdoc-syntax">: </span><span class="jsdoc-string">'7'
487                                     </span><span class="jsdoc-syntax">}
488                                     ]
489                                 }
490                             ]
491                         },
492                         {
493                             </span><span class="jsdoc-var">tag</span><span class="jsdoc-syntax">: </span><span class="jsdoc-string">'tfoot'</span><span class="jsdoc-syntax">,
494                             </span><span class="jsdoc-var">cn</span><span class="jsdoc-syntax">: [
495                                 {
496                                     </span><span class="jsdoc-var">tag</span><span class="jsdoc-syntax">: </span><span class="jsdoc-string">'tr'</span><span class="jsdoc-syntax">,
497                                     </span><span class="jsdoc-var">cn</span><span class="jsdoc-syntax">: [
498                                     {
499                                         </span><span class="jsdoc-var">tag</span><span class="jsdoc-syntax">: </span><span class="jsdoc-string">'th'</span><span class="jsdoc-syntax">,
500                                         </span><span class="jsdoc-var">colspan</span><span class="jsdoc-syntax">: </span><span class="jsdoc-string">'7'</span><span class="jsdoc-syntax">,
501                                         </span><span class="jsdoc-var">cls</span><span class="jsdoc-syntax">: </span><span class="jsdoc-string">''</span><span class="jsdoc-syntax">,
502                                         </span><span class="jsdoc-var">cn</span><span class="jsdoc-syntax">: [
503                                             {
504                                                 </span><span class="jsdoc-var">tag</span><span class="jsdoc-syntax">: </span><span class="jsdoc-string">'button'</span><span class="jsdoc-syntax">,
505                                                 </span><span class="jsdoc-var">cls</span><span class="jsdoc-syntax">: </span><span class="jsdoc-string">'btn btn-info ok'</span><span class="jsdoc-syntax">,
506                                                 </span><span class="jsdoc-var">html</span><span class="jsdoc-syntax">: </span><span class="jsdoc-string">'OK'
507                                             </span><span class="jsdoc-syntax">}
508                                         ]
509                                     }
510
511                                     ]
512                                 }
513                             ]
514                         }
515                     ]
516                 }
517                 ]
518             }
519         ]
520     }
521 });
522
523
524
525  </span></code></body></html>