<commit_before>import { Q, ajax, importOnCall } from '/utils/msa-utils.js'

const addErrorPopup = importOnCall("/utils/msa-utils-popup.js", "addErrorPopup")

// template

const unloggedTemplate = `
		<div><input type=text size=10 name="name" placeholder="username"></div>
		<div><input type=password size=10 name="pass" placeholder="password"></div>
		<div><button class="login">Login</button></div>
`

const loggedTemplate = `
	<div style="display:flex; flex-direction:row; align-items: center">
		<label class="name" style="font-weight: bold;"></label>
		<input type="image" class="logout" style="width:1em; height:1em; padding-left:5px" src='/user/img/logout'>
	</div>
`
// msa-user-login-box

function getUser() {
	if(window.MsaUserPrm === undefined)
		window.MsaUserPrm = ajax("GET", "/user/user")
	return window.MsaUserPrm
}

export class HTMLMsaUserLoginBoxElement extends HTMLElement {

	connectedCallback(){
		getUser().then(user => {
			this.user = user
			this.initContent()
			this.initActions()
		})
	}

	getLoggedTemplate(){
		return loggedTemplate
	}

	getUnloggedTemplate(){
		return unloggedTemplate
	}

	initContent(){
		// display content, in function of user
		if(this.user) this.innerHTML = this.getLoggedTemplate()
		else this.innerHTML = this.getUnloggedTemplate()
		// sync
		this.sync()
	}

	sync(){
		this.syncText()
	}
	syncText(){
		// logged name
		if(this.user) this.Q(".name").textContent = this.user.name
	}

	initActions(){
		if(this.user) {
			// logout button
			this.Q(".logout").onclick = () => { this.postLogout() }
		} else {
			// login inputs
			this.querySelectorAll("input").forEach(input => {
				input.onkeydown = evt => {
					if(evt.key === "Enter")
						this.postLogin()
				}
			})
			// login button
			this.Q("button.login").onclick = () => { this.postLogin() }
		}
	}

	postLogin(){
		const name = this.Q("input[name=name]").value,
			pass = this.Q("input[name=pass]").value
		ajax('POST', '/user/login',
			{ header:{ Authorization: "Basic "+name+":"+pass }})
		.then(user => { if(user) location.reload() })
		.catch(err => addErrorPopup(this, err))
	}

	postLogout(){
		ajax('POST', '/user/logout')
		.then(() => location.reload())
	}
}

HTMLMsaUserLoginBoxElement.prototype.Q = Q

customElements.define("msa-user-login-box", HTMLMsaUserLoginBoxElement)

<commit_msg>Use popupError from ajax()<commit_after>import { Q, ajax } from '/utils/msa-utils.js'

// template

const unloggedTemplate = `
		<div><input type=text size=10 name="name" placeholder="username"></div>
		<div><input type=password size=10 name="pass" placeholder="password"></div>
		<div><button class="login">Login</button></div>
`

const loggedTemplate = `
	<div style="display:flex; flex-direction:row; align-items: center">
		<label class="name" style="font-weight: bold;"></label>
		<input type="image" class="logout" style="width:1em; height:1em; padding-left:5px" src='/user/img/logout'>
	</div>
`
// msa-user-login-box

function getUser() {
	if(window.MsaUserPrm === undefined)
		window.MsaUserPrm = ajax("GET", "/user/user")
	return window.MsaUserPrm
}

export class HTMLMsaUserLoginBoxElement extends HTMLElement {

	connectedCallback(){
		getUser().then(user => {
			this.user = user
			this.initContent()
			this.initActions()
		})
	}

	getLoggedTemplate(){
		return loggedTemplate
	}

	getUnloggedTemplate(){
		return unloggedTemplate
	}

	initContent(){
		// display content, in function of user
		if(this.user) this.innerHTML = this.getLoggedTemplate()
		else this.innerHTML = this.getUnloggedTemplate()
		// sync
		this.sync()
	}

	sync(){
		this.syncText()
	}
	syncText(){
		// logged name
		if(this.user) this.Q(".name").textContent = this.user.name
	}

	initActions(){
		if(this.user) {
			// logout button
			this.Q(".logout").onclick = () => { this.postLogout() }
		} else {
			// login inputs
			this.querySelectorAll("input").forEach(input => {
				input.onkeydown = evt => {
					if(evt.key === "Enter")
						this.postLogin()
				}
			})
			// login button
			this.Q("button.login").onclick = () => { this.postLogin() }
		}
	}

	postLogin(){
		const name = this.Q("input[name=name]").value,
			pass = this.Q("input[name=pass]").value
		ajax('POST', '/user/login', {
			header: { Authorization: "Basic "+name+":"+pass },
			popupError: this
		})
		.then(user => { if(user) location.reload() })
	}

	postLogout(){
		ajax('POST', '/user/logout')
		.then(() => location.reload())
	}
}

HTMLMsaUserLoginBoxElement.prototype.Q = Q

customElements.define("msa-user-login-box", HTMLMsaUserLoginBoxElement)


{'fraction_non_alphanumeric': 0.1817781690140845, 'fraction_numerical': 0.0030809859154929575, 'mean_word_length': 4.027654867256637, 'pattern_counts': {'":': 2, '<': 33, '<?xml version=': 0, '>': 48, 'https://': 0, 'lorem ipsum': 0, 'www.': 0, 'xml': 0}, 'pii_count': 0, 'substrings_counts': 0, 'word_list_counts': {'cursed_substrings.json': 0, 'profanity_word_list.json': 0, 'sexual_word_list.json': 0, 'zh_pornsignals.json': 0}}
{'dir': 'git-commits-cleaned', 'id': '1657163', 'n_tokens_mistral': 1735, 'n_tokens_neox': 1584, 'n_words': 277}