diff options
Diffstat (limited to 'media')
| -rw-r--r-- | media/css/cavetables.css | 52 | ||||
| -rw-r--r-- | media/scripts/TableSort.js | 158 |
2 files changed, 210 insertions, 0 deletions
diff --git a/media/css/cavetables.css b/media/css/cavetables.css new file mode 100644 index 0000000..ba93356 --- /dev/null +++ b/media/css/cavetables.css @@ -0,0 +1,52 @@ +body { + all: initial; + font-size: 100%; +} + +div#inputf { + display: inline-block; + width: 300px; + text-align: justify; + margin-top: 0px; + margin-bottom: 5px +} + +.menu, ul#links{ + display: none; +} + +table { + border-spacing: 0; + width: 100%; + border: 1px solid #ddd; + font-family: monospace; +} + +th { + cursor: pointer; + background-color: #bbb +} + +th, td { + padding: 16px; + max-height: 40px; +} + +tr:nth-child(even) { + background-color: #f2f2f2 +} + +p { + + margin-right: 80px; + margin-left: 80px; +} + +button { + width: 300px +} +span#mono { + font-family: monospace; + background-color: #eee; + font-size: 120%; +} diff --git a/media/scripts/TableSort.js b/media/scripts/TableSort.js new file mode 100644 index 0000000..39f5e92 --- /dev/null +++ b/media/scripts/TableSort.js @@ -0,0 +1,158 @@ +function filterTable(tablename) +{ + table = document.getElementById(tablename); + + mindepth = document.getElementById("CaveDepthMin").value; + maxdepth = document.getElementById("CaveDepthMax").value; + if(mindepth==0)mindepth=-999999; + if(maxdepth==0)maxdepth= 999999; + + minlength = document.getElementById("CaveLengthMin").value; + maxlength = document.getElementById("CaveLengthMax").value; + if(minlength==0)minlength=-999999; + if(maxlength==0)maxlength= 999999; + + visitdate = document.getElementById("VisitDate").value; + + visitor = document.getElementById("Visitor").value; + + cavename = document.getElementById("CaveName").value.toLowerCase(); + + incomplete = document.getElementById("Incomplete").checked; + + var regexmode = false; + if(visitor[0]=='/' && visitor[visitor.length-1]=='/') + { + regexmode = true; + visitor = new RegExp(visitor.substr(1,visitor.length-2)); + } + else + { + visitor.toLowerCase(); + } + + rows = table.rows; + for(i=1; i< rows.length; i++) + { + name = (rows[i].getElementsByTagName("TD")[0]).innerHTML.toLowerCase(); + + depth = (rows[i].getElementsByTagName("TD")[1]).innerHTML.toLowerCase(); + depth = Number(depth.replace(/[^0-9.]/g,'')); + + length = (rows[i].getElementsByTagName("TD")[2]).innerHTML.toLowerCase(); + length = Number(length.replace(/[^0-9.]/g,'')); + + date = (rows[i].getElementsByTagName("TD")[3]).innerHTML.toLowerCase(); + + recentvisitor = (rows[i].getElementsByTagName("TD")[4]).innerHTML.toLowerCase(); + + if(cavename != "" && !name.includes(cavename)) + { + rows[i].style.visibility = "collapse"; + } + if(depth<mindepth || depth>maxdepth) + { + rows[i].style.visibility = "collapse"; + } + if(length<minlength || length>maxlength) + { + rows[i].style.visibility = "collapse"; + } + if(date < visitdate) + { + rows[i].style.visibility = "collapse"; + } + if(visitor != "" && regexmode && !visitor.test(recentvisitor)) + { + rows[i].style.visibility = "collapse"; + } + if(visitor != "" && !regexmode && !recentvisitor.includes(visitor)) + { + rows[i].style.visibility = "collapse"; + } + + crow=rows[i].getElementsByTagName("TD"); + for(var j=0; j<crow.length; j++) + { + if(crow[j].innerHTML == "" && incomplete) + { + rows[i].style.visibility = "collapse"; + break; + } + } + + } +} + +function filterTableReset(tablename) +{ + table = document.getElementById(tablename); + rows = table.rows; + for(i=1; i< rows.length; i++) + { + rows[i].style.visibility = "visible"; + } +} + + +function isOrdered(kvarray,numeric) +{ + for(var i=0;i<kvarray.length-1;i++) + { + if(numeric==1 && Number(kvarray[i][0])>Number(kvarray[i+1][0])) + { + return false; + } + if(numeric!=1 && kvarray[i][0]>kvarray[i+1][0]) + { + return false; + } + } + return true; +} + +function sortTable(n, tablename, numeric) { + table = document.getElementById(tablename); + rows = table.rows; + var ordering = []; + var i; + + //construct key-value pairs for sorting + for(i = 1; i < rows.length; i++) //remember header rows + { + key = rows[i].getElementsByTagName("TD")[n]; + key = key.innerHTML.toLowerCase(); + if(numeric==1) + { + key=key.replace(/[^0-9.]/g,'') + } + ordering.push([key,i]); + } + + var ascending = isOrdered(ordering,numeric); + + //sort either numerically or alphabetically + if(numeric==1) + { + ordering.sort((x,y) => Number(x[0])-Number(y[0])); + } + else + { + ordering.sort(); //sorts alphabetically + } + + if(ascending) ordering.reverse(); + + for(i = 0; i < ordering.length; i++) //add sorted list at the end of the table + { + var keyval = ordering[i]; + id = keyval[1]; //get rownumber of n^th sorted value + cln = rows[id].cloneNode(true); //deep clone of current node + table.insertBefore(cln,null); //add n^th row at the end + } + for(i = 1; i < ordering.length+1; i++) //remove unsorted nodes + { + table.deleteRow(1);// 0 -> header; 1 -> first row + } + +} |