Bug 1382175 - Fix time picker step and min/max regressions. r=mconley
Bug 1363672 uses .getStep() to obtain the step size for an input element in ms,
so we won't need to do conversion anymore.
Bug 1364026 uses .getMinimum() and
.getMaximum() to obtain min and max in ms, rather than strings.
MozReview-Commit-ID: pFNcsqEaC0
--- a/toolkit/content/widgets/timekeeper.js
+++ b/toolkit/content/widgets/timekeeper.js
@@ -9,17 +9,17 @@
* format (12/24hr), TimeKeeper will determine the ranges of possible
* selections, and whether or not the current time state is out of range
* or off step.
*
* @param {Object} props
* {
* {Date} min
* {Date} max
- * {Number} stepInMs
+ * {Number} step
* {String} format: Either "12" or "24"
* }
*/
function TimeKeeper(props) {
this.props = props;
this.state = { time: new Date(0), ranges: {} };
}
@@ -279,25 +279,25 @@ function TimeKeeper(props) {
* @param {Function} formatter: Outputs time in a particular format
* @return {Array<Object>}
* {
* {Number} value
* {Boolean} enabled
* }
*/
_getSteps(startValue, endValue, minStep, formatter) {
- const { min, max, stepInMs } = this.props;
+ const { min, max, step } = this.props;
// The timeStep should be big enough so that there won't be
// duplications. Ex: minimum step for minute should be 60000ms,
// if smaller than that, next step might return the same minute.
- const timeStep = Math.max(minStep, stepInMs);
+ const timeStep = Math.max(minStep, step);
// Make sure the starting point and end point is not off step
let time = min.valueOf() + Math.ceil((startValue - min.valueOf()) / timeStep) * timeStep;
- let maxValue = min.valueOf() + Math.floor((max.valueOf() - min.valueOf()) / stepInMs) * stepInMs;
+ let maxValue = min.valueOf() + Math.floor((max.valueOf() - min.valueOf()) / step) * step;
let steps = [];
// Increment by timeStep until reaching the end of the range.
while (time <= endValue) {
steps.push({
value: formatter(time),
// Check if the value is within the min and max. If it's out of range,
// also check for the case when minStep is too large, and has stepped out
@@ -403,14 +403,14 @@ function TimeKeeper(props) {
/**
* Checks if the time state is off step.
*
* @param {Date} time
* @return {Boolean}
*/
_isOffStep(time) {
- const { min, stepInMs } = this.props;
+ const { min, step } = this.props;
- return (time.valueOf() - min.valueOf()) % stepInMs != 0;
+ return (time.valueOf() - min.valueOf()) % step != 0;
}
};
}
--- a/toolkit/content/widgets/timepicker.js
+++ b/toolkit/content/widgets/timepicker.js
@@ -9,30 +9,28 @@
function TimePicker(context) {
this.context = context;
this._attachEventListeners();
}
{
const DAY_PERIOD_IN_HOURS = 12,
- SECOND_IN_MS = 1000,
- MINUTE_IN_MS = 60000,
DAY_IN_MS = 86400000;
TimePicker.prototype = {
/**
* Initializes the time picker. Set the default states and properties.
* @param {Object} props
* {
* {Number} hour [optional]: Hour in 24 hours format (0~23), default is current hour
* {Number} minute [optional]: Minute (0~59), default is current minute
- * {String} min [optional]: Minimum time, in 24 hours format. ex: "05:45"
- * {String} max [optional]: Maximum time, in 24 hours format. ex: "23:00"
- * {Number} step [optional]: Step size in minutes. Default is 60.
+ * {Number} min: Minimum time, in ms
+ * {Number} max: Maximum time, in ms
+ * {Number} step: Step size in ms
* {String} format [optional]: "12" for 12 hours, "24" for 24 hours format
* {String} locale [optional]: User preferred locale
* }
*/
init(props) {
this.props = props || {};
this._setDefaultState();
this._createComponents();
@@ -46,41 +44,28 @@ function TimePicker(context) {
* and format (12 or 24).
*/
_setDefaultState() {
const { hour, minute, min, max, step, format } = this.props;
const now = new Date();
let timerHour = hour == undefined ? now.getHours() : hour;
let timerMinute = minute == undefined ? now.getMinutes() : minute;
-
- // The spec defines 1 step == 1 second, need to convert to ms for timekeeper
let timeKeeper = new TimeKeeper({
- min: this._parseTimeString(min) || new Date(0),
- max: this._parseTimeString(max) || new Date(DAY_IN_MS - 1),
- stepInMs: step ? step * SECOND_IN_MS : MINUTE_IN_MS,
+ min: new Date(Number.isNaN(min) ? 0 : min),
+ max: new Date(Number.isNaN(max) ? DAY_IN_MS - 1 : max),
+ step,
format: format || "12"
});
timeKeeper.setState({ hour: timerHour, minute: timerMinute });
this.state = { timeKeeper };
},
/**
- * Convert a time string from DOM attribute to a date object.
- *
- * @param {String} timeString: (ex. "10:30", "23:55", "12:34:56.789")
- * @return {Date/Boolean} Date object or false if date is invalid.
- */
- _parseTimeString(timeString) {
- let time = new Date("1970-01-01T" + timeString + "Z");
- return time.toString() == "Invalid Date" ? false : time;
- },
-
- /**
* Initalize the spinner components.
*/
_createComponents() {
const { locale, format } = this.props;
const { timeKeeper } = this.state;
const wrapSetValueFn = (setTimeFunction) => {
return (value) => {