HTML document, ASCII text
1
{% extends "default.html" %}
2
{% block nav_title %}{{ gallery.title }}{% endblock %}
4
{% block title %}Gallery {{ gallery.title }} | {{ site_name }}{% endblock %}
5
{% block content %}
7
<div id="picture-view">
9
<x-frame id="picture-actions">
10
<ul class="action-list">
11
<li><a href="/gallery/{{ gallery.id }}/users">
12
<iconify-icon icon="mdi:user"></iconify-icon>Users
13
</a></li>
14
{% if have_extended_permission %}
15
<li><a href="/gallery/{{ gallery.id }}/edit">
16
<iconify-icon icon="mdi:edit"></iconify-icon>Edit
17
</a></li>
18
{% endif %}
19
{% if have_extended_permission %}
20
<li><details>
21
<summary>
22
<iconify-icon icon="mdi:delete"></iconify-icon>Delete
23
</summary>
24
<a href="/gallery/{{ gallery.id }}/delete">Confirm deletion</a>
25
</details></li>
26
{% endif %}
27
</ul>
28
</x-frame>
29
<x-frame style="--width: 768px" class="vbox">
30
<h1>{{ gallery.title }}</h1>
31
<p>owned by <a href="/profile/{{ gallery.owner.username }}">{{ gallery.owner.formatted_name }}</a></p>
32
<p>{{ gallery.description }}</p>
33
{% if have_permission %}
34
<form class="buttonbox" method="POST" action="/gallery/{{ gallery.id }}/add-picture">
35
<input name="picture_id" type="text" placeholder="Picture ID" required aria-label="Picture ID">
36
<button type="submit">Add picture</button>
37
</form>
38
<details>
39
<summary>Add from query</summary>
40
<form method="POST" action="/gallery/{{ gallery.id }}/add-pictures-from-query">
41
<label>
42
<span class="required-asterisk">Query YAML</span>
43
<textarea name="query" required rows="8"></textarea>
44
</label>
45
<button type="submit">Add pictures</button>
46
</form>
47
</details>
48
{% endif %}
49
<h2>Pictures</h2>
50
<ul class="thumbnail-list">
51
{% for picture in gallery.pictures %}
52
<li>
53
<a href="/picture/{{ picture.resource.id }}">
54
<div class="annotation-zone">
55
<img src="/raw/picture/{{ picture.resource.id }}" alt="{{ picture.resource.title }}">
56
{% for region in picture.resource.regions %}
57
{% if region.json.type == "bbox" %}
58
<svg class="shape-container" viewBox="0 0 {{ picture.resource.width }} {{ picture.resource.height }}">
59
<rect x="{{ region.json.shape.x * picture.resource.width }}"
60
y="{{ region.json.shape.y * picture.resource.height }}"
61
width="{{ region.json.shape.w * picture.resource.width }}"
62
height="{{ region.json.shape.h * picture.resource.height }}"
63
fill="none" class="shape-bbox shape"
64
></rect>
65
</svg>
66
{% elif region.json.type == "polygon" %}
67
<svg class="shape-container" viewBox="0 0 {{ picture.resource.width }} {{ picture.resource.height }}">
68
<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>
69
</svg>
70
{% elif region.json.type == "polyline" %}
71
<svg class="shape-container" viewBox="0 0 {{ picture.resource.width }} {{ picture.resource.height }}">
72
<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>
73
</svg>
74
{% elif region.json.type == "point" %}
75
<svg class="shape-container" viewBox="0 0 {{ picture.resource.width }} {{ picture.resource.height }}">
76
<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>
77
</svg>
78
{% endif %}
79
{% endfor %}
80
</div>
81
<div class="list-detail">
82
{{ picture.resource.title }}
83
</div>
84
</a>
85
<div class="list-more">
86
<form action="/gallery/{{ gallery.id }}/remove-picture" method="POST">
87
<input type="hidden" name="picture_id" value="{{ picture.resource.id }}">
88
{% if have_permission %}
89
<button type="submit" class="button-flat"><iconify-icon icon="mdi:close">Remove</iconify-icon></button>
90
{% endif %}
91
</form>
92
</div>
93
</li>
94
{% endfor %}
95
</ul>
96
</x-frame>
97
</div>
98
{% endblock %}