From db5dd6c5a03ec67df1388803297dce0d01d1e717 Mon Sep 17 00:00:00 2001
From: barisusakli <barisusakli@gmail.com>
Date: Fri, 9 Oct 2015 17:53:15 -0400
Subject: [PATCH] https://github.com/NodeBB/NodeBB/issues/1637

---
 templates/account/edit.tpl          | 79 +++++++----------------------
 templates/account/edit/email.tpl    | 31 +++++++++++
 templates/account/edit/password.tpl | 40 +++++++++++++++
 templates/account/edit/username.tpl | 31 +++++++++++
 4 files changed, 120 insertions(+), 61 deletions(-)
 create mode 100644 templates/account/edit/email.tpl
 create mode 100644 templates/account/edit/password.tpl
 create mode 100644 templates/account/edit/username.tpl

diff --git a/templates/account/edit.tpl b/templates/account/edit.tpl
index e4bf2c9..52c816f 100644
--- a/templates/account/edit.tpl
+++ b/templates/account/edit.tpl
@@ -6,20 +6,31 @@
 		<div class="col-md-2">
 			<div class="account-picture-block text-center">
 				<img id="user-current-picture" class="user-profile-picture" src="{picture}" /><br /><br />
-				<a id="changePictureBtn" href="#" class="btn btn-primary">[[user:change_picture]]</a>
+				<a id="changePictureBtn" href="#" class="btn btn-default">[[user:change_picture]]</a>
 				<br/><br/>
-				<!-- IF config.allowAccountDelete -->
-				<!-- IF isSelf -->
-				<a id="deleteAccountBtn" href="#" class="btn btn-danger">[[user:delete_account]]</a><br/><br/>
-				<!-- ENDIF isSelf -->
-				<!-- ENDIF config.allowAccountDelete -->
+
+				<!-- IF !username:disableEdit -->
+				<a href="{config.relative_path}/user/{userslug}/edit/username" class="btn btn-default">[[user:change_username]]</a><br/><br/>
+				<!-- ENDIF !username:disableEdit -->
+
+				<a href="{config.relative_path}/user/{userslug}/edit/email" class="btn btn-default">[[user:change_email]]</a><br/><br/>
+
+				<a href="{config.relative_path}/user/{userslug}/edit/password" class="btn btn-default">[[user:change_password]]</a><br/><br/>
+
 				<!-- IF config.requireEmailConfirmation -->
 				<!-- IF email -->
 				<!-- IF isSelf -->
-				<a id="confirm-email" href="#" class="btn btn-warning <!-- IF email:confirmed -->hide<!-- ENDIF email:confirmed -->">[[user:confirm_email]]</a>
+				<a id="confirm-email" href="#" class="btn btn-warning <!-- IF email:confirmed -->hide<!-- ENDIF email:confirmed -->">[[user:confirm_email]]</a><br/><br/>
 				<!-- ENDIF isSelf -->
 				<!-- ENDIF email -->
 				<!-- ENDIF config.requireEmailConfirmation -->
+
+				<!-- IF config.allowAccountDelete -->
+				<!-- IF isSelf -->
+				<a id="deleteAccountBtn" href="#" class="btn btn-danger">[[user:delete_account]]</a><br/><br/>
+				<!-- ENDIF isSelf -->
+				<!-- ENDIF config.allowAccountDelete -->
+
 			</div>
 		</div>
 
@@ -27,23 +38,6 @@
 			<div>
 				<form class='form-horizontal'>
 
-					<!-- IF !username:disableEdit -->
-					<div class="control-group">
-						<label class="control-label" for="inputUsername">[[user:username]]</label>
-						<div class="controls">
-							<input class="form-control" type="text" id="inputUsername" placeholder="[[user:username]]" value="{username}">
-						</div>
-					</div>
-					<!-- ENDIF !username:disableEdit -->
-
-					<div class="control-group">
-						<label class="control-label" for="inputEmail">[[user:email]]</label>
-						<div class="controls">
-							<input class="form-control" type="text" id="inputEmail" placeholder="[[user:email]]" value="{email}">
-						</div>
-
-					</div>
-
 					<div class="control-group">
 						<label class="control-label" for="inputFullname">[[user:fullname]]</label>
 						<div class="controls">
