Add contributor option and formattingHEADmaster

Adding new option to the data plots, to select
the amount of contributors that are shown on the four
contributor related plots.

Extra formatting of other python files.

Change-Id: Id4935efa197142ad36ae3fb5031919944add498d
Reviewed-by: Cristian Maureira-Fredes <cristian.maureira-fredes@qt.io>

5 files changed, 59 insertions, 26 deletions

diff --git a/app.py b/app.py
index ddae7e1..605c2a7 100644
--- a/app.py
+++ b/app.py
@@ -11,16 +11,19 @@ from pathlib import Path
 import pandas as pd
 from dash import Dash, Input, Output, callback, dcc, html
 
-from data_utils import (download_data, get_collab_chart_data,
-                        get_commit_chart_data, get_domain_chart_data,
-                        get_ranking_chart_data)
-from web_utils import (get_column, get_filter, get_header,
-                       get_file_content, get_services_status)
+from data_utils import (
+    download_data,
+    get_collab_chart_data,
+    get_commit_chart_data,
+    get_domain_chart_data,
+    get_ranking_chart_data,
+)
+from web_utils import get_column, get_filter, get_header, get_file_content, get_services_status
 
 from quips_utils import resolve_quips_url, get_quip_html, get_quip_number
 
 # Main application
-app = Dash(__name__)
+app = Dash(__name__, suppress_callback_exceptions=True)
 server = app.server
 app.title = "The Qt Project"
 
@@ -38,10 +41,11 @@ app.title = "The Qt Project"
     [
         Input("module-filter", "value"),
         Input("year-filter", "value"),
+        Input("contributors-filter", "value"),
         Input("tqtc-filter", "value"),
     ],
 )
