gallery.html
HTML document, ASCII text
1{% extends "default.html" %} 2 3{% block title %}Gallery {{ gallery.title }} | gigadata{% endblock %} 4 5{% 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{% endif %} 18<h2>Pictures</h2> 19<ul class="thumbnail-list"> 20{% for picture in gallery.pictures %} 21<li> 22<a href="/picture/{{ picture.resource.id }}"> 23<div class="annotation-zone"> 24<img src="/raw/picture/{{ picture.resource.id }}" alt="{{ picture.resource.title }}"> 25{% for region in picture.resource.regions %} 26{% if region.json.type == "bbox" %} 27<svg class="shape-container" viewBox="0 0 {{ picture.resource.width }} {{ picture.resource.height }}"> 28<rect x="{{ region.json.shape.x * picture.resource.width }}" 29y="{{ region.json.shape.y * picture.resource.height }}" 30width="{{ region.json.shape.w * picture.resource.width }}" 31height="{{ region.json.shape.h * picture.resource.height }}" 32fill="none" class="shape-bbox shape" 33></rect> 34</svg> 35{% elif region.json.type == "polygon" %} 36<svg class="shape-container" viewBox="0 0 {{ picture.resource.width }} {{ picture.resource.height }}"> 37<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> 38</svg> 39{% elif region.json.type == "polyline" %} 40<svg class="shape-container" viewBox="0 0 {{ picture.resource.width }} {{ picture.resource.height }}"> 41<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> 42</svg> 43{% elif region.json.type == "point" %} 44<svg class="shape-container" viewBox="0 0 {{ picture.resource.width }} {{ picture.resource.height }}"> 45<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> 46</svg> 47{% endif %} 48{% endfor %} 49</div> 50<div class="list-detail"> 51{{ picture.resource.title }} 52</div> 53</a> 54<div class="list-more"> 55<form action="/gallery/{{ gallery.id }}/remove-picture" method="POST"> 56<input type="hidden" name="picture_id" value="{{ picture.resource.id }}"> 57<button type="submit" class="button-flat">Remove</button> 58</form> 59</div> 60</li> 61{% endfor %} 62</ul> 63</x-frame> 64{% endblock %}