From 3a24e78823fe958b29ef03e5c4cb68b4a280252c Mon Sep 17 00:00:00 2001 From: sairajzero Date: Tue, 31 Mar 2020 23:37:53 +0530 Subject: [PATCH] v0.9.2 Bugs Fixed: - Fixed: sheet-view not cleared upon signout Added: - Added: Feature to sort the table contents (click on the column to sort) - Added: Button to view the groupBy popup - Added: Hovering on a log displays writer's floID and log time Others: - Hide sheet detail UI at startup --- FLO_LogSheet.html | 112 +++++++++++++++++++++++++++++++++++++--------- 1 file changed, 90 insertions(+), 22 deletions(-) diff --git a/FLO_LogSheet.html b/FLO_LogSheet.html index b9c36ad..4cf120c 100644 --- a/FLO_LogSheet.html +++ b/FLO_LogSheet.html @@ -514,13 +514,14 @@ margin: 0.5rem; padding: 0 0.5rem; overflow: hidden; - height: 3rem; + height: 1.5rem; + display: inline-block; } .table-container { margin: 0 1rem 1rem 1rem; overflow: scroll; - max-height: 18rem; + max-height: 19rem; } table { @@ -657,6 +658,22 @@ margin: 0.5rem; } + #view-group-by { + float: right; + margin-right: 0.5rem; + height: 1.5rem; + width: 5rem; + background: var(--alt-light); + color: var(--alt-dark); + border: 0.1rem solid var(--alt-dark); + border-radius: 0.2rem; + } + + #view-group-by:hover { + background: var(--alt-dark); + color: var(--alt-light); + } + #group-by>div:first-child { text-align: center; font-weight: bold; @@ -744,8 +761,9 @@ clearElement(document.getElementById("startup-load-msg")) clearElement(document.getElementById('person-list')) clearElement(document.getElementById('sheet-list')) + clearElement(document.getElementById('sheet-view')) //set the custom Privkey input - floDapps.setCustomPrivKeyInput( () => { + floDapps.setCustomPrivKeyInput(() => { return new Promise((resolve, reject) => { let signInBox = document.getElementById("sign-in-box") signInBox.classList.remove('hide') @@ -773,7 +791,7 @@ console.log(result) document.getElementById("greet-tag").textContent = `Hi, ${myFloID}` showMessage("SignIn Successful") - reactor.dispatchEvent("startUpSuccessLog",`Downloading objectData! Please Wait...`) + reactor.dispatchEvent("startUpSuccessLog", `Downloading objectData! Please Wait...`) //request object data from Supernode logSheet.init().then(result => { console.log(result) @@ -783,15 +801,16 @@ //hide loading screen document.getElementById("loading-screen").classList.add("hide") //display add buttons if subAdmin, else hide - if(floGlobals.subAdmins.includes(myFloID)){ + if (floGlobals.subAdmins.includes(myFloID)) { document.getElementById("add-person").classList.remove('hide') document.getElementById("new-sheet").classList.remove('hide') - }else{ + } else { document.getElementById("add-person").classList.add('hide') document.getElementById("new-sheet").classList.add('hide') } + document.getElementById("sheet-details").classList.add("hide") }).catch(error => { - reactor.dispatchEvent("startUpErrorLog",`Failed to download objectData`) + reactor.dispatchEvent("startUpErrorLog", `Failed to download objectData`) showMessage(error, "error") }) }).catch(error => showMessage(error, "error")) @@ -933,10 +952,11 @@
-
+

