From 020df6f5cb8077133b8705a6efb97805444a9b2c Mon Sep 17 00:00:00 2001
From: epriestley <git@epriestley.com>
Date: Sat, 23 Jul 2016 13:28:02 -0700
Subject: [PATCH] Add a numeric input control for TOTP codes

Summary:
Fixes T11365. I tested these variants:

  - `<input type="number" />`
  - `<input type="text" pattern="\d*" />`

Of these, this one (using `pattern`) appears to have the best behavior: it shows the correct keyboard on iOS mobile and does nothing on desktops.

Using `type="number"` causes unwanted sub-controls to appear in desktop Safari, and a numbers + symbols keyboard to appear on iOS (presumably so users can type "." and "-" and maybe ",").

Test Plan: Tested variants in desktop browsers and iOS simulator, see here and T11365 for discussion.

Reviewers: chad

Reviewed By: chad

Maniphest Tasks: T11365

Differential Revision: https://secure.phabricator.com/D16323
---
 src/__phutil_library_map__.php                |  2 ++
 .../auth/factor/PhabricatorTOTPAuthFactor.php |  2 +-
 .../form/control/PHUIFormNumberControl.php    | 22 +++++++++++++++++++
 3 files changed, 25 insertions(+), 1 deletion(-)
 create mode 100644 src/view/form/control/PHUIFormNumberControl.php

diff --git a/src/__phutil_library_map__.php b/src/__phutil_library_map__.php
index 3700788483..2c72ce85da 100644
--- a/src/__phutil_library_map__.php
+++ b/src/__phutil_library_map__.php
@@ -1626,6 +1626,7 @@ phutil_register_library_map(array(
     'PHUIFormIconSetControl' => 'view/form/control/PHUIFormIconSetControl.php',
     'PHUIFormInsetView' => 'view/form/PHUIFormInsetView.php',
     'PHUIFormLayoutView' => 'view/form/PHUIFormLayoutView.php',
+    'PHUIFormNumberControl' => 'view/form/control/PHUIFormNumberControl.php',
     'PHUIHandleListView' => 'applications/phid/view/PHUIHandleListView.php',
     'PHUIHandleTagListView' => 'applications/phid/view/PHUIHandleTagListView.php',
     'PHUIHandleView' => 'applications/phid/view/PHUIHandleView.php',
@@ -6185,6 +6186,7 @@ phutil_register_library_map(array(
     'PHUIFormIconSetControl' => 'AphrontFormControl',
     'PHUIFormInsetView' => 'AphrontView',
     'PHUIFormLayoutView' => 'AphrontView',
+    'PHUIFormNumberControl' => 'AphrontFormControl',
     'PHUIHandleListView' => 'AphrontTagView',
     'PHUIHandleTagListView' => 'AphrontTagView',
     'PHUIHandleView' => 'AphrontView',
diff --git a/src/applications/auth/factor/PhabricatorTOTPAuthFactor.php b/src/applications/auth/factor/PhabricatorTOTPAuthFactor.php
index b5124ab3ec..2910dc0610 100644
--- a/src/applications/auth/factor/PhabricatorTOTPAuthFactor.php
+++ b/src/applications/auth/factor/PhabricatorTOTPAuthFactor.php
@@ -132,7 +132,7 @@ final class PhabricatorTOTPAuthFactor extends PhabricatorAuthFactor {
         'the authenticator correctly:'));
 
     $form->appendChild(
-      id(new AphrontFormTextControl())
+      id(new PHUIFormNumberControl())
         ->setLabel(pht('TOTP Code'))
         ->setName('totpcode')
         ->setValue($code)
diff --git a/src/view/form/control/PHUIFormNumberControl.php b/src/view/form/control/PHUIFormNumberControl.php
new file mode 100644
index 0000000000..d65e590746
--- /dev/null
+++ b/src/view/form/control/PHUIFormNumberControl.php
@@ -0,0 +1,22 @@
+<?php
+
+final class PHUIFormNumberControl extends AphrontFormControl {
+
+  protected function getCustomControlClass() {
+    return 'phui-form-number';
+  }
+
+  protected function renderInput() {
+    return javelin_tag(
+      'input',
+      array(
+        'type' => 'text',
+        'pattern' => '\d*',
+        'name' => $this->getName(),
+        'value' => $this->getValue(),
+        'disabled' => $this->getDisabled() ? 'disabled' : null,
+        'id' => $this->getID(),
+      ));
+  }
+
+}