<topnav title="{{contextSrv.user.name}}" section="Profile" icon="fa fa-fw fa-user" subnav="true">
	<ul class="nav">
		<li class="active"><a href="profile">Overview</a></li>
		<li><a href="profile/password">Change password</a></li>
	</ul>
</topnav>

<div class="page-container" style="background: transparent; border: 0;">
	<div class="page-wide">

		<h2>Profile</h2>

		<form name="userForm">
			<div class="tight-form">
				<ul class="tight-form-list">
					<li class="tight-form-item" style="width: 100px">
						Name
					</li>
					<li>
						<input type="text" required ng-model="user.name" class="input-xxlarge tight-form-input last" >
					</li>
				</ul>
				<div class="clearfix"></div>
			</div>
			<div class="tight-form">
				<ul class="tight-form-list">
					<li class="tight-form-item" style="width: 100px">
						Email
					</li>
					<li>
						<input type="email" required ng-model="user.email" class="input-xxlarge tight-form-input last" >
					</li>
				</ul>
				<div class="clearfix"></div>
			</div>
			<div class="tight-form">
				<ul class="tight-form-list">
					<li class="tight-form-item" style="width: 100px">
						Username
					</li>
					<li>
						<input type="text" required ng-model="user.login" class="input-xxlarge tight-form-input last" >
					</li>
				</ul>
				<div class="clearfix"></div>
			</div>

			<div class="tight-form last">
				<ul class="tight-form-list">
					<li class="tight-form-item" style="width: 100px">
						UI Theme
					</li>
					<li>
						<select class="input-small tight-form-input" ng-model="user.theme" ng-options="f for f in ['dark', 'light']"></select>
					</li>
				</ul>
				<div class="clearfix"></div>
			</div>
			<br>
			<button type="submit" class="pull-right btn btn-success" ng-click="update()">Update</button>
		</form>

		<h3>Organizations</h3>

		<table class="filter-table form-inline">
			<thead>
				<tr>
					<th>Name</th>
					<th>Role</th>
					<th></th>
				</tr>
			</thead>
			<tbody>
				<tr ng-repeat="org in orgs">
					<td>{{org.name}}</td>
					<td>{{org.role}}</td>
					<td class="text-right">
						<span class="btn btn-primary btn-mini" ng-show="org.orgId === contextSrv.user.orgId">
							Current
						</span>
						<a ng-click="setUsingOrg(org)" class="btn btn-inverse btn-mini" ng-show="org.orgId !== contextSrv.user.orgId">
							Select
						</a>
					</td>
				</tr>
			</tbody>
		</table>

	</div>
</div>

