OLD | NEW |
---|---|
(Empty) | |
1 // Copyright 2014 The Chromium Authors. All rights reserved. | |
2 // Use of this source code is governed by a BSD-style license that can be | |
3 // found in the LICENSE file. | |
4 | |
5 cr.define('settime', function() { | |
6 /** | |
7 * TimeSetter handles a dialog to check and set system time. It can also | |
8 * include a timezone dropdown if timezoneId is provided. | |
9 * | |
10 * TimeSetter uses the system time to populate the controls initially and | |
11 * update them as the system time or timezone changes, and notifies Chrome | |
12 * when the user changes the time or timezone. | |
13 * @constructor | |
14 */ | |
15 function TimeSetter() {} | |
16 | |
17 cr.addSingletonGetter(TimeSetter); | |
18 | |
19 /** @const */ var BODY_PADDING_PX = 20; | |
20 /** @const */ var LABEL_PADDING_PX = 5; | |
21 | |
22 TimeSetter.prototype = { | |
23 /** | |
24 * Performs initial setup. | |
25 */ | |
26 initialize: function() { | |
27 // Store values for reverting inputs when the user's date/time is invalid. | |
28 this.prevValues_ = {}; | |
29 | |
30 // The build time doesn't include a timezone, so subtract 1 day to get a | |
31 // safe minimum date. | |
32 this.minDate_ = new Date(loadTimeData.getValue('buildTime')); | |
33 this.minDate_.setDate(this.minDate_.getDate() - 1); | |
34 | |
35 // Set the max date to the min date plus 20 years. | |
36 this.maxDate_ = new Date(this.minDate_); | |
37 this.maxDate_.setYear(this.minDate_.getFullYear() + 20); | |
38 | |
39 // Make sure the ostensible date is within this range. | |
40 var now = new Date(); | |
41 if (now > this.maxDate_) | |
42 this.maxDate_ = now; | |
43 else if (now < this.minDate_) | |
44 this.minDate_ = now; | |
45 | |
46 $('date').setAttribute('min', this.toHtmlValues_(this.minDate_).date); | |
47 $('date').setAttribute('max', this.toHtmlValues_(this.maxDate_).date); | |
48 | |
49 this.updateTime_(); | |
50 | |
51 // Show the timezone select if we have a timezone ID. | |
52 var currentTimezoneId = loadTimeData.getValue('currentTimezoneId'); | |
53 if (currentTimezoneId !== '') { | |
Dan Beam
2014/04/24 21:54:33
if (currentTimezoneId)
michaelpg
2014/04/24 22:42:48
Done.
| |
54 this.setTimezone_(currentTimezoneId); | |
55 $('timezone-select').addEventListener( | |
56 'change', this.onTimezoneChange_.bind(this), false); | |
57 $('timezone').hidden = false; | |
58 } | |
59 | |
60 this.sizeToFit_(); | |
61 | |
62 $('time').addEventListener('blur', this.onTimeBlur_.bind(this), false); | |
63 $('date').addEventListener('blur', this.onTimeBlur_.bind(this), false); | |
64 | |
65 $('done').addEventListener('click', this.onSubmit_.bind(this), false); | |
66 }, | |
67 | |
68 /** | |
69 * Sets the current timezone. | |
70 * @param {string} timezoneId The timezone ID to select. | |
71 * @private | |
72 */ | |
73 setTimezone_: function(timezoneId) { | |
74 $('timezone-select').value = timezoneId; | |
75 this.updateTime_(); | |
76 }, | |
77 | |
78 /** | |
79 * Updates the date/time controls to the current local time. | |
80 * Called initially, then called again once a minute. | |
81 * @private | |
82 */ | |
83 updateTime_: function() { | |
84 var now = new Date(); | |
85 | |
86 // Only update time controls if neither is focused or one is invalid. | |
87 if ((document.activeElement.id != 'date' && | |
88 document.activeElement.id != 'time') || | |
89 $('date').value === '' || $('time').value === '') { | |
90 var htmlValues = this.toHtmlValues_(now); | |
91 this.prevValues_.date = $('date').value = htmlValues.date; | |
92 this.prevValues_.time = $('time').value = htmlValues.time; | |
93 } | |
94 | |
95 window.clearTimeout(this.timeTimeout_); | |
96 | |
97 // Start timer to update these inputs every minute. | |
98 var secondsRemaining = 60 - now.getSeconds(); // 0 <= getSeconds() < 60 | |
Dan Beam
2014/04/24 21:54:33
remove commented code
michaelpg
2014/04/24 22:42:48
Done.
| |
99 this.timeTimeout_ = window.setTimeout(this.updateTime_.bind(this), | |
100 secondsRemaining * 1000); | |
101 }, | |
102 | |
103 /** | |
104 * Attempts to set the system time to the time given by the controls. | |
105 * @private | |
106 */ | |
107 applyTime_: function() { | |
108 var date = $('date').valueAsDate; | |
109 date.setMilliseconds(date.getMilliseconds() + $('time').valueAsNumber); | |
110 | |
111 // Add timezone offset to get real time. | |
112 date.setMinutes(date.getMinutes() + date.getTimezoneOffset()); | |
113 | |
114 var seconds = Math.floor(date / 1000); | |
115 chrome.send('setTimeInSeconds', [seconds]); | |
116 }, | |
117 | |
118 /** | |
119 * Handles events for the date/time controls. | |
120 * @param {Event} e The blur event. | |
121 * @private | |
122 */ | |
123 onTimeBlur_: function(e) { | |
124 if (e.target.validity.valid && e.target.value !== '') { | |
Dan Beam
2014/04/24 21:54:33
if (e.target.validity.valid && e.target.value)
michaelpg
2014/04/24 22:42:48
Done.
| |
125 // Make this the new fallback time in case of future invalid input. | |
126 this.prevValues_[e.target.id] = e.target.value; | |
127 this.applyTime_(); | |
128 } else { | |
129 // Restore previous value. | |
130 e.target.value = this.prevValues_[e.target.id]; | |
131 } | |
132 }, | |
133 | |
134 /** | |
135 * Handles events for the timezone control. | |
136 * @param {Event} e The change event. | |
137 * @private | |
138 */ | |
139 onTimezoneChange_: function(e) { | |
140 chrome.send('setTimezone', [e.target.value]); | |
141 }, | |
142 | |
143 /** | |
144 * Handles events for the submit button. | |
145 * @param {Event} e The click event. | |
146 * @private | |
147 */ | |
148 onSubmit_: function(e) { | |
149 chrome.send('DialogClose'); | |
150 }, | |
151 | |
152 /** | |
153 * Resizes the window if necessary to show the entire contents. | |
154 * @private | |
155 */ | |
156 sizeToFit_: function() { | |
157 // Because of l10n, we should check that the vertical content can fit | |
158 // within the window. | |
159 if (window.innerHeight < document.body.scrollHeight) { | |
160 var newHeight = document.body.scrollHeight + | |
161 window.outerHeight - window.innerHeight; // title bar | |
Dan Beam
2014/04/24 21:54:33
chrome webui code (and chrome code in general) doe
michaelpg
2014/04/24 22:42:48
Done.
| |
162 window.resizeTo(window.outerWidth, newHeight); | |
163 } | |
164 }, | |
165 | |
166 /** | |
167 * Builds date and time strings suitable for the values of HTML date and | |
168 * time elements. | |
169 * @param {Date} date The date object to represent. | |
170 * @return {Object} A pair of strings in the following format: | |
Dan Beam
2014/04/24 21:54:33
@return {{date: string, time: string}} Date is an
michaelpg
2014/04/24 22:42:48
Done.
| |
171 * { | |
172 * date: 'Full-date string as defined in RFC 3339', | |
173 * time: 'Time string as "HH:MM"' | |
174 * } | |
Dan Beam
2014/04/24 21:54:33
indent off
michaelpg
2014/04/24 22:42:48
Done.
| |
175 * @private | |
176 */ | |
177 toHtmlValues_: function(date) { | |
178 // Get the current time and subtract the timezone offset, so the | |
179 // JSON string is in local time. | |
180 var localDate = new Date(date); | |
181 localDate.setMinutes(date.getMinutes() - date.getTimezoneOffset()); | |
182 return { | |
183 date: localDate.toISOString().slice(0, 10), | |
184 time: localDate.toISOString().slice(11, 16) | |
185 }; | |
Dan Beam
2014/04/24 21:54:33
nit:
return {date: localDate.toISOString().slic
michaelpg
2014/04/24 22:42:48
Done.
| |
186 }, | |
187 }; | |
188 | |
189 TimeSetter.setTimezone = function(timezoneId) { | |
190 TimeSetter.getInstance().setTimezone_(timezoneId); | |
191 }; | |
192 | |
193 TimeSetter.updateTime = function() { | |
194 TimeSetter.getInstance().updateTime_(); | |
195 }; | |
196 | |
197 return { | |
198 TimeSetter: TimeSetter | |
199 }; | |
200 }); | |
201 | |
202 document.addEventListener( | |
203 'DOMContentLoaded', | |
204 settime.TimeSetter.getInstance().initialize.bind( | |
205 settime.TimeSetter.getInstance())); | |
Dan Beam
2014/04/24 21:54:33
document.addEventListener('DOMContentLoaded', func
michaelpg
2014/04/24 22:42:48
Done.
| |
OLD | NEW |