HTML document, ASCII text
1
{% extends "default.html" %}
2
{% block title %}Object {{ object.id }} | gigadata{% endblock %}
3
{% block content %}
5
<x-frame style="--width: 768px">
6
<h1>{{ object.id }}</h1>
7
<p>{{ object.description }}</p>
8
<h2>Pictures with this object</h2>
9
<ul class="thumbnail-list">
10
{% for resource in resources %}
11
<li>
12
<a href="/picture/{{ resource.id }}">
13
<div class="annotation-zone">
14
<img src="/raw/picture/{{ resource.id }}" alt="{{ resource.title }}">
15
{% for i in PictureRegion.query.filter_by(resource=resource, object=object) %}
16
{% if i.json.type == "bbox" %}
17
<svg class="shape-container" viewBox="0 0 {{ resource.width }} {{ resource.height }}">
18
<rect x="{{ i.json.shape.x * resource.width }}"
19
y="{{ i.json.shape.y * resource.height }}"
20
width="{{ i.json.shape.w * resource.width }}"
21
height="{{ i.json.shape.h * resource.height }}"
22
fill="none" class="shape-bbox shape"
23
></rect>
24
</svg>
25
{% elif i.json.type == "polygon" %}
26
<svg class="shape-container" viewBox="0 0 {{ resource.width }} {{ resource.height }}">
27
<polygon points="{% for point in i.json.shape %}{{ point.x * resource.width }},{{ point.y * resource.height }} {% endfor %}" fill="none" class="shape-polygon shape"></polygon>
28
</svg>
29
{% elif i.json.type == "polyline" %}
30
<svg class="shape-container" viewBox="0 0 {{ resource.width }} {{ resource.height }}">
31
<polyline points="{% for point in i.json.shape %}{{ point.x * resource.width }},{{ point.y * resource.height }} {% endfor %}" fill="none" class="shape-polyline shape"></polyline>
32
</svg>
33
{% elif i.json.type == "point" %}
34
<svg class="shape-container" viewBox="0 0 {{ resource.width }} {{ resource.height }}">
35
<circle cx="{{ i.json.shape.x * resource.width }}" cy="{{ i.json.shape.y * resource.height }}" r="0" fill="none" class="shape-point shape"></circle>
36
</svg>
37
{% endif %}
38
{% endfor %}
39
</div>
40
<div class="list-detail">
41
{{ resource.title }}
42
</div>
43
</a>
44
</li>
45
{% endfor %}
46
</ul>
47
{% include "pagination.html" %}
48
</x-frame>
49
{% endblock %}