<template name="account">
	<div class="template-account">
		<div class="container">
			<div class="row">
				<div class="col-md-6 col-md-offset-3">
					<div class="panel panel-default">
						  <div class="panel-heading">
								<h3 class="panel-title">{{_ "account_details"}}</h3>
						  </div>
						  <div class="panel-body">
								{{> updatePassword}}
						  </div>
					</div>
					<div class="panel panel-danger">
						  <div class="panel-heading">
								<h3 class="panel-title">{{_ "delete_account"}}</h3>
						  </div>
						  <div class="panel-body">
								<p>{{_ "delete_account_warn"}}</p>
								<p>
									<a class="btn btn-danger" data-toggle="modal" href='#delete-account'>{{_ "delete_account"}}</a>
									<div class="modal fade" id="delete-account">
										<div class="modal-dialog">
											<div class="modal-content">
												<div class="modal-header">
													<button type="button" class="close" data-dismiss="modal" aria-hidden="true">&times;</button>
													<h4 class="modal-title">{{_ "delete_account"}}</h4>
												</div>
												<div class="modal-body">
													{{_ "delete_account_warn2"}}
												</div>
												<div class="modal-footer">
													<button type="button" class="btn btn-default" data-dismiss="modal">{{_ "close"}}</button>
													<button type="button" class="btn btn-danger js-delete-account">{{_ "delete"}}</button>
												</div>
											</div>
										</div>
									</div>
								</p>
						  </div>
					</div>
				</div>
			</div>
		</div>
	</div>
</template>

<template name="updatePassword">
  <div class="template-update-password">
  	{{#autoForm schema=Schemas.updatePassword id="updatePassword"}}
  	<fieldset>
  	  <legend>Change Password</legend>
  	  {{> afQuickField name="old" type="password"}}
  	  {{> afQuickField name="new" type="password"}}
  	  {{> afQuickField name="confirm" type="password"}}
  	  <div>
  	    <button type="submit" class="btn btn-primary">Change Password</button>
  	  </div>
  	</fieldset>
  	{{/autoForm}}
  </div>
</template>

<template name="setUserName">
	<div class="template-set-username">
		<div class="container">
			<div class="col-md-6 col-md-offset-3">
				<div class="panel panel-default">
					<div class="panel-heading">
						<h3 class="panel-title">{{_ "account_details"}}</h3>
					</div>
					<div class="panel-body">
						{{#autoForm collection="Meteor.users" doc=user type="update" id="setUserName"}}
						<fieldset>
							<legend>Choose your name</legend>
					    	{{> afQuickField name="username"}}
					    	<div>
					      		<button type="submit" class="btn btn-primary">Save</button>
							</div>
						</fieldset>
						{{/autoForm}}
					</div>
				</div>
			</div>
		</div>
	</div>
</template>