<template name="userprofile">
	<div class="container-sm">
		<div class="page-component">
			<h2>
				{{mf 'profile.users_profile_page' "{NAME}'s Profile" NAME=this.user.username}}
			</h2>
			{{#if ownuser}}
				<h4>
					{{mf 'profile.its_you' "It's you!"}}&nbsp;
				</h4>
				<a class="page-link" href="/profile/">
					<span class="fa fa-cogs fa-fw" aria-hidden="true"></span>
					{{mf 'profile.preferenceslink' "Click here to change your preferences"}}
				</a>
			{{else}}
				{{#if acceptsMessages}}
				{{>emailBox}}
				{{/if}}
			{{/if}}
			{{#if showSettings}}
				<div class="form-group">
					{{#if showPrivileges}}
						<div class="form-group-element">
							<label class="label-lg">
								<span class="fa fa-cog fa-fw" aria-hidden="true"></span>
								{{mf 'privileges.title' 'Edit Privileges'}}
							</label>
							<div class="list-group">
								{{#if privileges.admin}}
									<li class="list-group-item list-group-item-success">
										{{mf 'privilege.has.admin' 'Administrator privileges granted'}}
										{{#if alterPrivileges}}
											<button type="button" class="js-remove-privilege-btn close"
												data-tooltip="{{mf 'privilege.remove' 'Remove privilege'}}"
												data-priv="admin">
												&times;
											</button>
										{{/if}}
									</li>
								{{else}}
									{{#if alterPrivileges}}
											<button type="button" class="giveAdmin list-group-item">
												{{mf 'privilege.add.admin' 'Grant administrator privileges'}}
											</button>
									{{/if}}
								{{/if}}
							</div>
						</div>
					{{/if}}

					{{#if showInviteGroups}}
						<div class="form-group-element">
							<label class="label-lg">
								<span class="fa fa-cog fa-fw" aria-hidden="true"></span>
								{{mf 'userprofile.groups.header' 'Edit groups'}}
							</label>
							<div class="list-group">
								{{#each inviteGroups}}
										{{#if groupMember this ../user}}
										<li class="list-group-item list-group-item-success">
											{{mf 'profile.group.member' 'Member of group '}}
											<span class="group">{{name}}</span>
											<button type="button" class="js-group-expel-btn close"
												data-tooltip="{{mf 'profile.group.expel' 'Expel from group {GROUPNAME}' GROUPNAME=this.name}}">
												&times;
											</button>
										</li>
										{{else}}
											<button type="button" class="draftIntoGroup list-group-item">
												{{mf 'profile.group.draft' 'Draft into group '}}
												{{name}}
											</button>
										{{/if}}
								{{/each}}
							</div>
						</div>
					{{/if}}
				</div>
			{{/if}}
		</div>
		{{> usersCourselist profileData=this ownProfile=false}}
	</div>
</template>

<template name="emailBox">
	<div class="details-form">
		<form class="sendMail">
			<div class="form-group">
				<label>{{mf 'profile.mail.content' 'Your message:'}}</label>
				<textarea class="form-control"
					id="emailmessage"
					placeholder="{{mf 'profile.mail.placeholder' 'Hi {USER}! …' USER=this.user.username}}"
					rows="3"></textarea>
			</div>
		{{#if hasEmail}}
			{{#if hasVerifiedEmail}}
				<div class="form-group">
					<div class="btn-group" data-toggle="buttons">
						<label class="btn btn-default">
							<input class="js-receive-copy"
								id="receiveCopy"
								type="checkbox"/>
							{{mf 'profile.mail.copy' 'Send me a copy of this message'}}
							<span class="checkmark glyphicon glyphicon-ok" aria-hidden="true" style="display:none"></span>
						</label>
						<label class="btn btn-default">
							<input class="js-send-own-adress"
								id="sendOwnAdress"
								type="checkbox"/>
							{{mf 'profile.mail.attachmail' 'Attach my e-mail address'}}
							<span class="checkmark glyphicon glyphicon-ok" aria-hidden="true" style="display:none"></span>
						</label>
					</div>
				</div>
			{{else}}
				<div class="form-group">
                    <p class="help-block">
                        <i class="fa fa-info fa-fw" aria-hidden="true"></i>
                        {{#mf KEY='userprofile.infoForUnverifiedMail'}}
                            In order to receive a copy to your E-Mail address or
                            attach it to the message, you need to verify your address.
                        {{/mf}}
                    </p>
                    {{> verifyEmail}}
				</div>
			{{/if}}
		{{/if}}
			<div class="form-actions">
				<button type="submit" class="btn btn-save" {{disabledIfBusy}}>
					{{#if busy 'sending'}}
						<span class="fa fa-circle-o-notch fa-spin fa-fw" aria-hidden="true"></span>
						{{mf 'userprofile.sendmail-btn.busy' 'Sending E-Mail...'}}
					{{else}}
						<span class="fa fa-send fa-fw" aria-hidden="true"></span>
						{{mf 'userprofile.sendmail-btn' 'Send E-Mail'}}
					{{/if}}
				</button>
			</div>
		</form>
	</div>
</template>