+
@@ -957,19 +977,19 @@ else if (e.target.parentNode.parentNode.classList.contains("person-card")) copyToLogInput(e.target.parentNode.parentNode.children[1].children[0].textContent) else if (e.target.tagName === "TD" && e.target.parentElement.parentElement.tagName === "THEAD") - document.getElementById("group-by").parentNode.classList.remove("hide") + sortTable(e.target.parentElement.parentElement.parentElement, e.target.cellIndex) } catch (error) { //do nothing } }; - document.getElementById("sign-out").addEventListener('click', function(e){ + document.getElementById("sign-out").addEventListener('click', function (e) { getConfirmation('Are you sure you want to Sign out?').then(result => { - try{ + try { floDapps.clearCredentials(); showMessage("Successfully Signed out") setTimeout(onLoadStartUp, 2000) - }catch(error){ + } catch (error) { showMessage(error, "error") } }) @@ -1012,6 +1032,10 @@ document.getElementById("additional-fields").appendChild(field) }) + document.getElementById('view-group-by').addEventListener("click", function (e) { + document.getElementById("group-by").parentNode.classList.remove("hide") + }) + document.getElementById('group-by-menu').children[0].addEventListener("change", function (e) { try { @@ -1046,6 +1070,7 @@ } }) + function removeElement(element) { element.parentNode.removeChild(element); } @@ -1055,13 +1080,13 @@ return element; } - function getConfirmation(message){ + function getConfirmation(message) { let confirmation = document.getElementById("confirmation"); confirmation.children[0].textContent = message; confirmation.parentNode.classList.remove("hide") return new Promise((resolve, reject) => { - let interval = setInterval(()=>{ - if(confirmation.parentNode.classList.contains("hide")){ + let interval = setInterval(() => { + if (confirmation.parentNode.classList.contains("hide")) { confirmation.children[1].children[0].onclick = null; confirmation.children[1].children[1].onclick = null; clearInterval(interval); @@ -1140,7 +1165,6 @@ } catch (error) { showMessage(error, "error") } - } function createSheet() { @@ -1174,18 +1198,18 @@ function enterLog() { let title = document.getElementById("sheet-details").children[0].textContent; let form = document.forms['sheet-view'] - if (form[0].tagName === 'INPUT'){ + if (form[0].tagName === 'INPUT') { let floID = form[0].value; let log = [] - for(let i=1;i { form.reset(); showMessage('Log Entry Successful') - let row = document.getElementById("sheet-view").getElementsByTagName("tbody")[0].insertRow(1) + let row = document.getElementById("sheet-view").getElementsByTagName("tbody")[0].insertRow(1); row.insertCell(0).textContent = floID - for(let k = 0; k < log.length; k++) - row.insertCell(k+1).textContent = log[k] + for (let k = 0; k < log.length; k++) + row.insertCell(k + 1).textContent = log[k] }).catch(error => showMessage(error, "error")) } } @@ -1237,8 +1261,16 @@ } function renderSheetView(title, description, editors, attributes, sheet, isWriteable) { + const parseVectorClock = (vc) => { + vc = vc.split('_') + console.log(vc) + let time = new Date(parseInt(vc[0])).toString().slice(4, 24); + let floID = vc[1] + return `by ${floID} (${time})` + } //Add Sheet Details let sheetDetails = document.getElementById("sheet-details") + sheetDetails.classList.remove("hide") sheetDetails.children[0].textContent = title; sheetDetails.children[1].textContent = editors; sheetDetails.children[2].textContent = description; @@ -1251,6 +1283,7 @@ let tbody = document.createElement("tbody") sheet.forEach(data => { let row = tbody.insertRow(0); + row.setAttribute("title", parseVectorClock(data.vc)) row.insertCell(0).textContent = data.floID data.log.forEach(l => row.insertCell().textContent = l) }) @@ -1264,7 +1297,8 @@ clearElement(document.getElementById("sheet-view")).appendChild(table); //Add options for groupBy document.getElementById('group-by').children[0].textContent = `Group ${title} by`; - document.getElementById('group-by-view').innerHTML = `
FLO IDnull
` + document.getElementById('group-by-view').innerHTML = + `
FLO IDnull
` let colSelect = clearElement(document.getElementById('group-by-menu').children[1]); attributes.forEach(a => { let opt = document.createElement('option'); @@ -1288,6 +1322,40 @@ table.appendChild(tbody); clearElement(document.getElementById("group-by-view")).appendChild(table); } + + function sortTable(table, n) { + console.log(table, n) + let dir = "DESC"; + let flag = false; + let startRow = (table.getElementsByTagName("INPUT").length === 0) ? 1 : 2 + while (true) { + let rows = table.rows; + let swapIndex = false; + console.log(rows) + for (let i = startRow; i < rows.length - 1; i++) { + let x = rows[i].getElementsByTagName("TD")[n].textContent; + let y = rows[i + 1].getElementsByTagName("TD")[n].textContent; + let x_ = parseFloat(x) + let y_ = parseFloat(y) + if (isNaN(x_) || isNaN(y_)) { + x_ = x.toLowerCase() + y_ = y.toLowerCase() + } + if ((dir == "DESC" && x_ < y_) || (dir == "ASC" && x_ > y_)) { + swapIndex = i; + break; + } + } + if (swapIndex !== false) { + rows[swapIndex].parentNode.insertBefore(rows[swapIndex + 1], rows[swapIndex]); + flag = true; + } else if (!flag && dir == 'DESC') + dir = "ASC"; + else + break + } + + }