General user will have FLO ID auto entered

This commit is contained in:
sairaj mote 2022-09-17 00:42:10 +05:30
parent 258d9e4055
commit 92bcec3d81
5 changed files with 59 additions and 46 deletions

File diff suppressed because one or more lines are too long

View File

@ -1027,7 +1027,6 @@ th {
z-index: 1;
padding: 1rem 0.8rem;
white-space: nowrap;
box-shadow: 0 0.2rem 0.4rem rgba(0, 0, 0, 0.1254901961);
cursor: pointer;
}
@ -1214,6 +1213,7 @@ th.ascending::after {
#specify_editors {
border-top: solid 1px rgba(var(--text-color), 0.2);
padding-top: 1rem;
}
#add_editor sm-input,

2
css/main.min.css vendored

File diff suppressed because one or more lines are too long

View File

@ -1010,7 +1010,6 @@ th {
z-index: 1;
padding: 1rem 0.8rem;
white-space: nowrap;
box-shadow: 0 0.2rem 0.4rem #00000020;
cursor: pointer;
}
tr {
@ -1172,6 +1171,7 @@ th.ascending::after {
}
#specify_editors {
border-top: solid 1px rgba(var(--text-color), 0.2);
padding-top: 1rem;
}
#add_editor,
#add_column,

View File

