arcoa/assets/app.js

72 lines
2.5 KiB
JavaScript

import './bootstrap.js';
/*
* Welcome to your app's main JavaScript file!
*
* This file will be included onto the page via the importmap() Twig function,
* which should already be in your base.html.twig.
*/
import './styles/app.css';
function showPasswd(selector) {
const icon = document.querySelector(selector);
const pwInput = document.querySelector('#pass-field');
icon.addEventListener('click', function () {
if (pwInput.getAttribute('type') === 'password') {
this.firstElementChild.classList.remove('fa-eye-slash');
this.firstElementChild.classList.add('fa-eye');
pwInput.setAttribute('type', 'text');
} else {
this.firstElementChild.classList.remove('fa-eye');
this.firstElementChild.classList.add('fa-eye-slash');
pwInput.setAttribute('type', 'password');
}
});
}
console.log('whatever');
if (location.pathname.includes('login')) {
showPasswd('#show-pw');
document.querySelector('#submit > button').addEventListener('click', function () {
this.parentElement.classList.add('is-loading');
});
const error = document.querySelector('.is-danger');
if (error) {
error.querySelector('.delete').addEventListener('click', () => {
error.classList.add('is-hidden');
});
}
}
if (! location.pathname.includes('login')) {
const vocabs = document.querySelector('#vocabs');
const userMenu = document.querySelector('.dropdown-trigger');
const userCaret = document.querySelector('#user-caret');
document.querySelector('#for-vocabs').addEventListener('click', function () {
vocabs.classList.toggle('is-hidden');
if (this.firstElementChild.classList.contains('fa-angle-right')) {
this.firstElementChild.classList.remove('fa-angle-right');
this.firstElementChild.classList.add('fa-angle-down');
} else {
this.firstElementChild.classList.remove('fa-angle-down');
this.firstElementChild.classList.add('fa-angle-right');
}
});
userMenu.addEventListener('click', function () {
document.querySelector('.dropdown').classList.toggle('is-active');
if (userCaret.classList.contains('fa-caret-down')) {
userCaret.classList.remove('fa-caret-down');
userCaret.classList.add('fa-caret-up');
} else {
userCaret.classList.remove('fa-caret-up');
userCaret.classList.add('fa-caret-down');
}
});
}