From 344ab9813907e1b3f7d9dceee84978f832813bef Mon Sep 17 00:00:00 2001
From: Reed Garmsen <rgarmsen2295@gmail.com>
Date: Fri, 31 Jul 2015 14:06:00 -0700
Subject: Added spinner animation to replace save button when uploading a new
 profile picture

---
 web/react/components/setting_picture.jsx | 4 ++++
 1 file changed, 4 insertions(+)

(limited to 'web/react/components/setting_picture.jsx')

diff --git a/web/react/components/setting_picture.jsx b/web/react/components/setting_picture.jsx
index fa4c8bb62..136421fa7 100644
--- a/web/react/components/setting_picture.jsx
+++ b/web/react/components/setting_picture.jsx
@@ -44,7 +44,11 @@ module.exports = React.createClass({
                             {server_error}
                             {client_error}
                             <span className='btn btn-sm btn-primary btn-file sel-btn'>Select<input ref='input' accept='.jpg,.png,.bmp' type='file' onChange={this.props.pictureChange}/></span>
+                            {!this.props.loadingPicture ?
                             <a className={this.props.submitActive ? 'btn btn-sm btn-primary' : 'btn btn-sm btn-inactive disabled'} onClick={this.props.submit}>Save</a>
+                            :
+                            <img className="spinner" src="/static/images/load.gif"/>
+                            }
                             <a className='btn btn-sm theme' href='#' onClick={self.props.updateSection}>Cancel</a>
                         </li>
                     </ul>
-- 
cgit v1.2.3-1-g7c22


From 3cd0c3b73b5df0d59e7c12044ddc4948a42b071c Mon Sep 17 00:00:00 2001
From: Reed Garmsen <rgarmsen2295@gmail.com>
Date: Mon, 3 Aug 2015 13:52:24 -0700
Subject: Minor cosmetic refactoring to the General Tab of user settings

---
 web/react/components/setting_picture.jsx | 34 ++++++++++++++++++++++----------
 1 file changed, 24 insertions(+), 10 deletions(-)

(limited to 'web/react/components/setting_picture.jsx')

diff --git a/web/react/components/setting_picture.jsx b/web/react/components/setting_picture.jsx
index 136421fa7..e97b67706 100644
--- a/web/react/components/setting_picture.jsx
+++ b/web/react/components/setting_picture.jsx
@@ -20,8 +20,14 @@ module.exports = React.createClass({
         }
     },
     render: function() {
-        var client_error = this.props.client_error ? <div className='form-group has-error'><label className='control-label'>{ this.props.client_error }</label></div> : null;
-        var server_error = this.props.server_error ? <div className='form-group has-error'><label className='control-label'>{ this.props.server_error }</label></div> : null;
+        var clientError = null;
+        if (this.props.client_error) {
+            clientError = <div className='form-group has-error'><label className='control-label'>{this.props.client_error}</label></div>;
+        }
+        var serverError = null;
+        if (this.props.server_error) {
+            serverError = <div className='form-group has-error'><label className='control-label'>{this.props.server_error}</label></div>;
+        }
 
         var img = null;
         if (this.props.picture) {
@@ -30,8 +36,20 @@ module.exports = React.createClass({
             img = (<img ref='image' className='profile-img' src={this.props.src}/>);
         }
 
-        var self = this;
+        var confirmButton;
+        if (this.props.loadingPicture) {
+            confirmButton = <img className='spinner' src='/static/images/load.gif'/>;
+        } else {
+            var confirmButtonClass = 'btn btn-sm';
+            if (this.props.submitActive) {
+                confirmButtonClass += ' btn-primary';
+            } else {
+                confirmButtonClass += ' btn-inactive disabled';
+            }
+            confirmButton = <a className={confirmButtonClass} onClick={this.props.submit}>Save</a>;
+        }
 
+        var self = this;
         return (
             <ul className='section-max'>
                 <li className='col-xs-12 section-title'>{this.props.title}</li>
@@ -41,14 +59,10 @@ module.exports = React.createClass({
                             {img}
                         </li>
                         <li className='setting-list-item'>
-                            {server_error}
-                            {client_error}
+                            {serverError}
+                            {clientError}
                             <span className='btn btn-sm btn-primary btn-file sel-btn'>Select<input ref='input' accept='.jpg,.png,.bmp' type='file' onChange={this.props.pictureChange}/></span>
-                            {!this.props.loadingPicture ?
-                            <a className={this.props.submitActive ? 'btn btn-sm btn-primary' : 'btn btn-sm btn-inactive disabled'} onClick={this.props.submit}>Save</a>
-                            :
-                            <img className="spinner" src="/static/images/load.gif"/>
-                            }
+                            {confirmButton}
                             <a className='btn btn-sm theme' href='#' onClick={self.props.updateSection}>Cancel</a>
                         </li>
                     </ul>
-- 
cgit v1.2.3-1-g7c22

