feat: annotations

Feature

Summary

This MR enables TIDO to display annotations.

Does the result of the MR comply to our "definition of done"?

• Unit tests passed
• Code reviewed
• Acceptance criteria met
• Functional tests passed
• Non-Functional requirements met
• Product Owner accepts the User Story

Documentation

• I updated the README (if applicable)
• I provided my functions with appropriate documentation
• I adjusted other parts of the documentation (if applicable)

Tests

Are we able to test this new feature?

• Yes, everything can be done via unit tests.
• Yes, you can test by following these steps:

prerequisites:

• checkout the branch: git checkout feature/#41-annotations
• update your local modules once: npm i
• open the index.template.html file:
  • set an entrypoint: https://ahikar-dev.sub.uni-goettingen.de/api/textapi/ahikar/arabic-karshuni/collection.json
• start your dev environment: npm run dev

feature tests:

• action
  • navigate to Cod. Arab. 236 Copenhagen => Sheet 2a
• expectation
  • data toggles in the anno panel are selected (according to the content types available in the text)
  • the list below shows all the annotations highlighted
  • the text counterparts are underlined and have an icon attached to it (according to the type given)
• action
  • click on the names toggle at the top
• expectation
  • names toggle turns inactive
  • the list gets reduced by all the annotations that correspond to names
  • text counterparts (names) aren't underlined and haven't an icon attached to it
• action
  • click on the names toggle at the top again
• expectation
  • pls refer to the step above; this time the behaviour is the other way around: toggle gets active, names are back in list (in sorted order, taking the remaining / shown data types into account) and text is highlighted again
• action
  • click a single annotation in the annotation list
• expectation
  • the item gets dehighlighted as it's text counterpart in the text panel does and the "none" button is highlighted, since now there aren't all of the annotations selected
• action
  • reverse the last step: click the dehighlighted text entity in the in the text panel
• expectation
  • the text gets highlighted again as it's list counterpart in the annotation panel does and the "all" button is highlighted again (pls take a look at the lower third of the anno panel => options)
• action
  • click on none in the "options section" (see above)
• expectation
  • all the annotations get dehighlighted at once but are still shown. this applies to the text entities as well
• action
  • hover over the comment toggle
• expectation
  • since the current item doesn't contain any comment, the cursor turns into a "disabled state" and the toggle isn't clickable
• action
  • click all active data type toggles one after another
• expectation
  • the toggles turn inactive
  • all the text entities get dehighlighted
  • there is no list of annotations in the anno panel anymore
  • instead there is a notification that addresses the user to interact: Toggle at least one data type to show annotations
• action
  • from here (referring to the last step) click an arbitray text entity in the text panel
• expectation
  • the appropriate text entity gets highlighted (underlined and icon attached)
  • the data type toggle gets active (according to the type you clicked on) and every corrseponding type is shown
  • only the annotation that matches it's text counterpart is highlighted. All the others are shown, but are dehighlighted
• action
  • select the "next" item: e.g. click on next sheet or select it in the tree => Sheet 2b
• expectation
  • this item doesn't contain any annotation at all, hence a user notification is displayed: => no annotations available
• action
  • navigate to Sheet 4a
• expectation
  • the annotations get updated according to the current item shown
  • the places toggle gets inactive (no places here)
  • the comments toggle turns active (the item contains a single comment)
• action
  • click the names toggle
• expectation
  • the annotation list shows only the single comment
  • since there is a single item in the annotation list only, the sorting buttons completely disappear

Different text types

• action
  • navigate to Mingana Syriac 133 ff.82v-103r => Sheet 82a
  • click on TRANSLITERATION at the top of the text panel to switch the text
• expectation
  • the annotations update according to the text type selected

Configuration

Pls note: (just as a reminder) since it's about config, you have to reload your page everytime you are about change sth in the index.template.html file

• action

  • open the index-template.html file
  • find the section for the annotations to be configured (at the top of the config object)
  • toggle the show key to false and reload your page

• expectation

  • all the data type toggles are inactive
  • a user notification shows up
  • nothing is highlighted

• action

  • change an icon (config => types): e.g. for the persons:

  "css": "fa-user" => "css": "fa-search" "icon": "fasUser" => "icon": "fasSearch"

  refresh your page

• expectation

  • all the icons (according to the data type you changed) change to the newly configured icon face

• action

  • repeat the last step, but this time provide a nonsense name for the SVG, or rather force a typo: e.g. "icon": "fasUser" => "icon": "fasBla"

• expectation

  • since fasBla doesn't exist, a fallback icon is shown in the annotation panel (data toggles and list alike). For the time being this fallback point to fasTimes, but this might need an improvement from a semantical perspective

• action

  • change a label: e.g. "label": "Places" to "label": "Orte"

• expectation

  • the label of the appropriate data type toggle (top of the anno panel) changes according to your configuration

• action

  • add a completely new object to the types array: { "content-type": "TestIt", "css": "fa-search", "icon": "fasSearch", "label": "ABC123" },

• expectation

  • your recently created additional content type gets rendered as an additional data type toggle.

Pls note: As long as the API doesn't provide a type called TestIt and / or the current item you are displaying doesn't contain an equaling content type, the data toggle is disabled

Please take a look at the README section as well. Thank you!

• No, it is not possible.

Changelog

• I added a statement to the CHANGELOG.

Related Tickets

Add all related issues and especially those to be closed.

Related

#41 (closed) #158 (closed) #159 (closed) #161 (closed) #162 (closed) #169 (closed) #170 (closed) #179 (closed) #180 (closed) #190 (closed) #225 (closed)

Closes

Closes

#41 (closed) #158 (closed) #159 (closed) #161 (closed) #162 (closed) #169 (closed) #170 (closed) #179 (closed) #180 (closed) #190 (closed) #225 (closed)

Logs and Screenshots

/cc Mathias Göbel, Frank Schneider, Michelle Weidling