From 81c7cbf8aec7326478b9665db40e67d38b901676 Mon Sep 17 00:00:00 2001 From: gvachkov Date: Thu, 11 Oct 2018 15:28:11 +0200 Subject: [PATCH] add read only state --- .../alump/gridstack/GridStackLayout.java | 42 ++++++++++++---- .../alump/gridstack/client/GwtGridStack.java | 36 +++++++++++--- .../client/shared/GridStackChildOptions.java | 1 + .../VAADIN/addons/gridstack/gridstack.scss | 4 ++ .../vaadin/alump/gridstack/demo/TestView.java | 49 +++++++++++++++---- 5 files changed, 108 insertions(+), 24 deletions(-) diff --git a/gridstack-addon/src/main/java/org/vaadin/alump/gridstack/GridStackLayout.java b/gridstack-addon/src/main/java/org/vaadin/alump/gridstack/GridStackLayout.java index af43b31..03bbb68 100644 --- a/gridstack-addon/src/main/java/org/vaadin/alump/gridstack/GridStackLayout.java +++ b/gridstack-addon/src/main/java/org/vaadin/alump/gridstack/GridStackLayout.java @@ -17,6 +17,16 @@ */ package org.vaadin.alump.gridstack; +import java.util.ArrayList; +import java.util.Collection; +import java.util.Iterator; +import java.util.List; + +import org.vaadin.alump.gridstack.client.shared.GridStackChildOptions; +import org.vaadin.alump.gridstack.client.shared.GridStackLayoutState; +import org.vaadin.alump.gridstack.client.shared.GridStackMoveData; +import org.vaadin.alump.gridstack.client.shared.GridStackServerRpc; + import com.vaadin.annotations.JavaScript; import com.vaadin.event.LayoutEvents; import com.vaadin.shared.Connector; @@ -24,12 +34,6 @@ import com.vaadin.shared.MouseEventDetails; import com.vaadin.ui.AbstractLayout; import com.vaadin.ui.Component; -import org.vaadin.alump.gridstack.client.shared.*; - -import java.util.ArrayList; -import java.util.Collection; -import java.util.Iterator; -import java.util.List; /** * Vaadin layout using gridstack.js library to layout components @@ -64,8 +68,8 @@ public void layoutClick(MouseEventDetails mouseEventDetails, Connector connector @Override public void onChildrenMoved(List moves) { Collection events = new ArrayList(); - for(GridStackMoveData move : moves) { - Component childComponent = (Component)move.child; + for (GridStackMoveData move : moves) { + Component childComponent = (Component) move.child; GridStackCoordinates oldCoordinates = getCoordinates(childComponent); GridStackChildOptions info = getState(false).childOptions.get(move.child); @@ -296,7 +300,7 @@ public Component getComponent(int x, int y) { * @return Component at slot, or null if component not found */ public Component getComponent(int x, int y, boolean acceptInsideHit) { - for(Connector connector : getState().childOptions.keySet()) { + for (Connector connector : getState().childOptions.keySet()) { GridStackChildOptions info = getState().childOptions.get(connector); if(acceptInsideHit) { if(x >= info.x && x < (info.x + info.width) && y >= info.y && y < (info.y + info.width)) { @@ -677,4 +681,24 @@ public boolean isAreaEmpty(GridStackCoordinates coordinates) throws IllegalArgum return true; } + /** + * Sets read only state to child component. If the child is set to read only it will not be able to be moved, resized or moved by another component + * + * @param child - Child component + * @param readOnly - State of the component + */ + public void setComponentReadOnly(Component child, boolean readOnly) { + getComponentOptions(child).readOnly = readOnly; + } + + /** + * Check if the child component is in read only state + * + * @param child - Child component + * @return true if the component is in read only state + */ + public boolean isComponentReadOnly(Component child) { + return getComponentOptions(child).readOnly; + } + } diff --git a/gridstack-addon/src/main/java/org/vaadin/alump/gridstack/client/GwtGridStack.java b/gridstack-addon/src/main/java/org/vaadin/alump/gridstack/client/GwtGridStack.java index 829b4dc..dc8491f 100644 --- a/gridstack-addon/src/main/java/org/vaadin/alump/gridstack/client/GwtGridStack.java +++ b/gridstack-addon/src/main/java/org/vaadin/alump/gridstack/client/GwtGridStack.java @@ -17,6 +17,17 @@ */ package org.vaadin.alump.gridstack.client; +import java.util.ArrayList; +import java.util.Date; +import java.util.HashMap; +import java.util.Iterator; +import java.util.List; +import java.util.Map; +import java.util.logging.Logger; + +import org.vaadin.alump.gridstack.client.shared.GridStackChildOptions; +import org.vaadin.alump.gridstack.client.shared.GridStackOptions; + import com.google.gwt.core.client.Duration; import com.google.gwt.dom.client.Document; import com.google.gwt.dom.client.Element; @@ -24,11 +35,6 @@ import com.google.gwt.user.client.Timer; import com.google.gwt.user.client.ui.ComplexPanel; import com.google.gwt.user.client.ui.Widget; -import org.vaadin.alump.gridstack.client.shared.GridStackChildOptions; -import org.vaadin.alump.gridstack.client.shared.GridStackOptions; - -import java.util.*; -import java.util.logging.Logger; public class GwtGridStack extends ComplexPanel { @@ -170,7 +176,14 @@ protected Element createWrapper(GridStackChildOptions info) { wrapper.setAttribute("data-gs-locked", "yes"); } - Element content = Document.get().createDivElement(); + if (info.readOnly) { + wrapper.setAttribute("data-gs-locked", "yes"); + wrapper.setAttribute("data-gs-no-resize", "yes"); + wrapper.setAttribute("data-gs-no-move", "yes"); + } + + final Element content = Document.get() + .createDivElement(); content.addClassName(CONTENT_CLASSNAME); if(!info.useDragHandle) { @@ -341,6 +354,7 @@ public void updateChild(Widget widget, GridStackChildOptions options) { updateWidgetWrapper(wrapper, options.x, options.y, options.width, options.height); updateWidgetSizeLimits(wrapper, GwtGridSizeLimits.create(options)); setLocked(wrapper, options.locked); + setReadOnly(wrapper, options.readOnly); if(options.disableScrolling) { wrapper.addClassName(DISABLE_SCROLLING_CLASSNAME); @@ -383,6 +397,16 @@ protected native final void setLocked(Element element, boolean locked) }); }-*/; + protected native final void setReadOnly(Element element, boolean readOnly) + /*-{ + var elementId = this.@org.vaadin.alump.gridstack.client.GwtGridStack::elementId; + $wnd.$(function () { + var grid = $wnd.$('#' + elementId).data('gridstack'); + grid.locked(element, readOnly); + grid.resizable(element, !readOnly); + grid.movable(element, !readOnly); + }); + }-*/; public void commit() { if(initialized && isAttached()) { diff --git a/gridstack-addon/src/main/java/org/vaadin/alump/gridstack/client/shared/GridStackChildOptions.java b/gridstack-addon/src/main/java/org/vaadin/alump/gridstack/client/shared/GridStackChildOptions.java index af8e615..d7a4188 100644 --- a/gridstack-addon/src/main/java/org/vaadin/alump/gridstack/client/shared/GridStackChildOptions.java +++ b/gridstack-addon/src/main/java/org/vaadin/alump/gridstack/client/shared/GridStackChildOptions.java @@ -33,6 +33,7 @@ public class GridStackChildOptions implements Serializable { public Integer maxWidth = null; public Integer maxHeight = null; public boolean locked = false; + public boolean readOnly = false; public boolean useDragHandle = false; public String styleName = null; diff --git a/gridstack-addon/src/main/resources/VAADIN/addons/gridstack/gridstack.scss b/gridstack-addon/src/main/resources/VAADIN/addons/gridstack/gridstack.scss index 54bc70c..2ba86e8 100644 --- a/gridstack-addon/src/main/resources/VAADIN/addons/gridstack/gridstack.scss +++ b/gridstack-addon/src/main/resources/VAADIN/addons/gridstack/gridstack.scss @@ -170,6 +170,10 @@ $gridstack_item_padding: $gridstack_horizontal_padding / 2 !default; } } + &.ui-draggable-disabled .grid-stack-item-drag-handle.separate-handle { + display: none !important; + } + &:hover .grid-stack-item-drag-handle.separate-handle { display: block; } diff --git a/gridstack-demo/src/main/java/org/vaadin/alump/gridstack/demo/TestView.java b/gridstack-demo/src/main/java/org/vaadin/alump/gridstack/demo/TestView.java index 98153ed..b1ad5f4 100644 --- a/gridstack-demo/src/main/java/org/vaadin/alump/gridstack/demo/TestView.java +++ b/gridstack-demo/src/main/java/org/vaadin/alump/gridstack/demo/TestView.java @@ -1,5 +1,17 @@ package org.vaadin.alump.gridstack.demo; +import java.util.ArrayList; +import java.util.Collections; +import java.util.Iterator; +import java.util.List; +import java.util.Random; +import java.util.concurrent.atomic.AtomicInteger; + +import org.vaadin.alump.gridstack.GridStackButton; +import org.vaadin.alump.gridstack.GridStackCoordinates; +import org.vaadin.alump.gridstack.GridStackLayout; +import org.vaadin.teemu.VaadinIcons; + import com.vaadin.event.LayoutEvents; import com.vaadin.navigator.Navigator; import com.vaadin.navigator.View; @@ -7,15 +19,22 @@ import com.vaadin.server.ExternalResource; import com.vaadin.server.Resource; import com.vaadin.server.ThemeResource; -import com.vaadin.ui.*; +import com.vaadin.ui.Alignment; +import com.vaadin.ui.Button; +import com.vaadin.ui.CheckBox; +import com.vaadin.ui.Component; +import com.vaadin.ui.CssLayout; +import com.vaadin.ui.HorizontalLayout; +import com.vaadin.ui.Image; +import com.vaadin.ui.Label; +import com.vaadin.ui.Link; +import com.vaadin.ui.Notification; +import com.vaadin.ui.Panel; +import com.vaadin.ui.PasswordField; +import com.vaadin.ui.TextArea; +import com.vaadin.ui.TextField; +import com.vaadin.ui.VerticalLayout; import com.vaadin.ui.themes.ValoTheme; -import org.vaadin.alump.gridstack.GridStackButton; -import org.vaadin.alump.gridstack.GridStackCoordinates; -import org.vaadin.alump.gridstack.GridStackLayout; -import org.vaadin.teemu.VaadinIcons; - -import java.util.*; -import java.util.concurrent.atomic.AtomicInteger; /** * Main test/demo view of GridStackLayout @@ -33,6 +52,7 @@ public class TestView extends VerticalLayout implements View { private Random rand = new Random(0xDEADBEEF); private Component locked; + private Component readOnly; // This value can be used as x and y when client side can pick the best slot private final static int CLIENT_SELECTS = GridStackLayout.CLIENT_SIDE_SELECTS; @@ -82,6 +102,10 @@ public TestView() { gridStack.addComponent(createForm(), 0, 5, 2, 3, false); gridStack.addComponent(createConsole(), 0, 3, 4, 2); + this.readOnly = new Label("This component can be set to read only (moving and resizing is disabled and moving children over will not move this)"); + this.readOnly.setWidth(100, Unit.PERCENTAGE); + this.gridStack.addComponent(this.readOnly, 0, 8, 3, 1); + Component image = createImage(); gridStack.addComponent(image, 2, 1, 3, 2); gridStack.setWrapperScrolling(image, false); @@ -161,7 +185,14 @@ private Component createToolbar() { toolbar.addComponent(lockItem); toolbar.addComponent(createButton(VaadinIcons.LIST, "Navigate to list demo", - e -> navigator.navigateTo(SplitView.VIEW_NAME))); + e -> navigator.navigateTo(SplitView.VIEW_NAME))); + + final CheckBox readOnlyItem = new CheckBox("Read only child"); + readOnlyItem.setDescription("Define if item with text \"Read only\" is read only or not"); + readOnlyItem.addValueChangeListener(e -> { + this.gridStack.setComponentReadOnly(this.readOnly, readOnlyItem.getValue()); + }); + toolbar.addComponent(readOnlyItem); return toolbar; }