wangchunlin
/
cvat
1
0
Fork 0
Code Issues Pull Requests Packages Projects Releases Wiki Activity

React UI: Added message when share is empty or not mounted (#1373)

Browse Source 
* Added message when share is empty or not mounted

* Updated changelog

* Update CHANGELOG.md

Co-authored-by: Nikita Manovich <40690625+nmanovic@users.noreply.github.com>
main
Boris Sekachev 6 years ago committed by GitHub
parent 7ece212afb
commit b94a949617
No known key found for this signature in database
GPG Key ID: 4AEE18F83AFDEB23
8 changed files with 98 additions and 62 deletions
Show Stats Download Patch File Download Diff File

3
CHANGELOG.md
Unescape Escape View File

@ -10,7 +10,8 @@ and this project adheres to [Semantic Versioning](https://semver.org/spec/v2.0.0
- Dialog window with some helpful information about using filters - Dialog window with some helpful information about using filters
- Ability to display a bitmap in the new UI - Ability to display a bitmap in the new UI
- Button to reset colors settings (brightness, saturation, contrast) in the new UI - Button to reset colors settings (brightness, saturation, contrast) in the new UI
- Added option to display shape text always - Option to display shape text always
- Dedicated message with clarifications when share is unmounted (https://github.com/opencv/cvat/pull/1373)
### Changed ### Changed
- Increase preview size of a task till 256, 256 on the server - Increase preview size of a task till 256, 256 on the server

24
cvat-ui/src/components/create-model-page/create-model-content.tsx
Unescape Escape View File

@ -3,20 +3,16 @@
// SPDX-License-Identifier: MIT // SPDX-License-Identifier: MIT
import React from 'react'; import React from 'react';
import { Row, Col } from 'antd/lib/grid';
import { import Icon from 'antd/lib/icon';
Row, import Alert from 'antd/lib/alert';
Col, import Button from 'antd/lib/button';
Icon, import Tooltip from 'antd/lib/tooltip';
Alert, import message from 'antd/lib/message';
Button, import notification from 'antd/lib/notification';
Tooltip,
message,
notification,
} from 'antd';
import Text from 'antd/lib/typography/Text'; import Text from 'antd/lib/typography/Text';
import consts from 'consts';
import ConnectedFileManager, { import ConnectedFileManager, {
FileManagerContainer, FileManagerContainer,
} from 'containers/file-manager/file-manager'; } from 'containers/file-manager/file-manager';
@ -107,7 +103,7 @@ export default class CreateModelContent extends React.PureComponent<Props> {
const status = modelCreatingStatus const status = modelCreatingStatus
&& modelCreatingStatus !== 'CREATED' ? modelCreatingStatus : ''; && modelCreatingStatus !== 'CREATED' ? modelCreatingStatus : '';
const guideLink = 'https://github.com/opencv/cvat/blob/develop/cvat/apps/auto_annotation/README.md'; const { AUTO_ANNOTATION_GUIDE_URL } = consts;
return ( return (
<Row type='flex' justify='start' align='middle' className='cvat-create-model-content'> <Row type='flex' justify='start' align='middle' className='cvat-create-model-content'>
<Col span={24}> <Col span={24}>
@ -116,7 +112,7 @@ export default class CreateModelContent extends React.PureComponent<Props> {
onClick={(): void => { onClick={(): void => {
// false positive // false positive
// eslint-disable-next-line // eslint-disable-next-line
window.open(guideLink, '_blank'); window.open(AUTO_ANNOTATION_GUIDE_URL, '_blank');
}} }}
type='question-circle' type='question-circle'
/> />

45
cvat-ui/src/components/feedback/feedback.tsx
Unescape Escape View File

@ -4,13 +4,10 @@
import './styles.scss'; import './styles.scss';
import React from 'react'; import React from 'react';
import Button from 'antd/lib/button';
import { import Icon from 'antd/lib/icon';
Button, import Popover from 'antd/lib/popover';
Icon, import Text from 'antd/lib/typography/Text';
Popover,
} from 'antd';
import { import {
FacebookShareButton, FacebookShareButton,
LinkedinShareButton, LinkedinShareButton,
@ -30,59 +27,59 @@ import {
LinkedinIcon, LinkedinIcon,
} from 'react-share'; } from 'react-share';
import Text from 'antd/lib/typography/Text'; import consts from 'consts';
function renderContent(): JSX.Element { function renderContent(): JSX.Element {
const githubURL = 'https://github.com/opencv/cvat'; const {
const githubImage = 'https://raw.githubusercontent.com/opencv/' GITHUB_URL,
+ 'cvat/develop/cvat/apps/documentation/static/documentation/images/cvat.jpg'; GITHUB_IMAGE_URL,
const questionsURL = 'https://gitter.im/opencv-cvat/public'; GITTER_PUBLIC_URL,
const feedbackURL = 'https://gitter.im/opencv-cvat/public'; } = consts;
return ( return (
<> <>
<Icon type='star' /> <Icon type='star' />
<Text style={{ marginLeft: '10px' }}> <Text style={{ marginLeft: '10px' }}>
Star us on Star us on
<a target='_blank' rel='noopener noreferrer' href={githubURL}> GitHub</a> <a target='_blank' rel='noopener noreferrer' href={GITHUB_URL}> GitHub</a>
</Text> </Text>
<br /> <br />
<Icon type='like' /> <Icon type='like' />
<Text style={{ marginLeft: '10px' }}> <Text style={{ marginLeft: '10px' }}>
Leave a Leave a
<a target='_blank' rel='noopener noreferrer' href={feedbackURL}> feedback</a> <a target='_blank' rel='noopener noreferrer' href={GITTER_PUBLIC_URL}> feedback</a>
</Text> </Text>
<hr /> <hr />
<div style={{ display: 'flex' }}> <div style={{ display: 'flex' }}>
<FacebookShareButton url={githubURL} quote='Computer Vision Annotation Tool'> <FacebookShareButton url={GITHUB_URL} quote='Computer Vision Annotation Tool'>
<FacebookIcon size={32} round /> <FacebookIcon size={32} round />
</FacebookShareButton> </FacebookShareButton>
<VKShareButton url={githubURL} title='Computer Vision Annotation Tool' image={githubImage} description='CVAT'> <VKShareButton url={GITHUB_URL} title='Computer Vision Annotation Tool' image={GITHUB_IMAGE_URL} description='CVAT'>
<VKIcon size={32} round /> <VKIcon size={32} round />
</VKShareButton> </VKShareButton>
<TwitterShareButton url={githubURL} title='Computer Vision Annotation Tool' hashtags={['CVAT']}> <TwitterShareButton url={GITHUB_URL} title='Computer Vision Annotation Tool' hashtags={['CVAT']}>
<TwitterIcon size={32} round /> <TwitterIcon size={32} round />
</TwitterShareButton> </TwitterShareButton>
<RedditShareButton url={githubURL} title='Computer Vision Annotation Tool'> <RedditShareButton url={GITHUB_URL} title='Computer Vision Annotation Tool'>
<RedditIcon size={32} round /> <RedditIcon size={32} round />
</RedditShareButton> </RedditShareButton>
<LinkedinShareButton url={githubURL}> <LinkedinShareButton url={GITHUB_URL}>
<LinkedinIcon size={32} round /> <LinkedinIcon size={32} round />
</LinkedinShareButton> </LinkedinShareButton>
<TelegramShareButton url={githubURL} title='Computer Vision Annotation Tool'> <TelegramShareButton url={GITHUB_URL} title='Computer Vision Annotation Tool'>
<TelegramIcon size={32} round /> <TelegramIcon size={32} round />
</TelegramShareButton> </TelegramShareButton>
<WhatsappShareButton url={githubURL} title='Computer Vision Annotation Tool'> <WhatsappShareButton url={GITHUB_URL} title='Computer Vision Annotation Tool'>
<WhatsappIcon size={32} round /> <WhatsappIcon size={32} round />
</WhatsappShareButton> </WhatsappShareButton>
<ViberShareButton url={githubURL} title='Computer Vision Annotation Tool'> <ViberShareButton url={GITHUB_URL} title='Computer Vision Annotation Tool'>
<ViberIcon size={32} round /> <ViberIcon size={32} round />
</ViberShareButton> </ViberShareButton>
</div> </div>
<hr /> <hr />
<Text style={{ marginTop: '50px' }}> <Text style={{ marginTop: '50px' }}>
Do you need help? Contact us on Do you need help? Contact us on
<a target='_blank' rel='noopener noreferrer' href={questionsURL}> gitter</a> <a target='_blank' rel='noopener noreferrer' href={GITTER_PUBLIC_URL}> gitter</a>
</Text> </Text>
</> </>
); );

35
cvat-ui/src/components/file-manager/file-manager.tsx
Unescape Escape View File

@ -4,17 +4,16 @@
import './styles.scss'; import './styles.scss';
import React from 'react'; import React from 'react';
import Tabs from 'antd/lib/tabs';
import { import Icon from 'antd/lib/icon';
Tabs, import Input from 'antd/lib/input';
Icon,
Input,
Upload,
} from 'antd';
import Tree, { AntTreeNode, TreeNodeNormal } from 'antd/lib/tree/Tree';
import { RcFile } from 'antd/lib/upload';
import Text from 'antd/lib/typography/Text'; import Text from 'antd/lib/typography/Text';
import Paragraph from 'antd/lib/typography/Paragraph';
import Upload, { RcFile } from 'antd/lib/upload';
import Empty from 'antd/lib/empty';
import Tree, { AntTreeNode, TreeNodeNormal } from 'antd/lib/tree/Tree';
import consts from 'consts';
export interface Files { export interface Files {
local: File[]; local: File[];
@ -148,6 +147,7 @@ export default class FileManager extends React.PureComponent<Props, State> {
}); });
} }
const { SHARE_MOUNT_GUIDE_URL } = consts;
const { treeData } = this.props; const { treeData } = this.props;
const { const {
expandedKeys, expandedKeys,
@ -156,7 +156,7 @@ export default class FileManager extends React.PureComponent<Props, State> {
return ( return (
<Tabs.TabPane key='share' tab='Connected file share'> <Tabs.TabPane key='share' tab='Connected file share'>
{ treeData.length { treeData[0].children && treeData[0].children.length
? ( ? (
<Tree <Tree
className='cvat-share-tree' className='cvat-share-tree'
@ -190,7 +190,18 @@ export default class FileManager extends React.PureComponent<Props, State> {
> >
{ renderTreeNodes(treeData) } { renderTreeNodes(treeData) }
</Tree> </Tree>
) : <Text className='cvat-text-color'>No data found</Text>} ) : (
<div className='cvat-empty-share-tree'>
<Empty />
<Paragraph className='cvat-text-color'>
Please, be sure you had
<Text strong>
<a href={SHARE_MOUNT_GUIDE_URL}> mounted </a>
</Text>
share before you built CVAT and the shared storage contains files
</Paragraph>
</div>
)}
</Tabs.TabPane> </Tabs.TabPane>
); );
} }

6
cvat-ui/src/components/file-manager/styles.scss
Unescape Escape View File

@ -10,3 +10,9 @@
max-height: 20em; max-height: 20em;
overflow: auto; overflow: auto;
} }
.cvat-empty-share-tree {
> .ant-typography {
margin-top: 10px;
}
}

3
cvat-ui/src/components/global-error-boundary/global-error-boundary.tsx
Unescape Escape View File

@ -19,6 +19,7 @@ import ErrorStackParser from 'error-stack-parser';
import { resetAfterErrorAsync } from 'actions/boundaries-actions'; import { resetAfterErrorAsync } from 'actions/boundaries-actions';
import { CombinedState } from 'reducers/interfaces'; import { CombinedState } from 'reducers/interfaces';
import logger, { LogType } from 'cvat-logger'; import logger, { LogType } from 'cvat-logger';
import consts from 'consts';
interface StateToProps { interface StateToProps {
job: any | null; job: any | null;
@ -161,7 +162,7 @@ class GlobalErrorBoundary extends React.PureComponent<Props, State> {
</li> </li>
<li> <li>
Notify an administrator or submit the issue directly on Notify an administrator or submit the issue directly on
<a href='https://github.com/opencv/cvat'> GitHub. </a> <a href={consts.GITHUB_URL}> GitHub. </a>
Please, provide also: Please, provide also:
<ul> <ul>
<li>Steps to reproduce the issue</li> <li>Steps to reproduce the issue</li>

26
cvat-ui/src/components/header/header.tsx
Unescape Escape View File

@ -16,6 +16,7 @@ import Modal from 'antd/lib/modal';
import Text from 'antd/lib/typography/Text'; import Text from 'antd/lib/typography/Text';
import { CVATLogo, AccountIcon } from 'icons'; import { CVATLogo, AccountIcon } from 'icons';
import consts from 'consts';
interface HeaderContainerProps { interface HeaderContainerProps {
onLogout: () => void; onLogout: () => void;
@ -60,12 +61,15 @@ function HeaderContainer(props: Props): JSX.Element {
|| installedTFAnnotation || installedTFAnnotation
|| installedTFSegmentation; || installedTFSegmentation;
function aboutModal(): void { const {
const CHANGELOG = 'https://github.com/opencv/cvat/blob/develop/CHANGELOG.md'; CHANGELOG_URL,
const LICENSE = 'https://github.com/opencv/cvat/blob/develop/LICENSE'; LICENSE_URL,
const GITTER = 'https://gitter.im/opencv-cvat'; GITTER_URL,
const FORUM = 'https://software.intel.com/en-us/forums/intel-distribution-of-openvino-toolkit'; FORUM_URL,
GITHUB_URL,
} = consts;
function aboutModal(): void {
Modal.info({ Modal.info({
title: `${toolName}`, title: `${toolName}`,
content: ( content: (
@ -106,10 +110,10 @@ function HeaderContainer(props: Props): JSX.Element {
</Text> </Text>
</p> </p>
<Row type='flex' justify='space-around'> <Row type='flex' justify='space-around'>
<Col><a href={CHANGELOG} target='_blank' rel='noopener noreferrer'>{'What\'s new?'}</a></Col> <Col><a href={CHANGELOG_URL} target='_blank' rel='noopener noreferrer'>{'What\'s new?'}</a></Col>
<Col><a href={LICENSE} target='_blank' rel='noopener noreferrer'>License</a></Col> <Col><a href={LICENSE_URL} target='_blank' rel='noopener noreferrer'>License</a></Col>
<Col><a href={GITTER} target='_blank' rel='noopener noreferrer'>Need help?</a></Col> <Col><a href={GITTER_URL} target='_blank' rel='noopener noreferrer'>Need help?</a></Col>
<Col><a href={FORUM} target='_blank' rel='noopener noreferrer'>Forum on Intel Developer Zone</a></Col> <Col><a href={FORUM_URL} target='_blank' rel='noopener noreferrer'>Forum on Intel Developer Zone</a></Col>
</Row> </Row>
</div> </div>
), ),
@ -199,7 +203,9 @@ function HeaderContainer(props: Props): JSX.Element {
type='link' type='link'
onClick={ onClick={
(): void => { (): void => {
window.open('https://github.com/opencv/cvat', '_blank'); // false positive
// eslint-disable-next-line security/detect-non-literal-fs-filename
window.open(GITHUB_URL, '_blank');
} }
} }
> >

18
cvat-ui/src/consts.ts
Unescape Escape View File

@ -4,8 +4,26 @@
const UNDEFINED_ATTRIBUTE_VALUE = '__undefined__'; const UNDEFINED_ATTRIBUTE_VALUE = '__undefined__';
const NO_BREAK_SPACE = '\u00a0'; const NO_BREAK_SPACE = '\u00a0';
const CHANGELOG_URL = 'https://github.com/opencv/cvat/blob/develop/CHANGELOG.md';
const LICENSE_URL = 'https://github.com/opencv/cvat/blob/develop/LICENSE';
const GITTER_URL = 'https://gitter.im/opencv-cvat';
const GITTER_PUBLIC_URL = 'https://gitter.im/opencv-cvat/public';
const FORUM_URL = 'https://software.intel.com/en-us/forums/intel-distribution-of-openvino-toolkit';
const GITHUB_URL = 'https://github.com/opencv/cvat';
const GITHUB_IMAGE_URL = 'https://raw.githubusercontent.com/opencv/cvat/develop/cvat/apps/documentation/static/documentation/images/cvat.jpg';
const AUTO_ANNOTATION_GUIDE_URL = 'https://github.com/opencv/cvat/blob/develop/cvat/apps/auto_annotation/README.md';
const SHARE_MOUNT_GUIDE_URL = 'https://github.com/opencv/cvat/blob/master/cvat/apps/documentation/installation.md#share-path';
export default { export default {
UNDEFINED_ATTRIBUTE_VALUE, UNDEFINED_ATTRIBUTE_VALUE,
NO_BREAK_SPACE, NO_BREAK_SPACE,
CHANGELOG_URL,
LICENSE_URL,
GITTER_URL,
GITTER_PUBLIC_URL,
FORUM_URL,
GITHUB_URL,
GITHUB_IMAGE_URL,
AUTO_ANNOTATION_GUIDE_URL,
SHARE_MOUNT_GUIDE_URL,
}; };

Write Preview
Loading…
Cancel
Save