diff --git a/cvat-canvas/src/typescript/canvasView.ts b/cvat-canvas/src/typescript/canvasView.ts
index 5d614948..75963144 100644
--- a/cvat-canvas/src/typescript/canvasView.ts
+++ b/cvat-canvas/src/typescript/canvasView.ts
@@ -1356,7 +1356,9 @@ export class CanvasViewImpl implements CanvasView, Listener {
return this.adoptedText.text((block): void => {
block.tspan(`${label.name} ${clientID}`).style('text-transform', 'uppercase');
for (const attrID of Object.keys(attributes)) {
- block.tspan(`${attrNames[attrID]}: ${attributes[attrID]}`).attr({
+ const value = attributes[attrID] === consts.UNDEFINED_ATTRIBUTE_VALUE
+ ? '' : attributes[attrID];
+ block.tspan(`${attrNames[attrID]}: ${value}`).attr({
attrID,
dy: '1em',
x: 0,
diff --git a/cvat-canvas/src/typescript/consts.ts b/cvat-canvas/src/typescript/consts.ts
index 1c36351d..23a36f11 100644
--- a/cvat-canvas/src/typescript/consts.ts
+++ b/cvat-canvas/src/typescript/consts.ts
@@ -10,6 +10,7 @@ const AREA_THRESHOLD = 9;
const SIZE_THRESHOLD = 3;
const POINTS_STROKE_WIDTH = 1.5;
const POINTS_SELECTED_STROKE_WIDTH = 4;
+const UNDEFINED_ATTRIBUTE_VALUE = '__undefined__';
export default {
BASE_STROKE_WIDTH,
@@ -20,4 +21,5 @@ export default {
SIZE_THRESHOLD,
POINTS_STROKE_WIDTH,
POINTS_SELECTED_STROKE_WIDTH,
+ UNDEFINED_ATTRIBUTE_VALUE,
};
diff --git a/cvat-ui/src/components/annotation-page/attribute-annotation-workspace/attribute-annotation-sidebar/attribute-editor.tsx b/cvat-ui/src/components/annotation-page/attribute-annotation-workspace/attribute-annotation-sidebar/attribute-editor.tsx
index de8a6222..50cec85a 100644
--- a/cvat-ui/src/components/annotation-page/attribute-annotation-workspace/attribute-annotation-sidebar/attribute-editor.tsx
+++ b/cvat-ui/src/components/annotation-page/attribute-annotation-workspace/attribute-annotation-sidebar/attribute-editor.tsx
@@ -10,6 +10,8 @@ import Select, { SelectValue } from 'antd/lib/select';
import Radio, { RadioChangeEvent } from 'antd/lib/radio';
import Input from 'antd/lib/input';
+import consts from 'consts';
+
interface InputElementParameters {
attrID: number;
inputType: string;
@@ -53,7 +55,9 @@ function renderInputElement(parameters: InputElementParameters): JSX.Element {
)}
>
{values.map((value: string): JSX.Element => (
- {value}
+
+ {value === consts.UNDEFINED_ATTRIBUTE_VALUE ? '\u00a0' : value}
+
))}
@@ -71,7 +75,9 @@ function renderInputElement(parameters: InputElementParameters): JSX.Element {
)}
>
{values.map((value: string): JSX.Element => (
- {value}
+
+ {value === consts.UNDEFINED_ATTRIBUTE_VALUE ? '\u00a0' : value}
+
))}
@@ -193,7 +199,9 @@ function renderList(parameters: ListParameters): JSX.Element | null {
[key: string]: (keyEvent?: KeyboardEvent) => void;
} = {};
- values.slice(0, 10).forEach((value: string, index: number): void => {
+ const filteredValues = values
+ .filter((value: string): boolean => value !== consts.UNDEFINED_ATTRIBUTE_VALUE);
+ filteredValues.slice(0, 10).forEach((value: string, index: number): void => {
const key = `SET_${index}_VALUE`;
keyMap[key] = {
name: `Set value "${value}"`,
@@ -214,7 +222,7 @@ function renderList(parameters: ListParameters): JSX.Element | null {
return (
- {values.map((value: string, index: number): JSX.Element => (
+ {filteredValues.map((value: string, index: number): JSX.Element => (
{`${index}:`}
{` ${value}`}
diff --git a/cvat-ui/src/components/annotation-page/attribute-annotation-workspace/styles.scss b/cvat-ui/src/components/annotation-page/attribute-annotation-workspace/styles.scss
index 1f8de841..231cc13b 100644
--- a/cvat-ui/src/components/annotation-page/attribute-annotation-workspace/styles.scss
+++ b/cvat-ui/src/components/annotation-page/attribute-annotation-workspace/styles.scss
@@ -48,9 +48,7 @@
margin: 10px 0px 10px 10px;
}
-
.attribute-annotation-sidebar-attr-elem-wrapper {
- display: inline-block;
width: 60%;
}
diff --git a/cvat-ui/src/components/annotation-page/standard-workspace/objects-side-bar/object-item.tsx b/cvat-ui/src/components/annotation-page/standard-workspace/objects-side-bar/object-item.tsx
index fcf0fe38..efd81d67 100644
--- a/cvat-ui/src/components/annotation-page/standard-workspace/objects-side-bar/object-item.tsx
+++ b/cvat-ui/src/components/annotation-page/standard-workspace/objects-side-bar/object-item.tsx
@@ -20,7 +20,7 @@ import Text from 'antd/lib/typography/Text';
import Tooltip from 'antd/lib/tooltip';
import ColorChanger from 'components/annotation-page/standard-workspace/objects-side-bar/color-changer';
-
+import consts from 'consts';
import {
ObjectOutsideIcon,
FirstIcon,
@@ -30,10 +30,10 @@ import {
BackgroundIcon,
ForegroundIcon,
} from 'icons';
-
import { ObjectType, ShapeType } from 'reducers/interfaces';
import { clamp } from 'utils/math';
+
function ItemMenu(
serverID: number | undefined,
locked: boolean,
@@ -508,7 +508,9 @@ function ItemAttributeComponent(props: ItemAttributeComponentProps): JSX.Element
}}
>
{ attrValues.map((value: string): JSX.Element => (
- {value}
+
+ {value === consts.UNDEFINED_ATTRIBUTE_VALUE ? '\u00a0' : value}
+
)) }
@@ -534,7 +536,9 @@ function ItemAttributeComponent(props: ItemAttributeComponentProps): JSX.Element
className='cvat-object-item-select-attribute'
>
{ attrValues.map((value: string): JSX.Element => (
- {value}
+
+ {value === consts.UNDEFINED_ATTRIBUTE_VALUE ? '\u00a0' : value}
+
)) }
diff --git a/cvat-ui/src/consts.ts b/cvat-ui/src/consts.ts
new file mode 100644
index 00000000..666dc98d
--- /dev/null
+++ b/cvat-ui/src/consts.ts
@@ -0,0 +1,9 @@
+// Copyright (C) 2019-2020 Intel Corporation
+//
+// SPDX-License-Identifier: MIT
+
+const UNDEFINED_ATTRIBUTE_VALUE = '__undefined__';
+
+export default {
+ UNDEFINED_ATTRIBUTE_VALUE,
+};
diff --git a/cvat-ui/src/utils/enviroment.ts b/cvat-ui/src/utils/enviroment.ts
index e1f01755..137e9dd1 100644
--- a/cvat-ui/src/utils/enviroment.ts
+++ b/cvat-ui/src/utils/enviroment.ts
@@ -2,6 +2,6 @@
//
// SPDX-License-Identifier: MIT
-export default function isDev() {
+export default function isDev(): boolean {
return process.env.NODE_ENV === 'development';
}