fixed absolute path in kegg.py

improved design of dash apps and css
improved design of GUI
now checks if R package needed for horizon plot is missing and auto installs
updated requirements.txt

desktop/requirements.txt

@@ -1,14 +1,14 @@
-pandas==1.3.5
-numpy==1.22.1
-scipy==1.7.3
-plotly==5.5.0
-dash~=2.4.1
-Flask==2.0.2
+pandas==1.5.1
+numpy==1.23.4
+scipy==1.9.2
+plotly==5.11.0
+dash==2.6.2
+Flask==2.2.2
 future==0.18.2
-mysql-connector-python==8.0.27
-requests==2.27.1
+mysql-connector-python==8.0.31
+requests==2.28.1
 setuptools~=57.0.0
-matplotlib~=3.5.2
+matplotlib~=3.6.1
 tqdm~=4.63.0
-Pillow~=9.0.1
-conda~=4.1.6
+conda==4.2.7
+rpy2==3.5.0

desktop/src/mmonitor/calculations/horizon_r.py

@@ -1,6 +1,11 @@
 from os import environ, getcwd, chdir
 from os.path import join
 from subprocess import call
+# import rpy2's package module
+import rpy2.robjects.packages as rpackages
+import rpy2.robjects as robjects
+from rpy2.robjects.vectors import StrVector
+from rpy2.robjects.packages import importr
 
 import pandas as pd
 
@@ -86,5 +91,10 @@ def _call_r_script() -> None:
 
     cwd = getcwd()
     chdir(r_path)
+    # utils = rpackages.importr('utils')
+    # make sure lattice is installed
+
+    # utils.install_packages('Lattice', repos="https://cloud.r-project.org")
+
     call(['Rscript', '--no-save', _HORIZON_R_SCRIPT])
     chdir(cwd)

desktop/src/mmonitor/dashapp/apps/correlations.py

@@ -149,7 +149,7 @@ def _init_layout(self) -> None:
             "margin-right": "2rem",
             "padding": "2rem 1rem",
             'margin-bottom': '200px',
-            'font-size': '25px'
+            'font-size': '21px'
         }
 
         container = html.Div(

desktop/src/mmonitor/dashapp/apps/horizon.py

@@ -37,7 +37,7 @@ def __init__(self, sql: MMonitorDBInterface):
         self._init_callbacks()
 
     def _init_layout(self) -> None:
-        header = html.H1("Horizon plot of taxonomy abundances")
+        header = html.H1("Horizon plot built with sample abundances")
         width_label = html.Label('Width: ')
         width_input = dcc.Input(
             id='width-input',
@@ -50,23 +50,31 @@ def _init_layout(self) -> None:
         )
         confirm = html.Button(
             'Generate',
-            id='confirm',
-            style={'padding': '5px'}
+            id='confirm'
+
         )
         input_container = html.Div([
             width_label,
             width_input,
             height_label,
             height_input,
             confirm
-        ])
+        ], style={ "padding": "2rem 1rem", 'font-size': '12px'})
+
+        CONTENT_STYLE = {
+
+            "margin-right": "2rem",
+            "padding": "2rem 1rem",
+            'margin-bottom': '200px',
+            'font-size': '25px'
+        }
 
         image = html.Img(
             id='horizon-plot',
             alt='Please generate a Horizon Plot',
-            style={'display': 'block', 'margin-left': 'auto', 'margin-right': 'auto', 'padding': '20px'}
+            style={'display': 'block', 'margin-right': 'auto', 'padding': '20px', "max-width": "95%", "height": "auto"}
         )
-        container = html.Div([header, input_container, image])
+        container = html.Div([header, input_container, image],style=CONTENT_STYLE)
 
         self.layout = container
 

desktop/src/mmonitor/dashapp/apps/kegg.py

@@ -1,10 +1,10 @@
 import base64
 import glob
+from pathlib import Path
 
 import dash
 from dash import dcc
 from dash import html
-
 from mmonitor.dashapp.app import app
 from mmonitor.dashapp.base_app import BaseApp
 
@@ -28,26 +28,33 @@ def __init__(self):
 
     def _init_layout(self) -> None:
         self._static_image_route = "/static/"
