Merge pull request #228 from qbicsoftware/development

Steffengreiner · web-flow · commit ad362525eb7c · 2022-03-02T11:31:32.000+01:00
Prepare 1.1.0
diff --git a/.github/workflows/build_package.yml b/.github/workflows/build_package.yml
@@ -3,7 +3,7 @@ name: Build Maven Package
 on:
   push:
     branches:
-      - '*'
+      - '**'
   pull_request:
     # The branches below must be a subset of the branches above
     branches: [ main, master ]
diff --git a/.github/workflows/run_tests.yml b/.github/workflows/run_tests.yml
@@ -3,7 +3,7 @@ name: Run Maven Tests
 on:
   push:
     branches:
-      - '*'
+      - '**'
   pull_request:
     # The branches below must be a subset of the branches above
     branches: [ main, master ]
diff --git a/sample-tracking-status-overview-app/src/main/groovy/life/qbic/portal/sampletracking/components/MainPage.groovy b/sample-tracking-status-overview-app/src/main/groovy/life/qbic/portal/sampletracking/components/MainPage.groovy
@@ -20,10 +20,10 @@ class MainPage extends VerticalLayout {
 
         this.setMargin(false)
 
-        this.addComponents(projectLayout, sampleLayout)
+        this.addComponentsAndExpand(projectLayout, sampleLayout)
         sampleLayout.setVisible(false)
-
         listenToProjectSelectionChange()
+        makeMainPageScrollable()
     }
 
     private void listenToProjectSelectionChange() {
@@ -40,4 +40,10 @@ class MainPage extends VerticalLayout {
             sampleView.setVisible(!viewModel.projectViewEnabled)
         })
     }
+
+    private void makeMainPageScrollable () {
+        this.setWidth("100%");
+        this.setHeight("100%");
+        this.addStyleName("scrollable-layout")
+    }
 }
diff --git a/sample-tracking-status-overview-app/src/main/groovy/life/qbic/portal/sampletracking/components/Responsive.groovy b/sample-tracking-status-overview-app/src/main/groovy/life/qbic/portal/sampletracking/components/Responsive.groovy
@@ -0,0 +1,61 @@
+package life.qbic.portal.sampletracking.components
+
+import com.vaadin.ui.Grid
+
+/**
+ * <b>Indicate responsive behaviour in UI components</b>
+ *
+ * <p>These functions can be used to adapt vaadin grid functionality such as grid column resize-ability or grid responsiveness.</p>
+ *
+ * @since 1.0.2
+ */
+interface Responsive {
+
+    /**
+     * Enables the possibility of manually resizing vaadin columns in a grid
+     *
+     * Manual resizing of grid columns in vaadin 8 disables the automatic calculation of column width upon screen resizing,
+     * which either causes the grid to flow outside of the screen if the column width is increased or leave empty grid space if column width is decreased
+     *
+     * @param Grid grid the {@link com.vaadin.ui.Grid}, for which the columns should be resizable
+     *
+     * @since 1.0.2
+     */
+    void enableResizableColumns()
+
+    /**
+     * Disables the possibility of manually resizing vaadin columns in a grid
+     *
+     * Manual resizing of grid columns in vaadin 8 disables the automatic calculation of column width upon screen resizing,
+     * which either causes the grid to flow outside of the screen if the column width is increased or leave empty grid space if column width is decreased
+     *
+     * @param Grid grid the {@link com.vaadin.ui.Grid}, for which the columns should be non-resizable
+     *
+     * @since 1.0.2
+     */
+    void disableResizableColumns()
+
+    /**
+     * Makes sure that the full grid width is used by the columns upon browser resizing
+     *
+     * Ensures that the grid width is allocated upon all the columns even if max-width attributes for individual columns are set
+     * Without this recalculation the unused column width would show as empty space on the right side of the grid
+     *
+     * @param Grid grid the {@link com.vaadin.ui.Grid}, which should be responsive to browser window resizing
+     *
+     * @since 1.0.2
+     */
+    void enableDynamicResizing()
+
+    /**
+     * Disables adjustment of column width to fill grid width upon screen resizing
+     *
+     * The unused column width shows as empty space on the right side of the grid
+     *
+     * @param Grid grid the {@link com.vaadin.ui.Grid}, which should not be responsive to browser window resizing
+     *
+     * @since 1.0.2
+     */
+    void disableDynamicResizing()
+
+}
diff --git a/sample-tracking-status-overview-app/src/main/groovy/life/qbic/portal/sampletracking/components/projectoverview/ProjectView.groovy b/sample-tracking-status-overview-app/src/main/groovy/life/qbic/portal/sampletracking/components/projectoverview/ProjectView.groovy
@@ -10,7 +10,6 @@ import com.vaadin.server.StreamResource
 import com.vaadin.shared.data.sort.SortDirection
 import com.vaadin.shared.ui.ContentMode
 import com.vaadin.shared.ui.grid.HeightMode
-import com.vaadin.ui.Alignment
 import com.vaadin.ui.Component
 import com.vaadin.ui.Grid
 import com.vaadin.ui.TextField
