sortable neighbourslist table
This commit is contained in:
parent
7290e6c3e7
commit
8bd5196059
36
history.html
36
history.html
@ -12,6 +12,34 @@
|
|||||||
font-size: 11pt;
|
font-size: 11pt;
|
||||||
}
|
}
|
||||||
|
|
||||||
|
th.sort-header::selection {
|
||||||
|
background: transparent;
|
||||||
|
}
|
||||||
|
|
||||||
|
th.sort-header {
|
||||||
|
cursor: pointer;
|
||||||
|
}
|
||||||
|
|
||||||
|
table th.sort-header:after {
|
||||||
|
font-family: "ionicons";
|
||||||
|
padding-left: 0.25em;
|
||||||
|
content: '\f10d';
|
||||||
|
visibility: hidden;
|
||||||
|
}
|
||||||
|
|
||||||
|
table th.sort-header:hover:after {
|
||||||
|
visibility: visible;
|
||||||
|
}
|
||||||
|
|
||||||
|
table th.sort-up:after, table th.sort-down:after, table th.sort-down:hover:after {
|
||||||
|
visibility: visible;
|
||||||
|
opacity: 0.4;
|
||||||
|
}
|
||||||
|
|
||||||
|
table th.sort-up:after {
|
||||||
|
content: '\f104';
|
||||||
|
}
|
||||||
|
|
||||||
table.attributes {
|
table.attributes {
|
||||||
width: auto !important;
|
width: auto !important;
|
||||||
}
|
}
|
||||||
@ -149,7 +177,11 @@
|
|||||||
width: 100%;
|
width: 100%;
|
||||||
}
|
}
|
||||||
|
|
||||||
#sidebardata td:not(:first-child) {
|
#sidebardata table th {
|
||||||
|
text-align: left;
|
||||||
|
}
|
||||||
|
|
||||||
|
#sidebardata td:not(:first-child), #sidebardata th:not(:first-child) {
|
||||||
text-align: right;
|
text-align: right;
|
||||||
}
|
}
|
||||||
|
|
||||||
@ -224,6 +256,8 @@
|
|||||||
<script src="https://cdnjs.cloudflare.com/ajax/libs/moment.js/2.9.0/moment-with-locales.min.js"></script>
|
<script src="https://cdnjs.cloudflare.com/ajax/libs/moment.js/2.9.0/moment-with-locales.min.js"></script>
|
||||||
<script src="https://cdnjs.cloudflare.com/ajax/libs/leaflet/0.7.3/leaflet.js"></script>
|
<script src="https://cdnjs.cloudflare.com/ajax/libs/leaflet/0.7.3/leaflet.js"></script>
|
||||||
<script src="https://cdnjs.cloudflare.com/ajax/libs/Leaflet.awesome-markers/2.0.2/leaflet.awesome-markers.min.js"></script>
|
<script src="https://cdnjs.cloudflare.com/ajax/libs/Leaflet.awesome-markers/2.0.2/leaflet.awesome-markers.min.js"></script>
|
||||||
|
<script src="https://cdnjs.cloudflare.com/ajax/libs/tablesort/3.0.2/tablesort.min.js"></script>
|
||||||
|
<script src="vendor/tablesort.numeric.js"></script>
|
||||||
<script src="history.js"></script>
|
<script src="history.js"></script>
|
||||||
</head>
|
</head>
|
||||||
<body>
|
<body>
|
||||||
|
31
history.js
31
history.js
@ -480,12 +480,28 @@ function showNodeinfo(config, gotoAnything, d) {
|
|||||||
el.appendChild(h3)
|
el.appendChild(h3)
|
||||||
|
|
||||||
var table = document.createElement("table")
|
var table = document.createElement("table")
|
||||||
|
var thead = document.createElement("thead")
|
||||||
|
|
||||||
var neighbours = d.neighbours.slice().sort( function (a, b) {
|
var tr = document.createElement("tr")
|
||||||
return a.node.nodeinfo.hostname.localeCompare(b.node.nodeinfo.hostname)
|
var th1 = document.createElement("th")
|
||||||
})
|
th1.textContent = "Knoten"
|
||||||
|
th1.classList.add("sort-default")
|
||||||
|
tr.appendChild(th1)
|
||||||
|
|
||||||
neighbours.forEach( function (d) {
|
var th2 = document.createElement("th")
|
||||||
|
th2.textContent = "TQ"
|
||||||
|
tr.appendChild(th2)
|
||||||
|
|
||||||
|
var th3 = document.createElement("th")
|
||||||
|
th3.textContent = "Entfernung"
|
||||||
|
tr.appendChild(th3)
|
||||||
|
|
||||||
|
thead.appendChild(tr)
|
||||||
|
table.appendChild(thead)
|
||||||
|
|
||||||
|
var tbody = document.createElement("tbody")
|
||||||
|
|
||||||
|
d.neighbours.forEach( function (d) {
|
||||||
var tr = document.createElement("tr")
|
var tr = document.createElement("tr")
|
||||||
|
|
||||||
var td1 = document.createElement("td")
|
var td1 = document.createElement("td")
|
||||||
@ -522,11 +538,16 @@ function showNodeinfo(config, gotoAnything, d) {
|
|||||||
a3.textContent = showDistance(d.link)
|
a3.textContent = showDistance(d.link)
|
||||||
a3.onclick = gotoAnything.link(d.link)
|
a3.onclick = gotoAnything.link(d.link)
|
||||||
td3.appendChild(a3)
|
td3.appendChild(a3)
|
||||||
|
td3.setAttribute("data-sort", d.link.distance !== undefined ? d.link.distance : -1)
|
||||||
tr.appendChild(td3)
|
tr.appendChild(td3)
|
||||||
|
|
||||||
table.appendChild(tr)
|
tbody.appendChild(tr)
|
||||||
})
|
})
|
||||||
|
|
||||||
|
table.appendChild(tbody)
|
||||||
|
|
||||||
|
new Tablesort(table)
|
||||||
|
|
||||||
el.appendChild(table)
|
el.appendChild(table)
|
||||||
}
|
}
|
||||||
|
|
||||||
|
26
vendor/tablesort.numeric.js
vendored
Normal file
26
vendor/tablesort.numeric.js
vendored
Normal file
@ -0,0 +1,26 @@
|
|||||||
|
(function(){
|
||||||
|
var cleanNumber = function(i) {
|
||||||
|
return i.replace(/[^\-?0-9.]/g, '');
|
||||||
|
},
|
||||||
|
|
||||||
|
compareNumber = function(a, b) {
|
||||||
|
a = parseFloat(a);
|
||||||
|
b = parseFloat(b);
|
||||||
|
|
||||||
|
a = isNaN(a) ? 0 : a;
|
||||||
|
b = isNaN(b) ? 0 : b;
|
||||||
|
|
||||||
|
return a - b;
|
||||||
|
};
|
||||||
|
|
||||||
|
Tablesort.extend('number', function(item) {
|
||||||
|
return item.match(/^-?[£\x24Û¢´€]?\d+\s*([,\.]\d{0,2})/) || // Prefixed currency
|
||||||
|
item.match(/^-?\d+\s*([,\.]\d{0,2})?[£\x24Û¢´€]/) || // Suffixed currency
|
||||||
|
item.match(/^-?(\d)*-?([,\.]){0,1}-?(\d)+([E,e][\-+][\d]+)?%?$/); // Number
|
||||||
|
}, function(a, b) {
|
||||||
|
a = cleanNumber(a);
|
||||||
|
b = cleanNumber(b);
|
||||||
|
|
||||||
|
return compareNumber(b, a);
|
||||||
|
});
|
||||||
|
}());
|
Loading…
Reference in New Issue
Block a user