0.0.2
This commit is contained in:
sairaj mote
parent
117eeb6373
commit
739b399963
13
css/main.css
13
css/main.css
@ -529,6 +529,11 @@ sm-input::part(input) {
|
||||
#sheet_details .flex:not(:first-of-type) {
|
||||
margin-bottom: 0.3rem;
|
||||
}
|
||||
#sheet_details .flex:not(:first-of-type) .icon {
|
||||
cursor: pointer;
|
||||
margin-right: 1rem;
|
||||
height: 100%;
|
||||
}
|
||||
#sheet_details.collapse {
|
||||
padding: 0.5rem 1rem;
|
||||
margin-bottom: 0;
|
||||
@ -567,6 +572,7 @@ table input {
|
||||
width: 100%;
|
||||
border-radius: 0.3rem;
|
||||
background: rgba(var(--text-color), 0.06);
|
||||
color: inherit;
|
||||
}
|
||||
table input:disabled {
|
||||
border: transparent;
|
||||
@ -710,9 +716,14 @@ td {
|
||||
grid-template-columns: repeat(auto-fill, minmax(11rem, 1fr));
|
||||
}
|
||||
|
||||
#sheet_page {
|
||||
#sheet_page.toggle-side-bar {
|
||||
grid-template-columns: 19rem 1fr;
|
||||
}
|
||||
#sheet_page:not(.toggle-side-bar) #side_bar {
|
||||
grid-template-columns: 1fr;
|
||||
position: fixed;
|
||||
transform: translateX(-100%);
|
||||
}
|
||||
|
||||
#side_bar {
|
||||
position: relative;
|
||||
|
||||
2
css/main.min.css
vendored
2
css/main.min.css
vendored
File diff suppressed because one or more lines are too long
@ -526,6 +526,11 @@ sm-input::part(input){
|
||||
}
|
||||
.flex:not(:first-of-type){
|
||||
margin-bottom: 0.3rem;
|
||||
.icon{
|
||||
cursor: pointer;
|
||||
margin-right: 1rem;
|
||||
height: 100%;
|
||||
}
|
||||
}
|
||||
&.collapse{
|
||||
padding: 0.5rem 1rem;
|
||||
@ -563,6 +568,7 @@ table{
|
||||
width: 100%;
|
||||
border-radius: 0.3rem;
|
||||
background: rgba(var(--text-color), 0.06);
|
||||
color: inherit;
|
||||
&:disabled{
|
||||
border: transparent;
|
||||
}
|
||||
@ -698,7 +704,14 @@ td{
|
||||
grid-template-columns: repeat(auto-fill, minmax(11rem, 1fr));
|
||||
}
|
||||
#sheet_page{
|
||||
grid-template-columns: 19rem 1fr;
|
||||
&.toggle-side-bar{
|
||||
grid-template-columns: 19rem 1fr;
|
||||
}
|
||||
&:not(.toggle-side-bar) #side_bar{
|
||||
grid-template-columns: 1fr;
|
||||
position: fixed;
|
||||
transform: translateX(-100%);
|
||||
}
|
||||
}
|
||||
#side_bar{
|
||||
position: relative;
|
||||
|
||||
244
index.html
244
index.html
@ -35,7 +35,9 @@
|
||||
vectorClock: {},
|
||||
appObjects: {},
|
||||
generalData: {},
|
||||
generalVC: {}
|
||||
generalVC: {},
|
||||
// for storing signle log sheet data
|
||||
currentSheet: {}
|
||||
}
|
||||
</script>
|
||||
<script id="onLoadStartUp">
|
||||
@ -44,10 +46,9 @@
|
||||
showLoader()
|
||||
//document.getElementById("loading-screen").classList.remove("hide")
|
||||
//clear Rendered Elements
|
||||
/*clearElement(document.getElementById("startup-load-msg"))
|
||||
clearElement(document.getElementById('person-list'))
|
||||
/*clearElement(document.getElementById('person-list'))*/
|
||||
clearElement(document.getElementById('sheets_container'))
|
||||
clearElement(document.getElementById('sheet_container'))*/
|
||||
clearElement(document.getElementById('sheet_container'))
|
||||
//set the custom Privkey input
|
||||
floDapps.setCustomPrivKeyInput(() => {
|
||||
return new Promise((resolve, reject) => {
|
||||
@ -204,20 +205,15 @@
|
||||
<section id="home_page" class="page grid">
|
||||
<section id="main_section">
|
||||
<header class="flex align-center space-between section-header">
|
||||
<h4>Recent Sheets</h4>
|
||||
<h4>Sheets</h4>
|
||||
<sm-input placeholder="Search sheets" type="search"></sm-input>
|
||||
</header>
|
||||
<section id="sheets_container" class="grid"></section>
|
||||
</section>
|
||||
</section>
|
||||
<section id="sheet_page" class="page grid hide-completely">
|
||||
<section id="sheet_page" class="page toggle-side-bar grid hide-completely">
|
||||
<nav id="side_bar">
|
||||
<div class="flex align-center">
|
||||
<svg class="icon" viewBox="0 0 64 64">
|
||||
<title>menu</title>
|
||||
<line y1="18.5" x2="64" y2="18.5"/>
|
||||
<line y1="45.5" x2="42" y2="45.5"/>
|
||||
</svg>
|
||||
<h4 class="section-header">People</h4>
|
||||
</div>
|
||||
<div id="people_container" class="grid"></div>
|
||||
@ -229,9 +225,14 @@
|
||||
<title>Go back to homepage</title>
|
||||
<polyline points="48.01 0.35 16.35 32 48.01 63.65"/>
|
||||
</svg>
|
||||
<h5>Homepage</h5>
|
||||
<h5>Sheets</h5>
|
||||
</div>
|
||||
<div class="flex align-center">
|
||||
<svg class="icon" onclick="toggleSideBar()" viewBox="0 0 64 64">
|
||||
<title>Reveal/hide side bar</title>
|
||||
<line y1="18.5" x2="64" y2="18.5"/>
|
||||
<line y1="45.5" x2="42" y2="45.5"/>
|
||||
</svg>
|
||||
<h3 id="sheet_heading"></h3>
|
||||
<svg id="toggle_details" class="icon justify-right" onclick="toggleDetails()" viewBox="0 0 64 64">
|
||||
<title>expand/collapse</title>
|
||||
@ -553,8 +554,10 @@
|
||||
viewSheet(e.target.closest('.sheet-card').dataset.name)
|
||||
else if (e.target.closest(".person-card"))
|
||||
copyToLogInput(e.target.closest(".person-card").dataset.floId)
|
||||
else if (e.target.closest("th"))
|
||||
sortTable(e.target.closest('table'), e.target.cellIndex)
|
||||
else if (e.target.closest("th")){
|
||||
sortTable(e.target.cellIndex, e.target.closest('th').classList.contains('descending'))
|
||||
e.target.closest('th').classList.toggle('descending')
|
||||
}
|
||||
} catch (error) {
|
||||
//do nothing
|
||||
}
|
||||
@ -594,10 +597,14 @@
|
||||
}
|
||||
|
||||
const sheetDetails = document.getElementById('sheet_details')
|
||||
const sheetPage = document.getElementById('sheet_page')
|
||||
|
||||
function toggleDetails(){
|
||||
sheetDetails.classList.toggle('collapse')
|
||||
}
|
||||
function toggleSideBar(){
|
||||
sheetPage.classList.toggle('toggle-side-bar')
|
||||
}
|
||||
|
||||
const allPages = document.querySelectorAll('.page')
|
||||
function showPage(page){
|
||||
@ -653,8 +660,8 @@
|
||||
|
||||
document.getElementById('group_by_menu').children[0].addEventListener("change", function (e) {
|
||||
try {
|
||||
let title = currentSheet.title;
|
||||
let sheet = currentSheet.sheetData;
|
||||
let title = floGlobals.currentSheet.title;
|
||||
let sheet = floGlobals.currentSheet.sheet;
|
||||
let type = this.value;
|
||||
if (type === 'count') {
|
||||
this.nextSibling.classList.add("hide")
|
||||
@ -673,8 +680,8 @@
|
||||
|
||||
document.getElementById('group_by_menu').children[1].addEventListener("change", function (e) {
|
||||
try {
|
||||
let title = currentSheet.title;
|
||||
let sheet = currentSheet.sheetData;
|
||||
let title = floGlobals.currentSheet.title;
|
||||
let sheet = floGlobals.currentSheet.sheet;
|
||||
let type = this.previousSibling.value;
|
||||
let column = this.value;
|
||||
let data = logSheet.groupLogsBy[type](title, sheet, column);
|
||||
@ -759,7 +766,7 @@
|
||||
|
||||
function enterLog(e) {
|
||||
e.preventDefault()
|
||||
let title = currentSheet.title;
|
||||
let title = floGlobals.currentSheet.title;
|
||||
let form = document.forms['new-log'],
|
||||
allFormElements = document.querySelectorAll('input[form="new-log"]')
|
||||
allFormElements.forEach(element => element.disabled = true)
|
||||
@ -856,11 +863,18 @@
|
||||
const sheetContainer = document.getElementById('sheet_container'),
|
||||
sheetHeading = document.getElementById('sheet_heading'),
|
||||
sheetDescription = document.getElementById('sheet_description'),
|
||||
sheetEditors = document.getElementById('sheet_editors'),
|
||||
currentSheet = {}
|
||||
sheetEditors = document.getElementById('sheet_editors')
|
||||
|
||||
function renderSheetView(title, description, editors, attributes, sheet, isWriteable, isSubAdmin) {
|
||||
showPage('sheet_page')
|
||||
function renderSheetView(title, description, editors, attributes, sheet, isWriteable, isSubAdmin, onlyRenderTable = false) {
|
||||
floGlobals.currentSheet = {
|
||||
title,
|
||||
description,
|
||||
editors,
|
||||
attributes,
|
||||
sheet,
|
||||
isWriteable,
|
||||
isSubAdmin
|
||||
}
|
||||
const parseVectorClock = (vc) => {
|
||||
vc = vc.split('_')
|
||||
let time = new Date(parseInt(vc[0])).toString().slice(4, 24);
|
||||
@ -888,30 +902,38 @@
|
||||
}
|
||||
return gradeField
|
||||
}
|
||||
if(!onlyRenderTable){
|
||||
showPage('sheet_page')
|
||||
|
||||
//Add Sheet Details
|
||||
currentSheet.title = title
|
||||
sheetHeading.textContent = removeUnderscore(title);
|
||||
if(editors){
|
||||
editors.forEach(editor =>{
|
||||
let card = document.createElement('div')
|
||||
card.className = 'editor'
|
||||
card.textContent = editor;
|
||||
frag.append(card)
|
||||
})
|
||||
sheetEditors.innerHTML = 'Maintained by: '
|
||||
sheetEditors.append(frag)
|
||||
//Add Sheet Details
|
||||
sheetHeading.textContent = removeUnderscore(title);
|
||||
if(editors){
|
||||
editors.forEach(editor =>{
|
||||
let card = document.createElement('div')
|
||||
card.className = 'editor'
|
||||
card.textContent = editor;
|
||||
frag.append(card)
|
||||
})
|
||||
sheetEditors.innerHTML = 'Maintained by: '
|
||||
sheetEditors.append(frag)
|
||||
}
|
||||
else
|
||||
sheetEditors.textContent = "Public";
|
||||
sheetDescription.textContent = description;
|
||||
}
|
||||
let table
|
||||
if(onlyRenderTable){
|
||||
table = sheetContainer.querySelector('table')
|
||||
sheetContainer.querySelector('tbody').remove()
|
||||
}
|
||||
else{
|
||||
//Create and add the sheet table
|
||||
table = document.createElement("table")
|
||||
let thead = table.createTHead()
|
||||
let head = thead.insertRow(0)
|
||||
head.append(createCell("FLO ID"), createCell("Grade"));
|
||||
attributes.forEach(a => head.append(createCell(a)))
|
||||
}
|
||||
else
|
||||
sheetEditors.textContent = "Public";
|
||||
sheetDescription.textContent = description;
|
||||
currentSheet.sheetData = sheet;
|
||||
//Create and add the sheet table
|
||||
let table = document.createElement("table")
|
||||
let thead = table.createTHead()
|
||||
let head = thead.insertRow(0)
|
||||
head.append(createCell("FLO ID"), createCell("Grade"));
|
||||
attributes.forEach(a => head.append(createCell(a)))
|
||||
let tbody = document.createElement("tbody")
|
||||
sheet.forEach(data => {
|
||||
let row = tbody.insertRow(0);
|
||||
@ -927,19 +949,22 @@
|
||||
row.insertCell().textContent = ``;
|
||||
attributes.forEach(a => row.insertCell().innerHTML = `<input form="new-log" class="log-input" type="text">`);
|
||||
}
|
||||
|
||||
table.appendChild(tbody);
|
||||
clearElement(document.getElementById("sheet_container")).appendChild(table);
|
||||
//Add options for groupBy
|
||||
document.getElementById('group_by').children[0].textContent = `Group ${title} by`;
|
||||
document.getElementById('group_by_view').innerHTML =
|
||||
`<table><th><tr><td>FLO ID</td><td><i>null</i></td></tr></th></table>`
|
||||
let colSelect = clearElement(document.getElementById('group_by_menu').children[1]);
|
||||
attributes.forEach(a => {
|
||||
let opt = document.createElement('option');
|
||||
opt.setAttribute('value', a);
|
||||
opt.textContent = a;
|
||||
colSelect.appendChild(opt)
|
||||
})
|
||||
if(!onlyRenderTable){
|
||||
clearElement(sheetContainer).appendChild(table);
|
||||
//Add options for groupBy
|
||||
document.getElementById('group_by').children[0].textContent = `Group ${title} by`;
|
||||
document.getElementById('group_by_view').innerHTML =
|
||||
`<table><th><tr><td>FLO ID</td><td><i>null</i></td></tr></th></table>`
|
||||
let colSelect = clearElement(document.getElementById('group_by_menu').children[1]);
|
||||
attributes.forEach(a => {
|
||||
let opt = document.createElement('option');
|
||||
opt.setAttribute('value', a);
|
||||
opt.textContent = a;
|
||||
colSelect.appendChild(opt)
|
||||
})
|
||||
}
|
||||
}
|
||||
|
||||
function renderGroupByView(groupName, groupData) {
|
||||
@ -957,46 +982,71 @@
|
||||
clearElement(document.getElementById("group_by_view")).appendChild(table);
|
||||
}
|
||||
|
||||
function sortTable(table, n) {
|
||||
console.log('sort')
|
||||
let dir = "DESC";
|
||||
let flag = false;
|
||||
let startRow = (table.getElementsByClassName("log-input").length === 0) ? 1 : 2
|
||||
table.classList.add('hide-completely')
|
||||
while (true) {
|
||||
let rows = table.rows;
|
||||
let swapIndex = false;
|
||||
for (let i = startRow; i < rows.length - 1; i++) {
|
||||
let x, y, x_, y_;
|
||||
if (n === 1) {
|
||||
x = rows[i].cells[n].children[0].value;
|
||||
y = rows[i + 1].cells[n].children[0].value;
|
||||
} else {
|
||||
x = rows[i].cells[n].textContent;
|
||||
y = rows[i + 1].cells[n].textContent;
|
||||
}
|
||||
x_ = parseFloat(x)
|
||||
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{
|
||||
table.classList.remove('hide-completely')
|
||||
break
|
||||
}
|
||||
}
|
||||
|
||||
function sortTable(n, ascending) {
|
||||
if(ascending)
|
||||
if(n === 0)
|
||||
floGlobals.currentSheet.sheet.sort((a, b) => {
|
||||
if (a.floID.toLowerCase() === b.floID.toLowerCase()) {
|
||||
return 0;
|
||||
}
|
||||
else {
|
||||
return (a.floID.toLowerCase() < b.floID.toLowerCase()) ? -1 : 1;
|
||||
}
|
||||
})
|
||||
else if(n === 1)
|
||||
floGlobals.currentSheet.sheet.sort((a, b) => {
|
||||
if (a.grade === b.grade) {
|
||||
return 0;
|
||||
}
|
||||
else {
|
||||
return (a.grade < b.grade) ? -1 : 1;
|
||||
}
|
||||
})
|
||||
else
|
||||
floGlobals.currentSheet.sheet.sort((a, b) => {
|
||||
let x = a.log[n-2] ? a.log[n-2].toLowerCase() : a.log[n-2]
|
||||
let y = b.log[n-2] ? b.log[n-2].toLowerCase() : b.log[n-2]
|
||||
if (x === y) {
|
||||
return 0;
|
||||
}
|
||||
else {
|
||||
return (x < y) ? -1 : 1;
|
||||
}
|
||||
})
|
||||
else
|
||||
if(n === 0)
|
||||
floGlobals.currentSheet.sheet.sort((a, b) => {
|
||||
if (a.floID.toLowerCase() === b.floID.toLowerCase()) {
|
||||
return 0;
|
||||
}
|
||||
else {
|
||||
return (a.floID.toLowerCase() > b.floID.toLowerCase()) ? -1 : 1;
|
||||
}
|
||||
})
|
||||
else if(n === 1)
|
||||
floGlobals.currentSheet.sheet.sort((a, b) => {
|
||||
if (a.grade === b.grade) {
|
||||
return 0;
|
||||
}
|
||||
else {
|
||||
return (a.grade > b.grade) ? -1 : 1;
|
||||
}
|
||||
})
|
||||
else
|
||||
floGlobals.currentSheet.sheet.sort((a, b) => {
|
||||
let x = a.log[n-2] ? a.log[n-2].toLowerCase() : a.log[n-2]
|
||||
let y = b.log[n-2] ? b.log[n-2].toLowerCase() : b.log[n-2]
|
||||
if (x === y) {
|
||||
return 0;
|
||||
}
|
||||
else {
|
||||
return (x > y) ? -1 : 1;
|
||||
}
|
||||
})
|
||||
|
||||
console.log(floGlobals.currentSheet.sheet)
|
||||
let {title, description, editors, attributes, sheet, isWriteable, isSubAdmin} = floGlobals.currentSheet
|
||||
renderSheetView(title, description, editors, attributes, sheet, isWriteable, isSubAdmin, true)
|
||||
}
|
||||
</script>
|
||||
<script id="init_lib">
|
||||
|
||||
Loading…
Reference in New Issue
Block a user