From a8fb5197fdfa9705c993b5bf6ae12d1f5f9a3088 Mon Sep 17 00:00:00 2001 From: "Heilig, Eric" Date: Mon, 17 Dec 2018 14:01:38 -0700 Subject: [PATCH 1/3] allow searching for multiple criteria separated by space --- static/storage.js | 40 ++++++++++++++++++++++------------------ 1 file changed, 22 insertions(+), 18 deletions(-) diff --git a/static/storage.js b/static/storage.js index dc138d7a..971c37e0 100644 --- a/static/storage.js +++ b/static/storage.js @@ -3,35 +3,39 @@ _lastData = []; function drawcontents(data) { data = data || _lastData; //Cache data so we can drawcontents without waiting for the server, for the search box. _lastData = data; - - const search = new RegExp(document.querySelector("#search").value, 'i'); - data = data.filter(function(item) { + + // allow searching for multiple criteria separated by space + var searchArgs = document.querySelector("#search").value; + searchArgs = searchArgs.trim(); + searchArgs = '(' + searchArgs.replace(/ +/g,")|(") + ')'; + const search = new RegExp(searchArgs, 'i'); + data = data.filter(function(item) { return search.test(item.name); }) - + sortByKey(data, "count"); - + const table = document.querySelector("#contents tbody"); //tables have tbody inserted automatically const rows = table.children; - + //update existing rows or create new ones data.forEach(function(item, i) { // format count to have .s in it for large number readability (1,000,000) item.count = item.count.toString().replace(/\B(?=(\d{3})+(?!\d))/g, ","); - + let row = rows[i]; if(!row) { row = document.createElement('tr'); row.innerHTML = ""; table.appendChild(row); } - + const img = row.querySelector('img'); const imgName = getImageFromName(item.name); if(img.getAttribute('src') !== imgName) { img.setAttribute('src',imgName); } - + const name = row.querySelector('.name'); if(name.textContent !== item.name) { name.textContent = item.name; @@ -39,13 +43,13 @@ function drawcontents(data) { makeItemGraphs(item.name); } } - + const count = row.querySelector('.count'); if(count.textContent !== ''+item.count) { count.textContent = item.count; } }); - + //remove excess rows, for example, after filtering while (data.length < rows.length) { table.removeChild(rows[data.length]); @@ -77,13 +81,13 @@ function sortByKey(array, key) { }); } -document.querySelector("#search").addEventListener('input', function() { +document.querySelector("#search").addEventListener('input', function() { drawcontents(); }); // Make graph of cluster IO items /*getJSON("/api/getStats", function(err, data){ - + }*/ function getItemStatData(item, callback){ var xhr = new XMLHttpRequest(); @@ -119,9 +123,9 @@ function makeItemGraphs(itemName){ HTML += '
'; ["place", "remove"].forEach(statistic => { console.log("Making chart for "+instanceID+"'s "+statistic+" statistic"); - + setTimeout(function(){ - let xmlhttp = new XMLHttpRequest(); // new HttpRequest instance + let xmlhttp = new XMLHttpRequest(); // new HttpRequest instance xmlhttp.open("POST", "/api/getStats"); xmlhttp.setRequestHeader("Content-Type", "application/json"); xmlhttp.onreadystatechange = function(){ @@ -135,7 +139,7 @@ function makeItemGraphs(itemName){ } catch(e) {} let whatGraphIsIt = "Item IO from "; // if(statistic == "remove") whatGraphIsIt = "Items taken from cluster by"; - + let chartData = JSON.parse(xmlhttp.response).data; switch(statistic){ case "place": @@ -191,7 +195,7 @@ function drawChart(selector, chartData, title) { e.dataSeries.visible = false; } else { e.dataSeries.visible = true; - } + } e.chart.render(); } }, @@ -201,4 +205,4 @@ function drawChart(selector, chartData, title) { // console.log(chart) chart.render(); return chart; -} \ No newline at end of file +} From 6855923e58ea360200dfa32a65bb95d9a3a492ee Mon Sep 17 00:00:00 2001 From: "Heilig, Eric" Date: Mon, 17 Dec 2018 14:06:33 -0700 Subject: [PATCH 2/3] formatting --- static/storage.js | 12 ++++++------ 1 file changed, 6 insertions(+), 6 deletions(-) diff --git a/static/storage.js b/static/storage.js index 971c37e0..eaf6853d 100644 --- a/static/storage.js +++ b/static/storage.js @@ -4,12 +4,12 @@ function drawcontents(data) { data = data || _lastData; //Cache data so we can drawcontents without waiting for the server, for the search box. _lastData = data; - // allow searching for multiple criteria separated by space - var searchArgs = document.querySelector("#search").value; - searchArgs = searchArgs.trim(); - searchArgs = '(' + searchArgs.replace(/ +/g,")|(") + ')'; - const search = new RegExp(searchArgs, 'i'); - data = data.filter(function(item) { + // allow searching for multiple criteria separated by space + var searchArgs = document.querySelector("#search").value; + searchArgs = searchArgs.trim(); + searchArgs = '(' + searchArgs.replace(/ +/g,")|(") + ')'; + const search = new RegExp(searchArgs, 'i'); + data = data.filter(function(item) { return search.test(item.name); }) From eaa8d5373c0ead12fb422fd7dc3816dd3bbf8556 Mon Sep 17 00:00:00 2001 From: =?UTF-8?q?Daniel=20Vest=C3=B8l?= Date: Mon, 17 Dec 2018 22:14:51 +0100 Subject: [PATCH 3/3] Readded whitespaces --- static/storage.js | 20 ++++++++++---------- 1 file changed, 10 insertions(+), 10 deletions(-) diff --git a/static/storage.js b/static/storage.js index eaf6853d..0e3c68a7 100644 --- a/static/storage.js +++ b/static/storage.js @@ -12,30 +12,30 @@ function drawcontents(data) { data = data.filter(function(item) { return search.test(item.name); }) - + sortByKey(data, "count"); - + const table = document.querySelector("#contents tbody"); //tables have tbody inserted automatically const rows = table.children; - + //update existing rows or create new ones data.forEach(function(item, i) { // format count to have .s in it for large number readability (1,000,000) item.count = item.count.toString().replace(/\B(?=(\d{3})+(?!\d))/g, ","); - + let row = rows[i]; if(!row) { row = document.createElement('tr'); row.innerHTML = ""; table.appendChild(row); } - + const img = row.querySelector('img'); const imgName = getImageFromName(item.name); if(img.getAttribute('src') !== imgName) { img.setAttribute('src',imgName); } - + const name = row.querySelector('.name'); if(name.textContent !== item.name) { name.textContent = item.name; @@ -43,13 +43,13 @@ function drawcontents(data) { makeItemGraphs(item.name); } } - + const count = row.querySelector('.count'); if(count.textContent !== ''+item.count) { count.textContent = item.count; } }); - + //remove excess rows, for example, after filtering while (data.length < rows.length) { table.removeChild(rows[data.length]); @@ -123,7 +123,7 @@ function makeItemGraphs(itemName){ HTML += '
'; ["place", "remove"].forEach(statistic => { console.log("Making chart for "+instanceID+"'s "+statistic+" statistic"); - + setTimeout(function(){ let xmlhttp = new XMLHttpRequest(); // new HttpRequest instance xmlhttp.open("POST", "/api/getStats"); @@ -139,7 +139,7 @@ function makeItemGraphs(itemName){ } catch(e) {} let whatGraphIsIt = "Item IO from "; // if(statistic == "remove") whatGraphIsIt = "Items taken from cluster by"; - + let chartData = JSON.parse(xmlhttp.response).data; switch(statistic){ case "place":