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

Development-GoTo and Search functionality implemented↩︎🔍 #4

Merged
merged 2 commits into from
Dec 23, 2024
Merged

Development-GoTo and Search functionality implemented↩︎🔍 #4

Show file tree
Hide file tree
Changes from all commits
Commits
Show all changes
2 commits
Select commit Hold shift + click to select a range
5816a20
Search implementation done🔍✅
charangirijala Dec 23, 2024
3a035bc
GoTo functionality implemented
charangirijala Dec 23, 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
8 changes: 8 additions & 0 deletions src/modules/main/logViewer/logViewer.css
View file
Open in desktop
Original file line number Diff line number Diff line change
Expand Up @@ -8,6 +8,14 @@ a {
overflow: visible;
z-index: 10;
}

.search-res {
background-color: rgb(250, 255, 189);
}

.search-res-focus {
background-color: yellow;
}
:host {
--dxp-s-form-element-text-font-size: 0.75rem;
--dxp-s-button-font-size: 0.8125rem;
Expand Down
42 changes: 15 additions & 27 deletions src/modules/main/logViewer/logViewer.html
View file
Open in desktop
Original file line number Diff line number Diff line change
Expand Up @@ -49,28 +49,11 @@ <h1>
<div
class="slds-m-left--xx-small search-button"
>
<div
class="slds-button-group actionBarButtonGroup"
role="group"
>
<button
class="slds-button slds-button_neutral action-bar-action-inlineEditReport reportAction report-action-inlineEditReport filtersButton"
type="button"
>
<svg
aria-hidden="true"
class="slds-button__icon slds-button__icon_left"
viewBox="0 0 52 52"
>
<g>
<path
d="M9.5 33.4l8.9 8.9c.4.4 1 .4 1.4 0L42 20c.4-.4.4-1 0-1.4l-8.8-8.8c-.4-.4-1-.4-1.4 0L9.5 32.1c-.4.4-.4 1 0 1.3zM36.1 5.7c-.4.4-.4 1 0 1.4l8.8 8.8c.4.4 1 .4 1.4 0l2.5-2.5c1.6-1.5 1.6-3.9 0-5.5l-4.7-4.7c-1.6-1.6-4.1-1.6-5.7 0l-2.3 2.5zM2.1 48.2c-.2 1 .7 1.9 1.7 1.7l10.9-2.6c.4-.1.7-.3.9-.5l.2-.2c.2-.2.3-.9-.1-1.3l-9-9c-.4-.4-1.1-.3-1.3-.1l-.2.2c-.3.3-.4.6-.5.9L2.1 48.2z"
></path>
</g></svg
>Enable Field
Editing
</button>
</div>
<ui-input
has-label={goTohasLabel}
placeholder={goToPlaceholder}
oninputchange={goToLine}
></ui-input>
</div>
<div
class="slds-m-left--xx-small"
Expand All @@ -87,7 +70,9 @@ <h1>
line-height: 1;
"
>
<div>
<div
class="search-button"
>
<div
role="button"
tabindex="-1"
Expand Down Expand Up @@ -117,7 +102,7 @@ <h1>
<div
class="slds-m-left--xx-small"
>
<div
<!-- <div
class="slds-button-group actionBarButtonGroup"
role="group"
>
Expand All @@ -139,7 +124,7 @@ <h1>
></path></svg
>Add Chart
</button>
</div>
</div> -->
</div>
<div
class="slds-m-left--xx-small"
Expand Down Expand Up @@ -645,8 +630,9 @@ <h1>
<ui-search
onclosesearch={handleSearch}
logtobe-filtered={fileData}
onnextmatch={goToNxtMatch}
onprevmatch={goToPrevMatch}
onmatchchange={goToMatch}
onsearchres={processSearchRes}
onnores={processNoSearchRes}
></ui-search>
</div>
</template>
Expand Down Expand Up @@ -733,6 +719,8 @@ <h1>
>
<tr
key={lineObj.lineNumber}
data-logid={lineObj.lineNumber}
class="log-row"
>
<td
style="
Expand Down
145 changes: 91 additions & 54 deletions src/modules/main/logViewer/logViewer.js
View file
Open in desktop
Original file line number Diff line number Diff line change
@@ -1,12 +1,16 @@
/* eslint-disable inclusive-language/use-inclusive-words */
import { LightningElement, track } from 'lwc';
import { subscribe, publish } from 'services/pubsub';
import { subscribe } from 'services/pubsub';

export default class logViewer extends LightningElement {
goToPlaceholder = 'Go to line';
goTohasLabel = false;
reRenderVal = false;
isLoading = false;
isSearching = false;
callStackToggle = false;
LineNumMap = new Map();
LineNumFocus = null;
fieldValue;
operatorValue;
filterValue = '';
Expand Down Expand Up @@ -163,7 +167,36 @@ export default class logViewer extends LightningElement {
const searchPopover =
this.template.querySelector('.data-search');
if (searchPopover) {
searchPopover.style.left = `${searchButtonRect.right}px`;
searchPopover.style.right = `${window.innerWidth - 24 - searchButtonRect.right}px`;
}
}
const lineElem = this.template.querySelectorAll('.log-row');
if (lineElem.length > 0) {
lineElem.forEach((ele) => {
ele.style.backgroundColor = 'rgba(0, 0, 0, 0)';
});
}
if (this.LineNumMap.size > 0) {
if (this.LineNumMap.has(this.pageNumber)) {
const highEle = this.LineNumMap.get(this.pageNumber);
highEle.forEach((ele) => {
const element = this.template.querySelector(
`[data-logid="${ele}"]`
);

if (element) {
if (this.LineNumFocus !== ele) {
element.style.backgroundColor =
'rgb(250, 255, 189)';
} else {
element.style.backgroundColor = 'yellow';
element.scrollIntoView({
behavior: 'smooth',
block: 'start'
});
}
}
});
}
}
}
Expand All @@ -174,52 +207,6 @@ export default class logViewer extends LightningElement {
return this.activeFilters.length > 0;
}

// subscribeToMessageChannel() {
// console.log("Subscribe called");
// if (!this.logChannelSub) {
// this.logChannelSub = subscribe(
// this.messageContext,
// STATE,
// (message) => {
// this.setFileData(message);
// },
// { scope: APPLICATION_SCOPE }
// );
// this.logChannelSub = true;
// }
// }

// setFileData(message) {
// if (message !== null && message !== undefined) {
// // console.log("[LogPreviewer.js] setFileData called", message);
// if (message.fileData !== undefined && message.fileData !== null) {
// this.fileData = message.fileData;
// this.pageNumber = 1;
// this.noOfPages = Math.ceil(
// this.fileData.length / this.linesPerPage
// );
// this.calculations();
// }
// if (
// message.fileMetadata !== undefined &&
// message.fileMetadata !== null
// ) {
// this.fileMetadata = message.fileMetadata;
// }
// if (
// message.eventsPicklistValues !== undefined &&
// message.eventsPicklistValues !== null
// ) {
// if (Array.isArray(message.eventsPicklistValues)) {
// this.filterPickListMaster =
// message.eventsPicklistValues.map((str) => ({
// value: str,
// label: str
// }));
// }
// }
// }
// }
onLinesPerPageChange(event) {
// console.log("Page Change: ", event.target.value);
let input = parseInt(event.target.value, 10);
Expand Down Expand Up @@ -508,15 +495,65 @@ export default class logViewer extends LightningElement {

handleSearch() {
this.isSearching = !this.isSearching;
// const payload = this.fileData;
// publish('searchChannel', payload);
if (this.isSearching === false) {
this.processNoSearchRes();
}
}

processSearchRes(event) {
const lineNumbers = event.detail;
this.LineNumMap = new Map();
//console.log(lineNumbers);
if (Array.isArray(lineNumbers)) {
lineNumbers.forEach((l) => {
if (this.linesPerPage !== 0) {
const pNum = Math.ceil(l / this.linesPerPage);
if (this.LineNumMap.has(pNum)) {
this.LineNumMap.get(pNum).push(l);
} else {
this.LineNumMap.set(pNum, [l]);
}
}
});
}
// console.log('Map: ', this.LineNumMap);
}

goToNxtMatch(event) {
console.log(event.detail);
goToMatch(event) {
const lineNumber = event.detail;
// console.log('lineNumber: ', lineNumber);
this.goToPage(lineNumber);
}

goToPage(lineNumber) {
//calculate the pagenumber
if (this.linesPerPage <= 0 || lineNumber <= 0) return;
this.LineNumFocus = lineNumber;
this.pageNumber = Math.ceil(lineNumber / this.linesPerPage);
this.calculations();
}

processNoSearchRes() {
this.LineNumFocus = null;
if (this.LineNumMap.size > 0) {
if (this.LineNumMap.has(this.pageNumber)) {
const highEle = this.LineNumMap.get(this.pageNumber);
highEle.forEach((ele) => {
const element = this.template.querySelector(
`[data-logid="${ele}"]`
);
if (element) {
element.style.backgroundColor = 'rgba(0, 0, 0, 0)';
}
});
}
}
this.LineNumMap = new Map();
}

goToPrevMatch(event) {
console.log(event.detail);
goToLine(event) {
// console.log('linenumber', event.detail);
const lNum = event.detail;
this.goToPage(lNum);
}
}
31 changes: 22 additions & 9 deletions src/modules/ui/input/input.html
View file
Open in desktop
Original file line number Diff line number Diff line change
@@ -1,15 +1,28 @@
<template>
<div class={inputClassList}>
<label class="slds-form-element__label slds-no-flex">{label}</label>
<template lwc:if={hasLabel}>
<label class="slds-form-element__label slds-no-flex">{label}</label>
</template>
<div class="slds-form-element__control slds-grow">
<input
type="text"
minlength={minimumLength}
placeholder={placeholder}
class="slds-input"
value={textValue}
onchange={handleInputChange}
/>
<template lwc:if={textValue}>
<input
type="text"
minlength={minimumLength}
placeholder={placeholder}
class="slds-input"
value={textValue}
onchange={handleInputChange}
/>
</template>
<template lwc:else>
<input
type="text"
minlength={minimumLength}
placeholder={placeholder}
class="slds-input"
oninput={handleOnInput}
/>
</template>
</div>
<template if:true={hasError}>
<div role="alert" class="slds-form-element__help">
Expand Down
15 changes: 14 additions & 1 deletion src/modules/ui/input/input.js
View file
Open in desktop
Original file line number Diff line number Diff line change
Expand Up @@ -5,6 +5,7 @@ export default class Input extends LightningElement {
@api minimumLength;
@api placeholder;
@api textValue;
@api hasLabel;
textValueInternal = '';
@api type;
hasError = false;
Expand All @@ -28,7 +29,19 @@ export default class Input extends LightningElement {
);
console.log(this.textValueInternal);
}

handleOnInput(event) {
const lineNum = event.target.value;
if (!isNaN(lineNum) && lineNum !== '') {
clearTimeout(this.timeoutId);
this.timeoutId = setTimeout(() => {
this.dispatchEvent(
new CustomEvent('inputchange', {
detail: parseInt(lineNum, 10)
})
);
}, 500);
}
}
checkMinLength() {
if (this.minimumLength && this.textValueInternal) {
if (
Expand Down
Loading