From 0d30cd4baffdfe428ce4d8c5cf272bb6bd475aab Mon Sep 17 00:00:00 2001
From: pkupczyk <piotr.kupczyk@id.ethz.ch>
Date: Thu, 17 Feb 2022 14:48:56 +0100
Subject: [PATCH] SSDM-12218 : ELN : Tables Improvements for Rich Text Content
- fix a problem with project and experiment related grids that can be hidden
via "More..." menu and could not be measured properly because they were using
"display:none" + add a safety measure and set max-height to rich text
properties to prevent taking too much space in case of potential future
incorrect measurements
---
.../webapps/eln-lims/html/js/util/FormUtil.js | 18 +++++---
.../ExperimentForm/ExperimentFormView.js | 25 ++++++-----
.../js/views/ProjectForm/ProjectFormView.js | 45 +++++++++++--------
3 files changed, 51 insertions(+), 37 deletions(-)
diff --git a/openbis_standard_technologies/dist/core-plugins/eln-lims/1/as/webapps/eln-lims/html/js/util/FormUtil.js b/openbis_standard_technologies/dist/core-plugins/eln-lims/1/as/webapps/eln-lims/html/js/util/FormUtil.js
index 4b9b9d9f848..0e49f11cf9f 100644
--- a/openbis_standard_technologies/dist/core-plugins/eln-lims/1/as/webapps/eln-lims/html/js/util/FormUtil.js
+++ b/openbis_standard_technologies/dist/core-plugins/eln-lims/1/as/webapps/eln-lims/html/js/util/FormUtil.js
@@ -1290,8 +1290,13 @@ var FormUtil = new function() {
shown = ! profile.hideSectionsByDefault;
}
}
+
var $section = $(option.section);
+ if(shown && option.beforeShowingAction) {
+ option.beforeShowingAction();
+ }
$section.toggle(shown);
+
var $label = $("<span>").append((shown ? "Hide " : "Show ") + option.label);
var id = 'options-menu-btn-' + _this.prepareId(option.label).toLowerCase();
var $dropdownElement = $("<li>", { 'role' : 'presentation' }).append($("<a>", { 'id' : id }).append($label));
@@ -1301,6 +1306,9 @@ var FormUtil = new function() {
var $section = event.data.section;
$section.toggle(300, function() {
if ($section.css("display") === "none") {
+ if (option.afterHidingAction) {
+ option.afterHidingAction();
+ }
$label.text("Show " + option.label);
sectionsSettings[option.label] = "hidden";
} else {
@@ -2286,6 +2294,8 @@ var FormUtil = new function() {
this.renderTruncatedGridValue = function(container, value){
var $value = $("<div>")
+ $value.css("max-height", "100px")
+ $value.css("overflow", "hidden")
if(_.isString(value)){
$value.text(value)
@@ -2300,16 +2310,11 @@ var FormUtil = new function() {
}
$value.css("visibility", "hidden").appendTo(container)
-
- var valueHeight = $value.get(0).clientHeight
-
+ var valueHeight = $value.get(0).scrollHeight
$value.remove()
$value.css("visibility", "")
if(valueHeight > 150){
- $value.css("max-height", "100px")
- $value.css("overflow", "hidden")
-
var $toggle = $("<a>").text("more")
$toggle.click(function(){
if($toggle.text() === "more"){
@@ -2320,7 +2325,6 @@ var FormUtil = new function() {
$toggle.text("more")
}
})
-
return $("<div>").append($value).append($toggle)
}else{
return $value
diff --git a/openbis_standard_technologies/dist/core-plugins/eln-lims/1/as/webapps/eln-lims/html/js/views/ExperimentForm/ExperimentFormView.js b/openbis_standard_technologies/dist/core-plugins/eln-lims/1/as/webapps/eln-lims/html/js/views/ExperimentForm/ExperimentFormView.js
index 980f3143d8a..aba9a8f3826 100644
--- a/openbis_standard_technologies/dist/core-plugins/eln-lims/1/as/webapps/eln-lims/html/js/views/ExperimentForm/ExperimentFormView.js
+++ b/openbis_standard_technologies/dist/core-plugins/eln-lims/1/as/webapps/eln-lims/html/js/views/ExperimentForm/ExperimentFormView.js
@@ -462,23 +462,26 @@ function ExperimentFormView(experimentFormController, experimentFormModel) {
this._createSamplesSection = function(hideShowOptionsModel) {
var _this = this;
var $samples = $("<div>", { id : "experiment-samples" });
- $samples.append($('<legend>').text(ELNDictionary.Samples));
- var sampleListHeader = $("<p>");
- var sampleListContainer = $("<div>");
- $samples.append(sampleListHeader);
- $samples.append(sampleListContainer);
- var views = {
- header : sampleListHeader,
- content : sampleListContainer
- }
- var sampleList = new SampleTableController(this._experimentFormController, null, this._experimentFormModel.experiment.identifier, null, null, this._experimentFormModel.experiment);
- sampleList.init(views);
$samples.hide();
hideShowOptionsModel.push({
label : ELNDictionary.Samples,
section : "#experiment-samples",
beforeShowingAction : function() {
+ $samples.append($('<legend>').text(ELNDictionary.Samples));
+ var sampleListHeader = $("<p>");
+ var sampleListContainer = $("<div>");
+ $samples.append(sampleListHeader);
+ $samples.append(sampleListContainer);
+ var views = {
+ header : sampleListHeader,
+ content : sampleListContainer
+ }
+ var sampleList = new SampleTableController(_this._experimentFormController, null, _this._experimentFormModel.experiment.identifier, null, null, _this._experimentFormModel.experiment);
+ sampleList.init(views);
sampleList.refreshHeight();
+ },
+ afterHidingAction : function(){
+ $samples.empty()
}
});
return $samples;
diff --git a/openbis_standard_technologies/dist/core-plugins/eln-lims/1/as/webapps/eln-lims/html/js/views/ProjectForm/ProjectFormView.js b/openbis_standard_technologies/dist/core-plugins/eln-lims/1/as/webapps/eln-lims/html/js/views/ProjectForm/ProjectFormView.js
index 4c72ee40e35..b50e6c8d574 100644
--- a/openbis_standard_technologies/dist/core-plugins/eln-lims/1/as/webapps/eln-lims/html/js/views/ProjectForm/ProjectFormView.js
+++ b/openbis_standard_technologies/dist/core-plugins/eln-lims/1/as/webapps/eln-lims/html/js/views/ProjectForm/ProjectFormView.js
@@ -282,48 +282,55 @@ function ProjectFormView(projectFormController, projectFormModel) {
}
this._createExperimentsSection = function(projectIdentifier, hideShowOptionsModel) {
+ var _this = this
var entityKindName = ELNDictionary.getExperimentKindName(projectIdentifier, true);
var $experiments = $("<div>", { id : "project-experiments" });
- var $experimentsContainer = $("<div>");
- $experiments.append($("<legend>").append(entityKindName));
- $experiments.append($experimentsContainer);
-
- var experimentTableController = new ExperimentTableController(this._projectFormController, null, jQuery.extend(true, {}, this._projectFormModel.project), true);
- experimentTableController.init($experimentsContainer);
$experiments.hide();
hideShowOptionsModel.push({
label : entityKindName,
section : "#project-experiments",
beforeShowingAction : function() {
+ var $experimentsContainer = $("<div>");
+ $experiments.append($("<legend>").append(entityKindName));
+ $experiments.append($experimentsContainer);
+
+ var experimentTableController = new ExperimentTableController(_this._projectFormController, null, jQuery.extend(true, {}, _this._projectFormModel.project), true);
+ experimentTableController.init($experimentsContainer);
experimentTableController.refreshHeight();
+ },
+ afterHidingAction : function(){
+ $experiments.empty()
}
});
return $experiments;
}
this._createSamplesSection = function(hideShowOptionsModel) {
+ var _this = this
var entityKindName = "" + ELNDictionary.Samples + "";
var $samples = $("<div>", { id : "project-samples" });
- var $experimentsContainer = $("<div>");
- $samples.append($("<legend>").append(entityKindName));
- var $samplesContainerHeader = $("<div>");
- $samples.append($samplesContainerHeader);
- var $samplesContainer = $("<div>");
- $samples.append($samplesContainer);
-
- var views = {
- header : $samplesContainerHeader,
- content : $samplesContainer
- }
- var sampleTableController = new SampleTableController(this._projectFormController, null, null, this._projectFormModel.project.permId, true, null, 40);
- sampleTableController.init(views);
$samples.hide();
+
hideShowOptionsModel.push({
label : entityKindName,
section : "#project-samples",
beforeShowingAction : function() {
+ $samples.append($("<legend>").append(entityKindName));
+ var $samplesContainerHeader = $("<div>");
+ $samples.append($samplesContainerHeader);
+ var $samplesContainer = $("<div>");
+ $samples.append($samplesContainer);
+ var views = {
+ header : $samplesContainerHeader,
+ content : $samplesContainer
+ }
+ var sampleTableController = new SampleTableController(_this._projectFormController, null, null, _this._projectFormModel.project.permId, true, null, 40);
+ sampleTableController.init(views);
sampleTableController.refreshHeight();
+ },
+ afterHidingAction : function(){
+ $samples.empty()
}
});
return $samples;
--
GitLab