-        self._samples = glob.glob("/Users/timolucas/PycharmProjects/MMonitor/desktop/src/resources/pipeline_out/*/")
-        print(self._samples)
-        header = html.H1("Functional mapping of annotated genomes to KEGG pathways")
-        print(self._samples)
+        base_path = Path(__file__)
+        base_path = Path(base_path.parent.absolute().parent.absolute().parent.absolute().parent.absolute())
+        self._samples = glob.glob(f"{base_path}/resources/pipeline_out/*/")
+        header = html.H1("KEGG pathways in metagenome")
         sample_dropdown = dcc.Dropdown(id="sample-dropdown", options=[{'label': t, 'value': t} for t in self._samples],
-                                       value=self._samples[0])
-        pathway_dropdown = dcc.Dropdown(id="pathway-dropdown")
+                                       value=self._samples[0],style={"max-width": "70%", "height": "auto"})
+
+        pathway_dropdown = dcc.Dropdown(id="pathway-dropdown",style={"max-width": "70%", "height": "auto"})
         dd = html.Div(id='dd-output-container')
 
-        dropdowns = html.Div(
-            [sample_dropdown, pathway_dropdown]
-        )
+        CONTENT_STYLE = {
+
+            "margin-right": "2rem",
+            "padding": "2rem 1rem",
+            'margin-bottom': '200px',
+            'font-size': '15px'
+        }
+
 
         image = html.Img(
             id='kegg-plot',
             alt='Please select a kegg plot',
-            style={'display': 'block', 'margin-left': 'auto', 'margin-right': 'auto', 'padding': '20px'}
-        )
+            style={'display': 'block', 'margin-right': 'auto', 'padding': '20px', "max-width": "99%", "height": "auto"})
+
+
 
-        container = html.Div([header, dropdowns, dd, image])
+        container = html.Div([header, sample_dropdown, pathway_dropdown, dd, image],style=CONTENT_STYLE)
 
         self._layout = container
 

desktop/src/mmonitor/dashapp/apps/taxonomy.py

