Bug 1301312 - Part 1: Localize AM/PM strings for <input type=time>. r?mconley, gandalf
MozReview-Commit-ID: 2QycAbnHmHv
--- a/toolkit/content/widgets/datetimebox.xml
+++ b/toolkit/content/widgets/datetimebox.xml
@@ -439,20 +439,26 @@
<stylesheet src="chrome://global/content/textbox.css"/>
<stylesheet src="chrome://global/skin/textbox.css"/>
<stylesheet src="chrome://global/content/bindings/datetimebox.css"/>
</resources>
<implementation>
<constructor>
<![CDATA[
- // TODO: Bug 1301312 - localization for input type=time input.
+ const kDefaultAMString = "AM";
+ const kDefaultPMString = "PM";
+
+ let { amString, pmString } =
+ this.getStringsForLocale(this.mLocales);
+
+ this.mAMIndicator = amString || kDefaultAMString;
+ this.mPMIndicator = pmString || kDefaultPMString;
+
this.mHour12 = true;
- this.mAMIndicator = "AM";
- this.mPMIndicator = "PM";
this.mPlaceHolder = "--";
this.mSeparatorText = ":";
this.mMillisecSeparatorText = ".";
this.mMaxLength = 2;
this.mMillisecMaxLength = 3;
this.mDefaultStep = 60 * 1000; // in milliseconds
this.mMinHourInHour12 = 1;
@@ -472,16 +478,22 @@
this.mHourField.setAttribute("typeBuffer", "");
this.mMinuteField =
document.getAnonymousElementByAttribute(this, "anonid", "input-two");
this.mMinuteField.setAttribute("typeBuffer", "");
this.mDayPeriodField =
document.getAnonymousElementByAttribute(this, "anonid", "input-three");
this.mDayPeriodField.classList.remove("numeric");
+ let dayPeriodLength =
+ Math.max(this.mAMIndicator.length, this.mPMIndicator.length);
+
+ this.mDayPeriodField.size = dayPeriodLength;
+ this.mDayPeriodField.maxLength = dayPeriodLength;
+
this.mHourField.placeholder = this.mPlaceHolder;
this.mMinuteField.placeholder = this.mPlaceHolder;
this.mDayPeriodField.placeholder = this.mPlaceHolder;
this.mHourField.setAttribute("min", this.mMinHourInHour12);
this.mHourField.setAttribute("max", this.mMaxHourInHour12);
this.mMinuteField.setAttribute("min", this.mMinMinute);
this.mMinuteField.setAttribute("max", this.mMaxMinute);
@@ -547,16 +559,43 @@
field.placeholder = aPlaceHolder;
container.insertBefore(field, this.mSpaceSeparator);
return field;
]]>
</body>
</method>
+ <method name="getStringsForLocale">
+ <parameter name="aLocales"/>
+ <body>
+ <![CDATA[
+ this.log("getStringsForLocale: " + aLocales);
+
+ let intlUtils = window.intlUtils;
+ if (!intlUtils) {
+ return {};
+ }
+
+ let amString, pmString;
+ let keys = [ "dates/gregorian/dayperiods/am",
+ "dates/gregorian/dayperiods/pm" ];
+
+ let result = intlUtils.getDisplayNames(this.mLocales, {
+ style: "short",
+ keys
+ });
+
+ [ amString, pmString ] = keys.map(key => result.values[key]);
+
+ return { amString, pmString };
+ ]]>
+ </body>
+ </method>
+
<method name="setFieldsFromInputValue">
<body>
<![CDATA[
let value = this.mInputElement.value;
if (!value) {
this.clearInputFields(true);
return;
}
@@ -1019,16 +1058,17 @@
</html:div>
</content>
<implementation implements="nsIDateTimeInputArea">
<constructor>
<![CDATA[
this.DEBUG = false;
this.mInputElement = this.parentNode;
+ this.mLocales = window.getAppLocalesAsBCP47();
this.mMin = this.mInputElement.min;
this.mMax = this.mInputElement.max;
this.mStep = this.mInputElement.step;
this.mIsPickerOpen = false;
this.mResetButton =
document.getAnonymousElementByAttribute(this, "anonid", "reset-button");