roundabout,
created on Sunday, 16 February 2025, 09:58:43 (1739699923),
received on Sunday, 16 February 2025, 09:58:45 (1739699925)
Author identity: vlad <vlad.muntoiu@gmail.com>
c883c3ae821c8a97272b31b7a9f0ffcbff66b24a
static/style.css
@@ -593,7 +593,6 @@ dd {
@media screen and (max-width: 768px) { .rating-box { flex-direction: column; margin: 1rem;} }
@@ -674,6 +673,22 @@ dd {
.action-list > li { padding: 0 !important; } #picture-view > x-frame > hgroup, #annotation-view-controls, #picture-details { margin-left: 1rem; margin-right: 1rem; } } #annotation-view-controls { display: flex; flex-flow: row wrap; gap: 1rem; margin-top: 1rem; margin-bottom: 1rem; } #picture-view > x-frame > hgroup { margin-bottom: 1rem;} .action-list {
templates/picture.html
@@ -70,9 +70,11 @@
</menu> </x-frame> <x-frame style="--width: 768px"> <h1>{{ resource.title }}</h1><p>by <a href="/profile/{{ resource.author.username }}">{{ resource.author.formatted_name }}</a></p><p>{{ resource.description }}</p><hgroup> <h1>{{ resource.title }}</h1> <p>by <a href="/profile/{{ resource.author.username }}">{{ resource.author.formatted_name }}</a></p> <p>{{ resource.description }}</p> </hgroup>{% if resource.replaced_by %} <div class="warning"> <h2>Obsolete</h2>
@@ -86,58 +88,58 @@
{% endif %} </div> {% endif %} <x-vbox><div id="annotation-zone"><img id="annotation-image" src="/raw/picture/{{ resource.id }}" alt="{{ resource.title }}">{% for region in resource.regions %}{% if region.json.type == "bbox" %}<svg class="shape-container-viewonly" viewBox="0 0 1 1" preserveAspectRatio="none"><rect x="{{ region.json.shape.x }}"y="{{ region.json.shape.y }}"width="{{ region.json.shape.w }}"height="{{ region.json.shape.h }}"fill="none" class="shape-bbox shape"></rect>{% set centre_x = region.json.shape.x + region.json.shape.w / 2 %}{% set centre_y = region.json.shape.y + region.json.shape.h / 2 %}</svg>{% elif region.json.type == "polygon" %}<svg class="shape-container-viewonly" viewBox="0 0 1 1" preserveAspectRatio="none"><polygon points="{% for point in region.json.shape %}{{ point.x }},{{ point.y }} {% endfor %}" fill="none" class="shape-polygon shape"></polygon>{% set top = region.json.shape | sort(attribute='y') | last %}{% set left = region.json.shape | sort(attribute='x') | first %}{% set bottom = region.json.shape | sort(attribute='y') | first %}{% set right = region.json.shape | sort(attribute='x') | last %}{% set centre_x = (left.x + right.x) / 2 %}{% set centre_y = (top.y + bottom.y) / 2 %}</svg>{% elif region.json.type == "polyline" %}<svg class="shape-container-viewonly" viewBox="0 0 1 1" preserveAspectRatio="none"><polyline points="{% for point in region.json.shape %}{{ point.x }},{{ point.y }} {% endfor %}" fill="none" class="shape-polyline shape"></polyline>{# Median point #}{% set centre_x = region.json.shape | map(attribute="x") | median %}{% set centre_y = region.json.shape | map(attribute="y") | median %}</svg>{% elif region.json.type == "point" %}<svg class="shape-container-viewonly" viewBox="0 0 1 1" preserveAspectRatio="none"><circle cx="{{ region.json.shape.x }}" cy="{{ region.json.shape.y }}" r="0" fill="none" class="shape-point shape"></circle>{% set centre_x = region.json.shape.x %}{% set centre_y = region.json.shape.y %}</svg>{% endif %}{{ shape_label(centre_x, centre_y, region.object_id) }}{% endfor %}</div><x-buttonbox id="annotation-view-controls"><label><input type="checkbox" id="show-shapes" checked>Show shapes</label><label><input type="checkbox" id="show-objects" checked>Show objects</label></x-buttonbox><div id="annotation-zone"> <img id="annotation-image" src="/raw/picture/{{ resource.id }}" alt="{{ resource.title }}"> {% for region in resource.regions %} {% if region.json.type == "bbox" %} <svg class="shape-container-viewonly" viewBox="0 0 1 1" preserveAspectRatio="none"> <rect x="{{ region.json.shape.x }}" y="{{ region.json.shape.y }}" width="{{ region.json.shape.w }}" height="{{ region.json.shape.h }}" fill="none" class="shape-bbox shape" ></rect> {% set centre_x = region.json.shape.x + region.json.shape.w / 2 %} {% set centre_y = region.json.shape.y + region.json.shape.h / 2 %} </svg> {% elif region.json.type == "polygon" %} <svg class="shape-container-viewonly" viewBox="0 0 1 1" preserveAspectRatio="none"> <polygon points="{% for point in region.json.shape %}{{ point.x }},{{ point.y }} {% endfor %}" fill="none" class="shape-polygon shape"></polygon> {% set top = region.json.shape | sort(attribute='y') | last %} {% set left = region.json.shape | sort(attribute='x') | first %} {% set bottom = region.json.shape | sort(attribute='y') | first %} {% set right = region.json.shape | sort(attribute='x') | last %} {% set centre_x = (left.x + right.x) / 2 %} {% set centre_y = (top.y + bottom.y) / 2 %} </svg> {% elif region.json.type == "polyline" %} <svg class="shape-container-viewonly" viewBox="0 0 1 1" preserveAspectRatio="none"> <polyline points="{% for point in region.json.shape %}{{ point.x }},{{ point.y }} {% endfor %}" fill="none" class="shape-polyline shape"></polyline> {# Median point #} {% set centre_x = region.json.shape | map(attribute="x") | median %} {% set centre_y = region.json.shape | map(attribute="y") | median %} </svg> {% elif region.json.type == "point" %} <svg class="shape-container-viewonly" viewBox="0 0 1 1" preserveAspectRatio="none"> <circle cx="{{ region.json.shape.x }}" cy="{{ region.json.shape.y }}" r="0" fill="none" class="shape-point shape"></circle> {% set centre_x = region.json.shape.x %} {% set centre_y = region.json.shape.y %} </svg> {% endif %} {{ shape_label(centre_x, centre_y, region.object_id) }} {% endfor %} </div> <x-buttonbox id="annotation-view-controls"> <label> <input type="checkbox" id="show-shapes" checked> Show shapes </label> <label> <input type="checkbox" id="show-objects" checked> Show objects </label> </x-buttonbox> <x-vbox id="picture-details">{% set licences = resource.licences | map(attribute="licence") | list %} {% set contains = resource.regions | map(attribute="object_id") | set | select | sort | list %} <h2>Ratings ({{ resource.rating_totals.values() | sum }})</h2>