diff options
15 files changed, 187 insertions, 6 deletions
diff --git a/WebContent/VAADIN/themes/base/tree/img/connector-item-last.png b/WebContent/VAADIN/themes/base/tree/img/connector-item-last.png Binary files differnew file mode 100644 index 0000000000..2eb04a32fd --- /dev/null +++ b/WebContent/VAADIN/themes/base/tree/img/connector-item-last.png diff --git a/WebContent/VAADIN/themes/base/tree/img/connector-item.png b/WebContent/VAADIN/themes/base/tree/img/connector-item.png Binary files differnew file mode 100644 index 0000000000..5f88fe1bef --- /dev/null +++ b/WebContent/VAADIN/themes/base/tree/img/connector-item.png diff --git a/WebContent/VAADIN/themes/base/tree/img/connector.png b/WebContent/VAADIN/themes/base/tree/img/connector.png Binary files differnew file mode 100644 index 0000000000..2844bba731 --- /dev/null +++ b/WebContent/VAADIN/themes/base/tree/img/connector.png diff --git a/WebContent/VAADIN/themes/base/tree/tree.css b/WebContent/VAADIN/themes/base/tree/tree.css index 9e056dc4d6..593771a49c 100644 --- a/WebContent/VAADIN/themes/base/tree/tree.css +++ b/WebContent/VAADIN/themes/base/tree/tree.css @@ -11,10 +11,24 @@ .v-tree-node-caption:focus { outline: none; } +div.v-tree-node-leaf { + background: transparent; +} +.v-tree-connectors .v-tree-node-leaf, +.v-tree-connectors .v-tree-node-leaf:hover { + background: transparent url(img/connector-item.png) no-repeat 8px 0; +} +.v-tree-connectors .v-tree-node-leaf-last, +.v-tree-connectors .v-tree-node-leaf-last:hover { + background: transparent url(img/connector-item-last.png) no-repeat 8px 0; +} .v-tree-node-expanded { - background-position: -5px -10px; + background: transparent url(../common/img/sprites.png) no-repeat -5px -10px; } -div.v-tree-node-leaf { +.v-tree-connectors .v-tree-node-children { + background: transparent url(img/connector.png) repeat-y 8px bottom; +} +.v-tree-connectors .v-tree-node-children-last { background: transparent; } .v-tree-node-caption { diff --git a/WebContent/VAADIN/themes/reindeer/tree/tree.css b/WebContent/VAADIN/themes/reindeer/tree/tree.css index 3f77bd991d..d33985f713 100644 --- a/WebContent/VAADIN/themes/reindeer/tree/tree.css +++ b/WebContent/VAADIN/themes/reindeer/tree/tree.css @@ -11,6 +11,15 @@ .v-tree-node-expanded { background-position: -7px 5px; } +.v-tree-connectors .v-tree-node-leaf { + background-position: 8px -1px; +} +.v-ie6 .v-tree-connectors div.v-tree-node-leaf { + background: transparent url(../../base/tree/img/connector-item.png) no-repeat 8px -1px; +} +.v-ie6 .v-tree-connectors div.v-tree-node-leaf-last { + background: transparent url(../../base/tree/img/connector-item-last.png) no-repeat 8px -1px; +} .v-tree-node-caption { margin-left: 16px; padding-bottom: 1px; diff --git a/WebContent/VAADIN/themes/runo/tree/img/connectors/collapsed-last.png b/WebContent/VAADIN/themes/runo/tree/img/connectors/collapsed-last.png Binary files differnew file mode 100644 index 0000000000..28b3626d79 --- /dev/null +++ b/WebContent/VAADIN/themes/runo/tree/img/connectors/collapsed-last.png diff --git a/WebContent/VAADIN/themes/runo/tree/img/connectors/collapsed.png b/WebContent/VAADIN/themes/runo/tree/img/connectors/collapsed.png Binary files differnew file mode 100644 index 0000000000..db4d41cccd --- /dev/null +++ b/WebContent/VAADIN/themes/runo/tree/img/connectors/collapsed.png diff --git a/WebContent/VAADIN/themes/runo/tree/img/connectors/connector-item.png b/WebContent/VAADIN/themes/runo/tree/img/connectors/connector-item.png Binary files differnew file mode 100644 index 0000000000..b4d0d7aa56 --- /dev/null +++ b/WebContent/VAADIN/themes/runo/tree/img/connectors/connector-item.png diff --git a/WebContent/VAADIN/themes/runo/tree/img/connectors/connector.png b/WebContent/VAADIN/themes/runo/tree/img/connectors/connector.png Binary files differnew file mode 100644 index 0000000000..a93f458787 --- /dev/null +++ b/WebContent/VAADIN/themes/runo/tree/img/connectors/connector.png diff --git a/WebContent/VAADIN/themes/runo/tree/img/connectors/expanded-last.png b/WebContent/VAADIN/themes/runo/tree/img/connectors/expanded-last.png Binary files differnew file mode 100644 index 0000000000..504b715122 --- /dev/null +++ b/WebContent/VAADIN/themes/runo/tree/img/connectors/expanded-last.png diff --git a/WebContent/VAADIN/themes/runo/tree/img/connectors/expanded.png b/WebContent/VAADIN/themes/runo/tree/img/connectors/expanded.png Binary files differnew file mode 100644 index 0000000000..5c036ed038 --- /dev/null +++ b/WebContent/VAADIN/themes/runo/tree/img/connectors/expanded.png diff --git a/src/com/vaadin/terminal/gwt/client/ui/VTree.java b/src/com/vaadin/terminal/gwt/client/ui/VTree.java index a1647c2c52..d7f575d675 100644 --- a/src/com/vaadin/terminal/gwt/client/ui/VTree.java +++ b/src/com/vaadin/terminal/gwt/client/ui/VTree.java @@ -287,7 +287,8 @@ public class VTree extends FocusElementPanel implements Paintable, childTree.childNodeContainer.addStyleDependentName("root"); } if (childTree != null) { - childTree.addStyleDependentName("last"); + boolean leaf = !uidl.getTag().equals("node"); + childTree.addStyleDependentName(leaf ? "leaf-last" : "last"); childTree.childNodeContainer.addStyleDependentName("last"); } final String selectMode = uidl.getStringAttribute("selectmode"); @@ -1090,9 +1091,8 @@ public class VTree extends FocusElementPanel implements Paintable, childNodeContainer.add(childTree); } if (!i.hasNext()) { - childTree - .addStyleDependentName(childTree.isLeaf() ? "leaf-last" - : "last"); + childTree.addStyleDependentName(childTree.isLeaf() + ? "leaf-last" : "last"); childTree.childNodeContainer.addStyleDependentName("last"); } } diff --git a/src/com/vaadin/ui/themes/BaseTheme.java b/src/com/vaadin/ui/themes/BaseTheme.java index c8ba08d30d..b501f8a05c 100644 --- a/src/com/vaadin/ui/themes/BaseTheme.java +++ b/src/com/vaadin/ui/themes/BaseTheme.java @@ -44,4 +44,10 @@ public class BaseTheme { @Deprecated public static final String PANEL_LIGHT = "light"; + /** + * Adds the connector lines between a parent node and its child nodes to + * indicate the tree hierarchy better. + */ + public static final String TREE_CONNECTORS = "connectors"; + }
\ No newline at end of file diff --git a/tests/src/com/vaadin/tests/components/tree/TreeConnectors.html b/tests/src/com/vaadin/tests/components/tree/TreeConnectors.html new file mode 100644 index 0000000000..b76c65fa69 --- /dev/null +++ b/tests/src/com/vaadin/tests/components/tree/TreeConnectors.html @@ -0,0 +1,67 @@ +<?xml version="1.0" encoding="UTF-8"?> +<!DOCTYPE html PUBLIC "-//W3C//DTD XHTML 1.0 Strict//EN" "http://www.w3.org/TR/xhtml1/DTD/xhtml1-strict.dtd"> +<html xmlns="http://www.w3.org/1999/xhtml" xml:lang="en" lang="en"> +<head profile="http://selenium-ide.openqa.org/profiles/test-case"> +<meta http-equiv="Content-Type" content="text/html; charset=UTF-8" /> +<link rel="selenium.base" href="/" /> +<title>TreeConnectors</title> +</head> +<body> +<table cellpadding="1" cellspacing="1" border="1"> +<thead> +<tr><td rowspan="1" colspan="3">TreeConnectors</td></tr> +</thead><tbody> +<tr> + <td>open</td> + <td>/run/TreeConnectors?theme=base</td> + <td></td> +</tr> +<tr> + <td>screenCapture</td> + <td></td> + <td>base</td> +</tr> +<tr> + <td>open</td> + <td>/run/TreeConnectors?theme=reindeer</td> + <td></td> +</tr> +<tr> + <td>screenCapture</td> + <td></td> + <td>reindeer</td> +</tr> +<tr> + <td>open</td> + <td>/run/TreeConnectors?theme=runo</td> + <td></td> +</tr> +<tr> + <td>screenCapture</td> + <td></td> + <td>runo</td> +</tr> +<tr> + <td>open</td> + <td>/run/TreeConnectors?theme=liferay</td> + <td></td> +</tr> +<tr> + <td>screenCapture</td> + <td></td> + <td>liferay</td> +</tr> +<tr> + <td>open</td> + <td>/run/TreeConnectors?theme=chameleon</td> + <td></td> +</tr> +<tr> + <td>screenCapture</td> + <td></td> + <td>chameleon</td> +</tr> + +</tbody></table> +</body> +</html> diff --git a/tests/src/com/vaadin/tests/components/tree/TreeConnectors.java b/tests/src/com/vaadin/tests/components/tree/TreeConnectors.java new file mode 100644 index 0000000000..08d4df0003 --- /dev/null +++ b/tests/src/com/vaadin/tests/components/tree/TreeConnectors.java @@ -0,0 +1,85 @@ +package com.vaadin.tests.components.tree; + +import com.vaadin.data.Item; +import com.vaadin.data.util.HierarchicalContainer; +import com.vaadin.tests.components.TestBase; +import com.vaadin.ui.Tree; +import com.vaadin.ui.themes.BaseTheme; + +@SuppressWarnings("serial") +public class TreeConnectors extends TestBase { + + @Override + protected void setup() { + final Tree tree = new Tree(null, createContainer()); + tree.addStyleName(BaseTheme.TREE_CONNECTORS); + for (Object rootItems : tree.rootItemIds()) { + tree.expandItemsRecursively(rootItems); + } + tree.setChildrenAllowed("Item 73", false); + + addComponent(tree); + } + + @Override + protected String getDescription() { + return "Tree nodes should be connected with lines indicating the hierarchy."; + } + + @Override + protected Integer getTicketNumber() { + return 6745; + } + + private HierarchicalContainer createContainer() { + HierarchicalContainer cont = new HierarchicalContainer(); + cont.addContainerProperty("name", String.class, ""); + + for (int i = 0; i < 20; i++) { + Item item = cont.addItem("Item " + i); + item.getItemProperty("name").setValue("Item " + i); + cont.setChildrenAllowed("Item " + i, false); + + if (i == 1 || i == 4) { + cont.setChildrenAllowed("Item " + i, true); + } + + // Add three items to item 1 + if (i > 1 && i < 4) { + cont.setParent("Item " + i, "Item 1"); + } + + // Add 5 items to item 4 + if (i > 4 && i < 10) { + cont.setChildrenAllowed("Item " + i, true); + + if (i == 7) { + item = cont.addItem("Item 71"); + item.getItemProperty("name").setValue("Item 71"); + cont.setParent("Item 71", "Item " + i); + cont.setChildrenAllowed("Item 71", false); + + item = cont.addItem("Item 72"); + item.getItemProperty("name").setValue("Item 72"); + cont.setParent("Item 72", "Item " + i); + cont.setChildrenAllowed("Item 72", true); + + item = cont.addItem("Item 73"); + item.getItemProperty("name").setValue("Item 73"); + cont.setParent("Item 73", "Item 72"); + cont.setChildrenAllowed("Item 73", true); + + item = cont.addItem("Item 74"); + item.getItemProperty("name").setValue("Item 74"); + cont.setParent("Item 74", "Item " + i); + cont.setChildrenAllowed("Item 74", true); + } + + cont.setParent("Item " + i, "Item " + (i - 1)); + + } + } + + return cont; + } +} |
