Make tag handling much more flexible

This commit is contained in:
2022-08-09 07:20:30 +01:00
parent 16c03bc19a
commit ae489b1045
3 changed files with 95 additions and 87 deletions

View File

@@ -1,67 +1,89 @@
{% extends "base.html" %}
{% load static %}
{% load joinsep %}
{% block content %}
<script src="{% static 'js/chart.js' %}"></script>
<script>
function addTag(value) {
function setupTags() {
var inputTags = document.getElementById('tags');
var btiInstance = inputTags.BulmaTagsInput();
btiInstance.add(value);
}
function delTag(value) {
var inputTags = document.getElementById('tags');
var btiInstance = inputTags.BulmaTagsInput();
btiInstance.remove(value);
}
function toggleTag(field, value) {
var queryElement = document.getElementById('query');
var tagText = `${field}: ${value}`;
var present = true;
if (present == true) {
var toAppend = ` AND ${field}: "${value}"`;
var toRemove = `${field}: "${value}"`;
var tagText = `${field}: ${value}`;
} else {
var toAppend = ` AND NOT ${field}: "${value}"`;
var toRemove = `NOT ${field}: "${value}"`;
}
if (!queryElement.value.includes(toAppend) && !queryElement.value.includes(toRemove)) {
addTag(tagText);
} else {
delTag(tagText);
}
}
function populateSearch(field, value, fromTag=false) {
var queryElement = document.getElementById('query');
var present = true;
if (present == true) {
var toAppend = ` AND ${field}: "${value}"`;
var toRemove = `${field}: "${value}"`;
var tagText = `${field}: ${value}`;
} else {
var toAppend = ` AND NOT ${field}: "${value}"`;
var toRemove = `NOT ${field}: "${value}"`;
}
if (!queryElement.value.includes(toAppend) && !queryElement.value.includes(toRemove)) {
if (fromTag) {
queryElement.value+=toAppend;
new BulmaTagsInput(inputTags);
inputTags.BulmaTagsInput().on('before.add', function(item) {
if (item.includes(": ")) {
var spl = item.split(": ");
} else {
queryElement.value+=toAppend;
var spl = item.split(":");
}
var field = spl[0];
try {
var value = JSON.parse(spl[1]);
} catch {
var value = spl[1];
}
populateSearch(field, value);
return `${field}: ${value}`;
});
inputTags.BulmaTagsInput().on('after.remove', function(item) {
var spl = item.split(": ");
var field = spl[0];
try {
var value = JSON.parse(spl[1]);
} catch {
var value = spl[1].trim();
}
populateSearch(field, value);
});
}
function populateSearch(field, value) {
var queryElement = document.getElementById('query');
var present = true;
if (present == true) {
var combinations = [`${field}: "${value}"`,
`${field}: "${value}"`,
`${field}: ${value}`,
`${field}:${value}`,
`${field}:"${value}"`];
var toAppend = ` AND ${field}: "${value}"`;
// var toRemove = `${field}: "${value}"`;
// var tagText = `${field}: ${value}`;
} else {
if (fromTag) {
queryElement.value = queryElement.value.replaceAll(toAppend, "");
queryElement.value = queryElement.value.replaceAll(toRemove, "");
} else {
}
var combinations = [`NOT ${field}: "${value}"`,
`NOT ${field}: "${value}"`,
`NOT ${field}: ${value}`,
`NOT ${field}:${value}`,
`NOT ${field}:"${value}"`];
// var toAppend = ` AND NOT ${field}: "${value}"`;
// var toRemove = `NOT ${field}: "${value}"`;
}
var contains = combinations.some(elem => queryElement.value.includes(elem));
if (!contains) {
queryElement.value+=toAppend;
} else {
for (var index in combinations) {
combination = combinations[index];
queryElement.value = queryElement.value.replaceAll("AND "+combination, "");
queryElement.value = queryElement.value.replaceAll(combination, "");
}
// queryElement.value = queryElement.value.replaceAll(toAppend, "");
// queryElement.value = queryElement.value.replaceAll(toRemove, "");
}
// if (!queryElement.value.includes(toAppend) && !queryElement.value.includes(toRemove)) {
// queryElement.value+=toAppend;
// } else {
// queryElement.value = queryElement.value.replaceAll(toAppend, "");
// queryElement.value = queryElement.value.replaceAll(toRemove, "");
// }
if (field == "src") {
document.getElementById("source").selectedIndex = 0;
}
if (queryElement.value.startsWith(" AND ")) {
queryElement.value = queryElement.value.replace(" AND ", "");
}
if (queryElement.value.startsWith("AND ")) {
queryElement.value = queryElement.value.replace("AND ", "");
}
htmx.trigger("#search", "click");
}
</script>
@@ -339,38 +361,9 @@
</form>
</div>
<div class="block">
<input id="tags" class="input" type="tags" placeholder="Add query" value="">
<input id="tags" class="input" type="tags" placeholder="Add query" value="{{ tags|joinsep:',' }}">
<script>
var inputTags = document.getElementById('tags');
new BulmaTagsInput(inputTags);
{% for tag in tags %}
inputTags.BulmaTagsInput().add("{{ tag|escapejs }}");
{% endfor %}
inputTags.BulmaTagsInput().on('before.add', function(item) {
if (item.includes(": ")) {
var spl = item.split(": ");
} else {
var spl = item.split(":");
}
var field = spl[0];
try {
var value = JSON.parse(spl[1]);
} catch {
var value = spl[1];
}
populateSearch(field, value, fromTag=true);
return `${field}: ${value}`;
});
inputTags.BulmaTagsInput().on('after.remove', function(item) {
var spl = item.split(": ");
var field = spl[0];
try {
var value = JSON.parse(spl[1]);
} catch {
var value = spl[1];
}
populateSearch(field, value, fromTag=true);
});
setupTags();
</script>
</div>
<div class="block">