Update each tab to have a searchbar and filter present

This commit is contained in:
alanfoster 2023-12-02 03:48:56 +00:00
parent 888c4a9b97
commit bec8fc847c
2 changed files with 54 additions and 62 deletions

View File

@ -202,44 +202,44 @@
</li> --> </li> -->
</ul> </ul>
<div class="tab-content"> <div class="card shadow mb-5">
<!-- Reverse Shell Tab--> <div class="card-body">
<div class="tab-pane active" id="reverse" role="tabpanel" aria-labelledby="reverse-tab"> <!-- Top configuration bar -->
<div class="card shadow mb-5"> <div class="d-md-flex">
<div class="card-body"> <!---Filters-->
<!-- Top configuration bar --> <label for="os-options" class="col-auto col-form-label"
<div class="d-md-flex"> style="font-size:1rem">OS</label>
<!---Filters--> <div class="col-auto">
<label for="os-options" class="col-auto col-form-label" <select id="os-options" class="custom-select">
style="font-size:1rem">OS</label> <option class="os-item" value="all">All</option>
<div class="col-auto"> <option class="os-item" value="linux">Linux</option>
<select id="os-options" class="custom-select"> <option class="os-item" value="windows">Windows</option>
<option class="os-item" value="all">All</option> <option class="os-item" value="mac">Mac</option>
<option class="os-item" value="linux">Linux</option> </select>
<option class="os-item" value="windows">Windows</option> </div>
<option class="os-item" value="mac">Mac</option>
</select>
</div>
<label for="os-options" class="col-auto col-form-label" <label for="os-options" class="col-auto col-form-label"
style="font-size:1rem">Name</label> style="font-size:1rem">Name</label>
<div class="col-auto flex-grow-1"> <div class="col-auto flex-grow-1">
<input type="text" id="searchBox" placeholder="Search..." class="form-control form-control-md text-left"> <input type="text" id="searchBox" placeholder="Search..." class="form-control form-control-md text-left">
</div> </div>
<!---/Filters--> <!---/Filters-->
<!-- Show all advanced switch --> <!-- Show all advanced switch -->
<div class="custom-control custom-switch text-right d-flex justify-content-center align-self-center"> <div class="custom-control custom-switch text-right d-flex justify-content-center align-self-center">
<input id="revshell-advanced-switch" type="checkbox" class="custom-control-input" checked> <input id="revshell-advanced-switch" type="checkbox" class="custom-control-input" checked>
<label for="revshell-advanced-switch" class="custom-control-label small pr-2 pb-1" <label for="revshell-advanced-switch" class="custom-control-label small pr-2 pb-1"
style="padding-top:2px" data-toggle="tooltip" title="Display all advanced settings"> style="padding-top:2px" data-toggle="tooltip" title="Display all advanced settings">
Show Advanced Show Advanced
</label> </label>
<img src="assets/floppy-disk-solid.svg" class="download-svg" data-toggle="tooltip" title="Download Payload"> <img src="assets/floppy-disk-solid.svg" class="download-svg" data-toggle="tooltip" title="Download Payload">
</div> </div>
<!-- /Show all advanced switch --> <!-- /Show all advanced switch -->
</div> </div>
<div class="tab-content">
<!-- Reverse Shell Tab-->
<div class="tab-pane active" id="reverse" role="tabpanel" aria-labelledby="reverse-tab">
<div class="card-text mt-4"> <div class="card-text mt-4">
<div class="row"> <div class="row">
@ -340,17 +340,11 @@
</div> </div>
</div> </div>
<!-- /card-text -->
</div> </div>
</div> <!-- /Reverse Shell Tab -->
</div>
<!-- /Reverse Shell Tab -->
<!-- Bind Shell Tab --> <!-- Bind Shell Tab -->
<div class="tab-pane" id="bind" role="tabpanel" aria-labelledby="bind-tab"> <div class="tab-pane" id="bind" role="tabpanel" aria-labelledby="bind-tab">
<div class="card shadow mb-5">
<div class="card-body">
<div class="card-text mt-4"> <div class="card-text mt-4">
<div class="row"> <div class="row">
<!-- Left column: Bind selection --> <!-- Left column: Bind selection -->
@ -395,15 +389,10 @@
</div> </div>
</div> </div>
</div> </div>
</div> <!-- /Bind Shell Tab -->
</div>
<!-- /Bind Shell Tab -->
<!-- MSFVenom Tab --> <!-- MSFVenom Tab -->
<div class="tab-pane" id="msfvenom" role="tabpanel" aria-labelledby="msfvenom-tab"> <div class="tab-pane" id="msfvenom" role="tabpanel" aria-labelledby="msfvenom-tab">
<div class="card shadow mb-5">
<div class="card-body">
<img src="assets/floppy-disk-solid.svg" class="download-svg float-right" data-toggle="tooltip" title="Download Payload">
<div class="card-text mt-4"> <div class="card-text mt-4">
<div class="row"> <div class="row">
<!-- Left column: MSFVenom selection --> <!-- Left column: MSFVenom selection -->
@ -456,14 +445,10 @@
</div> </div>
</div> </div>
</div> </div>
</div> <!-- /MSFVenom Tab -->
</div>
<!-- /MSFVenom Tab -->
<!-- HoaxShell Tab --> <!-- HoaxShell Tab -->
<div class="tab-pane" id="hoaxshell" role="tabpanel" aria-labelledby="hoaxshell-tab"> <div class="tab-pane" id="hoaxshell" role="tabpanel" aria-labelledby="hoaxshell-tab">
<div class="card shadow mb-5">
<div class="card-body">
<div class="card-text mt-4"> <div class="card-text mt-4">
<div class="row"> <div class="row">
<!-- Left column: HoaxShell selection --> <!-- Left column: HoaxShell selection -->
@ -507,10 +492,10 @@
</div> </div>
</div> </div>
</div> </div>
<!-- /hoaxshell Tab -->
</div> </div>
</div> </div>
<!-- /hoaxshell Tab --> </div>
</div>
<!-- RSG data --> <!-- RSG data -->
<script src="js/data.js"></script> <script src="js/data.js"></script>

View File

@ -358,7 +358,14 @@ const rsg = {
} }
); );
const documentFragment = document.createDocumentFragment() const documentFragment = document.createDocumentFragment();
if (filteredItems.length === 0) {
const emptyMessage = document.createElement("button");
emptyMessage.innerText = "No results found";
emptyMessage.classList.add("list-group-item", "list-group-item-action", "disabled");
documentFragment.appendChild(emptyMessage);
}
filteredItems.forEach((item, index) => { filteredItems.forEach((item, index) => {
const { const {
name, name,