PW interactions

templates/actions/objects/pathway.html

@@ -22,7 +22,7 @@
   {% for tpl in action_button_templates %}
     {% include tpl %}
   {% endfor %}
-  <li role="separator" class="divider"></li>
+  <li role="separator" class="divider h-px"></li>
 {% endif %}
 <li>
   <a
@@ -74,7 +74,7 @@
       Rules</a
     >
   </li>
-  <li role="separator" class="divider"></li>
+  <li role="separator" class="divider h-px"></li>
   <li>
     <a
       class="button"
@@ -99,11 +99,16 @@
       <i class="glyphicon glyphicon-plus"></i> Set Aliases</a
     >
   </li>
-  <li role="separator" class="divider"></li>
+  <li role="separator" class="divider h-px"></li>
   <li>
     <a
       class="button"
-      onclick="document.getElementById('delete_pathway_node_modal').showModal(); return false;"
+      onclick="
+      const modal = document.getElementById('delete_pathway_node_modal');
+      modal.showModal();
+      window.dispatchEvent(new Event('modal-opened'));
+      return false;
+      "
     >
       <i class="glyphicon glyphicon-trash"></i> Delete Compound</a
     >
@@ -111,7 +116,12 @@
   <li>
     <a
       class="button"
-      onclick="document.getElementById('delete_pathway_edge_modal').showModal(); return false;"
+      onclick="
+      const modal = document.getElementById('delete_pathway_edge_modal');
+      modal.showModal();
+      window.dispatchEvent(new Event('modal-opened'));
+      return false;
+      "
     >
       <i class="glyphicon glyphicon-trash"></i> Delete Reaction</a
     >

templates/modals/collections/new_prediction_setting_modal.html

@@ -203,11 +203,11 @@
               id="model-based-prediction-setting-threshold"
               name="model-based-prediction-setting-threshold"
               class="input input-bordered w-full"
-              placeholder="0.25"
+              value="0.25"
               type="number"
               min="0"
               max="1"
-              step="0.05"
+              step="any"
             />
           </div>
 

templates/modals/objects/delete_pathway_edge_modal.html

@@ -4,6 +4,25 @@
   id="delete_pathway_edge_modal"
   class="modal"
   x-data="modalForm({ state: { selectedEdge: '', imageUrl: '' } })"
+  @modal-opened.window="
+   const links = d3.selectAll('line.highlighted');
+  console.log(links);
+   if (!links.empty()) {
+        const el = links.node();
+        const selectElement = document.getElementById('delete_pathway_edge_edges');
+        console.log(el);
+        console.log(el.__data__);
+        for (let option of selectElement.options) {
+            if (option.value === el.__data__.url) {
+                option.selected = true;
+                break;
+            }
+        }
+
+        selectElement.dispatchEvent(new Event('change'));
+
+   }
+  "
   @close="reset()"
 >
   <div class="modal-box">

templates/modals/objects/delete_pathway_node_modal.html

@@ -4,6 +4,22 @@
   id="delete_pathway_node_modal"
   class="modal"
   x-data="modalForm({ state: { selectedNode: '', imageUrl: '' } })"
+  @modal-opened.window="
+   const el = d3.select('circle.highlighted').node();
+
+   if (el !== null) {
+    const selectElement = document.getElementById('delete_pathway_node_nodes');
+
+    for (let option of selectElement.options) {
+        if (option.value === el.__data__.url) {
+            option.selected = true;
+            break;
+        }
+    }
+
+    selectElement.dispatchEvent(new Event('change'));
+   }
+  "
   @close="reset()"
 >
   <div class="modal-box">

templates/objects/pathway.html

@@ -106,12 +106,12 @@
     </div>
 
     <!-- Graphical Representation -->
-    <div class="collapse-arrow bg-base-200 collapse">
+    <div class="collapse-arrow bg-base-200 collapse overflow-y-auto">
       <input type="checkbox" checked />
       <div class="collapse-title text-xl font-medium">
         Graphical Representation
       </div>
-      <div class="collapse-content">
+      <div class="collapse-content ">
         <div class="bg-base-100 mb-2 rounded-lg p-2">
           <div class="navbar bg-base-100 rounded-lg">
             <div class="flex-1">
@@ -140,7 +140,7 @@
                 </div>
                 <ul
                   tabindex="0"
-                  class="dropdown-content menu bg-base-100 rounded-box z-50 w-52 p-2"
+                  class="dropdown-content menu bg-base-100 rounded-box z-50 w-96 p-2"
                 >
                   {% include "actions/objects/pathway.html" %}
                 </ul>