1
|
import { AnnotationPanel } from '../../components/annotation/annotationPanel';
|
2
|
import { DocumentAnnotationView } from '../../components/annotation/documentAnnotationView';
|
3
|
import { TagPanel } from '../../components/annotation/tagPanel';
|
4
|
import { MainLayout } from '../../layouts/mainLayout';
|
5
|
import 'antd/dist/antd.css';
|
6
|
import styles from '/styles/annotation.module.scss';
|
7
|
import { Occurrence, Tag } from '../../components/models/tag';
|
8
|
import AnnotationProvider from '../../contexts/AnnotationContext';
|
9
|
|
10
|
/**
|
11
|
* Creates an annotation screen.
|
12
|
* @returns The annotation screen.
|
13
|
*/
|
14
|
function Annotation() {
|
15
|
const tags = [
|
16
|
{
|
17
|
name: 'tag a',
|
18
|
category: 'kategorie 1',
|
19
|
visible: true,
|
20
|
occurrences: [
|
21
|
{ position: 2, length: 5 },
|
22
|
{ position: 10, length: 2 },
|
23
|
],
|
24
|
},
|
25
|
{
|
26
|
name: 'tag b',
|
27
|
category: 'kategorie 2',
|
28
|
visible: true,
|
29
|
occurrences: [
|
30
|
{ position: 546, length: 432 },
|
31
|
{ position: 767, length: 123 },
|
32
|
],
|
33
|
},
|
34
|
];
|
35
|
|
36
|
const addOccurrence = () => {};
|
37
|
|
38
|
const changeVisibility = (tag: Tag) => {};
|
39
|
|
40
|
const deleteOccurrence = (occurrence: Occurrence) => {};
|
41
|
|
42
|
const changePosition = (occurrence: Occurrence, newValue: number) => {};
|
43
|
|
44
|
const changeLength = (occurrence: Occurrence, newValue: number) => {};
|
45
|
|
46
|
return (
|
47
|
<AnnotationProvider>
|
48
|
<MainLayout>
|
49
|
<div className={styles.layoutwrapper}>
|
50
|
<div className={styles.tags}>
|
51
|
<TagPanel />
|
52
|
</div>
|
53
|
<div className={styles.document}>
|
54
|
<DocumentAnnotationView />
|
55
|
</div>
|
56
|
<div className={styles.annotations}>
|
57
|
<AnnotationPanel
|
58
|
tags={tags}
|
59
|
onAddOccurrence={addOccurrence}
|
60
|
onChangeVisibility={changeVisibility}
|
61
|
onDeleteOccurrence={deleteOccurrence}
|
62
|
onChangePosition={changePosition}
|
63
|
onChangeLength={changeLength}
|
64
|
/>
|
65
|
</div>
|
66
|
</div>
|
67
|
</MainLayout>
|
68
|
</AnnotationProvider>
|
69
|
);
|
70
|
}
|
71
|
|
72
|
export default Annotation;
|