@ -38,13 +38,11 @@
return new Promise((resolve, reject) => {
hideLoader()
showPage('sign_in_page')
let signInBtn = getRef('sign_in_btn'),
privateKeyInput = getRef('get_priv_key_field')
signInBtn.onclick = () => {
getRef('sign_in_btn').onclick = () => {
closePopup()
showLoader()
resolve(privateKeyInput.value)
privateKeyInput.value = ''
resolve(getRef('get_priv_key_field').value.trim())
getRef('get_priv_key_field').value = ''
}
})
})
@ -58,7 +56,7 @@
console.log(result)
//Render the personList and sheetList
renderPersonList()
renderSheetList(logSheet.listSheets())
renderSheetList()
//hide loading screen
hideLoader()
showPage(window.location.hash, { firstLoad: true })
@ -165,7 +163,14 @@
<section id="main_section">
<header class="flex align-center space-between section-header">
<h4>Sheets</h4>
<sm-input id="search_sheets" placeholder="Search sheets" type="search"></sm-input>
<sm-input id="search_sheets" placeholder="Search sheets" type="search">
<svg class="icon" slot="icon" xmlns="http://www.w3.org/2000/svg" height="24px"
viewBox="0 0 24 24" width="24px" fill="#000000">
<path d="M0 0h24v24H0V0z" fill="none" />
<path
d="M15.5 14h-.79l-.28-.27C15.41 12.59 16 11.11 16 9.5 16 5.91 13.09 3 9.5 3S3 5.91 3 9.5 5.91 16 9.5 16c1.61 0 3.09-.59 4.23-1.57l.27.28v.79l5 4.99L20.49 19l-4.99-5zm-6 0C7.01 14 5 11.99 5 9.5S7.01 5 9.5 5 14 7.01 14 9.5 11.99 14 9.5 14z" />
</svg>
</sm-input>
</header>
<section id="sheets_container" class="grid"></section>
</section>
@ -224,10 +229,8 @@
</section>
<div id="sheet_container">
<table>
<thead>
<tr></tr>
</thead>
<tbody></tbody>
<thead id="sheet_container__header"></thead>
<tbody id="sheet_container__body"></tbody>
</table>
</div>
<form id="new-log" style="display: none;" onsubmit="enterLog(event); return false;"></form>
@ -314,7 +317,7 @@
<sm-form>
<sm-input id="sheet_title_input" placeholder="Name*" autofocus animate required></sm-input>
<sm-textarea id="sheet_description_input" placeholder="Description" rows="4" animate required></sm-textarea>
<div id="specify_columns" class="grid">
<div id="specify_columns" class="grid gap-0-5">
<div class="flex flex-direction-column">
<h4>Add Columns</h4>
<p>Columns will be added as the order you added them.</p>
@ -327,16 +330,17 @@
</button>
</div>
</div>
<div class="flex align-center space-between">
Make sheet private
<sm-switch id="sheet_type_switch" onchange="toggleEditors()"></sm-switch>
</div>
<div id="specify_editors" class="grid hidden">
<sm-switch id="sheet_type_switch" onchange="toggleEditors()">
<div slot="left" class="flex align-center space-between">
Make sheet private
</div>
</sm-switch>
<div id="specify_editors" class="grid gap-0-5 hidden">
<div class="flex flex-direction-column">
<h4>Add editors</h4>
<p>Only specified editors will be able to update this sheet.</p>
</div>
<div id="editors_container" class="grid"></div>
<div id="editors_container" class="grid gap-0-3"></div>
<div id="add_editor" class="flex align-center space-between">
<sm-input id="add_editor_input" exclude placeholder="Editor's FLO Address"></sm-input>
<button class="button" onclick="addEditor()">
@ -763,8 +767,6 @@
break;
}
})
const tableHeader = getRef('sheet_container').firstElementChild.firstElementChild,
tableBody = getRef('sheet_container').firstElementChild.children[1]
function showLoader() {
document.body.classList.remove('hidden')
getRef('main_loader').classList.remove('hidden')
@ -820,7 +822,7 @@
}
})
})
watchLastElement.observe(tableBody, { childList: true, subtree: true })
watchLastElement.observe(getRef('sheet_container__body'), { childList: true, subtree: true })
getRef('search_sheets').addEventListener('input', function () {
if (this.value.trim !== '') {
@ -870,7 +872,7 @@
'data-flo-id': floId
})
card.innerHTML = `
<h4 class="editor-address">${floId}</h4>
<h4 class="editor-address wrap-around">${floId}</h4>
<button onclick="this.parentNode.remove()">
<svg class="icon" xmlns="http://www.w3.org/2000/svg" height="24px" viewBox="0 0 24 24" width="24px" fill="#000000"><path d="M0 0h24v24H0V0z" fill="none"/><path d="M16 9v10H8V9h8m-1.5-6h-5l-1 1H5v2h14V4h-3.5l-1-1zM18 7H6v12c0 1.1.9 2 2 2h8c1.1 0 2-.9 2-2V7z"/></svg>
</button>
@ -987,8 +989,11 @@
params = Object.fromEntries(urlSearchParams.entries());
}
switch (pageId) {
case 'sign_in_page':
getRef('get_priv_key_field').focusIn();
break;
case 'home_page':
tableBody.innerHTML = ''
getRef('sheet_container__body').innerHTML = ''
getRef('sheet_heading').textContent = ''
getRef('sheet_type').textContent = ''
getRef('sheet_description').textContent = ''
@ -1036,6 +1041,7 @@
getRef('entry_type_selector').addEventListener('change', e => {
if (e.target.value === 'sign-in') {
showChildElement('user_entry', 0, { entry: slideInRight, exit: slideOutRight }).then(() => {
getRef('get_priv_key_field').focusIn()
})
} else {
showChildElement('user_entry', 1, { entry: slideInLeft, exit: slideOutLeft }).then(() => {
@ -1150,13 +1156,12 @@
let title = getRef('sheet_title_input').value.trim();
let description = getRef('sheet_description_input').value.trim();
let columns = []
let editors = []
getRef('columns_container').querySelectorAll('.column-title').forEach(column => columns.push(column.textContent))
if (!columns.length) {
notify('Every LogSheet should contain atleast 1 column.', 'error')
notify('Every LogSheet should contain at least 1 column.', 'error')
return
}
getRef('editors_container').querySelectorAll('.editor-address').forEach(editor => editors.push(editor.textContent))
let editors = [...new Set([...getRef('editors_container').querySelectorAll('.editor-address')].map(editor => editor.textContent))]
if (!getRef('sheet_type_switch').checked)
editors = null;
else
@ -1165,7 +1170,7 @@
let sheetId = logSheet.createNewSheet(title, description, columns, editors)
let sheet = {}
sheet[sheetId] = { editors }
renderSheetList(sheet)
renderSheetList()
closePopup()
notify(`Created New Sheet: ${sheetId} (${title})`, 'success')
showSave()
@ -1196,10 +1201,13 @@
allFormElements.forEach(element => element.disabled = false)
form.reset();
notify('Log entry successful', 'success')
let row = tableBody.insertRow(0);
row.insertCell().textContent = floID
row.insertCell().innerHTML = `<input type="text" class="grade-input" disabled>`
log.forEach(l => row.insertCell().textContent = l)
getRef('sheet_container__body').prepend(html.node`
<tr>
<td>${floID}</td>
<td><input type="text" class="grade-input" disabled></td>
${log.map(l => html`<td>${l}</td>`)}
</tr>
`)
}).catch(error => {
notify(error, "error")
allFormElements.forEach(element => element.disabled = false)
@ -1212,14 +1220,14 @@
getRef('sheet_heading').classList.add('placeholder')
getRef('sheet_type').classList.add('placeholder')
getRef('sheet_description').classList.add('placeholder')
tableHeader.classList.add('hidden')
getRef('sheet_container__header').classList.add('hidden')
showPage('sheet_view')
logSheet.refreshLogs(sheetId).then(result => {
getRef('sheet_container').classList.remove('placeholder')
getRef('sheet_heading').classList.remove('placeholder')
getRef('sheet_type').classList.remove('placeholder')
getRef('sheet_description').classList.remove('placeholder')
tableHeader.classList.remove('hidden')
getRef('sheet_container__header').classList.remove('hidden')
let data = logSheet.viewLogs(sheetId)
renderSheetView(data.id, data.title, data.description, data.editors, data.attributes, data.sheet.reverse(),
!data.editors || data.editors.includes(myFloID), floGlobals.subAdmins.includes(myFloID))
@ -1233,7 +1241,8 @@
renderElem(getRef("people_container"), html`${list}`)
}
function renderSheetList(sheetList) {
function renderSheetList() {
const sheetList = logSheet.listSheets()
const list = []
if (floGlobals.subAdmins.includes(myFloID)) {
const firstCard = html`
@ -1330,21 +1339,25 @@
getRef('sheet_editors').innerHTML = ''
}
getRef('sheet_description').textContent = description;
clearElement(tableHeader)
let row = tableHeader.insertRow();
clearElement(getRef('sheet_container__header'))
let row = getRef('sheet_container__header').insertRow();
row.append(createTh("FLO ID"), createTh("Grade"));
attributes.forEach(a => row.append(createTh(a)))
//Add input fields if writable
let blockEditingID = (!isSubAdmin && (editors || true));
if (isWriteable && !lazyLoad) {
let row = tableHeader.insertRow();
row.insertCell().innerHTML = `<input form="new-log" class="log-input" type="text">`;
row.insertCell().textContent = ``;
attributes.forEach(a => row.insertCell().innerHTML = `<input form="new-log" class="log-input" type="text">`);
getRef('sheet_container__header').append(html.node`
<tr>
<td><input form="new-log" class="log-input" value="${blockEditingID ? myFloID : ''}" ?readonly=${blockEditingID}></td>
<td></td>
${attributes.map(attr => html`<td><input form="new-log" class="log-input"></td>`)}
</tr>
`)
}
}
if (onlyRenderTable) {
if (!lazyLoad)
tableBody.innerHTML = ''
getRef('sheet_container__body').innerHTML = ''
}
for (let i = startingIndex; i < endingIndex; i++) {
let data = sheet[i]
@ -1359,7 +1372,7 @@
data.log.forEach(l => row.append(createCell(l)))
frag.append(row)
}
tableBody.append(frag)
getRef('sheet_container__body').append(frag)
if (!onlyRenderTable) {
//Add options for groupBy
getRef('group_by_title').textContent = `Group ${title} by`;