Added strings of i18n and made the pin-keyboard work for rtl lang.

chrome/browser/resources/chromeos/quick_unlock/pin_keyboard.js

 // Copyright 2016 The Chromium Authors. All rights reserved.
 // Use of this source code is governed by a BSD-style license that can be
 // found in the LICENSE file.
 
 /**
  * @fileoverview
  * 'pin-keyboard' is a keyboard that can be used to enter PINs or more generally
  * numeric values.
  *
  * Properties:
  *    value: The value of the PIN keyboard. Writing to this property will adjust
  *           the PIN keyboard's value.
  *
  * Events:
  *    pin-change: Fired when the PIN value has changed. The pin is available at
  *                event.detail.pin.
  *    submit: Fired when the PIN is submitted. The pin is available at
  *            event.detail.pin.
  *
  * Example:
  *    <pin-keyboard on-pin-change="onPinChange" on-submit="onPinSubmit"
  *                  value="{{pinValue}}">
  *    </pin-keyboard>
  */
 Polymer({
   is: 'pin-keyboard',
 
+  behaviors: [
+    I18nBehavior,
+  ],
+
   properties: {
+    /**
+     * Whether or not the keyboard's input element should be numerical
+     * or password.
+     */
+    enablePassword: {
+      type: Boolean,
+      value: false
+    },
+
     /** The value stored in the keyboard's input element. */
     value: {
       type: String,
       notify: true,
       value: '',
       observer: 'onPinValueChange_'
     }
   },
 
   /** Transfers focus to the input element. */
@@ skipping 38 matching lines @@
       event.preventDefault();
       return;
     }
 
     // Enter pressed.
     if (event.keyCode == 13) {
       this.firePinSubmitEvent_();
       event.preventDefault();
       return;
     }
+  },
+
+  /**
+   * @private

[xiyuan, 2016/06/30 22:54:14]

nit: move this to the end of jsdoc, here and other places.

+   * Computes whether the input type for the pin input should be password or
+   * numerical.
+   */
+  computeInputType_: function(enablePassword) {
+    return enablePassword ? 'password' : 'number';
+  },
+
+  /**
+   * @private
+   * Computes the value of the pin input placeholder.
+   */
+  computeInputPlaceholder_: function(enablePassword) {
+    return enablePassword ? this.i18n('pinKeyboardPlaceholderPinPassword') :
+                            this.i18n('pinKeyboardPlaceholderPin');
+  },
+
+  /**
+   * @private
+   * Computes the direction of the pin input.
+   */
+  computeInputClass_: function(password) {
+    // +password will convert a string to a number or to NaN if that's not
+    // possible. Number.isInteger will verify the value is not a NaN and that it
+    // does not contain decimals.
+    //
+    // This heuristic will fail for inputs like '1.0'.
+    var enableRtl = (document.dir == 'rtl') && !Number.isInteger(+password);
+    return enableRtl ? 'input-non-pin' : '';

[xiyuan, 2016/06/30 22:54:14]

I am not quite follow. What are we trying to do here? Switching to RTL when
input is not a number? If so, what happens when Chrome uses a RTL lang such as
"ar"?

[jdufault, 2016/06/30 22:58:19]

The complication here is that the PIN keyboard accepts both a password and a
PIN.

If the user is entering a PIN, input should always be LTR.

If the user is entering a password, input should be RTL in RTL languages.

[xiyuan, 2016/06/30 23:09:34]

emm, would the default behavior of number input work properly? Think chrome
should handle bidi and show numbers as LTR. Why we need to explicitly set to LTR
for pin input? 

And with "direction: ltr" on #root, would that work properly for the digit
buttons on rtl?

   }
 });