-def update_charts(module, year, tqtc):
+def update_charts(module, year, contributors, tqtc):
     """
     This function is in charge of updating the data for all the charts,
     and the connection is done by the chart-id from each.
@@ -57,10 +61,10 @@ def update_charts(module, year, tqtc):
 
     commit_data = get_commit_chart_data(df)
     collab_data = get_collab_chart_data(df)
-    files_changed_data = get_ranking_chart_data(df, column="files_changed")
-    commit_count_data = get_ranking_chart_data(df, column="commit_count")
-    insertions_data = get_ranking_chart_data(df, column="insertions")
-    deletions_data = get_ranking_chart_data(df, column="deletions")
+    files_changed_data = get_ranking_chart_data(df, top=contributors, column="files_changed")
+    commit_count_data = get_ranking_chart_data(df, top=contributors, column="commit_count")
+    insertions_data = get_ranking_chart_data(df, top=contributors, column="insertions")
+    deletions_data = get_ranking_chart_data(df, top=contributors, column="deletions")
     domain_data = get_domain_chart_data(df)
 
     return (
@@ -298,7 +302,9 @@ page_data_layout = html.Div(
 )
 
 QUIPS_HTML_DIR = Path("../quipshtml/")
-page_quip_layout = {get_quip_number(str(f)): get_quip_html(f) for f in QUIPS_HTML_DIR.glob("quip-*.html")}
+page_quip_layout = {
+    get_quip_number(str(f)): get_quip_html(f) for f in QUIPS_HTML_DIR.glob("quip-*.html")
+}
 
 page_guidelines_layout = html.Div(
     [
@@ -335,7 +341,6 @@ page_guidelines_layout = html.Div(
 )
 
 
-
 @callback(Output("page-content", "children"), [Input("url", "pathname")])
 def display_page(pathname):
     if pathname == "/data":
diff --git a/assets/style.css b/assets/style.css
index de08a11..2626437 100644
--- a/assets/style.css
+++ b/assets/style.css
@@ -24,6 +24,7 @@ h3 {
 h4 {
     font-size: 20px;
     margin: 0px;
+    margin-top: 10px;
     color: #222840;
     text-align: left;
     padding-left: 20px;
@@ -107,7 +108,6 @@ p {
 }
 
 .Select-control {
-    width: 220px;
     height: 38px;
 }
 
@@ -129,6 +129,11 @@ p {
 .dash-dropdown {
     display: inline-block;
     vertical-align: middle;
+    width: 80%;
+}
+
+.input-number {
+    width: 80%;
 }
 
 .tqtc-filter {
diff --git a/data_utils.py b/data_utils.py
index c52f09f..7bbb62c 100644
--- a/data_utils.py
+++ b/data_utils.py
@@ -60,7 +60,7 @@ def get_domain_chart_data(df):
         ],
         "layout": {
             "title": "Commits per email domain",
-            "height": "350",
+            "height": "400",
             "padding": {
                 "r": "150",
             },
@@ -68,14 +68,13 @@ def get_domain_chart_data(df):
     }
 
 
-def get_ranking_chart_data(df, column="commit_count"):
-    TOP = 10
+def get_ranking_chart_data(df, top=10, column="commit_count"):
     d4 = (
         df.groupby("name")
         .agg({"name": "count", "files_changed": "sum", "insertions": "sum", "deletions": "sum"})
         .rename(columns={"name": "commit_count"})
     )
-    d4 = d4.sort_values(by=column, ascending=False)[:TOP]
+    d4 = d4.sort_values(by=column, ascending=False)[:top]
     d4 = d4.reset_index()
     d4["name"] = d4["name"].apply(partially_hide)
     d4 = d4.iloc[::-1]
@@ -136,7 +135,7 @@ def get_commit_chart_data(df):
         ],
         "layout": {
             "title": "Number of commits",
-            "height": "300",
+            "height": "400",
             "xaxis": {"tickangle": "45"},
         },
     }
@@ -158,7 +157,7 @@ def get_collab_chart_data(df):
         ],
         "layout": {
             "title": "Number of contributors",
-            "height": "300",
+            "height": "400",
             "xaxis": {"tickangle": "45"},
         },
     }
diff --git a/quips_utils.py b/quips_utils.py
index a5a4ec6..aaf1b7a 100644
--- a/quips_utils.py
+++ b/quips_utils.py
@@ -10,9 +10,11 @@ from dash import dcc, html
 from web_utils import get_header, get_column, get_file_content
 import dash_dangerously_set_inner_html
 
+
 def get_quip_number(s):
     return int(re.findall("\d{4}", s)[0])
 
+
 def replace_quip_url(s):
     # quip-0001.html -> /quips/1
     quip_links = re.findall("quip-\d{4}-?[\w-]*.html", s)
@@ -30,6 +32,7 @@ def replace_quip_url(s):
 def get_quips_index():
     return """index"""
 
+
 def get_html_content(fname):
     content = ""
     with open(fname) as f:
@@ -38,6 +41,7 @@ def get_html_content(fname):
     content = replace_quip_url(content)
     return content
 
+
 def get_quip_html(html_file):
     return html.Div(
         [
@@ -60,6 +64,7 @@ def get_quip_html(html_file):
         ]
     )
 
+
 def get_quip_layout_from_file(quip_file):
     if not Path(quip_file).exists():
         raise Exception(f"File '{quip_file}' do not exist")
@@ -76,11 +81,11 @@ def get_quip_layout_from_file(quip_file):
                 children=[
                     get_column(
                         divs=[get_quips_index()],
-                        columns_number = "three",
+                        columns_number="three",
                     ),
                     get_column(
                         divs=[get_file_content(quip_file)],
-                        columns_number = "seven",
+                        columns_number="seven",
                     ),
                 ],
                 className="row justify-center",
@@ -88,6 +93,7 @@ def get_quip_layout_from_file(quip_file):
         ]
     )
 
+
 def resolve_quips_url(numbers, pathname):
     if not pathname.startswith("/quips/"):
         return False
@@ -102,4 +108,3 @@ def resolve_quips_url(numbers, pathname):
         return False
 
     return True
-
diff --git a/web_utils.py b/web_utils.py
index d90f353..073076f 100644
--- a/web_utils.py
+++ b/web_utils.py
@@ -18,7 +18,9 @@ def get_header():
             html.Div(
                 children=[
                     html.A(
-                        children=[html.Img(src="assets/theqtproject.png", className="header-logo")],
+                        children=[
+                            html.Img(src="/assets/theqtproject.png", className="header-logo")
+                        ],
                         href="https://contribute.qt-project.org",
                     ),
                 ],
@@ -175,7 +177,7 @@ def get_filter(modules, years):
                         className="tqtc-filter",
                     ),
                 ],
-                className="six columns",
+                className="five columns",
             ),
             html.Div(
                 children=[
@@ -192,7 +194,24 @@ def get_filter(modules, years):
                         ],
                     ),
                 ],
-                className="six columns",
+                className="three columns",
+            ),
+            html.Div(
+                children=[
+                    html.Div(
+                        children=[
+                            html.Div(children="Contributors", className="menu-title"),
+                            dcc.Input(
+                                id="contributors-filter",
+                                value=10,
+                                min=5,
+                                type="number",
+                                className="input-number",
+                            ),
+                        ],
+                    ),
+                ],
+                className="three columns",
             ),
         ],
         className="row card option-select",