roundabout,
created on Friday, 6 September 2024, 17:25:01 (1725643501),
received on Friday, 6 September 2024, 19:35:57 (1725651357)
Author identity: vlad <vlad.muntoiu@gmail.com>
07c353bb6c4c4b9b889d5d11e8f296078574a225
app.py
@@ -348,7 +348,7 @@ def has_object(id):
return flask.render_template("object.html", object=object_, resources=resources, page_number=page, page_length=per_page, num_pages=resources.pages, prev_page=resources.prev_num, next_page=resources.next_num)next_page=resources.next_num, PictureRegion=PictureRegion)@app.route("/upload")
@@ -413,6 +413,7 @@ def upload_post():
file.save(path.join(config.DATA_PATH, "pictures", str(resource.id))) pil_image = Image.open(path.join(config.DATA_PATH, "pictures", str(resource.id))) resource.width, resource.height = pil_image.size db.session.commit()if flask.request.form.get("annotations"): try:
static/style.css
@@ -29,18 +29,18 @@ iconify-icon {
font-size: 2rem; } #annotation-zone {#annotation-zone, .annotation-zone {position: relative; user-select: none; } #annotation-image {#annotation-image, .annotation-image {user-drag: none; -webkit-user-drag: none; image-rendering: pixelated; } #annotation-zone > svg {#annotation-zone > svg, .annotation-zone > svg {z-index: 1; position: absolute; top: 0;
@@ -116,7 +116,7 @@ iconify-icon {
min-height: 2lh; } .shape-container-viewonly > .shape {.shape-container-viewonly > .shape, .thumbnail-list > li .shape {fill: var(--color-info); stroke: var(--color-info); fill-opacity: 0;
@@ -125,11 +125,11 @@ iconify-icon {
stroke-opacity 0.25s cubic-bezier(0.61, 1, 0.88, 1); } .shape-container-viewonly > .shape-polyline {.shape-container-viewonly > .shape-polyline, .thumbnail-list > li .shape-polyline {fill: none; } .shape-container-viewonly > .shape-point {.shape-container-viewonly > .shape-point, .thumbnail-list > li .shape-point {stroke: var(--color-info); transition: r 0.25s cubic-bezier(0.34, 1.56, 0.64, 1), stroke-width 0.25s cubic-bezier(0.34, 1.56, 0.64, 1),
@@ -177,6 +177,11 @@ iconify-icon {
stroke-opacity: 1; } .thumbnail-list > li:hover .shape { fill-opacity: 0.2; stroke-opacity: 1; } /* Disabled for now, until there is more navigation that would benefit from transitions */ /* @view-transition {
templates/object.html
@@ -10,7 +10,33 @@
{% for resource in resources %} <li> <a href="/picture/{{ resource.id }}"> <img src="/raw/picture/{{ resource.id }}" alt="{{ resource.title }}"><div class="annotation-zone"> <img src="/raw/picture/{{ resource.id }}" alt="{{ resource.title }}"> {% for i in PictureRegion.query.filter_by(resource=resource, object=object) %} {% if i.json.type == "bbox" %} <svg class="shape-container" viewBox="0 0 {{ resource.width }} {{ resource.height }}"> <rect x="{{ i.json.shape.x * resource.width }}" y="{{ i.json.shape.y * resource.height }}" width="{{ i.json.shape.w * resource.width }}" height="{{ i.json.shape.h * resource.height }}" fill="none" class="shape-bbox shape" ></rect> </svg> {% elif i.json.type == "polygon" %} <svg class="shape-container" viewBox="0 0 {{ resource.width }} {{ resource.height }}"> <polygon points="{% for point in i.json.shape %}{{ point.x * resource.width }},{{ point.y * resource.height }} {% endfor %}" fill="none" class="shape-polygon shape"></polygon> </svg> {% elif i.json.type == "polyline" %} <svg class="shape-container" viewBox="0 0 {{ resource.width }} {{ resource.height }}"> <polyline points="{% for point in i.json.shape %}{{ point.x * resource.width }},{{ point.y * resource.height }} {% endfor %}" fill="none" class="shape-polyline shape"></polyline> </svg> {% elif i.json.type == "point" %} <svg class="shape-container" viewBox="0 0 {{ resource.width }} {{ resource.height }}"> <circle cx="{{ i.json.shape.x * resource.width }}" cy="{{ i.json.shape.y * resource.height }}" r="0" fill="none" class="shape-point shape"></circle> </svg> {% endif %} {% endfor %} </div><div class="list-detail"> {{ resource.title }} </div>