Skip to content
New issue

Have a question about this project? Sign up for a free GitHub account to open an issue and contact its maintainers and the community.

Sign up for GitHub

By clicking “Sign up for GitHub”, you agree to our terms of service and privacy statement. We’ll occasionally send you account related emails.

Already on GitHub? Sign in to your account

Jump to bottom

logsearch page -Wildcard and autocomplete support for index Search #932

Merged
merged 4 commits into from
May 22, 2024
Merged

logsearch page -Wildcard and autocomplete support for index Search #932

Show file tree
Hide file tree
Changes from 2 commits
Commits
Show all changes
4 commits
Select commit Hold shift + click to select a range
aca03a2
logsearch page -Wildcard Option, Index Search
sunitakawane May 22, 2024
554886e
Merge branch 'develop' into logsPage_IndexAutocomplete
sunitakawane May 22, 2024
d001be1
address PR comments
sunitakawane May 22, 2024
bd6c83e
Merge branch 'develop' into logsPage_IndexAutocomplete
nkunal May 22, 2024
File filter

Filter by extension

Filter by extension
Conversations
Failed to load comments.
Loading
Jump to
Jump to file
Failed to load files.
Loading
Diff view
Diff view
1 change: 0 additions & 1 deletion static/css/query-builder.css
View file
Open in desktop
Original file line number Diff line number Diff line change
Expand Up @@ -395,7 +395,6 @@ input.form-control {
position: absolute;
right: 28px;
top: 10px;
width: 398px;
}

.tab-li {
Expand Down
38 changes: 37 additions & 1 deletion static/css/siglens.css
View file
Open in desktop
Original file line number Diff line number Diff line change
Expand Up @@ -5255,4 +5255,40 @@ input.form-control {
flex-direction: column;
max-height: 100%;
font-size: 14px;
}
}

.index-container{
border: 1px solid var(--border-btn-color);
border-radius: 5px;
height: 32px;
display: flex;
align-items: center;
padding: 0px 12px;
font-size: 14px;
flex-grow: 1;
}
.index-container .selected-index{
color: var(--text-color);
padding: 4px 28px 4px 7px;
margin-right: 8px;
white-space: nowrap;
position: relative;
background-color: #ECF6FB;
}
.index-container .selected-index .remove-icon {
font-size: 22px;
font-weight: bold;
position: absolute;
top: -3px;
right: 8px;
cursor: pointer;
}
#index-listing{
border: none;
height: 28px;
padding: 0px !important;
}
#index-listing:focus{
outline: none;
background: var(--ui-widget-bg-color);
}
70 changes: 59 additions & 11 deletions static/index.html
View file
Open in desktop
Original file line number Diff line number Diff line change
Expand Up @@ -64,6 +64,62 @@
$('html').attr('data-theme', defaultTheme);
</script>
{{ .RunCheck1 | safeHTML }}
<style>
/* JQUERY AUTOCOMPLETE */
.ui-autocomplete {
position: absolute;
top: 100%;
left: 0;
z-index: 1000;
display: none;
float: left;
min-width: 160px;
padding: 0;
margin: 2px 0 0;
list-style: none;
font-size: 14px;
text-align: left;
background-color: #ffffff;
border: 1px solid #cccccc;
border: 1px solid rgba(0, 0, 0, 0.15);
border-radius: 4px;
-webkit-box-shadow: 0 6px 12px rgba(0, 0, 0, 0.175);
box-shadow: 0 6px 12px rgba(0, 0, 0, 0.175);
background-clip: padding-box;
}

.ui-autocomplete > li > div {
display: block;
padding: 3px 20px;
clear: both;
font-weight: normal;
height: 34px;
white-space: nowrap;
display: flex;
align-items: center;
}

.ui-state-hover,
.ui-state-active,
.ui-state-focus {
color: #ffffff;
text-decoration: none;
background-color: #2D69BC;
cursor: pointer;
height: 34px;
}

.ui-helper-hidden-accessible {
border: 0;
clip: rect(0 0 0 0);
height: 1px;
margin: -1px;
overflow: hidden;
padding: 0;
position: absolute;
width: 1px;
}
</style>
</head>