@@ -100,43 +94,6 @@
 		</div>
 
 		<div class="col-md-5">
-			<form class='form-horizontal'>
-				<!-- IF isSelf -->
-				<div class="control-group">
-					<label class="control-label" for="inputCurrentPassword">[[user:current_password]]</label>
-					<div class="controls">
-						<input autocomplete="off" class="form-control" type="password" id="inputCurrentPassword" placeholder="[[user:current_password]]" value=""<!-- IF !hasPassword --> disabled<!-- ENDIF !hasPassword-->>
-					</div>
-				</div>
-				<!-- ENDIF isSelf -->
-
-				<div class="control-group">
-					<label class="control-label" for="inputNewPassword">[[user:password]]</label>
-					<div class="input-group">
-						<input class="form-control" type="password" id="inputNewPassword" placeholder="[[user:password]]" value="">
-						<span class="input-group-addon">
-							<span id="password-notify"><span class="success hide"><i class="fa fa-check"></i></span><span class="error hide"></span><span class="default"><i class="fa fa-circle-o"></i></span></span>
-						</span>
-					</div>
-				</div>
-
-				<div class="control-group">
-					<label class="control-label" for="inputNewPasswordAgain">[[user:confirm_password]]</label>
-					<div class="input-group">
-						<input class="form-control" type="password" id="inputNewPasswordAgain" placeholder="[[user:confirm_password]]" value="">
-						<span class="input-group-addon">
-							<span id="password-confirm-notify"><span class="success hide"><i class="fa fa-check"></i></span><span class="error hide"></span><span class="default"><i class="fa fa-circle-o"></i></span></span>
-						</span>
-					</div>
-				</div>
-				<br/>
-				<div class="form-actions">
-					<a id="changePasswordBtn" href="#" class="btn btn-primary"><i class="hide fa fa-spinner fa-spin"></i> [[user:change_password]]</a>
-				</div>
-			</form>
-
-			<hr />
-
 			<!-- IF sso.length -->
 			<label class="control-label">[[user:sso.title]]</label>
 			<div class="list-group">
