Put vector and html layout in the same page

[Yuu-Han]

I think it is better to put the different layouts in the same html page instead of two separate pages, so that it is easier to enable switching layout on the HistoryMap (https://github.com/Vis4Sense/HistoryMap/issues/145#issuecomment-1883311516) and to share the common components of the page.

Options for implementation:

1. One div for the tree, changing its innerHtml according to selection of layout
2. One div for vector and another div for html, changing the display attribute (none or block)

[Yuu-Han]

It could take some efforts to refactor the code in order to put the things on the same page. Maybe two separate pages are good for now.

I was concerned about how to reuse the html node in @Jeffrey-D-Pierce's implementation. I just had a try in 24e1372bd602d861dd9df76e38900c9731af077b, using customContent to generate the html for each page item.

One slight issue is currently I need to adapt the pageObj to the form of the input of customContent, would it be better if the function takes the shared pageObj schema as input or if there is a global function that conducts such transition so that both layouts can run it without customisation? (see comments in the following code block)

https://github.com/Vis4Sense/HistoryMap/blob/24e1372bd602d861dd9df76e38900c9731af077b/src/historymap/hmTree3View.js#L136-L168

Another slight issue is that currently importing custom.js would run the following code:

https://github.com/Vis4Sense/HistoryMap/blob/24e1372bd602d861dd9df76e38900c9731af077b/src/historymap/simple_html_tree/custom.js#L99-L112

Would it be better if we can access customContent from a script that merely defines functions but does not take any action?