]>
Commit | Line | Data |
---|---|---|
eafa9a65 DM |
1 | Ext.define('PMG.StatTimeSelector', { |
2 | extend: 'Ext.container.Container', | |
3 | xtype: 'pmgStatTimeSelector', | |
4 | ||
5 | statics: { | |
6 | selected_year: undefined, | |
7 | selected_month: undefined, | |
8 | selected_day: undefined, | |
9 | ||
28eb60c0 TL |
10 | initSelected: function() { |
11 | let today = new Date(); | |
12 | this.selected_year = today.getFullYear(); | |
13 | this.selected_month = today.getMonth() + 1; | |
14 | this.selected_day = today.getDate(); | |
15 | }, | |
eafa9a65 | 16 | |
28eb60c0 TL |
17 | getTimeSpan: function() { |
18 | if (this.selected_year === undefined) { | |
19 | this.initSelected(); | |
20 | } | |
21 | const year = this.selected_year; | |
22 | const month = this.selected_month; | |
23 | const day = this.selected_day; | |
c87d46fb | 24 | |
28eb60c0 | 25 | let starttime, endtime; |
eafa9a65 DM |
26 | if (!month) { |
27 | starttime = new Date(year, 0); | |
28 | endtime = new Date(year + 1, 0); | |
29 | } else if (!day) { | |
30 | starttime = new Date(year, month - 1); | |
31 | endtime = new Date(year, month); | |
32 | } else { | |
33 | starttime = new Date(year, month - 1, day); | |
34 | endtime = new Date(year, month - 1, day + 1); | |
35 | } | |
36 | ||
28eb60c0 TL |
37 | return { |
38 | starttime: (starttime.getTime() / 1000).toFixed(0), | |
39 | endtime: (endtime.getTime() / 1000).toFixed(0), | |
40 | }; | |
c87d46fb | 41 | }, |
eafa9a65 | 42 | }, |
c87d46fb | 43 | |
eafa9a65 | 44 | layout: { |
c87d46fb | 45 | type: 'hbox', |
eafa9a65 | 46 | }, |
c87d46fb | 47 | |
eafa9a65 DM |
48 | controller: { |
49 | xclass: 'Ext.app.ViewController', | |
50 | ||
51 | updateVisibility: function() { | |
28eb60c0 | 52 | let view = this.getView(); |
c87d46fb | 53 | |
28eb60c0 TL |
54 | let yearsel = this.lookupReference('yearsel'); |
55 | let monthsel = this.lookupReference('monthsel'); | |
56 | let daysel = this.lookupReference('daysel'); | |
eafa9a65 | 57 | |
28eb60c0 TL |
58 | let year = yearsel.getValue(); |
59 | let month = monthsel.getValue(); | |
eafa9a65 DM |
60 | daysel.setVisible(month !== 0); |
61 | if (!month) { | |
62 | daysel.setValue(0); | |
63 | } | |
28eb60c0 | 64 | let day = daysel.getValue(); |
eafa9a65 | 65 | |
28eb60c0 | 66 | let statics = Ext.getClass(view); |
eafa9a65 DM |
67 | |
68 | statics.selected_year = year; | |
69 | statics.selected_month = month; | |
70 | statics.selected_day = day; | |
71 | ||
28eb60c0 | 72 | let data = statics.getTimeSpan(); |
eafa9a65 DM |
73 | Ext.GlobalEvents.fireEvent('pmgStatTimeSelectorUpdate', data); |
74 | }, | |
c87d46fb | 75 | |
c4d58b03 DC |
76 | updateMaxDays: function() { |
77 | let year = this.lookup('yearsel').getValue(); | |
78 | let month = this.lookup('monthsel').getValue(); | |
79 | // get last day of current month by wrapping back day 0 from next (zero indexed) month | |
80 | let maxDays = new Date(year, month, 0).getDate(); | |
81 | this.lookup('daysel').getStore().setFilters([{ | |
82 | property: 'day', | |
83 | operator: '<=', | |
84 | value: maxDays, | |
85 | }]); | |
86 | }, | |
87 | ||
eafa9a65 | 88 | onSelect: function() { |
c4d58b03 | 89 | this.updateMaxDays(); |
eafa9a65 DM |
90 | this.updateVisibility(); |
91 | }, | |
c87d46fb | 92 | |
eafa9a65 | 93 | init: function(view) { |
28eb60c0 | 94 | let statics = Ext.getClass(view); |
c87d46fb | 95 | |
28eb60c0 TL |
96 | let yearsel = this.lookupReference('yearsel'); |
97 | let monthsel = this.lookupReference('monthsel'); | |
98 | let daysel = this.lookupReference('daysel'); | |
c87d46fb | 99 | |
eafa9a65 DM |
100 | yearsel.setValue(statics.selected_year); |
101 | monthsel.setValue(statics.selected_month); | |
ccbf186f | 102 | daysel.setValue(statics.selected_month ? statics.selected_day : 0); |
eafa9a65 DM |
103 | |
104 | this.updateVisibility(); | |
c87d46fb | 105 | }, |
eafa9a65 | 106 | }, |
c87d46fb | 107 | |
eafa9a65 DM |
108 | items: [ |
109 | { | |
110 | xtype: 'combobox', | |
111 | reference: 'yearsel', | |
112 | store: { | |
c87d46fb | 113 | fields: ['year'], |
eafa9a65 | 114 | data: (function() { |
28eb60c0 TL |
115 | let today = new Date(); |
116 | let year = today.getFullYear(); | |
c87d46fb TL |
117 | return [{ year: year }, { year: year -1 }, { year: year -2 }]; |
118 | }()), | |
eafa9a65 DM |
119 | }, |
120 | listeners: { select: 'onSelect' }, | |
c87d46fb | 121 | value: new Date().getFullYear(), |
eafa9a65 DM |
122 | queryMode: 'local', |
123 | displayField: 'year', | |
124 | editable: false, | |
c87d46fb | 125 | valueField: 'year', |
eafa9a65 DM |
126 | }, |
127 | { | |
128 | xtype: 'combobox', | |
129 | reference: 'monthsel', | |
130 | store: { | |
c87d46fb | 131 | fields: ['month', 'name'], |
eafa9a65 | 132 | data: (function() { |
28eb60c0 TL |
133 | let i; |
134 | let data = [{ month: 0, name: gettext('Whole year') }]; | |
eafa9a65 | 135 | for (i = 1; i <= 12; i++) { |
c87d46fb | 136 | data.push({ month: i, name: Ext.Date.monthNames[i-1] }); |
eafa9a65 DM |
137 | } |
138 | return data; | |
c87d46fb | 139 | }()), |
eafa9a65 DM |
140 | }, |
141 | listeners: { select: 'onSelect' }, | |
142 | queryMode: 'local', | |
143 | displayField: 'name', | |
144 | editable: false, | |
c87d46fb | 145 | valueField: 'month', |
eafa9a65 DM |
146 | }, |
147 | { | |
148 | xtype: 'combobox', | |
149 | reference: 'daysel', | |
150 | store: { | |
c87d46fb | 151 | fields: ['day', 'name'], |
eafa9a65 | 152 | data: (function() { |
28eb60c0 TL |
153 | let i; |
154 | let data = [{ day: 0, name: gettext('Whole month') }]; | |
eafa9a65 | 155 | for (i = 1; i <= 31; i++) { |
c87d46fb | 156 | data.push({ day: i, name: i }); |
eafa9a65 DM |
157 | } |
158 | return data; | |
c87d46fb | 159 | }()), |
eafa9a65 DM |
160 | }, |
161 | listeners: { select: 'onSelect' }, | |
162 | queryMode: 'local', | |
163 | displayField: 'name', | |
164 | editable: false, | |
c87d46fb TL |
165 | valueField: 'day', |
166 | }, | |
167 | ], | |
eafa9a65 | 168 | }); |