Replace haddock3-analysis-components with haddock3-ui package

[sverhoeven]

You are about to submit a new Pull Request. Before continuing make sure you read the contributing guidelines.

Checklist

• Tests added for the new code
• Documentation added for the code changes
• Does not break licensing
• Does not add any dependencies, if it does please add a thorough explanation

Summary of the Pull Request

I made 2 npm packages

1. https://www.npmjs.com/package/@i-vresse/haddock3-ui
2. https://www.npmjs.com/package/@i-vresse/haddock3-analysis-components

The haddock3-ui package now can do everything the haddock3-analysis-components can do. So I want to archive the haddock3-analysis-components GitHub repo.

This PR uses the haddock3-ui package for rendering tables of clusters and structures.

This PR also implements offline mode for the table in the report.html, no urls outside the local web server are requested.

Related Issue

i-VRESSE/haddock3-ui#6

Additional Info

[VGPReys]

To which extend we could also ship the haddock3-ui when installing haddock3, so the offline = true would also be functional ?

[VGPReys]

I see that plotly menu is on top of the cluster legend (see screenshot)

[sverhoeven]

To which extend we could also ship the haddock3-ui when installing haddock3, so the offline = true would also be functional ?

Working on offline mode in i-VRESSE/haddock3-ui#9 .
How would we like to use the haddock3-ui js bundle?

1. As an external file,
   1. next to report.html,
   2. somewhere within run_dir for reusing same js file.
2. JS embedded inside report.html

[VGPReys]

To which extend we could also ship the haddock3-ui when installing haddock3, so the offline = true would also be functional ?

Working on offline mode in i-VRESSE/haddock3-ui#9 . How would we like to use the haddock3-ui js bundle?

1. As an external file,
   
   1. next to report.html,
   2. somewhere within run_dir for reusing same js file.

2. JS embedded inside report.html

Good question! design choice I guess.

• Can't it be somewhere in the haddock3 installation repository ? Like haddock3/js-bundle/haddock3-ui.js?

• Or maybe we want to have it contained in the run_dir somewhere, so results are self sufficient and can be separated from the code. I guess this is the best option. Could be placed in the data directory: run_dir/data/ui/haddock3-ui.js.

@rvhonorato , @amjjbonvin please provide input for this

[amjjbonvin]

How large is the js file?

[sverhoeven]

The js file is 1.5Mb and the css file 11Kb.

@VGPReys indeed I was thinking of making it part of the haddock3 installation (using a similar mechanism as used to download cns executables in #1013) and then during analysis copy the css+js files to the run_dir, as the web server must have the css+js files in the directory it is hosting.

[sverhoeven]

Offline example

In examples/scoring dir created capri-scoring-test.offline.cfg with

# ===================================================================================
# CAPRI Scoring example
# ===================================================================================
# The Critical Assessment of PRedicted Interactions (CAPRI) experiment
#  aims to do test methods that model macromolecular interactions in
#  blind predictions based on the three-dimensional structures of proteins.
# For more information, please visit: https://www.ebi.ac.uk/pdbe/complex-pred/capri/
# ===================================================================================
run_dir = "capriscoring-test"

# execution mode
ncores = 40
mode = "local"
offline = true

# molecules to be scored (an ensemble PBD)
molecules = "data/T161-rescoring-ens.pdb"

# ===================================================================================
[topoaa]

[emscoring]

[caprieval]

[clustfcc]
min_population = 2

[seletopclusts]
top_cluster = 1
top_models = 2

[mdscoring]
per_interface_scoring = true

[clustfcc]
min_population = 2

[seletopclusts]

[caprieval]

# ===================================================================================

Ran with

rm -r capriscoring-test
haddock3 capri-scoring-test.offline.cfg
mkdir capriscoring-test/data/ui
curl -o capriscoring-test/data/ui/report.bundle.js https://cdn.jsdelivr.net/npm/@i-vresse/haddock3-ui@~0.3.0/dist/report.bundle.js
curl -o capriscoring-test/data/ui/index.css https://cdn.jsdelivr.net/npm/@i-vresse/haddock3-ui@~0.3.0/dist/index.css

[sverhoeven]

@rvhonorato At #1025 (comment) I am working on rendering tables in offline mode. To do that I need to copy a css and js file from the haddock3 installation.

How can we make those files part of the haddock3 installation? I see several options:

1. Use custombuild step similar to re-work haddock3 installation #1013 to download files.
2. have the files be part of the repo and have a script to update them.
3. Have a haddock3-ui python package that contains the js and css files and is a dependency of haddock3 package.

What has your preference?

[sverhoeven]

I went for option 2 so a 1.5Mb js file will be part of the repo.

[mgiulini]

both unclustered and clustered tables look good!

[sverhoeven]

I see that plotly menu is on top of the cluster legend (see screenshot)

Fixed with i-VRESSE@d24a510

[sverhoeven]

@VGPReys you beat me with #1041, so I will solve the conflicts.

[VGPReys]

@VGPReys you beat me with #1041, so I will solve the conflicts.

Oops...
I did not realized that you also worked on it !

[sverhoeven]

@VGPReys you beat me with #1041, so I will solve the conflicts.

Oops... I did not realized that you also worked on it !

No worries, conflicts have been resolved.