Skip to content

Commit

Permalink
new: Expose viewport, improve capture settings
Browse files Browse the repository at this point in the history
  • Loading branch information
@Rafiot
Rafiot committed Feb 17, 2025
1 parent b6ea3f4 commit ce9171a
Show file tree
Hide file tree
Showing 2 changed files with 69 additions and 12 deletions.
16 changes: 13 additions & 3 deletions website/web/__init__.py
View file
Original file line number Diff line number Diff line change
Expand Up @@ -17,14 +17,15 @@
import filetype # type: ignore[import-untyped]

from collections import defaultdict
from datetime import date, datetime, timedelta
from datetime import date, datetime, timedelta, UTC
from importlib.metadata import version
from io import BytesIO, StringIO
from typing import Any, TypedDict
from collections.abc import Iterable
from urllib.parse import unquote_plus, urlparse
from uuid import uuid4
from zipfile import ZipFile
from zoneinfo import ZoneInfo

from har2tree import HostNode, URLNode
import flask_login # type: ignore[import-untyped]
Expand Down Expand Up @@ -60,7 +61,6 @@
from .proxied import ReverseProxied

logging.config.dictConfig(get_config('logging'))
all_timezones_set = available_timezones()

app: Flask = Flask(__name__)
app.wsgi_app = ReverseProxied(app.wsgi_app) # type: ignore[method-assign]
Expand Down Expand Up @@ -281,7 +281,13 @@ def get_icon(icon_id: str) -> Icon | None:
return available_icons.get(icon_id)


def get_tz_info() -> tuple[str | None, str, set[str]]:
all_timezones_set: dict[str, str] = {}
for tzname in sorted(available_timezones()):
if offset := ZoneInfo(tzname).utcoffset(datetime.now(UTC)):
all_timezones_set[tzname] = f"{offset.total_seconds() / (60 * 60):+06.2f}"


def get_tz_info() -> tuple[str | None, str, dict[str, str]]:
now = datetime.now().astimezone()
local_TZ = now.tzname()
local_UTC_offset = f'UTC{now.strftime("%z")}'
Expand Down Expand Up @@ -1735,6 +1741,10 @@ def capture_web() -> str | Response | WerkzeugResponse:
capture_query['allow_tracking'] = True if request.form.get('allow_tracking') else False
capture_query['java_script_enabled'] = True if request.form.get('java_script_enabled') else False

if request.form.get('width') or request.form.get('height'):
capture_query['viewport'] = {'width': int(request.form.get('width', 1280)),
'height': int(request.form.get('height', 720))}

if lookyloo.headed_allowed:
capture_query['headless'] = True if request.form.get('headless') else False

Expand Down
65 changes: 56 additions & 9 deletions website/web/templates/capture.html
View file
Original file line number Diff line number Diff line change
Expand Up @@ -322,6 +322,31 @@
</div>
</div>

<div class="row mb-3">
<label class="col-sm-2 col-form-label">Viewport:</label>
<div class="col-sm-10">
<div class="row align-items-center">
<div class="col">
<label class="visually-hidden" for="width">Width</label>
<div class="input-group">
<div class="input-group-text">Width</div>
<input class="form-control" type="number" id="width" name="width" aria-describedby="width" placeholder="1280">
</div>
</div>
<div class="col">
<label class="visually-hidden" for="height">Height</label>
<div class="input-group">
<div class="input-group-text">Height</div>
<input class="form-control" type="number" id="height" name="height" aria-describedby="height" placeholder="720">
</div>
</div>
</div>
<div class="alert alert-info" role="alert">
The size of the browser window (default is 1280x720), if possible, the screenshot will take the full page and not just the viewport.
</div>
</div>
</div>

<!-- Referer -->
<div class="row mb-3">
<label for="referer" class="col-sm-2 col-form-label"><a href="https://developer.mozilla.org/en-US/docs/Web/HTTP/Headers/Referer">Referer</a>:</label>
Expand Down Expand Up @@ -359,14 +384,17 @@

<div class="row mb-3">
{% set local_TZ, local_UTC_offset, all_timezones = tz_info() %}
<label for="timezone_id" class="col-sm-2 col-form-label"><a href="https://playwright.dev/python/docs/emulation#locale--timezone">Timezone</a> (defaults to {{local_TZ}} - {{local_UTC_offset}}):</label>
<label for="timezone_id" class="col-sm-2 col-form-label"><a href="https://playwright.dev/python/docs/emulation#locale--timezone">Timezone</a>:</label>
<div class="col-sm-10">
<input class="form-control" list="tzOptions" name="timezone_id" id="timezone_id" aria-label="Pick the timezone for the capture" placeholder="Europe/Vatican">
<datalist id="tzOptions">
{% for tz in all_timezones %}
<option value="{{tz}}">{{tz}}</option>
{% for tz, offset in all_timezones.items() %}
<option value="{{tz}}">{{tz}} (UTC{{offset}})</option>
{%endfor%}
</datalist>
<div class="alert alert-info" role="alert">
Defaults to localtime: {{local_TZ}} - {{local_UTC_offset}}.
</div>
</div>
</div>

Expand All @@ -385,14 +413,25 @@
<div class="row mb-3">
<label for="geoloc" class="col-sm-2 col-form-label"><a href="https://playwright.dev/python/docs/emulation#geolocation">Geolocation</a>:</label>
<div class="col-sm-10" id="geoloc">
<div class="row g-3">
<div class="row align-items-center">
<div class="col">
<input type="number" step="any" class="form-control" name="geo_latitude" id="geo_latitude" placeholder="Latitude">
<label class="visually-hidden" for="geo_latitude">Latitude</label>
<div class="input-group">
<div class="input-group-text">Latitude</div>
<input class="form-control" step="any" type="number" id="geo_latitude" name="geo_latitude" aria-describedby="geo_latitude" placeholder="55.750996996">
</div>
</div>
<div class="col">
<input type="number" step="any" class="form-control" name="geo_longitude" id="geo_longitude" placeholder="Longitude">
<label class="visually-hidden" for="geo_longitude">Longitude</label>
<div class="input-group">
<div class="input-group-text">Longitude</div>
<input class="form-control" step="any" type="number" id="geo_longitude" name="geo_longitude" aria-describedby="geo_longitude" placeholder="37.617330864">
</div>
</div>
</div>
<div class="alert alert-info" role="alert">
The values are passed to captured website if it requests them via the Geolocation API.
</div>
</div>
</div>

Expand All @@ -408,12 +447,20 @@
<div class="row mb-3">
<label for="httpauth" class="col-sm-2 col-form-label">HTTP Basic Authentication</label>
<div class="col-sm-10" id="httpauth">
<div class="row g-3">
<div class="row align-items-center">
<div class="col">
<input type="text" class="form-control" name="http_auth_username" id="http_auth_username" placeholder="Username">
<label class="visually-hidden" for="http_auth_username">Username</label>
<div class="input-group">
<div class="input-group-text">Username</div>
<input class="form-control" type="text" id="http_auth_username" name="http_auth_username" aria-describedby="http_auth_username" placeholder="Jacques Chirac">
</div>
</div>
<div class="col">
<input type="text" class="form-control" name="http_auth_password" id="http_auth_password" placeholder="Password">
<label class="visually-hidden" for="http_auth_password">Password</label>
<div class="input-group">
<div class="input-group-text">Password</div>
<input class="form-control" type="password" id="http_auth_password" name="http_auth_password" aria-describedby="http_auth_password" placeholder="Yackety Yak">
</div>
</div>
</div>
<div class="alert alert-danger" role="alert">
Expand Down

0 comments on commit ce9171a

Please sign in to comment.