Merge with remove-jquery

pull/914/head
AntoniaBK 2024-05-13 09:45:57 +02:00
commit 33d1677722
2 changed files with 191 additions and 133 deletions

View File

@ -1,33 +1,192 @@
$("#os").change(function(){ // scripts for chosing what should be captured
var os_name = $(this).find(":selected").val().replace(/(:|\.|\[|\]|,|=)/g, "\\$1").replace(/ /g,"_");
var first_browser_name = $("[id='" + os_name + "']").find('select option:first-child').val().replace(/(:|\.|\[|\]|,|=)/g, "\\$1").replace(/ /g,"_");
// Hide and disable everything
$("#os > option").removeAttr('selected');
$(".style-sub-1").hide();
$(".style-sub-1 > div > select").attr('disabled', true);
$(".style-sub-1 > div > select").removeAttr('selected');
$(".style-sub-2").hide();
$(".style-sub-2 > div > select").attr('disabled', true);
$(".style-sub-2 > div > select").removeAttr('selected');
$("[id='" + os_name + "']").show(); document.getElementById('nav-url-tab').addEventListener('click', function (e) {
$("[id='" + os_name + "'] > div > select").removeAttr('disabled'); // switch to tab for capture of URL(s)
$("[id='" + os_name + "'] > div > select option:first").prop('selected',true);
$("[id='" + os_name + '_' + first_browser_name + "']").show(); // default: single capture field
$("[id='" + os_name + '_' + first_browser_name + "'] > div > select").removeAttr('disabled'); document.getElementById("singleCaptureField").required = true;
$("[id='" + os_name + '_' + first_browser_name + "'] > div > select option:first").prop('selected',true); document.getElementById("singleCaptureField").classList.remove("d-none");
// hide multiple captures field
document.getElementById('multipleCaptures').checked = false;
document.getElementById("multipleCapturesField").required = false;
document.getElementById("multipleCapturesField").classList.add("d-none");
document.getElementById("document").required = false;
}); });
$('select[name="browser"]').change(function(){ document.getElementById('nav-doc-tab').addEventListener('click', function (e) {
var browser_name = $(this).find(":selected").val().replace(/(:|\.|\[|\]|,|=)/g, "\\$1").replace(/ /g,"_"); // switch to tab for capture of document
var os_name = $(this).parent().parent().attr("id").replace(/(:|\.|\[|\]|,|=)/g, "\\$1").replace(/ /g,"_"); document.getElementById("document").required = true;
document.getElementById("multipleCapturesField").required = false;
// Hide what makes sense document.getElementById("singleCaptureField").required = false;
$(".style-sub-1 > div > select").removeAttr('selected');
$(".style-sub-2").hide();
$(".style-sub-2 > div > select").attr('disabled', true);
$(".style-sub-2 > div > select").removeAttr('selected');
$("[id='" + os_name + '_' + browser_name + "']").show();
$("[id='" + os_name + '_' + browser_name + "'] > div > select").removeAttr('disabled');
}); });
document.getElementById('multipleCaptures').addEventListener('click', function (e) {
// switch input-fields between multiple and single capture
if (document.getElementById('multipleCaptures').checked === true) {
// enable multiple captures
document.getElementById('singleCaptureField').value = '';
document.getElementById("singleCaptureField").classList.add("d-none");
document.getElementById("singleCaptureField").required = false;
document.getElementById("multipleCapturesField").classList.remove("d-none");
document.getElementById("multipleCapturesField").required = true;
} else {
// disable multiple captures
document.getElementById('multipleCapturesField').value = '';
document.getElementById("multipleCapturesField").classList.add("d-none");
document.getElementById("multipleCapturesField").required = false;
document.getElementById("singleCaptureField").classList.remove("d-none");
document.getElementById("singleCaptureField").required = true;
}
});
// scripts for browser configuration of the capture
document.getElementById("os").addEventListener("change", function () {
let osSelect = document.getElementById("os");
let os_name = osSelect.options[osSelect.selectedIndex].value.replace(/(:|\.|\[|\]|,|=)/g, "\\$1").replace(/ /g, "_");
let first_browser_name = document.querySelector("[id='" + os_name + "'] select option:first-child").value.replace(/(:|\.|\[|\]|,|=)/g, "\\$1").replace(/ /g, "_");
// Hide and disable everything
document.querySelectorAll("#os option").forEach(function (option) {
option.removeAttribute('selected');
});
document.querySelectorAll(".style-sub-1").forEach(function (element) {
element.style.display = 'none';
});
document.querySelectorAll(".style-sub-1 > div > select").forEach(function (select) {
select.disabled = true;
select.querySelectorAll('option').forEach(function (option) {
option.removeAttribute('selected');
});
});
document.querySelectorAll(".style-sub-2").forEach(function (element) {
element.style.display = 'none';
});
document.querySelectorAll(".style-sub-2 > div > select").forEach(function (select) {
select.disabled = true;
select.querySelectorAll('option').forEach(function (option) {
option.removeAttribute('selected');
});
});
// Re-enable and show what makes sense
document.querySelector("[id='" + os_name + "']").style.display = 'block';
document.querySelectorAll("[id='" + os_name + "'] > div > select").forEach(function (select) {
select.disabled = false;
select.querySelector('option:first-child').selected = true;
});
document.querySelector("[id='" + os_name + '_' + first_browser_name + "']").style.display = 'block';
document.querySelectorAll("[id='" + os_name + '_' + first_browser_name + "'] > div > select").forEach(function (select) {
select.disabled = false;
select.querySelector('option:first-child').selected = true;
});
});
document.querySelector('select[name="browser"]').addEventListener('click', function (e) {
let browser_name = document.querySelector('select[name="browser"]').options[osSelect.selectedIndex].value.replace(/(:|\.|\[|\]|,|=)/g, "\\$1").replace(/ /g, "_");
let os_name = document.querySelector('select[name="browser"]').parentNode.parentNode.getAttribute("id").replace(/(:|\.|\[|\]|,|=)/g, "\\$1").replace(/ /g, "_");
// Hide what makes sense
document.querySelectorAll(".style-sub-1 > div > select").forEach(function (select) {
select.querySelectorAll('option').forEach(function (option) {
option.removeAttribute('selected');
});
});
document.querySelectorAll(".style-sub-2").forEach(function (element) {
element.style.display = 'none';
});
document.querySelectorAll(".style-sub-2 > div > select").forEach(function (select) {
select.disabled = true;
select.querySelectorAll('option').forEach(function (option) {
option.removeAttribute('selected');
});
});
document.querySelector("[id='" + os_name + '_' + browser_name + "']").style.display = 'block';
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) {
//disable select fields when personal useragent (ua) selected etc...
document.getElementById('personal_ua').disabled = false;
document.getElementById('freetext_ua').disabled = true;
disablePredefinedUA();
});
document.getElementById('predefined_ua_select').addEventListener('click', function (e) {
document.getElementById('os-type').value = 'desktop';
document.getElementById('os-type').dispatchEvent(new Event('change'));
document.getElementById('freetext_ua').disabled = true;
document.getElementById('personal_ua').disabled = true;
// Enable predefinded user-agent
let os_type = document.getElementById('os-type');
os_type.value = 'desktop';
os_type.dispatchEvent(new Event('change'))
});
document.getElementById('freetext_ua_select').addEventListener('click', function (e) {
// Enable freetext user-agent
document.getElementById('freetext_ua').disabled = false;
document.getElementById('personal_ua').disabled = true;
disablePredefinedUA()
})
const disablePredefinedUA = function () {
document.getElementById('os-type').disabled = true;
document.getElementById('device-name-mobile').disabled = true;
document.getElementById('os').disabled = true;
document.querySelectorAll('select[name="browser"]').forEach(function (element) {
element.disabled = true;
});
document.querySelectorAll('select[name="user_agent"]').forEach(function (element) {
element.disabled = true;
});
};
document.getElementById('os-type').addEventListener('change', function () {
document.getElementById('os-type').disabled = false;
if (this.value === "mobile") {
document.getElementById("mobiles-list").style.display = 'block';
document.getElementById('device-name-mobile').disabled = false;
document.getElementById("desktops-list").style.display = 'none';
document.getElementById('os').disabled = true;
document.querySelectorAll('select[name="browser"]').forEach(function (element) {
element.disabled = true;
});
document.querySelectorAll('select[name="user_agent"]').forEach(function (element) {
element.disabled = true;
});
} else { // os-type is desktop
document.getElementById("desktops-list").style.display = 'block';
document.getElementById('os').disabled = false;
document.querySelectorAll('select[name="browser"]:not([hidden])').forEach(function (element) {
element.disabled = false;
});
document.querySelectorAll('select[name="user_agent"]:not([hidden])').forEach(function (element) {
element.disabled = false;
});
document.getElementById("mobiles-list").style.display = 'none';
document.getElementById('device-name-mobile').disabled = true;
}
});
// admin-only report-form
const displayReportForm = function() {
let show_form = document.getElementById("auto-report").checked;
if(show_form) {
document.getElementById("collapseMailConfiguration").style.display = "block";
} else {
document.getElementById("collapseMailConfiguration").style.display = "none";
}
}
displayReportForm()
document.getElementById("auto-report").addEventListener('change', displayReportForm);

