diff --git a/src/fragmentarium/ui/fragment/TokenAnnotationTool.sass b/src/fragmentarium/ui/fragment/TokenAnnotationTool.sass new file mode 100644 index 000000000..e6e7743fb --- /dev/null +++ b/src/fragmentarium/ui/fragment/TokenAnnotationTool.sass @@ -0,0 +1,11 @@ +.annotation-tool +.annotation-line + &__source + &__annotation-layer + font-size: .7em + td + padding-bottom: 1em + .markable-token + white-space: nowrap + border: 1px dashed orange + margin-right: 1em diff --git a/src/fragmentarium/ui/fragment/TokenAnnotationTool.tsx b/src/fragmentarium/ui/fragment/TokenAnnotationTool.tsx index 10321f4fe..3f74cced5 100644 --- a/src/fragmentarium/ui/fragment/TokenAnnotationTool.tsx +++ b/src/fragmentarium/ui/fragment/TokenAnnotationTool.tsx @@ -5,7 +5,8 @@ import { isTextLine } from 'transliteration/domain/type-guards' import DisplayControlLine from 'transliteration/ui/DisplayControlLine' import { TextLine } from 'transliteration/domain/text-line' import { lineComponents } from 'transliteration/ui/TransliterationLines' -import { AnnotationLineColumns } from 'transliteration/ui/annotation-line-tokens' +import { AnnotationLine } from 'transliteration/ui/annotation-line-tokens' +import './TokenAnnotationTool.sass' type Props = { fragment: Fragment @@ -27,7 +28,7 @@ export default class TokenAnnotationTool extends Component { line: TextLine lineIndex: number }): JSX.Element { - return + return } render(): JSX.Element { @@ -40,7 +41,7 @@ export default class TokenAnnotationTool extends Component { lineComponents.get(line.type) || DisplayControlLine return ( - +
{isTextLine(line) ? ( - {this.hasLeadingWhitespace && ' '} column.content.forEach((token, index) => { + const nextToken = column.content[index + 1] || null switch (token.type) { case 'LanguageShift': language = token.language @@ -33,15 +34,15 @@ function createTokenMarkables( case 'Column': throw new Error('Unexpected column token.') default: + enclosureIsOpen = isOpenEnclosure(token) markable = new MarkableToken( token, index, isInGloss, protocol, language, - index !== 0 && !isCloseEnclosure(token) && !enclosureIsOpen + nextToken && !isCloseEnclosure(nextToken) && !enclosureIsOpen ) - enclosureIsOpen = isOpenEnclosure(token) markables.push(markable) } }) @@ -49,7 +50,7 @@ function createTokenMarkables( return markables } -export function AnnotationLineColumns({ +export function AnnotationLine({ line, lineIndex, }: { @@ -63,47 +64,46 @@ export function AnnotationLineColumns({ - {markables.map((token, index) => { + {markables.map((markable, index) => { return ( ) })} ) - const lemmaAnnotationLayer = ( + const lemmaAnnotationLayer = _.some( + markables, + (markable) => markable.token.lemmatizable + ) ? ( - {markables.map((token, index) => { - return ( + {markables.map((markable, index) => { + const token = markable.token + return token.lemmatizable ? ( + ) : ( + ) })} + ) : ( + <> ) return (
- console.log( - `display token ${token.token.cleanValue} at ` + - `line=${lineIndex}, index in array=${index}, token index = ${token.index}`, - token.token - ) - } + onClick={() => console.log(markable)} > - {token.display()} + {markable.display()} + {markable.hasTrailingWhitespace && <>  }
- console.log( - `lemma of token ${token.token.cleanValue} at line=${lineIndex}, index=${index}`, - token.token - ) - } + onClick={() => console.log(markable)} > - {token.token.uniqueLemma} + {_.isEmpty(token.uniqueLemma) ? '➕' : token.uniqueLemma} + {markable.hasTrailingWhitespace && <>  }