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