View File

@ -22,12 +22,12 @@
{% block content %} {% block content %}
<div class="container"> <div class="container">
<center>
<a href="{{ url_for('index') }}" title="Go back to index"> <a href="{{ url_for('index') }}" title="Go back to index">
<img src="{{ url_for('static', filename='lookyloo.jpeg') }}" <img src="{{ url_for('static', filename='lookyloo.jpeg') }}"
alt="Lookyloo" width="25%"> alt="Lookyloo" width="25%">
</a> </a>
</center>
{{ render_messages(container=True, dismissible=True) }} {{ render_messages(container=True, dismissible=True) }}
<form role="form" action="{{ url_for('capture_web') }}" method=post enctype=multipart/form-data> <form role="form" action="{{ url_for('capture_web') }}" method=post enctype=multipart/form-data>
<div class="row mb-3"> <div class="row mb-3">
@ -81,7 +81,6 @@
<hr> <hr>
<!-- End of Submission type --> <!-- End of Submission type -->
<div> <div>
<button class="btn btn-link" type="button" data-bs-toggle="collapse" data-bs-target="#collapseConfigBrowser" <button class="btn btn-link" type="button" data-bs-toggle="collapse" data-bs-target="#collapseConfigBrowser"
aria-expanded="false" aria-controls="collapseConfigBrowser"> aria-expanded="false" aria-controls="collapseConfigBrowser">
@ -389,7 +388,6 @@
</div> </div>
{% endif %} {% endif %}
<center>
<b> <b>
{% if default_public %} {% if default_public %}
By default, the capture is public. If you do not want that, untick the box at the top of the form. By default, the capture is public. If you do not want that, untick the box at the top of the form.
@ -400,7 +398,7 @@
</br> </br>
</br> </br>
<button type="submit" class="new-capture-button btn btn-primary" id="btn-looking">Start looking!</button> <button type="submit" class="new-capture-button btn btn-primary" id="btn-looking">Start looking!</button>
</center>
</form> </form>
</div> </div>
{% endblock %} {% endblock %}
@ -410,104 +408,5 @@
<script src='{{ url_for('static', filename='capture.js') }}' <script src='{{ url_for('static', filename='capture.js') }}'
{{get_sri('static', 'capture.js')}} {{get_sri('static', 'capture.js')}}
crossorigin="anonymous"></script> crossorigin="anonymous"></script>
<script>
const displayReportForm = function() {
let show_form = document.getElementById("auto-report").checked;
if(show_form){
document.getElementById("collapseMailConfiguration").style.display = "block";
} else {
document.getElementById("collapseMailConfiguration").style.display = "none";
}
}
displayReportForm()
document.getElementById("auto-report").addEventListener('change', displayReportForm);
</script>
<script>
$('#nav-url-tab').on('click', function(e) {
document.getElementById("singleCaptureField").required = true;
document.getElementById("document").required = false;
$("#singleCaptureField").removeClass("d-none");
document.getElementById('multipleCaptures').checked = false;
$("#multipleCapturesField").addClass("d-none");
});
$('#nav-doc-tab').on('click', function(e) {
document.getElementById("document").required = true;
document.getElementById("multipleCapturesField").required = false;
document.getElementById("singleCaptureField").required = false;
});
</script>
<script>
$('#multipleCaptures').on('click', function(e) {
if (document.getElementById('multipleCaptures').checked == true) {
document.getElementById('singleCaptureField').value = '';
$("#singleCaptureField").addClass("d-none");
document.getElementById("singleCaptureField").required = false;
$("#multipleCapturesField").removeClass("d-none");
document.getElementById("multipleCapturesField").required = true;
}
else {
document.getElementById('multipleCapturesField').value = '';
$("#singleCaptureField").removeClass("d-none");
document.getElementById("singleCaptureField").required = true;
$("#multipleCapturesField").addClass("d-none");
document.getElementById("multipleCapturesField").required = false;
}
})
</script>
<script>
$('#personal_ua_select').on('click', function(e) {
$('#personal_ua').prop("disabled", false);
$('#freetext_ua').prop("disabled", true);
disablePredefinedUA();
});
$('#predefined_ua_select').on('click', function(e) {
$('#os-type').val('desktop').trigger('change');
$('#freetext_ua').prop("disabled", true);
$('#personal_ua').prop("disabled", true);
});
$('#freetext_ua_select').on('click', function(e) {
$('#freetext_ua').prop("disabled", false);
$('#personal_ua').prop("disabled", true);
disablePredefinedUA();
});
const disablePredefinedUA = function() {
$('#os-type').prop("disabled", true);
$('#device-name-mobile').prop("disabled", true);
$('#os').prop("disabled", true);
$('select[name="browser"]').prop("disabled", true);
$('select[name="user_agent"]').prop("disabled", true);
};
$('#os-type').on('change', function() {
$('#os-type').prop("disabled", false);
if ( this.value == "mobile")
{
$("#mobiles-list").show();
$('#device-name-mobile').prop("disabled", false);
$("#desktops-list").hide();
$('#os').prop("disabled", true);
$('select[name="browser"]').prop("disabled", true);
$('select[name="user_agent"]').prop("disabled", true);
}
else
{
$("#desktops-list").show();
$('#os').prop("disabled", false);
$('select[name="browser"]:visible').prop("disabled", false);
$('select[name="user_agent"]:visible').prop("disabled", false);
$("#mobiles-list").hide();
$('#device-name-mobile').prop("disabled", true);
}
});
</script>
{% endblock %} {% endblock %}