chg: [show tracker] add btn to hide/show long rule

This commit is contained in:
terrtia 2025-01-31 15:43:34 +01:00
parent 05bcfaa7d1
commit 63be1f3d0f
No known key found for this signature in database
GPG key ID: 1E1B1F50D84613D0

View file

@ -220,7 +220,10 @@
{% if rule_content %} {% if rule_content %}
<h5 class="mb-0">Yara Rule:</h5> <h5 class="mb-0">Yara Rule:</h5>
<p class="my-0"> <p class="my-0">
<pre class="text-collapse border bg-light">{{ rule_content }}</pre> <pre class="text-collapse border bg-light mb-0">
{{ rule_content }}
</pre>
<button class="btn btn-info btn-sm" id="btn_read_more">Show more</button>
</p> </p>
{% endif %} {% endif %}
@ -380,7 +383,6 @@
$('#div_edit_tags').hide(); $('#div_edit_tags').hide();
$('#div_edit_description').hide(); $('#div_edit_description').hide();
$("#page-Tracker").addClass("active"); $("#page-Tracker").addClass("active");
text_collapse();
$('#date-range-from').dateRangePicker({ $('#date-range-from').dateRangePicker({
separator: ' to ', separator: ' to ',
@ -439,26 +441,26 @@
} }
} }
function text_collapse() { // Hover effect
const textElements = document.querySelectorAll(".text-collapse"); var btn_read_more = $('#btn_read_more')
var textElement = document.querySelectorAll(".text-collapse")[0];
const lineHeight = parseFloat(window.getComputedStyle(textElement).lineHeight);
var maxLines = 30;
const maxHeight = lineHeight * maxLines;
textElements.forEach((textElement) => { // Apply initial truncation
console.log(textElements) textElement.style.maxHeight = maxHeight + 'px';
const lineHeight = parseFloat(window.getComputedStyle(textElement).lineHeight); if (textElement.getBoundingClientRect().height < maxHeight) {
const maxLines = 30; btn_read_more.hide();
const maxHeight = lineHeight * maxLines; } else {
btn_read_more.on("click", function() {
// Apply initial truncation if (btn_read_more.text() === "Show more") {
textElement.style.maxHeight = maxHeight + 'px';
// Hover effect
textElement.addEventListener("mouseenter", () => {
textElement.style.maxHeight = 'none'; textElement.style.maxHeight = 'none';
}); btn_read_more.text("Show less");
} else {
textElement.addEventListener("mouseleave", () => {
textElement.style.maxHeight = maxHeight + 'px'; textElement.style.maxHeight = maxHeight + 'px';
}); btn_read_more.text("Show more");
}
}); });
} }