103 lines
3.9 KiB
HTML
103 lines
3.9 KiB
HTML
{% extends 'scanner/base.html' %}
|
|
{% load i18n home_tags %}
|
|
|
|
{% block styles %}
|
|
{{ block.super }}
|
|
<link href="/static/scanner/css/main.css" rel="stylesheet">
|
|
{% endblock %}
|
|
{% block columns %}{% endblock %}
|
|
|
|
{% block content %}
|
|
<div class="w3-row w3-row-padding w3-black">
|
|
<div class="w3-col w3-center" style="width: 30%">
|
|
<div class="w3-col">
|
|
<div>{% trans "Choix de la session" %}</div>
|
|
<select id="_session" class="w3-select">
|
|
{% for s in sessions %}
|
|
<option value="{{ s.id }}">{{ s.name }}</option>
|
|
{% endfor %}
|
|
</select>
|
|
</div>
|
|
<div class="w3-col">
|
|
<div class="w3-row w3-bold">
|
|
<div class="w3-half">X<br><span id="_x"></span></div>
|
|
<div class="w3-half">Y<br><span id="_y"></span></div>
|
|
<div class="w3-col w3-padding"><span id="_uuid"></span></div>
|
|
</div>
|
|
</div>
|
|
|
|
<div class="w3-col">
|
|
<button id="_median" class="w3-button w3-dark-xlight w3-round-large w3-padding-small w3-block">
|
|
{% trans 'Axes' %} <br><i class="fa-solid fa-crosshairs w3-text-amber w3-xlarge"></i>
|
|
</button>
|
|
</div>
|
|
<div class="w3-col">
|
|
<button id="_crop" class="w3-button w3-dark-xlight w3-round-large w3-padding-top w3-margin-top w3-block">
|
|
{% trans 'Recadrer' %}<br><i class="fa-solid fa-crop w3-text-amber w3-xlarge"></i>
|
|
</button>
|
|
</div>
|
|
<div class="w3-col">
|
|
<button id="_scan" class="w3-button w3-dark-xlight w3-round-large w3-margin-top w3-block">
|
|
{% trans 'Lancer le balayage' %}<br><i class="fa-solid fa-circle-check w3-text-orange w3-xlarge"></i>
|
|
</button>
|
|
</div>
|
|
<div class="w3-col">
|
|
<button id="_halt" class="w3-button w3-red w3-round-large w3-margin-top w3-block">
|
|
{% trans 'ARRET' %}<br><i class="fa-solid fa-hand w3-xlarge"></i>
|
|
</button>
|
|
</div>
|
|
<div class="w3-col">
|
|
<div class="w3-margin-top w3-padding w3-small">
|
|
<span id="_ts"></span>
|
|
</div>
|
|
<div class="w3-margin-top w3-padding w3-small">
|
|
<span id="_scan_state" class="w3-text-amber w3-border"></span>
|
|
</div>
|
|
</div>
|
|
</div>
|
|
<div class="w3-col" style="width: 70%">
|
|
{% include 'scanner/scan-image.html' %}
|
|
</div>
|
|
</div>
|
|
<ul id="_debug" class="w3-scroll-y" style="height: 50vh"></ul>
|
|
{% endblock %}
|
|
|
|
{% block js_footer %}
|
|
{{ block.super }}
|
|
<script>
|
|
const container = sId("scan-img");
|
|
const ws_route = "{{ ws_route }}";
|
|
const use_tracking = "{{ use_tracking }}" == "True";
|
|
const options = {
|
|
ts: sId("_ts"),
|
|
cx: sId("_cx"),
|
|
cy: sId("_cy"),
|
|
x : sId("_x"),
|
|
y : sId("_y"),
|
|
session: sId("_session"),
|
|
scan : sId("_scan"),
|
|
halt : sId("_halt"),
|
|
debug : sId("_debug"),
|
|
median : sId("_median"),
|
|
crop : sId("_crop"),
|
|
speed_px_s : sId("_speed_px_s"),
|
|
axial_speed : sId("_axial_speed"),
|
|
axial_pos : sId("_axial_pos"),
|
|
area_px : sId("_area_px"),
|
|
frame_count : sId("_count"),
|
|
scan_state: sId("_scan_state")
|
|
};
|
|
</script>
|
|
<script src="/static/scanner/js/main.js"></script>
|
|
<script>
|
|
const manager = new ScannerManager(container, options);
|
|
const protocol = location.protocol === "https:" ? "wss" : "ws";
|
|
const wsUrl = `${protocol}://${location.host}/${ws_route}`;
|
|
const socket = new MetadataSocket(wsUrl);
|
|
socket.setManager(manager);
|
|
socket.connect();
|
|
manager.registerSocket(socket);
|
|
</script>
|
|
{% endblock %}
|
|
|