mirror of https://github.com/CIRCL/lookyloo
Make the report-form look better
AntoniaBK
parent
33d1677722
commit
6dd71fba1f
|
|
@ -22,18 +22,18 @@
|
||||||
|
|
||||||
{% 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">
|
||||||
<div class="col-sm-10">
|
<div class="col-sm-10">
|
||||||
<div class="form-check">
|
<div class="form-check">
|
||||||
<input class="form-check-input" type="checkbox" name="listing" {% if default_public %}checked="true"{% endif %}></input>
|
<input class="form-check-input" type="checkbox" id="listing" name="listing" {% if default_public %}checked="checked"{% endif %}>
|
||||||
<label for="listing" class="form-check-label">Display results on public page</label>
|
<label for="listing" class="form-check-label">Display results on public page</label>
|
||||||
</div>
|
</div>
|
||||||
</div>
|
</div>
|
||||||
|
|
@ -48,23 +48,24 @@
|
||||||
</nav>
|
</nav>
|
||||||
|
|
||||||
<div class="tab-content" id="nav-tabContent">
|
<div class="tab-content" id="nav-tabContent">
|
||||||
</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 for="url" class="col-sm-1 col-form-label">URL:</label>
|
<label class="col-sm-1 col-form-label">URL:
|
||||||
<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>
|
||||||
|
|
||||||
<span class="col-sm-2 input-group-text">
|
<div class="col-sm-2 input-group-text">
|
||||||
<div class="form-check">
|
<div class="form-check">
|
||||||
<input class="form-check-input" name="multipleCaptures" id="multipleCaptures" type="checkbox"
|
<input class="form-check-input" name="multipleCaptures" id="multipleCaptures" type="checkbox"
|
||||||
value="" aria-label="tick to enable multiple captures">
|
value="" aria-label="tick to enable multiple captures">
|
||||||
<label for="multipleCaptures" class="form-check-label">Multiple captures</label>
|
<label for="multipleCaptures" class="form-check-label">Multiple captures</label>
|
||||||
</div>
|
</div>
|
||||||
</span>
|
</div>
|
||||||
</div>
|
</div>
|
||||||
</div>
|
</div>
|
||||||
|
|
||||||
|
|
@ -97,12 +98,12 @@
|
||||||
<div class="row mb-3">
|
<div class="row mb-3">
|
||||||
<div class="col-sm-10">
|
<div class="col-sm-10">
|
||||||
<div class="form-check">
|
<div class="form-check">
|
||||||
<input class="form-check-input" type="radio" id="personal_ua_select" name="user_agent_select"></input>
|
<input class="form-check-input" type="radio" id="personal_ua_select" name="user_agent_select">
|
||||||
<label for="personal_ua_select" class="form-check-label">
|
<label for="personal_ua_select" class="form-check-label">
|
||||||
Use the current <a href="https://en.wikipedia.org/wiki/User_agent">user-agent</a> of your own browser:</br>
|
Use the current <a href="https://en.wikipedia.org/wiki/User_agent">user-agent</a> of your own browser:<br>
|
||||||
{{ personal_ua }}
|
{{ personal_ua }}
|
||||||
</label>
|
</label>
|
||||||
<input class="visually-hidden" type="text" id="personal_ua" name="personal_ua" value="{{ personal_ua }}" disabled></input>
|
<input class="visually-hidden" type="text" id="personal_ua" name="personal_ua" value="{{ personal_ua }}" disabled>
|
||||||
</div>
|
</div>
|
||||||
</div>
|
</div>
|
||||||
</div>
|
</div>
|
||||||
|
|
@ -112,7 +113,7 @@
|
||||||
<div class="row mb-3">
|
<div class="row mb-3">
|
||||||
<div class="col-sm-10">
|
<div class="col-sm-10">
|
||||||
<div class="form-check">
|
<div class="form-check">
|
||||||
<input class="form-check-input" type="radio" id="predefined_ua_select" name="user_agent_select" checked></input>
|
<input class="form-check-input" type="radio" id="predefined_ua_select" name="user_agent_select" checked>
|
||||||
<label for="predefined_ua_select" class="form-check-label">Pick the <a href="https://en.wikipedia.org/wiki/User_agent">user-agent</a> of your choice:</label>
|
<label for="predefined_ua_select" class="form-check-label">Pick the <a href="https://en.wikipedia.org/wiki/User_agent">user-agent</a> of your choice:</label>
|
||||||
</div>
|
</div>
|
||||||
</div>
|
</div>
|
||||||
|
|
@ -148,7 +149,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" name="browser" {% if not os==default['os'] %}disabled{%endif%}>
|
<select class="form-select" id="browser" 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>
|
||||||
|
|
@ -162,7 +163,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" name="user_agent" {% if not os==default['os'] or not browser==default['browser'] %}disabled{%endif%}>
|
<select class="form-select" id="user_agent" 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>
|
||||||
|
|
@ -179,7 +180,7 @@
|
||||||
<!-- Mobiles -->
|
<!-- Mobiles -->
|
||||||
<div id="mobiles-list" style="display:none">
|
<div id="mobiles-list" style="display:none">
|
||||||
<div class="row mb-3">
|
<div class="row mb-3">
|
||||||
<label for="os" class="col-sm-2 col-form-label">Device name:</label>
|
<label for="device-name-mobile" class="col-sm-2 col-form-label">Device name:</label>
|
||||||
<div class="col-sm-10">
|
<div class="col-sm-10">
|
||||||
<select class="form-select" name="device_name" id="device-name-mobile" disabled>
|
<select class="form-select" name="device_name" id="device-name-mobile" disabled>
|
||||||
{% for device_name in devices['mobile']['default'].keys() %}
|
{% for device_name in devices['mobile']['default'].keys() %}
|
||||||
|
|
@ -195,7 +196,7 @@
|
||||||
<div class="row mb-3">
|
<div class="row mb-3">
|
||||||
<div class="col-sm-10">
|
<div class="col-sm-10">
|
||||||
<div class="form-check">
|
<div class="form-check">
|
||||||
<input class="form-check-input" type="radio" id="freetext_ua_select" name="user_agent_select"></input>
|
<input class="form-check-input" type="radio" id="freetext_ua_select" name="user_agent_select">
|
||||||
<label for="freetext_ua_select" class="form-check-label">Type the <a href="https://en.wikipedia.org/wiki/User_agent">user-agent</a> of your choice:</label>
|
<label for="freetext_ua_select" class="form-check-label">Type the <a href="https://en.wikipedia.org/wiki/User_agent">user-agent</a> of your choice:</label>
|
||||||
</div>
|
</div>
|
||||||
</div>
|
</div>
|
||||||
|
|
@ -227,7 +228,7 @@
|
||||||
<label for="allow_tracking" class="col-sm-2 col-form-check-label">Allow tracking:</label>
|
<label for="allow_tracking" class="col-sm-2 col-form-check-label">Allow tracking:</label>
|
||||||
<div class="col-sm-10">
|
<div class="col-sm-10">
|
||||||
<div class="form-check">
|
<div class="form-check">
|
||||||
<input class="form-check-input" type="checkbox" name="allow_tracking" aria-describedby="allow_tracking_help"></input>
|
<input class="form-check-input" type="checkbox" id="allow_tracking" name="allow_tracking" aria-describedby="allow_tracking_help">
|
||||||
<div id="allow_tracking_help" class="form-text">We'll attempt to click on the button allowing the website captured to violate your privacy.</div>
|
<div id="allow_tracking_help" class="form-text">We'll attempt to click on the button allowing the website captured to violate your privacy.</div>
|
||||||
</div>
|
</div>
|
||||||
</div>
|
</div>
|
||||||
|
|
@ -246,7 +247,7 @@
|
||||||
<label for="dnt" class="col-sm-2 col-form-label"><a href="https://developer.mozilla.org/en-US/docs/Web/HTTP/Headers/DNT">Do not Track</a>:</label>
|
<label for="dnt" class="col-sm-2 col-form-label"><a href="https://developer.mozilla.org/en-US/docs/Web/HTTP/Headers/DNT">Do not Track</a>:</label>
|
||||||
<div class="col-sm-10">
|
<div class="col-sm-10">
|
||||||
<select class="form-select" name="dnt" id="dnt" aria-label="Select a value for the Do Not Track HTTP Header">
|
<select class="form-select" name="dnt" id="dnt" aria-label="Select a value for the Do Not Track HTTP Header">
|
||||||
<option value="" selected>Select a value for the DNT header (header not set otherwise)</button>
|
<option value="" selected>Select a value for the DNT header (header not set otherwise)</option>
|
||||||
<option value="0">0 (The user prefers to allow tracking on the target site.)</option>
|
<option value="0">0 (The user prefers to allow tracking on the target site.)</option>
|
||||||
<option value="1">1 (The user prefers not to be tracked on the target site.)</option>
|
<option value="1">1 (The user prefers not to be tracked on the target site.)</option>
|
||||||
<option value="null">null (The user has not specified a preference about tracking.)</option>
|
<option value="null">null (The user has not specified a preference about tracking.)</option>
|
||||||
|
|
@ -360,45 +361,51 @@
|
||||||
<!-- admin only checkbox for autoreport -->
|
<!-- admin only checkbox for autoreport -->
|
||||||
<div>
|
<div>
|
||||||
<div class="form-check">
|
<div class="form-check">
|
||||||
<input class="form-check-input" type="checkbox" id="auto-report" name="auto-report" checked="false">
|
<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>
|
<div id="collapseMailConfiguration" class="collapse d-xl-block">
|
||||||
<div id="collapseMailConfiguration" class="collapse d-xl-block">
|
<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 for="email" >Email of the sender (optional): </label>
|
<div class="col-sm-7">
|
||||||
<div>
|
<input class="form-control" type="text" id="email"
|
||||||
<input type="text" id="email" name="email">
|
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 for="comment">Comment (optional): </label>
|
Email of the recipient (optional): </label>
|
||||||
<div>
|
<div class="col-sm-7">
|
||||||
<input type="text" id="comment" name="comment">
|
<input class="form-control" type="text" id="recipient-mail"
|
||||||
|
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 for="recipient-mail">Email of the recipient (optional): </label>
|
<div class="col-sm-7">
|
||||||
<div>
|
<textarea class="form-control" type="text" id="comment" name="comment" rows="3"></textarea>
|
||||||
<input type="text" id="recipient-mail" name="recipient-mail">
|
</div>
|
||||||
</div>
|
</div>
|
||||||
|
|
||||||
</div>
|
</div>
|
||||||
</div>
|
</div>
|
||||||
</div>
|
</div>
|
||||||
|
<hr>
|
||||||
{% 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.
|
||||||
{% else %}
|
{% else %}
|
||||||
By default, the capture is private (not visible on the index page). If you want it to be public tick the box at the top of the form.
|
By default, the capture is private (not visible on the index page). If you want it to be public tick the box at the top of the form.
|
||||||
{% endif %}
|
{% endif %}
|
||||||
</b>
|
</b>
|
||||||
</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 %}
|
||||||
|
|
|
||||||
Loading…
Reference in New Issue