Setup Environment

Basically, HistoJS has a front-end, Flask as the back-end framework, and an images database (i.e., Digital Slide Archive) —it can be conceptualized as having three layers:

• JavaScript UI Layer (Front-End): This is the layer that the end-users interact with, and can handle the browsing and OME-TIFF channels grouping phase.

• Flask (Back-End) Layer: This Python layer, powered by Flask, handles the analysis phase.

• Data Layer (Digital Slide Archive): This is where OME-TIFF data is stored, retrieved, and managed. It includes a data management system and Rest APIs to handle the requests.

---

Flask (Back-End) Layer:

• Install requirements

    3.4 < python < 3.8  is recommended

For deploying HistoJS on a cluster or a local client-side machine, first download or clone HistoJS repository:

    git clone https://github.com/Mmasoud1/HistoJS.git
    cd HistoJS

Then create histojs conda environment:

    conda env create -f histojs.yml

After creating the histojs environment, from the root level of the repository open a new terminal, activate the environment and run the python Rest Api file:

    source activate histojs
    python RestApi.py

JavaScript UI Layer (Front-End):

• To run the local host in the browser, start up a simple local server from the root level of the repository with any available port number 8xxx (e.g., 8020)

    python -m http.server 8xxx

• In the browser URL, open the local host with the selected port number (e.g., 8020):

    localhost:8020/

The following demo summarizes the above steps. However, the conda environment creation was bypassed in that demo because it was already created before.

HistoJS_Setup.mp4

Data Layer (Digital Slide Archive):

For using the backbone Digital Slide Archive (DSA) server (e.g., Styx ), you need to create a user account on any DSA server and upload your OME-TIFF image, cells mask (Optional), and the channels metadata CSV file to your collection as in this link:

    https://styx.neurology.emory.edu/girder/#folder/658d5f2ca45554f5d9171e01

Please note: if the name of the OME image file is $fileName$.ome.tif (e.g. TONSIL-1_40X.ome.tif), the optional cell mask image name must be $fileName$_cellMask.tiff (e.g., TONSIL-1_40X_cellMask.tiff), and the Channel metadata CSV file name should be $fileName$_channel_metadata.csv (e.g., TONSIL-1_40X_channel_metadata.csv)

DSA example of OME-TIFF data hosting (Data source: Rashid et al)

The Channel metadata CSV file must have at least two columns: 'channel_number' and 'channel_name' :