<body>
Expand Down Expand Up @@ -173,6 +229,9 @@
</div>
</div>
<div class="dropdown-box">
<div class="index-container">
<input type="text" name="" id="index-listing">
</div>
<div class="dropdown">
<button class="btn dropdown-toggle" type="button" id="query-language-btn" data-toggle="dropdown"
aria-haspopup="true" aria-expanded="false" data-bs-toggle="dropdown" title="Select Query Type">
Expand All @@ -186,17 +245,6 @@
<li id="option-3" class="query-language-option active">Splunk QL</li>
</div>
</div>
<div class="dropdown">
<button class="btn dropdown-toggle" type="button" id="index-btn" data-toggle="dropdown" aria-haspopup="true"
aria-expanded="false" data-bs-toggle="dropdown" title="Index Name to search on">
<span>Index</span>
<img class="dropdown-arrow orange" src="assets/arrow-btn.svg">
<img class="dropdown-arrow blue" src="assets/up-arrow-btn-light-theme.svg">
</button>
<div class="dropdown-menu box-shadow" aria-labelledby="index-btn" id="available-indexes">
<div id="index-listing"></div>
</div>
</div>
<div class="dropdown">
<button class="btn dropdown-toggle" type="button" id="date-picker-btn" data-toggle="dropdown" aria-haspopup="true"
aria-expanded="false" data-bs-toggle="dropdown" title="Pick the time window">
Expand Down
24 changes: 24 additions & 0 deletions static/js/common.js
View file
Open in desktop
Original file line number Diff line number Diff line change
Expand Up @@ -861,4 +861,28 @@ function findColumnIndex(columnsMap, columnName) {
}
}
return -1; // Return -1 if the column name is not found
}

function setIndexDisplayValue(selectedSearchIndex){
if (selectedSearchIndex) {
// Remove all existing selected indexes
$(".index-container .selected-index").remove();
const selectedIndexes = selectedSearchIndex.split(',');
selectedIndexes.forEach(function(index) {
addSelectedIndex(index);
// Remove the selectedSearchIndex from indexValues
const indexIndex = indexValues.indexOf(index);
if (indexIndex !== -1) {
indexValues.splice(indexIndex, 1);
}
if (index.endsWith('*')) {
const prefix = index.slice(0, -1); // Remove the '*'
const filteredIndexValues = indexValues.filter(function(option) {
return !option.startsWith(prefix);
});
indexValues = filteredIndexValues;
$("#index-listing").autocomplete("option", "source", filteredIndexValues);
}
});
}
}
22 changes: 1 addition & 21 deletions static/js/edit-panel-screen.js
View file
Open in desktop
Original file line number Diff line number Diff line change
Expand Up @@ -473,27 +473,7 @@ function editPanelInit(redirectedFromViewScreen) {
if (currentPanel.queryData && currentPanel.queryData.indexName) {
selectedSearchIndex = currentPanel.queryData.indexName;
}
if (selectedSearchIndex) {
// Remove all existing selected indexes
$(".index-container .selected-index").remove();
const selectedIndexes = selectedSearchIndex.split(',');
selectedIndexes.forEach(function(index) {
addSelectedIndex(index);
// Remove the selectedSearchIndex from indexValues
const indexIndex = indexValues.indexOf(index);
if (indexIndex !== -1) {
indexValues.splice(indexIndex, 1);
}
if (index.endsWith('*')) {
const prefix = index.slice(0, -1); // Remove the '*'
const filteredIndexValues = indexValues.filter(function(option) {
return !option.startsWith(prefix);
});
indexValues = filteredIndexValues;
$("#index-listing").autocomplete("option", "source", filteredIndexValues);
}
});
}
setIndexDisplayValue(selectedSearchIndex);

if ($('.dropDown-dataSource.active').length) handleSourceDropDownClick();
if ($('.dropDown-unit.active').length) handleUnitDropDownClick();
Expand Down
29 changes: 1 addition & 28 deletions static/js/event-handlers.js
View file
Open in desktop
Original file line number Diff line number Diff line change
Expand Up @@ -324,37 +324,10 @@ function indexOnSelectHandler(evt) {
checkedIndices.push($(this).data("index"));
});
selectedSearchIndex = checkedIndices.join(",");
getDisplayTextForIndex();
setIndexDisplayValue(selectedSearchIndex);
Cookies.set('IndexList', selectedSearchIndex)
}

