Changed intern search logic
This commit is contained in:
parent
f15e874b92
commit
0eccc4ffe4
42
css/main.css
42
css/main.css
@ -868,7 +868,7 @@ ul {
|
||||
position: absolute;
|
||||
top: 0;
|
||||
right: 0;
|
||||
margin: 0 2rem;
|
||||
margin: -1rem 1rem 0 1rem;
|
||||
list-style: none;
|
||||
padding: 0.5rem 0;
|
||||
width: max-content;
|
||||
@ -896,12 +896,11 @@ ul {
|
||||
margin: 1rem 0;
|
||||
}
|
||||
|
||||
#interns_list {
|
||||
#intern_list_popup {
|
||||
flex-direction: column;
|
||||
min-width: 20rem;
|
||||
}
|
||||
|
||||
#interns_list #interns_list_container {
|
||||
#intern_list_popup #interns_list_container {
|
||||
min-height: 50vh;
|
||||
max-height: 50vh;
|
||||
overflow-y: auto;
|
||||
@ -1035,17 +1034,13 @@ ul {
|
||||
#admin_page {
|
||||
position: relative;
|
||||
display: grid;
|
||||
gap: 1rem;
|
||||
padding: 0;
|
||||
gap: 0;
|
||||
height: 100%;
|
||||
}
|
||||
|
||||
#admin_page__header {
|
||||
gap: 1rem;
|
||||
align-items: center;
|
||||
grid-template-columns: 1fr auto;
|
||||
}
|
||||
|
||||
#project_editing_panel {
|
||||
position: relative;
|
||||
padding: 1rem;
|
||||
height: 100%;
|
||||
overflow-y: auto;
|
||||
@ -1096,6 +1091,7 @@ ul {
|
||||
}
|
||||
.fab-actions__item .icon {
|
||||
fill: var(--accent-color);
|
||||
margin-left: 0.5rem;
|
||||
}
|
||||
|
||||
.fab {
|
||||
@ -1103,9 +1099,9 @@ ul {
|
||||
display: flex;
|
||||
justify-content: center;
|
||||
align-items: center;
|
||||
padding: 0.8rem;
|
||||
height: 3rem;
|
||||
width: 3rem;
|
||||
padding: 1rem;
|
||||
height: 3.2rem;
|
||||
width: 3.2rem;
|
||||
border-radius: 50%;
|
||||
background-color: var(--accent-color);
|
||||
box-shadow: 0 0.5rem 0.8remrgba 0, 0, 0, 0.3;
|
||||
@ -1237,16 +1233,6 @@ ul {
|
||||
.hide-page-on-mobile {
|
||||
display: none;
|
||||
}
|
||||
|
||||
#admin_page {
|
||||
gap: 0;
|
||||
padding: 0;
|
||||
grid-template-rows: auto 1fr;
|
||||
}
|
||||
|
||||
#admin_page__header {
|
||||
padding: 1rem;
|
||||
}
|
||||
}
|
||||
@media only screen and (min-width: 640px) {
|
||||
.hide-on-desktop {
|
||||
@ -1312,18 +1298,16 @@ ul {
|
||||
|
||||
#admin_page {
|
||||
grid-template-columns: 18rem minmax(0, 1fr);
|
||||
grid-template-rows: auto 1fr;
|
||||
grid-template-areas: "admin-header admin-header" ". .";
|
||||
grid-template-rows: 1fr;
|
||||
}
|
||||
|
||||
#admin_page__header {
|
||||
grid-area: admin-header;
|
||||
#admin_page__left {
|
||||
background-color: var(--foreground-color);
|
||||
}
|
||||
|
||||
#admin_page__left,
|
||||
#project_editing_panel {
|
||||
border-radius: 0.5rem;
|
||||
background-color: var(--foreground-color);
|
||||
box-shadow: 0 0.5rem 1rem -0.5rem rgba(0, 0, 0, 0.3);
|
||||
}
|
||||
|
||||
|
||||
2
css/main.min.css
vendored
2
css/main.min.css
vendored
File diff suppressed because one or more lines are too long
@ -896,7 +896,7 @@ ul {
|
||||
position: absolute;
|
||||
top: 0;
|
||||
right: 0;
|
||||
margin: 0 2rem;
|
||||
margin: -1rem 1rem 0 1rem;
|
||||
list-style: none;
|
||||
padding: 0.5rem 0;
|
||||
width: max-content;
|
||||
@ -928,12 +928,11 @@ ul {
|
||||
margin: 1rem 0;
|
||||
}
|
||||
|
||||
#interns_list {
|
||||
#intern_list_popup {
|
||||
flex-direction: column;
|
||||
min-width: 20rem;
|
||||
}
|
||||
|
||||
#interns_list #interns_list_container {
|
||||
#intern_list_popup #interns_list_container {
|
||||
min-height: 50vh;
|
||||
max-height: 50vh;
|
||||
overflow-y: auto;
|
||||
@ -1067,17 +1066,13 @@ ul {
|
||||
#admin_page {
|
||||
position: relative;
|
||||
display: grid;
|
||||
gap: 1rem;
|
||||
padding: 0;
|
||||
gap: 0;
|
||||
height: 100%;
|
||||
}
|
||||
|
||||
#admin_page__header {
|
||||
gap: 1rem;
|
||||
align-items: center;
|
||||
grid-template-columns: 1fr auto;
|
||||
}
|
||||
|
||||
#project_editing_panel {
|
||||
position: relative;
|
||||
padding: 1rem;
|
||||
height: 100%;
|
||||
overflow-y: auto;
|
||||
@ -1133,6 +1128,7 @@ ul {
|
||||
}
|
||||
.icon{
|
||||
fill: var(--accent-color);
|
||||
margin-left: 0.5rem;
|
||||
}
|
||||
}
|
||||
.fab{
|
||||
@ -1140,9 +1136,9 @@ ul {
|
||||
display: flex;
|
||||
justify-content: center;
|
||||
align-items: center;
|
||||
padding: 0.8rem;
|
||||
height: 3rem;
|
||||
width: 3rem;
|
||||
padding: 1rem;
|
||||
height: 3.2rem;
|
||||
width: 3.2rem;
|
||||
border-radius: 50%;
|
||||
background-color: var(--accent-color);
|
||||
box-shadow: 0 0.5rem 0.8remrgba(0, 0, 0, 0.3);
|
||||
@ -1277,14 +1273,6 @@ ul {
|
||||
.hide-page-on-mobile {
|
||||
display: none;
|
||||
}
|
||||
#admin_page{
|
||||
gap: 0;
|
||||
padding: 0;
|
||||
grid-template-rows: auto 1fr;
|
||||
}
|
||||
#admin_page__header{
|
||||
padding: 1rem;
|
||||
}
|
||||
}
|
||||
@media only screen and (min-width: 640px) {
|
||||
.hide-on-desktop {
|
||||
@ -1355,17 +1343,14 @@ ul {
|
||||
|
||||
#admin_page {
|
||||
grid-template-columns: 18rem minmax(0, 1fr);
|
||||
grid-template-rows: auto 1fr;
|
||||
grid-template-areas: 'admin-header admin-header' '. .';
|
||||
grid-template-rows: 1fr;
|
||||
}
|
||||
|
||||
#admin_page__header {
|
||||
grid-area: admin-header;
|
||||
#admin_page__left{
|
||||
background-color: var(--foreground-color);
|
||||
}
|
||||
#admin_page__left,
|
||||
#project_editing_panel{
|
||||
border-radius: 0.5rem;
|
||||
background-color: var(--foreground-color);
|
||||
box-shadow: 0 0.5rem 1rem -0.5rem rgba(0, 0, 0, 0.3);
|
||||
}
|
||||
|
||||
|
||||
100
new.html
100
new.html
@ -204,9 +204,6 @@
|
||||
</section>
|
||||
</section>
|
||||
<section id="admin_page" class="page hide-completely">
|
||||
<header id="admin_page__header" class="grid">
|
||||
<p>Don't forget to commit changes</p>
|
||||
</header>
|
||||
<section id="admin_page__left" class="flex direction-column">
|
||||
<sm-tab-header target="admin_tabs">
|
||||
<sm-tab>Projects</sm-tab>
|
||||
@ -241,7 +238,7 @@
|
||||
Add task
|
||||
</sm-button>
|
||||
<ul id="task_context" class="hide-completely">
|
||||
<li id="assign_intern" tabindex="0" class="interact" onclick="showPopup('interns_list')">
|
||||
<li id="assign_intern" tabindex="0" class="interact" onclick="showPopup('intern_list_popup')">
|
||||
<svg class="icon" xmlns="http://www.w3.org/2000/svg" viewBox="0 0 24 24" width="24"
|
||||
height="24">
|
||||
<path fill="none" d="M0 0h24v24H0z" />
|
||||
@ -273,19 +270,25 @@
|
||||
<section id="admin_fab" class="fab-actions">
|
||||
<ul id="admin_fab__options" class="grid gap-0-5 hide-completely">
|
||||
<li class="fab-actions__item interact" onclick="showPopup('add_project_popup')">
|
||||
<svg class="icon button__icon--left" xmlns="http://www.w3.org/2000/svg" viewBox="0 0 24 24" width="24" height="24"><path fill="none" d="M0 0h24v24H0z"/><path d="M11 11V5h2v6h6v2h-6v6h-2v-6H5v-2z"/></svg>
|
||||
Add project
|
||||
<span class="fab-actions__item-name">
|
||||
Add project
|
||||
</span>
|
||||
<svg class="icon" xmlns="http://www.w3.org/2000/svg" viewBox="0 0 24 24" width="24" height="24"><path fill="none" d="M0 0h24v24H0z"/><path d="M12.414 5H21a1 1 0 0 1 1 1v14a1 1 0 0 1-1 1H3a1 1 0 0 1-1-1V4a1 1 0 0 1 1-1h7.414l2 2zM4 5v14h16V7h-8.414l-2-2H4zm7 7V9h2v3h3v2h-3v3h-2v-3H8v-2h3z"/></svg>
|
||||
</li>
|
||||
<li class="fab-actions__item interact" onclick="showPopup('add_intern_popup')">
|
||||
<svg class="icon button__icon--left" xmlns="http://www.w3.org/2000/svg" viewBox="0 0 24 24" width="24" height="24"><path fill="none" d="M0 0h24v24H0z"/><path d="M14 14.252v2.09A6 6 0 0 0 6 22l-2-.001a8 8 0 0 1 10-7.748zM12 13c-3.315 0-6-2.685-6-6s2.685-6 6-6 6 2.685 6 6-2.685 6-6 6zm0-2c2.21 0 4-1.79 4-4s-1.79-4-4-4-4 1.79-4 4 1.79 4 4 4zm6 6v-3h2v3h3v2h-3v3h-2v-3h-3v-2h3z"/></svg>
|
||||
Add intern
|
||||
<span class="fab-actions__item-name">
|
||||
Add intern
|
||||
</span>
|
||||
<svg class="icon" xmlns="http://www.w3.org/2000/svg" viewBox="0 0 24 24" width="24" height="24"><path fill="none" d="M0 0h24v24H0z"/><path d="M14 14.252v2.09A6 6 0 0 0 6 22l-2-.001a8 8 0 0 1 10-7.748zM12 13c-3.315 0-6-2.685-6-6s2.685-6 6-6 6 2.685 6 6-2.685 6-6 6zm0-2c2.21 0 4-1.79 4-4s-1.79-4-4-4-4 1.79-4 4 1.79 4 4 4zm6 6v-3h2v3h3v2h-3v3h-2v-3h-3v-2h3z"/></svg>
|
||||
</li>
|
||||
<li class="fab-actions__item interact" onclick="commitToChanges()">
|
||||
<svg class="icon button__icon--left" xmlns="http://www.w3.org/2000/svg" viewBox="0 0 24 24" width="24" height="24"><path fill="none" d="M0 0h24v24H0z"/><path d="M7 19v-6h10v6h2V7.828L16.172 5H5v14h2zM4 3h13l4 4v13a1 1 0 0 1-1 1H4a1 1 0 0 1-1-1V4a1 1 0 0 1 1-1zm5 12v4h6v-4H9z"/></svg>
|
||||
Commit changes
|
||||
<span class="fab-actions__item-name">
|
||||
Commit changes
|
||||
</span>
|
||||
<svg class="icon" xmlns="http://www.w3.org/2000/svg" viewBox="0 0 24 24" width="24" height="24"><path fill="none" d="M0 0h24v24H0z"/><path d="M7 19v-6h10v6h2V7.828L16.172 5H5v14h2zM4 3h13l4 4v13a1 1 0 0 1-1 1H4a1 1 0 0 1-1-1V4a1 1 0 0 1 1-1zm5 12v4h6v-4H9z"/></svg>
|
||||
</li>
|
||||
</ul>
|
||||
<button onclick="toggleFab()" class="fab">
|
||||
<button class="fab" onclick="toggleFab()">
|
||||
<svg class="icon" xmlns="http://www.w3.org/2000/svg" viewBox="0 0 24 24" width="24" height="24"><path fill="none" d="M0 0h24v24H0z"/><path d="M16 18v2H5v-2h11zm5-7v2H3v-2h18zm-2-7v2H8V4h11z"/></svg>
|
||||
<svg class="icon" xmlns="http://www.w3.org/2000/svg" viewBox="0 0 24 24" width="24" height="24"><path fill="none" d="M0 0h24v24H0z"/><path d="M12 10.586l4.95-4.95 1.414 1.414-4.95 4.95 4.95 4.95-1.414 1.414-4.95-4.95-4.95 4.95-1.414-1.414 4.95-4.95-4.95-4.95L7.05 5.636z"/></svg>
|
||||
</button>
|
||||
@ -359,7 +362,7 @@
|
||||
</div>
|
||||
</sm-popup>
|
||||
|
||||
<sm-popup id="interns_list">
|
||||
<sm-popup id="intern_list_popup">
|
||||
<header slot="header" class="popup__header">
|
||||
<button class="popup__header__close" onclick="hidePopup()">
|
||||
<svg class="icon" xmlns="http://www.w3.org/2000/svg" viewBox="0 0 24 24" width="24" height="24">
|
||||
@ -377,7 +380,7 @@
|
||||
d="M18.031 16.617l4.283 4.282-1.415 1.415-4.282-4.283A8.96 8.96 0 0 1 11 20c-4.968 0-9-4.032-9-9s4.032-9 9-9 9 4.032 9 9a8.96 8.96 0 0 1-1.969 5.617zm-2.006-.742A6.977 6.977 0 0 0 18 11c0-3.868-3.133-7-7-7-3.868 0-7 3.132-7 7 0 3.867 3.132 7 7 7a6.977 6.977 0 0 0 4.875-1.975l.15-.15z" />
|
||||
</svg>
|
||||
</sm-input>
|
||||
<div id="interns_list_container"></div>
|
||||
<ul id="interns_list_container"></ul>
|
||||
</sm-popup>
|
||||
|
||||
<sm-popup id="project_info">
|
||||
@ -613,14 +616,14 @@
|
||||
</li>
|
||||
</template>
|
||||
<template id="intern_card_template">
|
||||
<div class="intern-card grid align-center interact">
|
||||
<li class="intern-card grid align-center interact">
|
||||
<div class="intern-card__initials"></div>
|
||||
<h4 class="intern-card__name capitalize"></h4>
|
||||
<div class="intern-card__score-wrapper flex align-center">
|
||||
<h4 class="intern-card__score"></h4>
|
||||
<svg class="icon" xmlns="http://www.w3.org/2000/svg" viewBox="0 0 24 24" width="24" height="24"><path fill="none" d="M0 0h24v24H0z"/><path d="M12 18.26l-7.053 3.948 1.575-7.928L.587 8.792l8.027-.952L12 .5l3.386 7.34 8.027.952-5.935 5.488 1.575 7.928z"/></svg>
|
||||
</div>
|
||||
</div>
|
||||
</li>
|
||||
</template>
|
||||
<template id="timeline_task_card">
|
||||
<div class="task">
|
||||
@ -10358,7 +10361,7 @@
|
||||
// creates cards containing intern information
|
||||
const card = getRef('intern_card_template').content.cloneNode(true)
|
||||
setAttributes(card.firstElementChild, { 'data-intern-id': internFLOID, 'title': 'Intern Information' })
|
||||
card.querySelector('.intern-card__initials').style.backgroundColor = randomColor()
|
||||
card.querySelector('.intern-card__initials').style.backgroundColor = getInternColor(internFLOID)
|
||||
card.querySelector('.intern-card__initials').textContent = internName.split(' ').map(v => v.charAt(0)).join('');
|
||||
card.querySelector('.intern-card__name').textContent = internName;
|
||||
card.querySelector('.intern-card__score').textContent = internPoints;
|
||||
@ -10488,6 +10491,13 @@
|
||||
},
|
||||
}
|
||||
|
||||
const renderedIntensColor = {}
|
||||
function getInternColor(floId){
|
||||
if(!renderedIntensColor[floId]){
|
||||
renderedIntensColor[floId] = randomColor()
|
||||
}
|
||||
return renderedIntensColor[floId]
|
||||
}
|
||||
|
||||
//helper functions
|
||||
|
||||
@ -10640,7 +10650,8 @@
|
||||
currentTask = e.target.closest('.task-list-item');
|
||||
}
|
||||
if (e.target.closest('.task-option')) {
|
||||
getRef('task_context').setAttribute('style', `top: ${e.target.closest('.task-option').offsetTop}px`)
|
||||
const optionButton = e.target.closest('.task-option')
|
||||
getRef('task_context').setAttribute('style', `top: ${optionButton.offsetTop}px`)
|
||||
getRef('task_context').classList.remove('hide-completely')
|
||||
getRef('task_context').animate([
|
||||
{
|
||||
@ -10784,11 +10795,8 @@
|
||||
for (intern in allInternsList) {
|
||||
frag.append(render.internCard(allInternsList[intern], intern, RIBC.getInternRating(intern)))
|
||||
}
|
||||
getRef('interns_list_container').innerHTML = ''
|
||||
getRef('all_interns_list').innerHTML = ''
|
||||
const fragClone = frag.cloneNode(true)
|
||||
getRef('interns_list_container').append(frag)
|
||||
getRef('all_interns_list').append(fragClone)
|
||||
getRef('all_interns_list').append(frag)
|
||||
}
|
||||
|
||||
function changeScore(scoreUpdate) {
|
||||
@ -10924,7 +10932,7 @@
|
||||
}
|
||||
}
|
||||
|
||||
async function renderFilteredUpdates(options = {}) {
|
||||
const renderFilteredUpdates = debounce(async (options = {}) => {
|
||||
const {lazyLoad = false} = options
|
||||
const selectedProject = getRef('updates_page__project_selector').value
|
||||
const selectedintern = getRef('updates_page__intern_selector').value
|
||||
@ -10943,7 +10951,7 @@
|
||||
matchedUpdates = await getUpdatesByIntern(selectedintern, matchedUpdates)
|
||||
renderInternUpdates({updates: matchedUpdates, lazyLoad})
|
||||
}
|
||||
}
|
||||
}, 100)
|
||||
|
||||
function clearFilter(){
|
||||
getRef('updates_page__project_selector').reset()
|
||||
@ -11051,7 +11059,7 @@
|
||||
getRef('loading_page').classList.add('hide-completely')
|
||||
}
|
||||
}
|
||||
let myInput = function () {
|
||||
function myInput() {
|
||||
return new Promise((resolve, reject) => {
|
||||
loader('hide')
|
||||
getRef('sign_in_page').classList.remove('hide-completely');
|
||||
@ -11071,14 +11079,14 @@
|
||||
|
||||
function toggleFab() {
|
||||
if(getRef('admin_fab').hasAttribute('open')){
|
||||
getRef('admin_fab').toggleAttribute('open')
|
||||
getRef('admin_fab').removeAttribute('open')
|
||||
setTimeout(() => {
|
||||
getRef('admin_fab__options').classList.toggle('hide-completely')
|
||||
getRef('admin_fab__options').classList.add('hide-completely')
|
||||
}, 300);
|
||||
}else{
|
||||
getRef('admin_fab__options').classList.toggle('hide-completely')
|
||||
getRef('admin_fab__options').classList.remove('hide-completely')
|
||||
setTimeout(() => {
|
||||
getRef('admin_fab').toggleAttribute('open')
|
||||
getRef('admin_fab').setAttribute('open', '')
|
||||
}, 0);
|
||||
}
|
||||
}
|
||||
@ -11101,6 +11109,25 @@
|
||||
if (event.target.closest('.intern-card'))
|
||||
showInternInfo(event.target.closest('.intern-card'))
|
||||
})
|
||||
document.addEventListener('popupopened', e => {
|
||||
switch(e.detail.popup.id){
|
||||
case 'intern_list_popup':
|
||||
allInternsList = RIBC.getInternList();
|
||||
for (intern in allInternsList) {
|
||||
frag.append(render.internCard(allInternsList[intern], intern, RIBC.getInternRating(intern)))
|
||||
}
|
||||
getRef('interns_list_container').innerHTML = ''
|
||||
getRef('interns_list_container').append(frag)
|
||||
break;
|
||||
}
|
||||
})
|
||||
document.addEventListener('popupclosed', e => {
|
||||
switch(e.detail.popup.id){
|
||||
case 'intern_list_popup':
|
||||
getRef('interns_list_container').innerHTML = ''
|
||||
break;
|
||||
}
|
||||
})
|
||||
|
||||
const internAssignedTasks = {}
|
||||
|
||||
@ -11304,11 +11331,18 @@
|
||||
showTasksOfBranch(event.target.closest('.branch-btn'), 'project_editing_panel', 'task_list')
|
||||
}
|
||||
})
|
||||
|
||||
document.getElementById('intern_search_field').addEventListener('input', (event) => {
|
||||
let container = document.getElementById('interns_list_container'),
|
||||
inputField = document.getElementById('intern_search_field');
|
||||
})
|
||||
|
||||
const searchInterns = debounce((e) => {
|
||||
const searchKey = e.target.value.trim()
|
||||
const allInterns = RIBC.getInternList()
|
||||
for (const intern in allInterns) {
|
||||
if(allInternsList[intern].toLowerCase().includes(searchKey.toLowerCase()))
|
||||
frag.append(render.internCard(allInternsList[intern], intern, RIBC.getInternRating(intern)))
|
||||
}
|
||||
getRef('interns_list_container').innerHTML = ''
|
||||
getRef('interns_list_container').append(frag)
|
||||
}, 150)
|
||||
getRef('intern_search_field').addEventListener('input', searchInterns)
|
||||
|
||||
getRef('post_update_btn').addEventListener('click', () => {
|
||||
const { projectId, projectName, projectBranch, task } = internAssignedTasks[currentTaskId]
|
||||
|
||||
Loading…
Reference in New Issue
Block a user