feat: add support for reversed orientation

Close #87
FlowingCode · Nov 25, 2021 · 7b768d8 · 7b768d8
1 parent a642d98
commit 7b768d8
Show file tree

Hide file tree

Showing 3 changed files with 60 additions and 25 deletions.
diff --git a/src/main/java/com/flowingcode/vaadin/addons/twincolgrid/TwinColGrid.java b/src/main/java/com/flowingcode/vaadin/addons/twincolgrid/TwinColGrid.java
@@ -104,7 +104,9 @@ Collection<T> getItems() {
   /** enumeration of all available orientation for TwinGolGrid component */
   public enum Orientation {
     HORIZONTAL,
-    VERTICAL;
+    VERTICAL,
+    HORIZONTAL_REVERSE,
+    VERTICAL_REVERSE;
   }
 
   private final TwinColModel<T> available;
@@ -235,24 +237,58 @@ private void updateContainerLayout() {
   }
 
   private Component createContainerLayout() {
-    return orientation == Orientation.VERTICAL
-        ? createVerticalContainer()
-        : createHorizontalContainer();
+    switch (orientation) {
+      case HORIZONTAL:
+        addButton.setIcon(VaadinIcon.ANGLE_RIGHT.create());
+        addAllButton.setIcon(VaadinIcon.ANGLE_DOUBLE_RIGHT.create());
+        removeButton.setIcon(VaadinIcon.ANGLE_LEFT.create());
+        removeAllButton.setIcon(VaadinIcon.ANGLE_DOUBLE_LEFT.create());
+        return createHorizontalContainer(false);
+      case HORIZONTAL_REVERSE:
+        addButton.setIcon(VaadinIcon.ANGLE_LEFT.create());
+        addAllButton.setIcon(VaadinIcon.ANGLE_DOUBLE_LEFT.create());
+        removeButton.setIcon(VaadinIcon.ANGLE_RIGHT.create());
+        removeAllButton.setIcon(VaadinIcon.ANGLE_DOUBLE_RIGHT.create());
+        return createHorizontalContainer(true);
+      case VERTICAL:
+        addButton.setIcon(VaadinIcon.ANGLE_DOWN.create());
+        addAllButton.setIcon(VaadinIcon.ANGLE_DOUBLE_DOWN.create());
+        removeButton.setIcon(VaadinIcon.ANGLE_UP.create());
+        removeAllButton.setIcon(VaadinIcon.ANGLE_DOUBLE_UP.create());
+        return createVerticalContainer(false);
+      case VERTICAL_REVERSE:
+        addButton.setIcon(VaadinIcon.ANGLE_UP.create());
+        addAllButton.setIcon(VaadinIcon.ANGLE_DOUBLE_UP.create());
+        removeButton.setIcon(VaadinIcon.ANGLE_DOWN.create());
+        removeAllButton.setIcon(VaadinIcon.ANGLE_DOUBLE_DOWN.create());
+        return createVerticalContainer(true);
+    }
+    throw new IllegalStateException();
   }
 
-  private HorizontalLayout createHorizontalContainer() {
+  private HorizontalLayout createHorizontalContainer(boolean reverse) {
     buttonContainer = getVerticalButtonContainer();
-    HorizontalLayout hl = new HorizontalLayout(available.layout, buttonContainer, selection.layout);
+    HorizontalLayout hl;
+    if (reverse) {
+      hl = new HorizontalLayout(selection.layout, buttonContainer, available.layout);
+    } else {
+      hl = new HorizontalLayout(available.layout, buttonContainer, selection.layout);
+    }
     hl.getElement().getStyle().set("min-height", "0px");
     hl.getElement().getStyle().set("flex", "1 1 0px");
     hl.setMargin(false);
     hl.setWidthFull();
     return hl;
   }
 
-  private VerticalLayout createVerticalContainer() {
+  private VerticalLayout createVerticalContainer(boolean reverse) {
     buttonContainer = getHorizontalButtonContainer();
-    VerticalLayout vl = new VerticalLayout(available.layout, buttonContainer, selection.layout);
+    VerticalLayout vl;
+    if (reverse) {
+      vl = new VerticalLayout(selection.layout, buttonContainer, available.layout);
+    } else {
+      vl = new VerticalLayout(available.layout, buttonContainer, selection.layout);
+    }
     vl.getElement().getStyle().set("min-width", "0px");
     vl.getElement().getStyle().set("flex", "1 1 0px");
     vl.setMargin(false);
@@ -262,11 +298,6 @@ private VerticalLayout createVerticalContainer() {
   }
 
   private VerticalLayout getVerticalButtonContainer() {
-    addButton.setIcon(VaadinIcon.ANGLE_RIGHT.create());
-    addAllButton.setIcon(VaadinIcon.ANGLE_DOUBLE_RIGHT.create());
-    removeButton.setIcon(VaadinIcon.ANGLE_LEFT.create());
-    removeAllButton.setIcon(VaadinIcon.ANGLE_DOUBLE_LEFT.create());
-
     fakeButtonContainerLabel.getElement().setProperty("innerHTML", "&nbsp;");
     fakeButtonContainerLabel.setVisible(false);
 
@@ -280,11 +311,6 @@ private VerticalLayout getVerticalButtonContainer() {
   }
 
   private HorizontalLayout getHorizontalButtonContainer() {
-    addButton.setIcon(VaadinIcon.ANGLE_DOWN.create());
-    addAllButton.setIcon(VaadinIcon.ANGLE_DOUBLE_DOWN.create());
-    removeButton.setIcon(VaadinIcon.ANGLE_UP.create());
-    removeAllButton.setIcon(VaadinIcon.ANGLE_DOUBLE_UP.create());
-
     HorizontalLayout hButtonContainer =
         new HorizontalLayout(
             addAllButton, addButton, removeButton, removeAllButton);

diff --git a/.../twincolgrid/VerticalOrientationDemo.java → ...n/addons/twincolgrid/OrientationDemo.java b/.../twincolgrid/VerticalOrientationDemo.java → ...n/addons/twincolgrid/OrientationDemo.java
@@ -21,7 +21,9 @@
 
 import com.flowingcode.vaadin.addons.demo.DemoSource;
 import com.flowingcode.vaadin.addons.twincolgrid.TwinColGrid.Orientation;
+import com.vaadin.flow.component.formlayout.FormLayout;
 import com.vaadin.flow.component.orderedlayout.VerticalLayout;
+import com.vaadin.flow.component.select.Select;
 import com.vaadin.flow.router.PageTitle;
 import java.util.ArrayList;
 import java.util.Comparator;
@@ -30,19 +32,19 @@
 import java.util.Set;
 
 @SuppressWarnings("serial")
-@PageTitle("Vertical Orientation")
+@PageTitle("Orientation")
 @DemoSource(
-    "https://github.com/FlowingCode/TwinColGridAddon/blob/master/src/test/java/com/flowingcode/vaadin/addons/twincolgrid/VerticalOrientationDemo.java")
-public class VerticalOrientationDemo extends VerticalLayout {
+"https://github.com/FlowingCode/TwinColGridAddon/blob/master/src/test/java/com/flowingcode/vaadin/addons/twincolgrid/OrientationDemo.java")
+public class OrientationDemo extends VerticalLayout {
 
   private final Set<Book> selectedBooks = new HashSet<>();
   private final List<Book> availableBooks = new ArrayList<>();
 
-  public VerticalOrientationDemo() {
+  public OrientationDemo() {
     initializeData();
 
     final TwinColGrid<Book> twinColGrid =
-        new TwinColGrid<>(availableBooks, "TwinColGrid demo with drag and drop support")
+        new TwinColGrid<>(availableBooks, null)
             .addSortableColumn(Book::getIsbn, Comparator.comparing(Book::getIsbn), "ISBN")
             .addSortableColumn(Book::getTitle, Comparator.comparing(Book::getTitle), "Title")
             .withAvailableGridCaption("Available books")
@@ -52,7 +54,14 @@ public VerticalOrientationDemo() {
             .withOrientation(Orientation.VERTICAL);
     twinColGrid.setValue(selectedBooks);
 
-    add(twinColGrid);
+    FormLayout formLayout = new FormLayout();
+    Select<TwinColGrid.Orientation> orientationField = new Select<>(Orientation.values());
+    orientationField.addValueChangeListener(ev -> twinColGrid.withOrientation(ev.getValue()));
+    orientationField.setValue(twinColGrid.getOrientation());
+    orientationField.setWidth("225px");
+    formLayout.addFormItem(orientationField, "Orientation");
+
+    add(formLayout, twinColGrid);
     setSizeFull();
   }
 

diff --git a/src/test/java/com/flowingcode/vaadin/addons/twincolgrid/TwincolDemoView.java b/src/test/java/com/flowingcode/vaadin/addons/twincolgrid/TwincolDemoView.java
@@ -36,7 +36,7 @@ public TwincolDemoView() {
     addDemo(new DragAndDropDemo());
     addDemo(new FilterableDemo());
     addDemo(new BoundDemo());
-    addDemo(new VerticalOrientationDemo());
+    addDemo(new OrientationDemo());
     setSizeFull();
   }
 }