{{ define "title" }}{{.User.Name}} · Profile{{ end }}

{{ define "content" }}

	<div class="subhead">
		<div class="container">
			<ul class="nav nav-tabs pull-right">
				<li><a href="/dashboard">Dashboard</a></li>
				<li class="active"><a href="/account/user/profile">Settings</a></li>
			</ul> <!-- ./nav -->
			<h1 class="user">
				<img src="{{.User.Image}}">
				<span>{{.User.Name}}</span>
			</h1>
		</div><!-- ./container -->
	</div><!-- ./subhead -->


	<div class="container">
		<div class="row">

			<div class="col-xs-3">
				<ul class="nav nav-pills nav-stacked">
					<li class="active"><a href="/account/user/profile">Profile</a></li>
					<li><a href="/account/user/password">Password</a></li>
					<li><a href="/account/user/teams">Teams</a></li>
					<li><a href="/account/user/delete">Delete</a></li>
				</ul>
			</div><!-- ./col-xs-3 -->

			<div class="col-xs-9" role="main" style="padding-left:20px;">
				<div class="alert">Manage your account Profile.</div>

					<div class="col-xs-5">
						<form action="/account/user/profile" method="POST" role="form">
							<label>Your Name:</label>
							<div>
								<input class="form-control" type="text" name="name" value="{{.User.Name}}" />
							</div>
							<label>Your Email Address:</label>
							<div>
								<input class="form-control" type="text" name="email" value="{{.User.Email}}" />
							</div>
							<div class="alert alert-success hide" id="successAlert"></div>
							<div class="alert alert-error hide" id="failureAlert"></div>
							<div class="form-actions">
								<input class="btn btn-primary" id="submitButton" type="submit" value="Save" data-loading-text="Saving .." />
								<a class="btn btn-default" href="/account/user/profile">Cancel</a>
							</div>
						</form>
					</div>
					<div class="col-xs-7">
						<a class="avatar-link" href="https://gravatar.com/" target="_blank">
							<img src="{{.User.ImageLarge}}" />
							<span>edit gravatar</span>
						</a>
					</div>

			</div><!-- ./col-xs-9 -->
		</div><!-- ./row -->

	</div><!-- ./container -->
{{ end }}

{{ define "script" }}
	<script>
		document.forms[0].onsubmit = function(event) {
						$("#successAlert").hide();
						$("#failureAlert").hide();
						$('#submitButton').button('loading');

						var form = event.target;
						var formData = new FormData(form);
						xhr = new XMLHttpRequest();
						xhr.open('POST', form.action);
						xhr.onload = function() {
								if (this.status == 200) {
										$("#successAlert").text("Your profile information was successfully updated");
										$("#successAlert").show().removeClass("hide");
										$('#submitButton').button('reset');
								} else {
										$("#failureAlert").text("Failed to update your profile information. " + this.response);
										$("#failureAlert").show().removeClass("hide");
										$('#submitButton').button('reset');
								};
						};
						xhr.send(formData);
						return false;
				};

				$("#saveGeneral").on('click', function () {
						var data = JSON.stringify({
								Name  : $("#fullname").val(),
								Email : $("#email").val()
						});

						$.ajax({
								url: "/admin?action=profile",
								context: document.body,
								type: "PUT",
								dataType: "json",
								contentType: "application/json; charset=utf-8",
								data: data,
								success: function(data) {
										$("#successGeneral").text("Your profile information was successfully updated");
										$("#successGeneral").show().removeClass("hide");
										$('#saveGeneral').button('reset')
								},
								error: function(data) {
										$("#failureGeneral").text("Failed to update your profile information. " + data.responseText);
										$("#failureGeneral").show().removeClass("hide");
										$('#saveGeneral').button('reset')
								}
						});
				});

				$("#savePassword").on('click', function () {            
						$("#successPassword").hide();
						$("#failurePassword").hide();
						$('#savePassword').button('loading');

						var data = JSON.stringify({
								Password    : $("#old_password").val(),
								PasswordNew : $("#new_password").val()
						});

						$.ajax({
								url: "/admin?action=password",
								context: document.body,
								type: "PUT",
								dataType: "json",
								contentType: "application/json; charset=utf-8",
								data: data,
								success: function(data) {
										$("#successPassword").text("Your password was successfully updated");
										$("#successPassword").show().removeClass("hide");
										$('#savePassword').button('reset');
								},
								error: function(data) {
										$("#failurePassword").text("Failed to update your password. " + data.responseText);
										$("#failurePassword").show().removeClass("hide");
										$('#savePassword').button('reset');
								}
						});
				});
	</script>
{{ end }}