From 3ef480805c375e86aa9c8fcf0080cf1797810252 Mon Sep 17 00:00:00 2001
From: Neda Taherifar <n.taherifar@gmail.com>
Date: Wed, 26 Jun 2024 11:40:57 +0800
Subject: [PATCH] Fix issue with semantic linking visualization

---
 .../assets/js/jstree-view-module.js           | 23 +++++++-
 .../js/parent-sample-selector-module.js       | 58 ++++++++++---------
 .../igsn_theme/sample_repository_schema.yaml  |  5 --
 .../package/snippets/sample_family_info.html  | 51 ++++++++--------
 .../form_snippets/sample_parent_field.html    | 12 ++--
 5 files changed, 85 insertions(+), 64 deletions(-)

diff --git a/ckan/src/ckanext-igsn-theme/ckanext/igsn_theme/assets/js/jstree-view-module.js b/ckan/src/ckanext-igsn-theme/ckanext/igsn_theme/assets/js/jstree-view-module.js
index 7aa61e0e..c4e4cc60 100644
--- a/ckan/src/ckanext-igsn-theme/ckanext/igsn_theme/assets/js/jstree-view-module.js
+++ b/ckan/src/ckanext-igsn-theme/ckanext/igsn_theme/assets/js/jstree-view-module.js
@@ -9,12 +9,16 @@ this.ckan.module('jstree-view-module', function (jquery) {
             var id = this.el.attr('data-id');
             var title = this.el.attr('data-title');
 
+            var truncatedTitle = self.truncateText(title, 20); 
+
             var data = [{
-                "text": title,
+                "text": truncatedTitle,
                 "id": id,
                 "state": {
                     "opened": true
-                }
+                },
+                "a_attr": { "title": title }
+
             }];
 
             $('#tree').jstree({
@@ -46,6 +50,7 @@ this.ckan.module('jstree-view-module', function (jquery) {
             
             $('#tree').on("dblclick", ".jstree-anchor", function (e) {
                 var href = $(this).attr('href');
+                console.log(href);
                 if (href) {
                     e.preventDefault();
                     window.location.href = href;
@@ -84,7 +89,8 @@ this.ckan.module('jstree-view-module', function (jquery) {
         createChildProcessor: function (packageId) {
             var childrenCount;
             var checkedChildren = [];
-
+            var self = this;
+            
             function verifyChild(child) {
                 $.ajax({
                     url: '/api/3/action/package_show',
@@ -107,6 +113,8 @@ this.ckan.module('jstree-view-module', function (jquery) {
                 if (--childrenCount === 0) {
                     if (checkedChildren.length > 0) {
                         checkedChildren.forEach(function (validChild) {
+                            validChild.a_attr = Object.assign({}, validChild.a_attr, { "title": validChild.text });
+                            validChild.text = self.truncateText(validChild.text, 20); 
                             $('#tree').jstree(true).create_node(packageId, validChild, "last");
                             $('#tree').jstree(true).open_node(packageId);
                         });
@@ -129,6 +137,15 @@ this.ckan.module('jstree-view-module', function (jquery) {
                     });
                 }
             };
+        },
+        
+        truncateText: function (text, maxLength) {
+            if (text.length <= maxLength) {
+                return text;
+            }
+            var startText = text.slice(0, Math.ceil(maxLength / 2));
+            var endText = text.slice(-Math.floor(maxLength / 2));
+            return startText + '...' + endText;
         }
     }
 
diff --git a/ckan/src/ckanext-igsn-theme/ckanext/igsn_theme/assets/js/parent-sample-selector-module.js b/ckan/src/ckanext-igsn-theme/ckanext/igsn_theme/assets/js/parent-sample-selector-module.js
index 972f279b..bad28dff 100644
--- a/ckan/src/ckanext-igsn-theme/ckanext/igsn_theme/assets/js/parent-sample-selector-module.js
+++ b/ckan/src/ckanext-igsn-theme/ckanext/igsn_theme/assets/js/parent-sample-selector-module.js
@@ -1,7 +1,6 @@
 this.ckan.module('parent-sample-selector-module', function ($, _) {
   return {
     initialize: function () {
-      this.textInputElement = $('#field-parent-name');
       this.inputElement = $('#field-parent');
       this.initializeSelect2();
       this.prepopulateSelect2();
@@ -10,57 +9,62 @@ this.ckan.module('parent-sample-selector-module', function ($, _) {
     initializeSelect2: function () {
       var self = this;
       this.org_id = this.options.group;
+      console.log(self.org_id);
       this.inputElement.select2({
         placeholder: "Select Parent of Sample",
         minimumInputLength: 0,
         ajax: {
-          url: '/api/3/action/package_search',
+          url: '/api/3/action/organization_show',
+          type: 'GET', 
           dataType: 'json',
           quietMillis: 500,
-          data: function (term, page) {
+          data: function (params) {
+            self.searchTerm = params || '';
             return {
-              q: term,
-              include_private: true,
-              fq: 'owner_org:' + self.org_id // filter query for organization id
+              id: self.org_id,
+              include_datasets: 'true'
             };
           },
-          results: function (data, page) {
+          processResults: function (data) {
             if (!data.success) {
               return { results: [] };
             }
+            var searchTerm = self.searchTerm.toLowerCase();
+            var filteredResults = data.result.packages.filter(function (item) {
+              return item.title.toLowerCase().includes(searchTerm);
+            });
             return {
-              results: data.result.results.map(function (item) {
+              results: filteredResults.map(function (item) {
                 return { id: item.id, text: item.title };
               })
             };
           },
           cache: true
         },
-        formatResult: function (item) { return item.text; },
-        formatSelection: function (item) { return item.text; },
+        templateResult: function (item) { return item.text; },
+        templateSelection: function (item) { return item.text; },
         dropdownCssClass: "bigdrop",
-        escapeMarkup: function (m) { return m; } // we do not want to escape markup since we are displaying html in results
-      }).on("change", function (e) {
-        self.updateDependentFields();
-      });
-    },
-    updateDependentFields: function () {
-      var self = this;
-
-      var selectedData = self.inputElement.select2('data');
-      if (selectedData) {
-        self.textInputElement.val(selectedData.text);
-      }
+        escapeMarkup: function (m) { return m; } 
+      })
     },
 
     prepopulateSelect2: function () {
       var self = this;
       var existingId = this.inputElement.val();
-      var existingText = this.textInputElement.val(); // Assuming you store the selected text in data attribute
-
-      if (existingId && existingText) {
-        var dataForSelect2 = { id: existingId, text: existingText };
-        self.inputElement.select2('data', dataForSelect2, true);
+      if (existingId) {
+        $.ajax({
+          url: '/api/3/action/package_show',
+          data: { id: existingId },
+          type: 'GET',
+          dataType: 'json',
+          success: function (data) {
+            if (data.success && data.result) {
+              var item = data.result;
+              var dataForSelect2 = new Option(item.title, item.id, true, true);
+              self.inputElement.select2('data', dataForSelect2, true);
+            }
+          }
+        });
       }
     }
   };
diff --git a/ckan/src/ckanext-igsn-theme/ckanext/igsn_theme/sample_repository_schema.yaml b/ckan/src/ckanext-igsn-theme/ckanext/igsn_theme/sample_repository_schema.yaml
index 5f940975..16e7db81 100644
--- a/ckan/src/ckanext-igsn-theme/ckanext/igsn_theme/sample_repository_schema.yaml
+++ b/ckan/src/ckanext-igsn-theme/ckanext/igsn_theme/sample_repository_schema.yaml
@@ -41,11 +41,6 @@ dataset_fields:
   help_text: Select the parent sample from existing samples.
   groupBy: About Sample
 
-- field_name: parent-name
-  form_snippet: hidden_field.html
-  display_snippet: null
-  groupBy: About Sample
-
 - field_name: author
   label: Authors
   preset: composite_repeating
diff --git a/ckan/src/ckanext-igsn-theme/ckanext/igsn_theme/templates/package/snippets/sample_family_info.html b/ckan/src/ckanext-igsn-theme/ckanext/igsn_theme/templates/package/snippets/sample_family_info.html
index 6822e5d2..6743531a 100644
--- a/ckan/src/ckanext-igsn-theme/ckanext/igsn_theme/templates/package/snippets/sample_family_info.html
+++ b/ckan/src/ckanext-igsn-theme/ckanext/igsn_theme/templates/package/snippets/sample_family_info.html
@@ -4,22 +4,11 @@ <h2 class="module-heading"><i class="fa fa-sitemap"></i> Sample Family</h2>
   <div data-module="jstree-view-module" data-id="{{ pkg.id }}" data-title="{{ pkg.title }}">
     <div id="tree"></div>
   </div>
-
 </div>
 {% endblock %}
 
 <style>
-  #tree .jstree-anchor {
-    white-space: nowrap;
-    overflow: hidden;
-    text-overflow: ellipsis;
-    display: inline-block;
-    max-width: calc(100% - 24px);
-    vertical-align: middle;
-    box-sizing: border-box;
-  }
-
-  #tree .jstree-node {
+  .tree-item {
     white-space: nowrap;
     overflow: hidden;
     text-overflow: ellipsis;
@@ -29,11 +18,6 @@ <h2 class="module-heading"><i class="fa fa-sitemap"></i> Sample Family</h2>
     box-sizing: border-box;
   }
 
-  #tree .jstree-wholerow {
-    display: none;
-  }
-
-
   .jstree-wholerow-ul {
     position: relative;
     display: inline-block;
@@ -41,23 +25,44 @@ <h2 class="module-heading"><i class="fa fa-sitemap"></i> Sample Family</h2>
     padding-top: 10px;
   }
 
-  #tree .jstree-ocl {
-    margin-right: 0px;
-  }
-
   .jstree-ocl::before {
     content: "\f0da";
     font-family: "FontAwesome";
     font-weight: 900;
     font-style: normal;
-
   }
 
-  .jstree-open>.jstree-ocl::before {
+  .jstree-open > .jstree-ocl::before {
     content: "\f0d7";
     font-family: "FontAwesome";
     font-weight: 900;
     font-style: normal;
+  }
+
+  .tooltip {
+    position: relative;
+    display: inline-block;
+  }
+
+  .tooltip .tooltiptext {
+    visibility: hidden;
+    width: 120px;
+    background-color: black;
+    color: #fff;
+    text-align: center;
+    border-radius: 6px;
+    padding: 5px;
+    position: absolute;
+    z-index: 1;
+    bottom: 125%;
+    left: 50%;
+    margin-left: -60px;
+    opacity: 0;
+    transition: opacity 0.3s;
+  }
 
+  .tooltip:hover .tooltiptext {
+    visibility: visible;
+    opacity: 1;
   }
 </style>
\ No newline at end of file
diff --git a/ckan/src/ckanext-igsn-theme/ckanext/igsn_theme/templates/scheming/form_snippets/sample_parent_field.html b/ckan/src/ckanext-igsn-theme/ckanext/igsn_theme/templates/scheming/form_snippets/sample_parent_field.html
index ba1ae28f..69d577c1 100644
--- a/ckan/src/ckanext-igsn-theme/ckanext/igsn_theme/templates/scheming/form_snippets/sample_parent_field.html
+++ b/ckan/src/ckanext-igsn-theme/ckanext/igsn_theme/templates/scheming/form_snippets/sample_parent_field.html
@@ -1,11 +1,11 @@
 <div 
-    data-module="parent-sample-selector-module"  
-    {% if data.get('organization', {}).get('id') %}
-        data-module-group="{{ data['organization']['id'] }}"
+    data-module="parent-sample-selector-module"    
+    {% if data.get('owner_org') %}
+        data-module-group="{{ data['owner_org'] }}"
     {% else %}
-        data-module-group="{{ data['group'] }}"
-    {% endif %} 
-    
+        data-module-group="{{ data['group_id'] }}"
+    {% endif %}
+
     class="form-group" id="parent">
     
     <label class="form-label" for="field-parent">Parent Sample</label>