Adding "view displays" to table view (#895)

IGS · Sep 23, 2024 · 9863670 · 9863670
1 parent 29932b0
commit 9863670
Show file tree

Hide file tree

Showing 3 changed files with 37 additions and 17 deletions.
diff --git a/www/cgi/add_display_to_layout.cgi b/www/cgi/add_display_to_layout.cgi
@@ -27,6 +27,12 @@ def main():
 
     user = geardb.get_user_from_session_id(session_id)
     layout = geardb.get_layout_by_share_id(share_id)
+
+    if layout is None:
+        result['error'] = "Layout not found"
+        print(json.dumps(result))
+        return
+
     layout.load()
 
     if user is None:
@@ -84,8 +90,13 @@ def main():
             if col_to_insert > 12:
                 # get grid height of the last row, first start column
                 # Want to ensure that the new row starts below the span of the previous row
-                grid_height = [m.grid_height for m in members_to_use if m.start_row == row_to_insert and m.start_col == 1][0]
-                row_to_insert += grid_height
+                # However, if there are no start_col = 1 members, then we can start at the "row_to_insert" value
+
+                start_col_grid_heights = [m.grid_height for m in members_to_use if m.start_row == row_to_insert and m.start_col == 1]
+                if len(start_col_grid_heights) > 0:
+                    grid_height = start_col_grid_heights[0]
+                    row_to_insert += grid_height
+
                 col_to_insert = 1
 
         if user.id == layout.user_id:

diff --git a/www/dataset_explorer.html b/www/dataset_explorer.html
@@ -273,6 +273,7 @@
                             <table id="results-table" class="table is-narrow is-striped is-fullwidth">
                                 <thead>
                                     <tr>
+                                        <th></th>
                                         <th>Title</th>
                                         <th>Visibility</th>
                                         <th>Organism</th>
@@ -284,6 +285,11 @@
                                 <tbody>
                                     <template id="results-table-view">
                                         <tr>
+                                            <td class="js-table-view-displays">
+                                                <button class="button is-small is-dark js-view-displays" data-tooltip-content="View, add or remove displays from current collection">
+                                                    <span class="icon"><i class="mdi mdi-24px mdi-plus-minus-variant"></i></span>
+                                                </button>
+                                            </td>
                                             <td class="js-display-title"></td>
                                             <td class="js-display-visibility"></td>
                                             <td class="js-display-organism"></td>

diff --git a/www/js/dataset_explorer.js b/www/js/dataset_explorer.js
@@ -1818,6 +1818,7 @@ const processSearchResults = (data) => {
 
         // Set properties for multiple elements
         // TODO: Truncate titles with tooltip for full title
+        setElementProperties(tableResultsView, ".js-view-displays", { dataset: { datasetId, title: label, isPublic } });
         setElementProperties(tableResultsView, ".js-display-title", { id: `${resultDatasetId}-table-title`, textContent: label });
         setElementProperties(tableResultsView, ".js-display-visibility", { id: `${resultDatasetId}-table-visibility` });
         setElementProperties(tableResultsView, ".js-display-organism", { id: `${resultDatasetId}-table-organism`, textContent: organism });
@@ -2005,6 +2006,23 @@ const processSearchResults = (data) => {
         applyTooltip(classElt, createActionTooltips(classElt), "bottom");
     }
 
+    // Normally this is done in the datasetCollectionCallback but we also need it when searching
+    // to ensure the table-view button is shown/hid when filters are applied
+    let collection = null;
+    try {
+        collection = flatDatasetCollectionData.find((collection) => collection.share_id === selected_dc_share_id);
+    } catch (error) {
+        // pass
+    }
+    const viewDisplayButtons = document.getElementsByClassName("js-view-displays");
+    for (const classElt of viewDisplayButtons) {
+        disableAndHideElement(classElt);
+        if (collection?.is_owner) {
+            enableAndShowElement(classElt);
+        }
+    }
+
+
     // Hide/Remove some buttons if user is not owner
     updateDatasetListButtons();
 
@@ -2763,21 +2781,6 @@ const handlePageSpecificLoginUIUpdates = async (event) => {
     initializeDatasetCollectionSelection();
     document.getElementById("dropdown-dc").classList.remove("is-right");    // Cannot see the dropdown if it is right aligned
 
-    // Normally this is done in the datasetCollectionCallback but we need to wait for the search to complete.
-    let collection = null;
-    try {
-        collection = flatDatasetCollectionData.find((collection) => collection.share_id === selected_dc_share_id);
-    } catch (error) {
-        // pass
-    }
-    const viewDisplayButtons = document.getElementsByClassName("js-view-displays");
-    for (const classElt of viewDisplayButtons) {
-        disableAndHideElement(classElt);
-        if (collection?.is_owner) {
-            enableAndShowElement(classElt);
-        }
-    }
-
     // Settings for selected facets
     for (const elt of document.querySelectorAll("ul.js-expandable-target li")) {
         elt.addEventListener("click", async (e) => {