From fe0c38c34bd402ceb98c6920a2c3e3363c2f90b5 Mon Sep 17 00:00:00 2001 From: Boris Sekachev Date: Mon, 29 Aug 2022 19:42:47 +0300 Subject: [PATCH] Added dumping a skeleton on a created resource, fixed some styles (#4829) * Added dumping a skeleton on a created resource, fixed some styles * Updated version & changelog * Fixed remarklint issue * Updated version --- CHANGELOG.md | 4 +- cvat-ui/package.json | 2 +- .../cloud-storages-page/styles.scss | 1 + cvat-ui/src/components/jobs-page/styles.scss | 4 ++ .../labels-editor/skeleton-configurator.tsx | 40 +++++++++++++------ .../src/components/labels-editor/styles.scss | 3 +- .../src/components/projects-page/styles.scss | 4 ++ 7 files changed, 42 insertions(+), 16 deletions(-) diff --git a/CHANGELOG.md b/CHANGELOG.md index a536532ca981..57fdba7890e8 100644 --- a/CHANGELOG.md +++ b/CHANGELOG.md @@ -22,10 +22,12 @@ and this project adheres to [Semantic Versioning](https://semver.org/spec/v2.0.0 - Documentation for LDAP authentication () - OpenCV.js caching and autoload () - Publishing dev version of CVAT docker images () -- Support of Human Pose Estimation, Facial Landmarks (and similar) use-cases, new shape type: Skeleton () +- Support of Human Pose Estimation, Facial Landmarks (and similar) use-cases, new shape type: +Skeleton (), () - Added helm chart support for serverless functions and analytics () - Added confirmation when remove a track () + ### Changed - Bumped nuclio version to 1.8.14 - Simplified running REST API tests. Extended CI-nightly workflow diff --git a/cvat-ui/package.json b/cvat-ui/package.json index a2824e7a3eb1..1dfdc1afd439 100644 --- a/cvat-ui/package.json +++ b/cvat-ui/package.json @@ -1,6 +1,6 @@ { "name": "cvat-ui", - "version": "1.41.2", + "version": "1.41.3", "description": "CVAT single-page application", "main": "src/index.tsx", "scripts": { diff --git a/cvat-ui/src/components/cloud-storages-page/styles.scss b/cvat-ui/src/components/cloud-storages-page/styles.scss index 7b53842e5124..95a9c2a76356 100644 --- a/cvat-ui/src/components/cloud-storages-page/styles.scss +++ b/cvat-ui/src/components/cloud-storages-page/styles.scss @@ -19,6 +19,7 @@ .cvat-empty-cloud-storages-list-icon { font-size: $grid-unit-size * 14; opacity: 0.5; + margin-bottom: $grid-unit-size * 2; } .cvat-cloud-storages-pagination { diff --git a/cvat-ui/src/components/jobs-page/styles.scss b/cvat-ui/src/components/jobs-page/styles.scss index 9cd9ab55ce30..f88f3f6aa753 100644 --- a/cvat-ui/src/components/jobs-page/styles.scss +++ b/cvat-ui/src/components/jobs-page/styles.scss @@ -60,6 +60,10 @@ } .cvat-jobs-page-job-item-card-preview { + .ant-empty-image { + height: $grid-unit-size * 10; + } + height: 100%; display: flex; align-items: center; diff --git a/cvat-ui/src/components/labels-editor/skeleton-configurator.tsx b/cvat-ui/src/components/labels-editor/skeleton-configurator.tsx index def5dd2edc60..f0de55dec674 100644 --- a/cvat-ui/src/components/labels-editor/skeleton-configurator.tsx +++ b/cvat-ui/src/components/labels-editor/skeleton-configurator.tsx @@ -1,4 +1,4 @@ -import React from 'react'; +import React, { CSSProperties } from 'react'; import PropTypes from 'prop-types'; import { Row, Col } from 'antd/lib/grid'; import Upload from 'antd/lib/upload'; @@ -59,7 +59,7 @@ export default class SkeletonConfigurator extends React.PureComponent; + private labels: Record; public constructor(props: Props) { super(props); @@ -463,7 +463,7 @@ export default class SkeletonConfigurator extends React.PureComponent(svg.children as any as SVGElement[]).forEach((element: SVGElement): void => { if (!(element instanceof SVGElement)) return; - const elementID = element.getAttribute('data-element-id'); + const elementID = +(element.getAttribute('data-element-id') as string); const cx = element.getAttribute('cx'); const cy = element.getAttribute('cy'); @@ -574,7 +574,7 @@ export default class SkeletonConfigurator extends React.PureComponent { const dataType = child.getAttribute('data-type'); if (dataType && dataType.includes('element')) { - const elementID = child.getAttribute('data-element-id'); + const elementID = +(child.getAttribute('data-element-id') as string); if (elementID !== null) { elements++; const elementLabel = this.labels[elementID]; @@ -631,9 +631,10 @@ export default class SkeletonConfigurator extends React.PureComponent + - + { if (svgRef.current) { this.setupTextLabels(false); + const copy = window.document.createElementNS('http://www.w3.org/2000/svg', 'svg'); + // eslint-disable-next-line no-unsanitized/property + copy.innerHTML = svgRef.current.innerHTML; + this.setupTextLabels(); const desc = window.document.createElementNS('http://www.w3.org/2000/svg', 'desc'); desc.setAttribute('data-description-type', 'labels-specification'); (desc as SVGDescElement).textContent = JSON.stringify(this.labels); - svgRef.current.appendChild(desc); - - const text = svgRef.current.innerHTML; - desc.remove(); + copy.appendChild(desc); + Array.from(copy.children).forEach((child: Element) => { + if (child.hasAttribute('data-label-id')) { + const elementID = +(child.getAttribute('data-element-id') as string); + child.removeAttribute('data-label-id'); + child.setAttribute('data-label-name', this.labels[elementID].name); + } + }); - this.setupTextLabels(); + const text = copy.innerHTML; const blob = new Blob([text], { type: 'image/svg+xml;charset=utf-8' }); const url = URL.createObjectURL(blob); const anchor = window.document.getElementById('downloadAnchor'); @@ -767,6 +780,7 @@ export default class SkeletonConfigurator extends React.PureComponent { file.text().then((result) => { @@ -805,12 +819,12 @@ export default class SkeletonConfigurator extends React.PureComponent -