HTML document, ASCII text
1
{% extends "default.html" %}
2
{% block title %}Picture query results | {{ site_name }}{% endblock %}
4
{% block content %}
6
<x-frame style="--width: 768px" class="vbox">
7
<h1>Picture query results</h1>
8
<details>
9
<summary>Query YAML</summary>
10
<pre>{{ query }}</pre>
11
</details>
12
<p>
13
Found {{ resources.total }} pictures.
14
</p>
15
<ul class="thumbnail-list">
16
{% for resource in resources %}
17
<li>
18
<a href="/picture/{{ resource.id }}">
19
<div class="annotation-zone">
20
<img src="/raw/picture/{{ resource.id }}" alt="{{ resource.title }}">
21
{% for region in resource.regions %}
22
{% if region.json.type == "bbox" %}
23
<svg class="shape-container" viewBox="0 0 {{ resource.width }} {{ resource.height }}">
24
<rect x="{{ region.json.shape.x * resource.width }}"
25
y="{{ region.json.shape.y * resource.height }}"
26
width="{{ region.json.shape.w * resource.width }}"
27
height="{{ region.json.shape.h * resource.height }}"
28
fill="none" class="shape-bbox shape"
29
></rect>
30
</svg>
31
{% elif region.json.type == "polygon" %}
32
<svg class="shape-container" viewBox="0 0 {{ resource.width }} {{ resource.height }}">
33
<polygon points="{% for point in region.json.shape %}{{ point.x * resource.width }},{{ point.y * resource.height }} {% endfor %}" fill="none" class="shape-polygon shape"></polygon>
34
</svg>
35
{% elif region.json.type == "polyline" %}
36
<svg class="shape-container" viewBox="0 0 {{ resource.width }} {{ resource.height }}">
37
<polyline points="{% for point in region.json.shape %}{{ point.x * resource.width }},{{ point.y * resource.height }} {% endfor %}" fill="none" class="shape-polyline shape"></polyline>
38
</svg>
39
{% elif region.json.type == "point" %}
40
<svg class="shape-container" viewBox="0 0 {{ resource.width }} {{ resource.height }}">
41
<circle cx="{{ region.json.shape.x * resource.width }}" cy="{{ region.json.shape.y * resource.height }}" r="0" fill="none" class="shape-point shape"></circle>
42
</svg>
43
{% endif %}
44
{% endfor %}
45
</div>
46
<div class="list-detail">
47
{{ resource.title }}
48
</div>
49
</a>
50
</li>
51
{% endfor %}
52
</ul>
53
{% include "pagination.html" %}
54
</x-frame>
55
{% endblock %}
56