Merge branch 'main' into deployment

tnaccarato · Aug 14, 2024 · d096a95 · d096a95
2 parents cc9b7c7 + 061cd40
commit d096a95
Show file tree

Hide file tree

Showing 6 changed files with 29 additions and 24 deletions.
diff --git a/vis_phewas/som/views.py b/vis_phewas/som/views.py
@@ -443,15 +443,25 @@ def create_allele_features(row, alleles, allele_weight=5):
         # Sort the categories
         categories = sorted([category['category_string'] for category in categories])
 
+        # Decode filters to regular list
+        decoded_filters = urllib.parse.unquote(filters) if filters else None
+        decoded_filters = decoded_filters.split(" OR ") if decoded_filters else None
+        # Replace the "category_string:==:" part with empty string
+        cleaned_filters = [f.split(":==:")[-1] for f in decoded_filters] if decoded_filters else None
+
         # Prepare the context for the template
         context = {
             'graph_div': graph_div,
             'csv_path': f"{settings.MEDIA_URL}{file_name}",
             "type": "disease",
             "categories": categories,
             "filters": filters if filters is not None else categories,
-            "num_clusters": num_clusters
+            "num_clusters": num_clusters,
+            "cleaned_filters": cleaned_filters
         }
 
+        for field in context:
+            print(f"{field}: {context[field]}") if field != "graph_div" else None
+
         # Return the rendered HTML
         return render(request, 'som/som_view.html', context)
diff --git a/vis_phewas/static/base.css b/vis_phewas/static/base.css
@@ -19,4 +19,15 @@
 button{
   text-shadow: 1px 0 3px black;
   color: white; !important;
+}
+
+.btn-info.dataAction.btn {
+    background-color: #a043e1 !important;
+    border-color: #a043e1 !important;
+    border-radius: 20px !important;
+}
+
+.btn-info.dataAction.btn:hover {
+    background-color: #7a2cbf !important;
+    border-color: #7a2cbf !important;
 }
diff --git a/vis_phewas/static/mainapp/css/index.css b/vis_phewas/static/mainapp/css/index.css
@@ -36,7 +36,7 @@ html, body, .container-fluid {
     height: 100%;
     z-index: 1; /* Set a lower z-index to ensure it's below the options tab */
     position: relative; /* Ensure it follows the stacking context */
-    background-color: aliceblue;
+    background-color: #d4e9fb;
 }
 
 .right-column {

diff --git a/vis_phewas/templates/mainapp/index.html b/vis_phewas/templates/mainapp/index.html
@@ -33,7 +33,7 @@
                         <button class="button btn btn-success applyFilters" onclick="applyFilters()">
                             Apply Filters
                         </button>
-                        <button class="button btn btn-info exportQuery" style="color: white" onclick="exportQuery()">
+                        <button class="button btn btn-info dataAction exportQuery" style="color: white" onclick="exportQuery()">
                             Export Filtered Data
                         </button>
                     </div>

diff --git a/vis_phewas/templates/mainapp/tools.html b/vis_phewas/templates/mainapp/tools.html
@@ -18,8 +18,8 @@ <h4>Resolution</h4>
 
     <div id="som_options" style="align-items: center; display: flex; flex-direction: column">
         <h4>Generate SOM for Disease Clustering</h4>
-        <button class="button btn btn-info exportQuery" onclick="generateSOM('', 'disease', 5)" style="color: white">Generate Disease SOM</button>
-        <button class="button btn btn-info exportQuery" onclick="generateSOM('', 'allele', 7)" style="color: white">Generate Allele SOM</button>
+        <button class="button btn btn-info dataAction" onclick="generateSOM('', 'disease', 5)" style="color: white; margin-bottom: 1%">Generate Disease SOM</button>
+        <button class="button btn btn-info dataAction" onclick="generateSOM('', 'allele', 7)" style="color: white;">Generate Allele SOM</button>
     </div>
 </div>
 
diff --git a/vis_phewas/templates/som/som_view.html b/vis_phewas/templates/som/som_view.html
@@ -36,7 +36,7 @@ <h2 style="align-self: center">Filter by Disease Category</h2>
                     <div class="checkbox-container">
                         {% for category in categories %}
                             <input type="checkbox" id="{{ category }}" name="filters" value="{{ category }}"
-                                    {% if category in filters %} checked {% endif %}>
+                                    {% if category in cleaned_filters %} checked {% endif %}>
                             <!-- Check the checkbox if it is in the selected filters -->
                             <label for="{{ category }}">{{ category }}</label>
                         {% endfor %}
@@ -53,11 +53,11 @@ <h2 style="align-self: center">Filter by Disease Category</h2>
             <div style="display: flex;flex-direction: row;justify-content: space-around;margin-top: 10px;">
 
                 <!-- Add a button to submit the form -->
-                <button type="submit" class="button btn btn-success" style="align-self: normal;">
+                <button type="submit" class="button btn btn-success" style="align-self: normal; border-radius: 20px">
                     Generate SOM with Selection
                 </button>
                 <!-- Add a button to download the cluster results CSV -->
-                <button class="button btn btn-info" type="button">
+                <button class="btn btn-info dataAction" type="button">
                     <a style="text-decoration: none;color: whitesmoke;text-shadow: 1px 0 3px black;" href="{{ csv_path }}" download="cluster_results.csv">Download Cluster Results CSV</a>
                 </button>
             </div>
@@ -86,22 +86,6 @@ <h2 style="align-self: center">Filter by Disease Category</h2>
             return encodeURIComponent(joinedFilters);
         }
 
-        // Function to load selected filters from localStorage on page load
-        function loadSelectedFilters() {
-            const selectedFilters = JSON.parse(localStorage.getItem('selectedFilters'));
-            if (selectedFilters) {
-                selectedFilters.forEach((filter) => {
-                    const category = filter.replace('category_string:==:', '');
-                    const checkbox = document.getElementById(category);
-                    if (checkbox) {
-                        checkbox.checked = true;
-                    }
-                });
-            }
-        }
-
-        // Call the function to load selected filters on page load
-        document.addEventListener('DOMContentLoaded', loadSelectedFilters);
 
         // Function to handle form submission
         function handleSubmit(event) {