You are viewing a plain text version of this content. The canonical link for it is here.
Posted to commits@allura.apache.org by br...@apache.org on 2015/08/12 20:54:10 UTC

allura git commit: [#7959] set focus to our input box initially, as well as after errors and when proceeding to next step

Repository: allura
Updated Branches:
  refs/heads/db/7959 [created] 96538161c


[#7959] set focus to our input box initially, as well as after errors and when proceeding to next step


Project: http://git-wip-us.apache.org/repos/asf/allura/repo
Commit: http://git-wip-us.apache.org/repos/asf/allura/commit/96538161
Tree: http://git-wip-us.apache.org/repos/asf/allura/tree/96538161
Diff: http://git-wip-us.apache.org/repos/asf/allura/diff/96538161

Branch: refs/heads/db/7959
Commit: 96538161cc5b03e24a86fedb8a9e72b40165a0c6
Parents: 4090d3b
Author: Dave Brondsema <db...@slashdotmedia.com>
Authored: Wed Aug 12 18:53:38 2015 +0000
Committer: Dave Brondsema <db...@slashdotmedia.com>
Committed: Wed Aug 12 18:53:38 2015 +0000

----------------------------------------------------------------------
 Allura/allura/public/nf/js/phone-verification.js | 19 ++++++++++++++-----
 1 file changed, 14 insertions(+), 5 deletions(-)
----------------------------------------------------------------------


http://git-wip-us.apache.org/repos/asf/allura/blob/96538161/Allura/allura/public/nf/js/phone-verification.js
----------------------------------------------------------------------
diff --git a/Allura/allura/public/nf/js/phone-verification.js b/Allura/allura/public/nf/js/phone-verification.js
index 4af2a9e..01792fe 100644
--- a/Allura/allura/public/nf/js/phone-verification.js
+++ b/Allura/allura/public/nf/js/phone-verification.js
@@ -48,7 +48,7 @@ function render(state) {
 
 var FormStepMixin = {
 
-  /* 
+  /*
    * Subclasses must implement:
    *   - getAPIUrl(): return API url this step will submit to
    *   - getAPIData(): returns data to submit to API url
@@ -60,11 +60,13 @@ var FormStepMixin = {
   render: function() {
     var input_props = {
       type: 'text',
+      ref: 'mainInput',
       className: grid,
       value: this.props.state[this.getKey()],
       disabled: this.isInputDisabled(),
       onChange: this.handleChange,
-      onKeyDown: this.onKeyDown
+      onKeyDown: this.onKeyDown,
+      autoFocus: true
     };
     var button_props = {
       onClick: this.handleClick,
@@ -83,6 +85,13 @@ var FormStepMixin = {
                dom('button', button_props, 'Submit')));
   },
 
+  componentDidMount: function() {
+    React.findDOMNode(this.refs.mainInput).focus();
+  },
+  componentDidUpdate: function() {
+    React.findDOMNode(this.refs.mainInput).focus();
+  },
+
   getErrorHtml: function() {
     return {__html: this.props.state.error || '&nbsp;'};
   },
@@ -94,7 +103,7 @@ var FormStepMixin = {
 
   getMessage: function() { return this.getHtml('message-' + this.getKey()); },
   getExtraMessage: function() { return this.getHtml('message-extra'); },
-  
+
   handleClick: function() {
     if (!this.isButtonDisabled()) {
       set_state({error: null});
@@ -146,7 +155,7 @@ var FormStepMixin = {
 
 var StepVerify = React.createClass({
   mixins: [FormStepMixin],
-  
+
   getAPIUrl: function() { return 'verify_phone'; },
   getAPIData: function() { return {'number': this.props.state[this.getKey()]}; },
   getLabel: function() { return 'Enter phone number'; },
@@ -156,7 +165,7 @@ var StepVerify = React.createClass({
 
 var StepCheck = React.createClass({
   mixins: [FormStepMixin],
-  
+
   getAPIUrl: function() { return 'check_phone_verification'; },
   getAPIData: function() { return {'pin': this.props.state[this.getKey()]}; },
   getLabel: function() { return 'Enter your PIN'; },