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
<form class="buttonbox" method="POST" action="/gallery/{{ gallery.id }}/add-picture">
10
<input name="picture_id" type="text" placeholder="Picture ID" required aria-label="Picture ID">
11
<button type="submit">Add picture</button>
12
</form>
13
<h2>Pictures</h2>
14
<ul class="thumbnail-list">
15
{% for picture in gallery.pictures %}
16
<li>
17
<a href="/picture/{{ picture.resource.id }}">
18
<div class="annotation-zone">
19
<img src="/raw/picture/{{ picture.resource.id }}" alt="{{ picture.resource.title }}">
20
{% for region in picture.resource.regions %}
21
{% if region.json.type == "bbox" %}
22
<svg class="shape-container" viewBox="0 0 {{ picture.resource.width }} {{ picture.resource.height }}">
23
<rect x="{{ region.json.shape.x * picture.resource.width }}"
24
y="{{ region.json.shape.y * picture.resource.height }}"
25
width="{{ region.json.shape.w * picture.resource.width }}"
26
height="{{ region.json.shape.h * picture.resource.height }}"
27
fill="none" class="shape-bbox shape"
28
></rect>
29
</svg>
30
{% elif region.json.type == "polygon" %}
31
<svg class="shape-container" viewBox="0 0 {{ picture.resource.width }} {{ picture.resource.height }}">
32
<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>
33
</svg>
34
{% elif region.json.type == "polyline" %}
35
<svg class="shape-container" viewBox="0 0 {{ picture.resource.width }} {{ picture.resource.height }}">
36
<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>
37
</svg>
38
{% elif region.json.type == "point" %}
39
<svg class="shape-container" viewBox="0 0 {{ picture.resource.width }} {{ picture.resource.height }}">
40
<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>
41
</svg>
42
{% endif %}
43
{% endfor %}
44
</div>
45
<div class="list-detail">
46
{{ picture.resource.title }}
47
</div>
48
</a>
49
</li>
50
{% endfor %}
51
</ul>
52
</x-frame>
53
{% endblock %}