function getDisplayTextForIndex(){
var selectedIndexes = selectedSearchIndex.split(',');
if (sortedListIndices && sortedListIndices.length > 0) {
selectedIndexes = sortedListIndices
.filter(item => selectedIndexes.includes(item.index))
.map(item => item.index);
} else {
selectedIndexes = [];
}

if (selectedIndexes.length === 0){
// If only no index is present
$("#index-btn span").html("Index");
}
else if (selectedIndexes.length === 1 ) {
// If only one index is selected
var indexName = selectedIndexes[0];
var displayedIndexName = indexName.trim() === "" ? "Index" : (indexName.length > 15 ? indexName.substring(0, 4) + '...' : indexName);
$("#index-btn span").html(displayedIndexName);
} else {
// If multiple indexes are selected
var numIndexes = selectedIndexes.length;
var firstIndexName = selectedIndexes[0];
var displayedFirstIndexName = firstIndexName.length > 15 ? firstIndexName.substring(0, 4) + '...' : firstIndexName.substring(0, 15);
$("#index-btn span").html(displayedFirstIndexName + ' +' + (numIndexes - 1));
}
}
function runLiveTailBtnHandler(evt) {
$(".popover").hide();
evt.preventDefault();
Expand Down
16 changes: 13 additions & 3 deletions static/js/index.js
View file
Open in desktop
Original file line number Diff line number Diff line change
Expand Up @@ -95,7 +95,12 @@ async function initializeIndexAutocomplete() {
}

$(this).val('');
runQueryBtnHandler();
const currentUrl = window.location.href;
if (currentUrl.includes("dashboard.html")){
runQueryBtnHandler();
}else{
runFilterBtnHandler(event);
}
},
open: function(event, ui) {
var containerPosition = $(this).closest('.index-container').offset();
Expand Down Expand Up @@ -199,7 +204,7 @@ async function initializeIndexAutocomplete() {
}

// Remove selected index from container when remove icon is clicked
$(".index-container").on("click", ".remove-icon", function() {
$(".index-container").on("click", ".remove-icon", function(e) {
if ($('.index-container .selected-index').length === 1) {
return; // If there's only one tag left, do not remove it
}
Expand Down Expand Up @@ -254,7 +259,12 @@ $(".index-container").on("click", ".remove-icon", function() {
$("#index-listing").css('width', '100%');
}

runQueryBtnHandler();
const currentUrl = window.location.href;
if (currentUrl.includes("dashboard.html")){
runQueryBtnHandler();
}else{
runFilterBtnHandler(e);
}
});


Expand Down
34 changes: 16 additions & 18 deletions static/js/log-search.js
View file
Open in desktop
Original file line number Diff line number Diff line change
Expand Up @@ -19,25 +19,23 @@

'use strict';

$(document).ready(() => {
let originalIndexValues = [];
let indexValues = [];

$(document).ready(async () => {
setSaveQueriesDialog();
getListIndices()
.then(function() {
if (window.location.search) {
data = getInitialSearchFilter(false, false);
} else {
console.log(`No query string found, using default search filter.`);
data = getSearchFilter(false, false);
}
return data;
})
.then(function(data) {
doSearch(data);
})
.finally(function() {
$('body').css('cursor', 'default');
getDisplayTextForIndex()
});
let indexes = await getListIndices();
originalIndexValues = indexes.map(item => item.index);
sunitakawane marked this conversation as resolved.
Show resolved Hide resolved
indexValues = [...originalIndexValues];
initializeIndexAutocomplete();
if (window.location.search) {
data = getInitialSearchFilter(false, false);
} else {
console.log(`No query string found, using default search filter.`);
sunitakawane marked this conversation as resolved.
Show resolved Hide resolved
data = getSearchFilter(false, false);
}
doSearch(data);
$('body').css('cursor', 'default');

const currentUrl = window.location.href;
if (currentUrl.includes("live-tail.html")) {
Expand Down
18 changes: 5 additions & 13 deletions static/js/search.js
View file
Open in desktop
Original file line number Diff line number Diff line change
Expand Up @@ -410,10 +410,8 @@
}
let sFrom = 0;

selIndexName.split(',').forEach(function(searchVal){
$(`.index-dropdown-item[data-index="${searchVal}"]`).toggleClass('active');
});

setIndexDisplayValue(selIndexName);

selectedSearchIndex = selIndexName.split(",").join(",");
Cookies.set('IndexList', selIndexName.split(",").join(","));

Expand Down Expand Up @@ -463,11 +461,7 @@
let sFrom = 0;
let queryLanguage = $("#query-language-btn span").html();

selIndexName.split(",").forEach(function (searchVal) {
$(`.index-dropdown-item[data-index="${searchVal}"]`).toggleClass(
"active"
);
});
setIndexDisplayValue(selIndexName);

selectedSearchIndex = selIndexName.split(",").join(",");
Cookies.set("IndexList", selIndexName.split(",").join(","));
Expand Down Expand Up @@ -549,10 +543,8 @@
let selIndexName = selectedSearchIndex;
let sFrom = 0;
let queryLanguage = $("#query-language-btn span").html();

selIndexName.split(",").forEach(function (searchVal) {
$(`.index-dropdown-item[data-index="${searchVal}"]`).toggleClass("active");
});

setIndexDisplayValue(selIndexName);

selectedSearchIndex = selIndexName.split(",").join(",");
Cookies.set("IndexList", selIndexName.split(",").join(","));
Expand Down
Loading