@@ -20,6 +19,7 @@ import groovy.util.logging.Log4j2
 import life.qbic.business.project.subscribe.Subscriber
 import life.qbic.portal.sampletracking.Constants
 import life.qbic.portal.sampletracking.communication.notification.NotificationService
+import life.qbic.portal.sampletracking.components.Responsive
 import life.qbic.portal.sampletracking.components.ViewModel
 import life.qbic.portal.sampletracking.components.projectoverview.download.DownloadProjectController
 import life.qbic.portal.sampletracking.components.projectoverview.statusdisplay.SampleCount
@@ -30,7 +30,7 @@ import life.qbic.portal.sampletracking.components.projectoverview.subscribe.Subs
 import java.util.function.Consumer
 
 @Log4j2
-class ProjectView extends ProjectDesign {
+class ProjectView extends ProjectDesign implements Responsive {
 
     private final ViewModel viewModel
     private final DownloadProjectController downloadProjectController
@@ -45,13 +45,18 @@ class ProjectView extends ProjectDesign {
         this.subscriptionCheckboxFactory = new SubscriptionCheckboxFactory(subscribeProjectController, subscriber, notificationService)
         this.downloadProjectController = downloadProjectController
         this.notificationService = notificationService
+        init()
+    }
+
+    private void init(){
         bindData()
         addClickListener()
         setupDownloadButton()
         bindManifestToProjectSelection()
-        makeProjectLayoutResponsive()
-        makeProjectGridResponsive(projectGrid)
-        setProjectGridStyles(projectGrid)
+        setupLayoutResponsiveness()
+        setProjectGridStyles()
+        disableResizableColumns()
+        enableDynamicResizing()
         addSorting()
         enableUserProjectFiltering()
     }
@@ -84,12 +89,7 @@ class ProjectView extends ProjectDesign {
 
         refreshDataProvider()
         //specify size of grid and layout
-        projectGrid.getColumn("ProjectTitle").setExpandRatio(5)
-        projectGrid.getColumn("SamplesReceived").setExpandRatio(1)
-        projectGrid.getColumn("SamplesPassedQc").setExpandRatio(1)
-        projectGrid.getColumn("LibraryPrepFinished").setExpandRatio(1)
-        projectGrid.getColumn("SampleDataAvailable").setExpandRatio(1)
-
+        projectGrid.setWidthFull()
         projectGrid.setHeightMode(HeightMode.ROW)
 
         // remove manual sorting - any sorting in the code should probably done before disabling it
@@ -98,81 +98,42 @@ class ProjectView extends ProjectDesign {
         }
     }
 
-    private void setProjectGridStyles(Grid projectGrid) {
-        setHeaderRowStyle(projectGrid.getDefaultHeaderRow())
-        addTooltips(projectGrid.getDefaultHeaderRow())
-        setColumnsStyle(projectGrid)
+    private void setProjectGridStyles() {
+        setHeaderRowStyle()
+        addTooltips()
+        setColumnsStyle()
     }
 
-    private void makeProjectLayoutResponsive() {
-        //The layout has to be set responsive for the media breakpoints to function
-        this.addStyleName("responsive-project-layout")
-        this.setResponsive(true)
-    }
-
-    private static void addTooltips(HeaderRow headerRow) {
+    private void addTooltips() {
+        HeaderRow headerRow = projectGrid.getDefaultHeaderRow()
         headerRow.getCell("Subscription").setDescription("Select a project to get status updates per email.")
         headerRow.getCell("SamplesReceived").setDescription("Number of samples that arrived in the processing facility.")
         headerRow.getCell("SamplesPassedQc").setDescription("Number of samples that passed quality control.")
         headerRow.getCell("LibraryPrepFinished").setDescription("Number of samples where library prep has been finished.")
         headerRow.getCell("SampleDataAvailable").setDescription("Number of available raw datasets.")
     }
 
-    private static void setHeaderRowStyle(HeaderRow headerRow) {
-        headerRow.getCell("Subscription").setStyleName("project-cell-min-width header-with-tooltip")
-        headerRow.getCell("SamplesReceived").setStyleName("project-cell-min-width header-with-tooltip")
-        headerRow.getCell("SamplesPassedQc").setStyleName("project-cell-min-width header-with-tooltip")
-        headerRow.getCell("LibraryPrepFinished").setStyleName("project-cell-min-width header-with-tooltip")
-        headerRow.getCell("SampleDataAvailable").setStyleName("project-cell-min-width header-with-tooltip")
-        headerRow.getCell("ProjectTitle").setStyleName("project-cell-min-width project-title-cell")
-        headerRow.getCell("ProjectCode").setStyleName("project-cell-min-width")
+    private void setHeaderRowStyle() {
+        HeaderRow headerRow = projectGrid.getDefaultHeaderRow()
+        headerRow.getCell("Subscription").setStyleName("cell-min-width header-with-tooltip")
+        headerRow.getCell("SamplesReceived").setStyleName("cell-min-width header-with-tooltip")
+        headerRow.getCell("SamplesPassedQc").setStyleName("cell-min-width header-with-tooltip")
+        headerRow.getCell("LibraryPrepFinished").setStyleName("cell-min-width header-with-tooltip")
+        headerRow.getCell("SampleDataAvailable").setStyleName("cell-min-width header-with-tooltip")
+        headerRow.getCell("ProjectTitle").setStyleName("cell-min-width cell-max-width")
+        headerRow.getCell("ProjectCode").setStyleName("cell-min-width")
         headerRow.getCell("Subscription").setStyleName("subscription-cell")
     }
 
-    private void setColumnsStyle(Grid projectGrid) {
-        setComponentAlignment(projectGrid, Alignment.TOP_LEFT)
-        projectGrid.setWidthFull()
+    private void setColumnsStyle() {
         projectGrid.getColumn("ProjectTitle").setStyleGenerator(projectTitleColumn -> {
-            return "project-cell-min-width project-title-cell"
+            return "cell-min-width cell-max-width"
         })
         projectGrid.getColumn("Subscription").setStyleGenerator(projectTitleColumn -> {
             return "subscription-cell"
         })
     }
 
-    private void makeProjectGridResponsive(Grid projectGrid) {
-        /*
-        Defines the lower end on how small columns can be resized manually.
-        Necessary to avoid overlapping the project/samples button with the download manifest button
-         */
-        int browserWindowWidth = 0
-        int maximumGridWidth = 0
-        //add padding width for left and right side of grid
-        final int gridPaddingWidth = 74
-        addAttachListener(attachedEvent -> {
-            browserWindowWidth = super.getUI().getPage().getBrowserWindowWidth()
-            maximumGridWidth = browserWindowWidth - gridPaddingWidth
-        })
-
-        //The grid width should adjust to the resizing preferences of the user
-        projectGrid.addColumnResizeListener(columnListener -> {
-
-            double columnsWidth = 0
-            projectGrid.getColumns().each { column ->
-                columnsWidth += column.getWidth()
-            }
-            if (columnsWidth <= maximumGridWidth) {
-                projectGrid.setWidth(Math.floor(columnsWidth).toString())
-                hotbarLayout.setWidth(Math.floor(columnsWidth).toString())
-            } else {
-                //If projectGrid width is bigger than screen adjust grid to max screen size
-                this.setWidth(maximumGridWidth.toString())
-                projectGrid.setWidth(maximumGridWidth.toString())
-                hotbarLayout.setWidth(maximumGridWidth.toString())
-            }
-        })
-    }
-
     private void addSorting(){
         sort.setItems(["Newest Changes", "Oldest Changes", "Subscribed", "Not Subscribed"])
 
@@ -338,7 +299,7 @@ class ProjectView extends ProjectDesign {
         })
     }
 
-    void enableUserProjectFiltering() {
+    private void enableUserProjectFiltering() {
         TextField searchField = this.searchField
         searchField.addValueChangeListener({
             if (it.getValue()) {
@@ -354,4 +315,52 @@ class ProjectView extends ProjectDesign {
         DataProvider<ProjectSummary, ?> dataProvider = this.projectGrid.getDataProvider()
         return dataProvider
     }
+
+    /**
+     * Adds responsiveness to an abstractComponent
+     *
+     * <p>This applies the css class style .responsive-grid-layout to the provided abstractComponent allowing it to display it's content in a responsive manner</p>
+     *
+     * @param AbstractComponent the {@link com.vaadin.ui.AbstractComponent}, where the css style and responsiveness should be added
+     * @since 1.0.2
+     */
+    private void setupLayoutResponsiveness() {
+        this.addStyleName("responsive-grid-layout")
+        this.setWidthFull()
+    }
+
+    @Override
+    void enableResizableColumns() {
+        projectGrid.getColumns().each { it ->
+            {
+                it.setResizable(true)
+            }
+        }
+    }
+
+    @Override
+    void disableResizableColumns() {
+        projectGrid.getColumns().each { it ->
+            {
+                it.setResizable(false)
+            }
+        }
+    }
+
+    @Override
+    void enableDynamicResizing() {
+        projectGrid.addAttachListener(attachEvent -> {
+            projectGrid.getUI().getCurrent().getPage().addBrowserWindowResizeListener(resizeEvent -> {
+                projectGrid.recalculateColumnWidths()
+            })
+        })
+    }
+
+    @Override
+    void disableDynamicResizing() {
+        Collection<AttachListener> attachListeners = projectGrid.getListeners(AttachListener) as Collection<AttachListener>
+        attachListeners.each {attachListener -> {
+            projectGrid.removeAttachListener(attachListener)
+        }}
+    }
 }
diff --git a/sample-tracking-status-overview-app/src/main/groovy/life/qbic/portal/sampletracking/components/sampleoverview/SampleView.groovy b/sample-tracking-status-overview-app/src/main/groovy/life/qbic/portal/sampletracking/components/sampleoverview/SampleView.groovy
diff --git a/sample-tracking-status-overview-app/src/main/webapp/VAADIN/themes/mytheme/mytheme.scss b/sample-tracking-status-overview-app/src/main/webapp/VAADIN/themes/mytheme/mytheme.scss
