function
setup() {
createCanvas(500, 300);
textSize(16);
matchQueryInput =
createInput();
matchQueryInput.position(30, 40);
getColBtn =
createButton(
"Get the matching row"
);
getColBtn.position(30, 70);
getColBtn.mouseClicked(getMatchedResults);
table =
new
p5.Table();
table.addColumn(
"name"
);
table.addColumn(
"id"
);
let newRow = table.addRow();
newRow.setString(
"name"
,
"mary"
);
newRow.setString(
"id"
, 21);
newRow = table.addRow();
newRow.setString(
"name"
,
"marco6"
);
newRow.setString(
"id"
, 27);
newRow = table.addRow();
newRow.setString(
"name"
,
"tunisia 4"
);
newRow.setString(
"id"
, 32);
newRow = table.addRow();
newRow.setString(
"name"
,
"user 23"
);
newRow.setString(
"id"
, 32);
newRow = table.addRow();
newRow.setString(
"name"
,
"admin"
);
newRow.setString(
"id"
, 45);
newRow = table.addRow();
newRow.setString(
"name"
,
"mikasa"
);
newRow.setString(
"id"
, 23);
showTable();
}
function
getMatchedResults() {
clear();
let matchQuery =
matchQueryInput.value();
if
(matchQuery !=
""
) {
matchResults =
table.matchRows(
new
RegExp(matchQuery),
'name'
);
if
(matchResults.length > 0) {
text(
"The rows that matches the "
+
"query is"
, 20, 120);
for
(let i = 0; i < matchResults.length; i++) {
text(matchResults[i].arr[0], 20, 140 + i * 20);
text(matchResults[i].arr[1], 120, 140 + i * 20);
}
}
else
text(
"No Results Found"
, 20, 120);
}
else
{
text(
"The query string is empty"
, 20, 120);
}
text(
"Enter a string to match it in "
+
"the 'name' column table"
, 20, 20);
}
function
showTable() {
clear();
text(
"There are "
+ table.getRowCount() +
" rows in the table"
, 20, 120);
for
(let r = 0; r < table.getRowCount(); r++)
for
(let c = 0; c < table.getColumnCount(); c++)
text(table.getString(r, c),
20 + c * 100, 140 + r * 20);
text(
"Enter a string to match it in "
+
"the 'name' column table"
, 20, 20);
}