diff --git a/templates/account/edit/email.tpl b/templates/account/edit/email.tpl
new file mode 100644
index 0000000..b47a8c5
--- /dev/null
+++ b/templates/account/edit/email.tpl
@@ -0,0 +1,31 @@
+<!-- IMPORT partials/account_menu.tpl -->
+
+<div class="col-md-5">
+	<form class="form-horizontal">
+
+		<div class="control-group">
+			<label class="control-label" for="inputNewEmail">[[user:email]]</label>
+			<div class="controls">
+				<input class="form-control" type="text" id="inputNewEmail" placeholder="[[user:email]]" value="{email}">
+			</div>
+		</div>
+
+		<!-- disables autocomplete on FF --><input type="password" style="display:none">
+
+		<!-- IF isSelf -->
+		<div class="control-group">
+			<label class="control-label" for="inputCurrentPassword">[[user:current_password]]</label>
+			<div class="controls">
+				<input autocomplete="off" class="form-control" type="password" id="inputCurrentPassword" placeholder="[[user:current_password]]" value=""<!-- IF !hasPassword --> disabled<!-- ENDIF !hasPassword-->>
+			</div>
+		</div>
+		<!-- ENDIF isSelf -->
+
+		<input type="hidden" name="uid" id="inputUID" value="{uid}" />
+
+		<br/>
+		<div class="form-actions">
+			<a id="submitBtn" href="#" class="btn btn-primary"><i class="hide fa fa-spinner fa-spin"></i> [[user:change_email]]</a>
+		</div>
+	</form>
+</div>
diff --git a/templates/account/edit/password.tpl b/templates/account/edit/password.tpl
new file mode 100644
index 0000000..505259e
--- /dev/null
+++ b/templates/account/edit/password.tpl
@@ -0,0 +1,40 @@
+<!-- IMPORT partials/account_menu.tpl -->
+
+<div class="col-md-5">
+	<form class='form-horizontal'>
+		<!-- disables autocomplete on FF --><input type="password" style="display:none">
+
+		<!-- IF isSelf -->
+		<div class="control-group">
+			<label class="control-label" for="inputCurrentPassword">[[user:current_password]]</label>
+			<div class="controls">
+				<input autocomplete="off" class="form-control" type="password" id="inputCurrentPassword" placeholder="[[user:current_password]]" value=""<!-- IF !hasPassword --> disabled<!-- ENDIF !hasPassword-->>
+			</div>
+		</div>
+		<!-- ENDIF isSelf -->
+
+		<div class="control-group">
+			<label class="control-label" for="inputNewPassword">[[user:password]]</label>
+			<div class="input-group">
+				<input class="form-control" type="password" id="inputNewPassword" placeholder="[[user:password]]" value="">
+				<span class="input-group-addon">
+					<span id="password-notify"><span class="success hide"><i class="fa fa-check"></i></span><span class="error hide"></span><span class="default"><i class="fa fa-circle-o"></i></span></span>
+				</span>
+			</div>
+		</div>
+
+		<div class="control-group">
+			<label class="control-label" for="inputNewPasswordAgain">[[user:confirm_password]]</label>
+			<div class="input-group">
+				<input class="form-control" type="password" id="inputNewPasswordAgain" placeholder="[[user:confirm_password]]" value="">
+				<span class="input-group-addon">
+					<span id="password-confirm-notify"><span class="success hide"><i class="fa fa-check"></i></span><span class="error hide"></span><span class="default"><i class="fa fa-circle-o"></i></span></span>
+				</span>
+			</div>
+		</div>
+		<br/>
+		<div class="form-actions">
+			<a id="changePasswordBtn" href="#" class="btn btn-primary"><i class="hide fa fa-spinner fa-spin"></i> [[user:change_password]]</a>
+		</div>
+	</form>
+</div>
\ No newline at end of file
diff --git a/templates/account/edit/username.tpl b/templates/account/edit/username.tpl
new file mode 100644
index 0000000..c336f27
--- /dev/null
+++ b/templates/account/edit/username.tpl
@@ -0,0 +1,31 @@
+<!-- IMPORT partials/account_menu.tpl -->
+
+<div class="col-md-5">
+	<form class="form-horizontal">
+
+		<div class="control-group">
+			<label class="control-label" for="inputNewUsername">[[user:username]]</label>
+			<div class="controls">
+				<input class="form-control" type="text" id="inputNewUsername" placeholder="[[user:username]]" value="{username}">
+			</div>
+		</div>
+
+		<!-- disables autocomplete on FF --><input type="password" style="display:none">
+
+		<!-- IF isSelf -->
+		<div class="control-group">
+			<label class="control-label" for="inputCurrentPassword">[[user:current_password]]</label>
+			<div class="controls">
+				<input autocomplete="off" class="form-control" type="password" id="inputCurrentPassword" placeholder="[[user:current_password]]" value=""<!-- IF !hasPassword --> disabled<!-- ENDIF !hasPassword-->>
+			</div>
+		</div>
+		<!-- ENDIF isSelf -->
+
+		<input type="hidden" name="uid" id="inputUID" value="{uid}" />
+
+		<br/>
+		<div class="form-actions">
+			<a id="submitBtn" href="#" class="btn btn-primary"><i class="hide fa fa-spinner fa-spin"></i> [[user:change_username]]</a>
+		</div>
+	</form>
+</div>
\ No newline at end of file