HTML document, ASCII text
1
{% extends "default.html" %}
2
{% block title %}Gallery {{ gallery.title }} | gigadata{% endblock %}
4
{% block content %}
6
<x-frame style="--width: 768px" class="vbox">
7
<h1>{{ gallery.title }}</h1>
8
<p>{{ gallery.description }}</p>
9
<p>
10
<a href="/gallery/{{ gallery.id }}/users">Users</a>
11
</p>
12
{% if have_permission %}
13
<form class="buttonbox" method="POST" action="/gallery/{{ gallery.id }}/add-picture">
14
<input name="picture_id" type="text" placeholder="Picture ID" required aria-label="Picture ID">
15
<button type="submit">Add picture</button>
16
</form>
17
<details>
18
<summary>Add from query</summary>
19
<form method="POST" action="/gallery/{{ gallery.id }}/add-pictures-from-query">
20
<label>
21
<span class="required-asterisk">Query YAML</span>
22
<textarea name="query" required rows="8"></textarea>
23
</label>
24
<button type="submit">Add pictures</button>
25
</form>
26
</details>
27
{% endif %}
28
<h2>Pictures</h2>
29
<ul class="thumbnail-list">
30
{% for picture in gallery.pictures %}
31
<li>
32
<a href="/picture/{{ picture.resource.id }}">
33
<div class="annotation-zone">
34
<img src="/raw/picture/{{ picture.resource.id }}" alt="{{ picture.resource.title }}">
35
{% for region in picture.resource.regions %}
36
{% if region.json.type == "bbox" %}
37
<svg class="shape-container" viewBox="0 0 {{ picture.resource.width }} {{ picture.resource.height }}">
38
<rect x="{{ region.json.shape.x * picture.resource.width }}"
39
y="{{ region.json.shape.y * picture.resource.height }}"
40
width="{{ region.json.shape.w * picture.resource.width }}"
41
height="{{ region.json.shape.h * picture.resource.height }}"
42
fill="none" class="shape-bbox shape"
43
></rect>
44
</svg>
45
{% elif region.json.type == "polygon" %}
46
<svg class="shape-container" viewBox="0 0 {{ picture.resource.width }} {{ picture.resource.height }}">
47
<polygon points="{% for point in region.json.shape %}{{ point.x * picture.resource.width }},{{ point.y * picture.resource.height }} {% endfor %}" fill="none" class="shape-polygon shape"></polygon>
48
</svg>
49
{% elif region.json.type == "polyline" %}
50
<svg class="shape-container" viewBox="0 0 {{ picture.resource.width }} {{ picture.resource.height }}">
51
<polyline points="{% for point in region.json.shape %}{{ point.x * picture.resource.width }},{{ point.y * picture.resource.height }} {% endfor %}" fill="none" class="shape-polyline shape"></polyline>
52
</svg>
53
{% elif region.json.type == "point" %}
54
<svg class="shape-container" viewBox="0 0 {{ picture.resource.width }} {{ picture.resource.height }}">
55
<circle cx="{{ region.json.shape.x * picture.resource.width }}" cy="{{ region.json.shape.y * picture.resource.height }}" r="0" fill="none" class="shape-point shape"></circle>
56
</svg>
57
{% endif %}
58
{% endfor %}
59
</div>
60
<div class="list-detail">
61
{{ picture.resource.title }}
62
</div>
63
</a>
64
<div class="list-more">
65
<form action="/gallery/{{ gallery.id }}/remove-picture" method="POST">
66
<input type="hidden" name="picture_id" value="{{ picture.resource.id }}">
67
<button type="submit" class="button-flat">Remove</button>
68
</form>
69
</div>
70
</li>
71
{% endfor %}
72
</ul>
73
</x-frame>
74
{% endblock %}