extends blocks/layout.pug
append var
	if(session && session.user && session.user.loggedInFull)
		- var breadcrumb = {0: {"name": cfg.app.name, "href": "/"}, 1: {"name": "Settings", "active": true}};
		- var title = "Settings";

mixin setting(name, id, inputId, hidden, inputType, inputValue, inputPlaceholder, inputIcon, inputDisabled)
	.uk-margin(id=id)
		label.uk-form-label(for=inputId)=name
		if(inputIcon)
			.uk-inline.uk-width-1-1
				span.uk-form-icon(uk-icon="icon: "+inputIcon)
				if(inputDisabled == "disabled")
					input.uk-input(id=inputId, type=inputType, value=inputValue, placeholder=inputPlaceholder, disabled)
				else
					input.uk-input(id=inputId, type=inputType, value=inputValue, placeholder=inputPlaceholder)
		else
			input.uk-input(id=inputId, type=inputType, value=inputValue, placeholder=inputPlaceholder)
	//-.uk-card.uk-card-default
		.uk-card-header.uk-card-primary
			h3.uk-card-title=name
		.uk-card-body
			p=id
		.uk-card-footer.uk-flex.uk-flex-right
			a.uk-button.uk-button-default.uk-button-primary(href="/api/redirect?id="+id) Login

mixin settings()
	form(class="uk-child-width-expand uk-margin-bottom", uk-grid)
		fieldset.uk-fieldset
			h1 Settings
			
			h2 Profile
			+setting('', 'lorem-ipsum', 'form-profile-username', 'false', 'text', user.nickname, '', 'user', 'disabled')
			+setting('', 'lorem-ipsum', 'form-profile-email', 'false', 'text', user.email, 'john.doe@example.com', 'mail')
			div(class="uk-flex uk-flex-between uk-margin-bottom", uk-grid)
				div(class="uk-width-2-3@m")
					#profile_msg.uk-alert(data-uk-alert).uk-hidden
						a.uk-close-alt.uk-alert-close(href="#")
						p
				div
					a(onclick="saveProfile(event)").uk-button.uk-button-primary Save
			
			h2 Password
			+setting('Password', 'form-password', 'form-security-password', 'false', 'password', '', '')
			+setting('Reenter Password', 'form-repassword', 'form-security-repassword', 'false', 'password', '', '')
			div(class="uk-flex uk-flex-between uk-margin-bottom", uk-grid)
				div(class="uk-width-2-3@m")
					#password_msg.uk-alert(data-uk-alert).uk-hidden
						a.uk-close-alt.uk-alert-close(href="#")
						p
				div
					a(onclick="savePassword(event)").uk-button.uk-button-primary Save
			
			
			div(class="uk-flex uk-flex-between uk-margin-bottom", uk-grid)
				div(class="uk-width-2-3@m uk-flex-column")
					h2 Multifactor Authentication
					#mfa_msg.uk-alert(data-uk-alert).uk-hidden
						a.uk-close-alt.uk-alert-close(href="#")
						p
				div
					if(user.mfa && user.mfa.active)
						a(onclick="switchMFA(event)").uk-button.uk-button-primary Disable
					if(!user.mfa || !user.mfa.active)
						a(onclick="switchMFA(event)").uk-button.uk-button-primary Enable
			if(user.mfa && user.mfa.active)
				div(class="uk-flex uk-flex-between uk-margin-bottom", uk-grid)
					div(class="uk-width-1-1")
						if(user.mfa.data)
							//- sort by number
							- user.mfa.data.sort(function(a, b) {return a.no - b.no; })
							each option in user.mfa.data
								.uk-card.uk-card-default.uk-card-body.uk-margin-bottom.uk-width-1-1
									.uk-flex.uk-flex-between
										div
											h3.uk-card-title= "Authentication Layer: "+option.no
										div
											p= "type: "
												span.uk-badge= option.type
									.uk-flex.uk-flex-between
										div
											a.uk-button.uk-button-default(onclick="showMFASecret(event)", id="secret.show."+option.type+"."+option.no) Show/Hide Secret
										div
											a.uk-button.uk-button-primary(onclick="removeMFA(event)", id="secret.remove."+option.type+"."+option.no) remove Layer
									p(class="secret uk-hidden", id="secret."+option.type+"."+option.no, data-secret=option.data)= "SECRET: " + option.data
			

append content
	if(session && session.user && session.user.loggedInFull)
		.uk-container
			+settings()
	else
		include blocks/login.pug