@@ -29,7 +29,7 @@ def _init_layout(self) -> None:
         debugging purposes.
         """
 
-        maira_header = html.H1(children='Bioreactor taxonomy computed using Centrifuge')
+        maira_header = html.H1(children='Taxonomic composition')
 
         # dropdown menu to select chart type
         # initialize as stacked bar chart
@@ -40,11 +40,12 @@ def _init_layout(self) -> None:
                 {'label': 'Grouped Barchart', 'value': 'groupedbar'},
                 {'label': 'Area plot', 'value': 'area'},
                 {'label': 'Pie chart', 'value': 'pie'},
-                {'label': 'Scatter 3D', 'value': 'scatter3d'},
-            ],
-            value='stackedbar'
+                {'label': 'Scatter 3D', 'value': 'scatter3d'}],
+                    style={"max-width" : "50%", "height" : "auto"},
+                    value='stackedbar'
         )
 
+
         # graph elements
         graph1 = dcc.Graph(id='graph1', figure={'data': []})
         graph2 = dcc.Graph(id='graph2', figure={'data': []})
@@ -68,11 +69,19 @@ def _init_layout(self) -> None:
         )
 
         # data table for debugging
-        db_header = html.H4(children='SQLite Database')
+        db_header = html.H4(children="Database")
         data, columns = self._generate_table_data_cols()
         data_tb = dash_table.DataTable(id='table-correlations', data=data, columns=columns)
 
-        container = html.Div([maira_header, demo_dd, graph1, graph2, pie_chart_input, db_header, data_tb])
+        CONTENT_STYLE = {
+
+            "margin-right": "2rem",
+            "padding": "2rem 1rem",
+            'margin-bottom': '200px',
+            'font-size': '25px'
+        }
+
+        container = html.Div([maira_header, demo_dd, graph1, graph2, pie_chart_input, db_header, data_tb],style=CONTENT_STYLE)
         self.layout = container
 
     def _generate_table_data_cols(self, max_rows=40) -> Tuple[List[Any], List[Any]]:

desktop/src/mmonitor/dashapp/assets/bWLwgP.css

@@ -214,15 +214,15 @@
 html is set to 62.5% so that all the REM measurements throughout Skeleton
 are based on 10px sizing. So basically 1.5rem = 15px :) */
 html {
-    font-size: 62.5%;
+    font-size: 60%;
 }
 
 body {
     font-size: 1.5em; /* currently ems cause chrome bug misinterpreting rems on body element */
     line-height: 1.6;
-    font-weight: 400;
+    font-weight: 300;
     font-family: "Open Sans", "HelveticaNeue", "Helvetica Neue", Helvetica, Arial, sans-serif;
-    color: rgb(50, 50, 50);
+    color:   #444E57;
 }
 
 
@@ -235,14 +235,14 @@ h1, h2, h3, h4, h5, h6 {
 }
 
 h1 {
-    font-size: 4.5rem;
+    font-size: 3.5rem;
     line-height: 1.2;
     letter-spacing: -.1rem;
     margin-bottom: 2rem;
 }
 
 h2 {
-    font-size: 3.6rem;
+    font-size: 3.2rem;
     line-height: 1.25;
     letter-spacing: -.1rem;
     margin-bottom: 1.8rem;
@@ -296,17 +296,39 @@ blockquote {
     margin-left: 0rem;
 }
 
+/*
 
+# uni tuebingen colours
+        # #B22222 red
+        # #444E57 grey
+ */
 /* Links
 –––––––––––––––––––––––––––––––––––––––––––––––––– */
 a {
-    color: #1EAEDB;
-    text-decoration: underline;
-    cursor: pointer;
+    background-color: #444E57 ;
+    color: white;
+    padding: 14px 25px;
+    text-align: center;
+    text-decoration: none;
+    display: inline-block;
+}
+
+
+
+a:link {
+  background-color: #444E57;
+}
+
+a:visited {
+  background-color: #444E57;
 }
 
 a:hover {
-    color: #0FA0CE;
+  background-color: #B22222;
+}
+
+a:active {
+  background-color: #B22222;
 }
 
 

desktop/src/mmonitor/dashapp/index.py

@@ -34,6 +34,7 @@ def _init_apps(self) -> None:
             '/apps/taxonomy': {
                 'name': 'Taxonomy',
                 'app': taxonomy.Taxonomy(self._sql)
+
             },
 
             '/apps/horizon': {
@@ -63,7 +64,7 @@ def _init_layout(self) -> None:
 
         location = dcc.Location(id='url', refresh=False)
         navigation = html.Div([
-            dcc.Link(values['name'], href=url, style={'padding': '10px', 'font-size': "30px"})
+            dcc.Link(values['name'], href=url, style={'padding': '10px', 'font-size': "30px", "font-weight" : "bold",  "hover" : "#B22222:"})
             for url, values in self._apps.items()
         ], className="row")
         page_content = html.Div(id='page-content', children=[])

desktop/src/mmonitor/userside/view.py

@@ -99,29 +99,33 @@ def __init__(self):
 
     def init_layout(self):
 
-        self.root.geometry("350x250")
+        self.root.geometry("220x210")
         self.root.title("MMonitor v0.1.0 alpha")
-        self.root.resizable(width=False, height=True)
+        self.root.resizable(width=False, height=False)
         self.width = 20
         self.height = 1
         # create buttons
+
+        # uni tuebingen colours
+        # #B22222 red
+        # #444E57 grey
         tk.Button(self.root, text="Create Project", command=self.create_project,
-                  padx=10, pady=5, width=self.width, height=self.height, fg='black', bg='white').pack()
+                  padx=10, pady=5, width=self.width, height=self.height, fg='white', bg='#444E57').pack()
         tk.Button(self.root, text="Choose Project", command=self.choose_project,
-                  padx=10, pady=5, width=self.width, height=self.height, fg='black', bg='#254D25').pack()
+                  padx=10, pady=5, width=self.width, height=self.height, fg='white', bg='#444E57').pack()
         # tk.Button(self.root, text="Choose centrifuge index", command=self.choose_index,
         #           padx=10, pady=5, width=self.width,height=self.height, fg='white', bg='#254D25').pack()
         # # tk.Button(self.root, text="Analyze fastq in folder", command=self.analyze_fastq_in_folder,
         #           padx=10, pady=5, width=self.width,height=self.height, fg='white', bg='#254D25').pack()
         tk.Button(self.root, text="Add metadata from CSV", command=self.append_metadata,
-                  padx=10, pady=5, width=self.width, height=self.height, fg='black', bg='#254D25').pack()
+                  padx=10, pady=5, width=self.width, height=self.height, fg='white', bg='#444E57').pack()
         tk.Button(self.root, text="Run analysis pipeline", command=self.checkbox_popup,
-                  padx=10, pady=5, width=self.width, height=self.height, fg='black', bg='#254D25').pack()
+                  padx=10, pady=5, width=self.width, height=self.height, fg='white', bg='#444E57').pack()
 
         tk.Button(self.root, text="Start monitoring", command=self.start_monitoring,
-                  padx=10, pady=5, width=self.width, height=self.height, fg='black', bg='#254D25').pack()
+                  padx=10, pady=5, width=self.width, height=self.height, fg='white', bg='#444E57').pack()
         tk.Button(self.root, text="Quit",
-                  padx=10, pady=5, width=self.width, height=self.height, fg='black', bg='#254D25',
+                  padx=10, pady=5, width=self.width, height=self.height, fg='white', bg='#444E57',
                   command=self.stop_app).pack()
 
     def open_popup(self, text, title):