Pulizia di vecchio codice e qualche miglioria

This commit is contained in:
2021-12-18 22:49:49 +01:00
parent 8e141af5df
commit 8a5e1a54c0
6 changed files with 42 additions and 64 deletions
+6 -39
View File
@@ -5,18 +5,17 @@
{{define "body"}}
<section>
<h2>
<img class="icons8" src="https://img.icons8.com/ios-filled/50/000000/find-user-male.png" />
<i class="fas fa-users"></i>
Utenti
</h2>
<p>
Questa è la lista di tutti gli utenti con un account su Poisson. Scrivi nome, cognome o username di un utente
per filtrare la lista in tempo reale.
<!-- TODO: Codice temporaneo -->
<p style="text-align: center;">
Questa è la lista di tutti gli utenti con un account su Poisson. Scrivi nome, cognome o username di un utente per filtrare la lista in tempo reale.
</p>
<div class="search">
<input type="text" id="search-field" placeholder="Cerca...">
<img class="icons8" src="https://img.icons8.com/ios-filled/50/000000/search.png" />
<i class="fas fa-search"></i>
</div>
<div class="user-list">
@@ -24,39 +23,7 @@
</div>
</section>
<script>
document.addEventListener('DOMContentLoaded', ({ }) => {
const $userList = document.querySelector('.user-list');
const $user = document.createElement('div');
$user.innerHTML = `
<div class="user">
<div class="contact">
<h3 class="fullname"></h3>
<h4 class="username"></h4>
</div>
<div class="links">
<a href="#">
<img class="icons8" src="https://img.icons8.com/ios-filled/50/000000/web.png" />
</a>
<a href="#">
<img class="icons8" src="https://img.icons8.com/ios-filled/50/000000/git.png" />
</a>
</div>
</div>
`;
// Per mostrare che la pagina regge molti utenti senza laggare troppo
Array(1400).fill(0).map(({ }, i) => {
setTimeout(() => {
// Pare che questa riga sia la più dispendiosa
const $newUser = $user.cloneNode(true);
$newUser.querySelector('.fullname').innerHTML = `Persona ${i + 1}`;
$newUser.querySelector('.username').innerHTML = `persona${i + 1}`;
$userList.appendChild($newUser.firstElementChild);
}, 0)
});
})
</script>
{{end}}