Fix: display the right user-agent select-block

pull/914/head
AntoniaBK 2024-05-14 11:13:46 +02:00
parent 1234bd1ff3
commit e711f7d9b5
2 changed files with 37 additions and 35 deletions

View File

@ -1,4 +1,4 @@
// scripts for chosing what should be captured // scripts for the submission type
document.getElementById('nav-url-tab').addEventListener('click', function (e) { document.getElementById('nav-url-tab').addEventListener('click', function (e) {
// switch to tab for capture of URL(s) // switch to tab for capture of URL(s)
@ -84,34 +84,37 @@ document.getElementById("os").addEventListener("change", function () {
}); });
}); });
document.querySelector('select[name="browser"]').addEventListener('click', function (e) { document.querySelectorAll('select[name="browser"]').forEach( function(element)
let osSelect = document.getElementById("os"); {
let browser_name = document.querySelector('select[name="browser"]').options[osSelect.selectedIndex].value.replace(/(:|\.|\[|\]|,|=|\\)/g, "\\$1").replace(/ /g, "_"); element.addEventListener('change', function (e) {
let os_name = document.querySelector('select[name="browser"]').parentNode.parentNode.getAttribute("id").replace(/(:|\.|\[|\]|,|=|\\)/g, "\\$1").replace(/ /g, "_"); let browser_name = element.options[element.selectedIndex].value.replace(/(:|\.|\[|\]|,|=|\\)/g, "\\$1").replace(/ /g, "_");
let osSelect = document.getElementById("os");
let os_name = osSelect.options[osSelect.selectedIndex].value.replace(/(:|\.|\[|\]|,|=|\\)/g, "\\$1").replace(/ /g, "_");
// Hide what makes sense // Hide and disable every useragent
document.querySelectorAll(".style-sub-1 > div > select").forEach(function (select) { document.querySelectorAll(".style-sub-1 > div > select").forEach(function (select) {
select.querySelectorAll('option').forEach(function (option) { select.querySelectorAll('option').forEach(function (option) {
option.removeAttribute('selected'); option.removeAttribute('selected');
});
}); });
}); document.querySelectorAll(".style-sub-2").forEach(function (element) {
document.querySelectorAll(".style-sub-2").forEach(function (element) { element.style.display = 'none';
element.style.display = 'none'; });
}); document.querySelectorAll(".style-sub-2 > div > select").forEach(function (select) {
document.querySelectorAll(".style-sub-2 > div > select").forEach(function (select) { select.disabled = true;
select.disabled = true; select.querySelectorAll('option').forEach(function (option) {
select.querySelectorAll('option').forEach(function (option) { option.removeAttribute('selected');
option.removeAttribute('selected'); });
});
// Show only the correct user-agent
document.querySelector("[id='" + os_name + '_' + browser_name + "']").style.display = 'flex';
document.querySelectorAll("[id='" + os_name + '_' + browser_name + "'] > div > select").forEach(function (select) {
select.disabled = false;
select.querySelector('option:first-child').selected = true;
}); });
});
document.querySelector("[id='" + os_name + '_' + browser_name + "']").style.display = 'flex';
document.querySelectorAll("[id='" + os_name + '_' + browser_name + "'] > div > select").forEach(function (select) {
select.disabled = false;
select.querySelector('option:first-child').selected = true;
}); });
}); });
document.getElementById('personal_ua_select').addEventListener('click', function (e) { document.getElementById('personal_ua_select').addEventListener('click', function (e) {
//disable select fields when personal useragent (ua) selected etc... //disable select fields when personal useragent (ua) selected etc...
document.getElementById('personal_ua').disabled = false; document.getElementById('personal_ua').disabled = false;

View File

@ -51,13 +51,12 @@
<br> <br>
<div class="tab-pane fade show active" id="nav-url" role="tabpanel" aria-labelledby="nav-url-tab"> <div class="tab-pane fade show active" id="nav-url" role="tabpanel" aria-labelledby="nav-url-tab">
<div class="row input-group mb-3"> <div class="row input-group mb-3">
<label class="col-sm-1 col-form-label">URL: <label for="url" class="col-sm-1 col-form-label">URL:</label>
<input type="text" class="form-control col-auto" name="url" id=singleCaptureField <input type="text" class="form-control col-auto" name="url" id=singleCaptureField
placeholder="URL to capture" value="{{predefined_url_to_capture}}" required> placeholder="URL to capture" value="{{predefined_url_to_capture}}" required>
<textarea class="form-control col-auto d-none" placeholder="URLs to capture, one per line" <textarea class="form-control col-auto d-none" placeholder="URLs to capture, one per line"
name="urls" id=multipleCapturesField></textarea> name="urls" id=multipleCapturesField></textarea>
</label>
<div class="col-sm-2 input-group-text"> <div class="col-sm-2 input-group-text">
<div class="form-check"> <div class="form-check">
@ -92,7 +91,7 @@
<div class="help-tip" title="Lookyloo uses an emulated browser for all captures, click to configure the User-Agent"></div> <div class="help-tip" title="Lookyloo uses an emulated browser for all captures, click to configure the User-Agent"></div>
</div> </div>
<div id="collapseConfigBrowser" class="collapse d-xl-block"> <div id="collapseConfigBrowser" class="collapse show">
<div class="card card-body"> <div class="card card-body">
{% if personal_ua %} {% if personal_ua %}
<div class="row mb-3"> <div class="row mb-3">
@ -149,7 +148,7 @@
<label for="browser" class="col-sm-2 col-form-label">Browser Type:</label> <label for="browser" class="col-sm-2 col-form-label">Browser Type:</label>
<div class="col-sm-10"> <div class="col-sm-10">
<!-- Disable all the selects not related to the default os --> <!-- Disable all the selects not related to the default os -->
<select class="form-select" id="browser" name="browser" {% if not os==default['os'] %}disabled{%endif%}> <select class="form-select" name="browser" {% if not os==default['os'] %}disabled{%endif%}>
{% for browser in browsers.keys()|sort(reverse=True) %} {% for browser in browsers.keys()|sort(reverse=True) %}
<!-- Select the default browser --> <!-- Select the default browser -->
<option value="{{ browser }}" {% if browser==default['browser'] %}selected{% endif %}>{{ browser }}</option> <option value="{{ browser }}" {% if browser==default['browser'] %}selected{% endif %}>{{ browser }}</option>
@ -163,7 +162,7 @@
<label for="user_agent" class="col-sm-2 col-form-label">User-Agent:</label> <label for="user_agent" class="col-sm-2 col-form-label">User-Agent:</label>
<div class="col-sm-10"> <div class="col-sm-10">
<!-- Disable all the selects, unless it is in default os and browser --> <!-- Disable all the selects, unless it is in default os and browser -->
<select class="form-select" id="user_agent" name="user_agent" {% if not os==default['os'] or not browser==default['browser'] %}disabled{%endif%}> <select class="form-select" name="user_agent" {% if not os==default['os'] or not browser==default['browser'] %}disabled{%endif%}>
{% for user_agent in user_agents %} {% for user_agent in user_agents %}
<!-- Select the default ua --> <!-- Select the default ua -->
<option value="{{ user_agent }}" {% if user_agent==default['useragent'] %}selected{% endif %}>{{ user_agent }}</option> <option value="{{ user_agent }}" {% if user_agent==default['useragent'] %}selected{% endif %}>{{ user_agent }}</option>
@ -364,26 +363,26 @@
<input class="form-check-input" type="checkbox" id="auto-report" name="auto-report" > <input class="form-check-input" type="checkbox" id="auto-report" name="auto-report" >
<label for="auto-report" class="form-check-label">Automatically submit to investigation team</label> <label for="auto-report" class="form-check-label">Automatically submit to investigation team</label>
</div> </div>
<div id="collapseMailConfiguration" class="collapse d-xl-block"> <div id="collapseMailConfiguration" class="collapse">
<div class="card card-body"> <div class="card card-body">
<div class="row mb-3"> <div class="row mb-3">
<label class="col-sm-5 col-form-label" for="email">Email of the sender (optional): </label> <label class="col-sm-3 col-form-label" for="email">Email of the sender (optional): </label>
<div class="col-sm-7"> <div class="col-sm-9">
<input class="form-control" type="text" id="email" <input class="form-control" type="text" id="email"
name="email" placeholder="myself@example.com"> name="email" placeholder="myself@example.com">
</div> </div>
</div> </div>
<div class="row mb-3"> <div class="row mb-3">
<label class="col-sm-5 col-form-label" for="recipient-mail"> <label class="col-sm-3 col-form-label" for="recipient-mail">
Email of the recipient (optional): </label> Email of the recipient (optional): </label>
<div class="col-sm-7"> <div class="col-sm-9">
<input class="form-control" type="text" id="recipient-mail" <input class="form-control" type="text" id="recipient-mail"
name="recipient-mail" placeholder="to-someone@example.com"> name="recipient-mail" placeholder="to-someone@example.com">
</div> </div>
</div> </div>
<div class="row mb-3"> <div class="row mb-3">
<label class="col-sm-5 col-form-label" for="comment">Comment (optional): </label> <label class="col-sm-3 col-form-label" for="comment">Comment (optional): </label>
<div class="col-sm-7"> <div class="col-sm-9">
<textarea class="form-control" type="text" id="comment" name="comment" rows="3"></textarea> <textarea class="form-control" type="text" id="comment" name="comment" rows="3"></textarea>
</div> </div>
</div> </div>