ref #6169 abstract page view having header and sub-header

diff --git a/src/main/java/eu/etaxonomy/cdm/vaadin/component/phycobank/RegistrationItem.java b/src/main/java/eu/etaxonomy/cdm/vaadin/component/phycobank/RegistrationItem.java
index 3c2abeeb9628c4a99224d44ca43e892a7a36914e..65f9413f04fdc55b438938b41c2ca873041d70c6 100644 (file)
--- a/src/main/java/eu/etaxonomy/cdm/vaadin/component/phycobank/RegistrationItem.java
+++ b/src/main/java/eu/etaxonomy/cdm/vaadin/component/phycobank/RegistrationItem.java
@@ -77,13 +77,12 @@ public class RegistrationItem extends GridLayout {
 
     public void init() {
 
-        setId("registration-list");
         setWidth(100, Unit.PERCENTAGE);
         addStyleName("registration-item");
 
         typeStateLabel.setStyleName(STYLE_LABEL_NOWRAP);
         addComponent(typeStateLabel, 0, 0);
-        setComponentAlignment(typeStateLabel, Alignment.MIDDLE_LEFT);
+        setComponentAlignment(typeStateLabel, Alignment.TOP_LEFT);
 
         addComponent(identifierLink, 1, 0);
         setComponentAlignment(identifierLink, Alignment.TOP_CENTER);

diff --git a/src/main/java/eu/etaxonomy/cdm/vaadin/view/AbstractPageView.java b/src/main/java/eu/etaxonomy/cdm/vaadin/view/AbstractPageView.java
new file mode 100644 (file)
index 0000000..c8ee0ae
--- /dev/null
+++ b/src/main/java/eu/etaxonomy/cdm/vaadin/view/AbstractPageView.java
@@ -0,0 +1,73 @@
+/**
+* Copyright (C) 2017 EDIT
+* European Distributed Institute of Taxonomy
+* http://www.e-taxonomy.eu
+*
+* The contents of this file are subject to the Mozilla Public License Version 1.1
+* See LICENSE.TXT at the top of this package for the full license terms.
+*/
+package eu.etaxonomy.cdm.vaadin.view;
+
+import com.vaadin.shared.ui.label.ContentMode;
+import com.vaadin.ui.CssLayout;
+import com.vaadin.ui.Label;
+import com.vaadin.ui.themes.ValoTheme;
+
+import eu.etaxonomy.vaadin.mvp.AbstractPresenter;
+import eu.etaxonomy.vaadin.mvp.AbstractView;
+
+/**
+ * A Page based on a <code>CssLayout</code> expanded to full size having a header and sub-header.
+ *
+ * The whole header section is build using a single <code>Label</code> for better performance.
+ *
+ * @author a.kohlbecker
+ * @since Mar 20, 2017
+ *
+ */
+public abstract class AbstractPageView<P extends AbstractPresenter> extends AbstractView<P>  {
+
+    private CssLayout layout;
+
+    private Label header;
+
+
+    /**
+     *
+     */
+    public AbstractPageView() {
+        layout = new CssLayout();
+        layout.setSizeFull();
+
+        header = new Label();
+        header.setStyleName(ValoTheme.LABEL_HUGE);
+        header.setWidth(100, Unit.PERCENTAGE);
+        header.setContentMode(ContentMode.HTML);
+        header.setValue("<div id=\"header\">" + getHeaderText() + "</div><div id=\"subheader\">" + getSubHeaderText() + "</div>");
+        layout.addComponent(header);
+
+        setCompositionRoot(layout);
+        this.setSizeFull();
+    }
+
+    protected CssLayout getLayout() {
+        return layout;
+    }
+
+    /**
+     * Provides the sub header text
+     *
+     * @return
+     */
+    protected abstract String getHeaderText();
+
+    /**
+     * Provides the header text
+     *
+     * @return
+     */
+    protected abstract  String getSubHeaderText();
+
+
+
+}

diff --git a/src/main/java/eu/etaxonomy/cdm/vaadin/view/phycobank/ListViewBean.java b/src/main/java/eu/etaxonomy/cdm/vaadin/view/phycobank/ListViewBean.java
index 4283fac6b6af85176014a5e296f7a319eb7c187d..59343d8365c59d9c64af10a705f857ffb2377818 100644 (file)
--- a/src/main/java/eu/etaxonomy/cdm/vaadin/view/phycobank/ListViewBean.java
+++ b/src/main/java/eu/etaxonomy/cdm/vaadin/view/phycobank/ListViewBean.java
@@ -18,28 +18,23 @@ import com.vaadin.data.util.GeneratedPropertyContainer;
 import com.vaadin.data.util.PropertyValueGenerator;
 import com.vaadin.navigator.View;
 import com.vaadin.navigator.ViewChangeListener.ViewChangeEvent;
-import com.vaadin.shared.ui.MarginInfo;
 import com.vaadin.shared.ui.grid.HeightMode;
 import com.vaadin.spring.annotation.SpringView;
-import com.vaadin.ui.Alignment;
 import com.vaadin.ui.Component;
+import com.vaadin.ui.CssLayout;
 import com.vaadin.ui.Grid;
 import com.vaadin.ui.Grid.Column;
 import com.vaadin.ui.Grid.SelectionMode;
-import com.vaadin.ui.Label;
-import com.vaadin.ui.Panel;
-import com.vaadin.ui.VerticalLayout;
 import com.vaadin.ui.renderers.ButtonRenderer;
 import com.vaadin.ui.renderers.DateRenderer;
 import com.vaadin.ui.renderers.HtmlRenderer;
-import com.vaadin.ui.themes.ValoTheme;
 
 import eu.etaxonomy.cdm.vaadin.component.phycobank.RegistrationItem;
 import eu.etaxonomy.cdm.vaadin.presenter.phycobank.ListPresenter;
 import eu.etaxonomy.cdm.vaadin.presenter.phycobank.RegistrationDTO;
 import eu.etaxonomy.cdm.vaadin.util.JodaDateTimeConverter;
 import eu.etaxonomy.cdm.vaadin.util.UrlStringConverter;
-import eu.etaxonomy.vaadin.mvp.AbstractView;
+import eu.etaxonomy.cdm.vaadin.view.AbstractPageView;
 import eu.etaxonomy.vaadin.ui.navigation.NavigationEvent;
 
 /**
@@ -48,53 +43,44 @@ import eu.etaxonomy.vaadin.ui.navigation.NavigationEvent;
  *
  */
 @SpringView(name=ListViewBean.NAME)
-public class ListViewBean extends AbstractView<ListPresenter> implements ListView, View {
+public class ListViewBean extends AbstractPageView<ListPresenter> implements ListView, View {
 
     private static final long serialVersionUID = 3543300933072824713L;
 
     public static final String NAME = "list";
 
-    private VerticalLayout layout;
+    CssLayout listContainer;
 
     private Grid grid;
 
-    private Panel panel;
-
     public ListViewBean() {
-        layout = new VerticalLayout();
-        layout.setSpacing(true);
-        layout.setSizeFull();
 
-        Label title = new Label("Registrations");
-        title.setStyleName(ValoTheme.LABEL_HUGE);
-        title.setWidthUndefined();
-        layout.addComponent(title);
-        layout.setComponentAlignment(title, Alignment.TOP_CENTER);
+        super();
 
-        Label hint = new Label("This is the list of all your registrations in progress.");
-        hint.setWidthUndefined();
-        layout.addComponent(hint);
-        layout.setComponentAlignment(hint, Alignment.MIDDLE_CENTER);
+        CssLayout toolBar = new CssLayout();
+        // toolBar.addComponent(new Button);
 
 //        grid = buildGrid();
 //        layout.addComponent(grid);
 //        layout.setExpandRatio(grid, 1);
 
-        buildPanel();
+        listContainer = new CssLayout();
+        listContainer.setId("registration-list");
+        listContainer.setWidth(100, Unit.PERCENTAGE);
+        listContainer.setHeight(100, Unit.PERCENTAGE);
+
+        getLayout().addComponent(listContainer);
 
-        setCompositionRoot(layout);
-        this.setSizeFull();
     }
 
-    /**
-     *
-     */
-    private void buildPanel() {
-        panel = new Panel();
-        panel.setSizeFull();
-        panel.setId("registration-list");
-        layout.addComponent(panel);
-        layout.setExpandRatio(panel, 1);
+    @Override
+    protected String getHeaderText() {
+        return "Registrations";
+    }
+
+    @Override
+    protected String getSubHeaderText() {
+        return "This is the list of all your registrations in progress.";
     }
 
     private Grid buildGrid() {
@@ -189,18 +175,17 @@ public class ListViewBean extends AbstractView<ListPresenter> implements ListVie
      */
     @Override
     public void populateList(Collection<RegistrationDTO> registrations) {
-        VerticalLayout list = new VerticalLayout();
-        list.setMargin(new MarginInfo(false, true));
-        list.setSpacing(true);
+
         for(RegistrationDTO regDto : registrations) {
 
             Component lazyItem = new RegistrationItem(regDto, this); //new LazyLoadWrapper(new RegistrationItem(regDto, this));
-            list.addComponent(lazyItem);
+            lazyItem.setWidth(100, Unit.PERCENTAGE);
+            listContainer.addComponent(lazyItem);
 //            if(list.getComponentCount() > 10){
 //                break;
 //            }
         }
-        panel.setContent(list);
+        // panel.setContent(listContainer);
 
     }
 

diff --git a/src/main/webapp/VAADIN/themes/edit-valo/edit-valo.scss b/src/main/webapp/VAADIN/themes/edit-valo/edit-valo.scss
index 5b1055c9cbbda5552f8286eca31834fd0d7c5e4f..6a92b5dd9a65cb58ae0f6ff9e71a04b692b5744e 100644 (file)
--- a/src/main/webapp/VAADIN/themes/edit-valo/edit-valo.scss
+++ b/src/main/webapp/VAADIN/themes/edit-valo/edit-valo.scss
@@ -72,6 +72,20 @@ $status-ready-color: adjust-color($plain-red, $hue: 180deg);
 
   // Insert your own theme rules here
   
+  // --- AbstractPageView --- // 
+  #header {
+    text-align: center;
+    margin: round($v-layout-spacing-vertical/2); // corresponds to layout spacing
+    font-size: $v-font-size--huge; // corresponds to valo style huge (26px)
+  }
+
+  #subheader {
+    text-align: center;
+    margin: round($v-layout-spacing-vertical/2);
+    font-size: $v-font-size; // valo default font size (16px)
+  }
+  // ------------------- // 
+  
   .logo_giant {
     font-size: 400%;
    }
@@ -193,6 +207,16 @@ $status-ready-color: adjust-color($plain-red, $hue: 180deg);
     }
     
     #registration-list {
+        /* --- for the css layout --- */
+        overflow: auto;
+        height: 100%;
+        padding-left: round($v-unit-size/3);
+        padding-right: round($v-unit-size/3);
+        
+        border: valo-border($border: $v-border, $color: $v-background-color, $strength: 1.4);
+        border-radius: $v-border-radius - first-number($v-border) $v-border-radius - first-number($v-border) 0 0;
+        /* ----------------------------------------------- */
+        
         // for grid rows
         .status-REJECTED {
             color: $status-rejected-color;