{{-- Modal of a print view --}}
<script type="text/ng-template" id="modals/settings.html">
	<form name="settingsForm" class="form-horizontal" ng-submit="update($event)">
	    <div class="modal-header">
			<button type="button" class="close" ng-click="cancel()">×</button>
			<h3 class="modal-title"><i class="fa fa-user"></i> Update Profile</h3>
		</div>
		<div class="modal-body">
			<div class="alert alert-success" ng-show="success"><i class="fa fa-check"></i> Your changes have been successfully saved!</div>
			<div class="form-group">
				<label for="firstName" class="col-sm-3 control-label">&nbsp;</label>
				<div class="col-sm-9">
					<img ng-src="{[{ data.profile_photo_url }]}" class="img-polaroid" style="width: 100px; height: 100px;">
					<div class="btn btn-default file-upload">
						<input id="photos_upload" type="file" name="files" user-data="data" profile-photo-upload>
						<i class="fa fa-arrow-circle-o-up"></i> &nbsp;Choose photo
					</div>
				</div>
			</div>
			<div class="form-group">
				<label for="firstName" class="col-sm-3 control-label">First Name</label>
				<div class="col-sm-9">
					<input id="firstName" class="form-control" type="text" name="first_name" ng-model="data.first_name" autocomplete="off" required>
				</div>
			</div>
			<div class="form-group">
				<label for="lastName" class="col-sm-3 control-label">Last Name</label>
				<div class="col-sm-9">
					<input id="lastName" class="form-control" type="text" name="last_name" ng-model="data.last_name" autocomplete="off">
				</div>
			</div>
			<div class="form-group">
				<label for="SettingsUsername" class="col-sm-3 control-label">Username</label>
				<div class="col-sm-9">
					<input id="SettingsUsername" class="form-control" type="text" name="username" ng-model="data.username" autocomplete="off" required disabled>
				</div>
			</div>
			<div class="form-group">
				<label for="SettingsEmail" class="col-sm-3 control-label">Email</label>
				<div class="col-sm-9">
					<input id="SettingsEmail" class="form-control" type="text" name="email" ng-model="data.email" autocomplete="off" required disabled>
				</div>
			</div>
			<div class="form-group">
				<label for="SettingsMobile" class="col-sm-3 control-label">Mobile</label>
				<div class="col-sm-9">
					<input id="SettingsMobile" class="form-control" type="text" name="mobile" ng-model="data.mobile">
				</div>
			</div>
			<div class="form-group">
				<label for="SettingsExtension" class="col-sm-3 control-label">Extension</label>
				<div class="col-sm-9">
					<input id="SettingsExtension" class="form-control" type="text" name="extension" ng-model="data.extension">
					<small class="text-muted">3CX extension for making calls (leave empty to use default from integration settings)</small>
				</div>
			</div>
		</div>
		<div class="modal-footer" ng-controller="BookingsRepairCtrl">
			<button class="btn btn-primary">Update</button>
			<button class="btn btn-default" type="button" ng-click="cancel()">Close</button>
		</div>
	</form>
</script>
