Add titles to taxa tables

[laurenwalker]

Each taxa table should have a title above it, such as Species 1, Species 2, etc. to indicate why there are multiple tables. During UX testing, it was not obvious what the second table was for once it appeared. There is some help text that explains it, but that is not always noticed.

[rushirajnenuji]

@laurenwalke, I was testing the numbering of the Species tables, but there is a problem. Once the user deletes a specific species table, the numbering goes wrong. The numbers are reinitialized only once the page is refreshed. After creating a couple of species table and removing some of them (for testing) the UI looks something like this: (please view the attached images) -

[csjx]

This is an interesting issue. If we modularized the taxa section into a EMLTaxonCoverageView like we do with the EMLGeoCoverageView, we could then listen for any change events in the EMLTaxonCoverage model and re-render() the view. But that's kind of a big refactor of that section of the code at this point (although I like the modularity nevertheless).

Now that I look at this section more closely, I'm not sure that we're rendering taxa information in the most intuitive way. The intention here is to represent a tree, and we have split the tree up into individual tables, and don't show the nested relationship between the child and the parent taxonomicClassifications in the tree.

I think we need to shoot for a more concise table rendering. for instance, if you look at the bear genus Ursus over at ITIS, their Taxonomic Hierarchy is a two column table with Rank as the first column and Value as the second. Most researchers are going to be familiar with this sort of display. Again, this is another refactor that we may need to schedule for a later release, but this species numbering issue is indicative of our display not being intuitive.

Let's discuss how to go forward with this.

[laurenwalker]

I agree that we need to modularize the EMLTaxonCoverageView. I actually started on that a few months ago and stopped once I realized how messy of a refactor it was going to be. I have a local EMLTaxonCoverageView that I can check in so that once we get to that point we can just it as a start.

I already talked to @rushirajnenuji about this on Slack, but we had this exact problem with the Methods Steps fields in the Editor. The steps are numbered sequentially there too, and it changes the numbers as steps are deleted. @rushirajnenuji, you should be able to reuse that code.

I like the indented display of the taxnomic hierarchy on the ITIS website. I also would like to see us improve our display in that direction.

[mbjones]

I also like the compact, indented ITIS display. It would be good to pair common names with scientific names at each rank in the tree. Within EML, we have several common situations that need to be handled well:

1. User only provides the leaf node (e.g., Species)

   • A
   • this is recommended because it prevents incorrect taxonomies from propagating
   • in this case, we should display the provided info, and (possibly look up and display the full tree from ITIS)

2. User provides the whole taxon tree for a single species

   • D <- C <- B <- A
   • this is not best practice in EML, but is common. Often the provided parent classes are wrong or out of date. We should display it, but we may also want to display the current ITIS parent tree as well (or instead?)

3. User provides the whole taxon tree for a multiple species

   • D <- C <- B <- (A1 A2 A3)
   • leaf nodes may occur at multiple ranks in the tree, which is confusing but needs to be handled
   • same issues as before with correctness, but now the tree might be right for some species, and not for others
   • ITIS corrections are warranted, but might differ for each species

One solution for all of these cases is to always look up the leaf node(s) and display the parent tree(s) from ITIS regardless of what the user provides in the metadata document. I'm not sure if I like this.

[laurenwalker]

Here are some changes to make to the taxa table titles:

1. The title should be located outside of the table border:
   The title looks odd squeezed in between the table border and the header row. Let's move the title outside of the div that has the border, or remove the border on the top of the table only via CSS, or move the title inside of the header row of the table.
   

2. The title should be more visible
   Let's remove the subtle class from the title, which will remove the light grey color. The title should also be a header HTML element, such as h6. This is more semantically correct than a paragraph p element.

3. Remove taxa-specific logic from the handleRemove() function

https://github.com/NCEAS/metacatui/blob/master/metacatui/src/main/webapp/js/views/metadata/EML211View.js#L2061-L2065

//updating the taxaTablesIndex once the element has been removed
var taxaNums = this.$(".taxaIndex");
for(var i=0; i < taxaNums.length; i++){
     $(taxaNums[i]).text(i+1);
}

At the end of the handleRemove() function, I see that we update the table numbers by selecting the elements with the taxaIndex class. Let's make this code more generic and use a class name like editor-header-index. The reason why: handleRemove() is a function that is used throughout the editor for handling removal of various EML elements. For example, handleRemove() is called when a person is removed, when an alternate identifier is used, when a funding number is removed, etc. So we want the logic in that function to be general enough to handle removal of many types of content in the Editor. When we hard-code in class names for very specific types of content, like taxonomy, we are preventing that code from being reused in other parts of the Editor. For example, in the future we may want to start numbering funding numbers (e.g. Funding 1, Funding 2, etc.), and if the handleRemove() code is general enough, we can give the funding index elements the editor-header-index and it will automatically work with that code.

4. Fix bugs
   Fix these bugs found by Tommy: Species Number Incorrect When Editing Package #329 and Taxa Species & Taxa Error Are Competing For Space #325

[rushirajnenuji]

Solved with Commit code da42fad.