Skip to content

Commit 2604f41

Browse files
ngonzalezpazFCjavier-godoy
ngonzalezpazFC
authored and
javier-godoy
committed
feat(demo): add tabs for demos, add source code section
1 parent 28c53c2 commit 2604f41

File tree

7 files changed

+275
-99
lines changed

7 files changed

+275
-99
lines changed

‎src/test/java/com/flowingcode/vaadin/addons/chipfield/BinderDemo.java‎

Lines changed: 34 additions & 0 deletions
Original file line numberDiff line numberDiff line change
@@ -0,0 +1,34 @@
1+
package com.flowingcode.vaadin.addons.chipfield;
2+
3+
import com.vaadin.flow.component.button.Button;
4+
import com.vaadin.flow.component.notification.Notification;
5+
import com.vaadin.flow.component.notification.Notification.Position;
6+
import com.vaadin.flow.component.orderedlayout.VerticalLayout;
7+
import com.vaadin.flow.data.binder.Binder;
8+
import java.util.Arrays;
9+
import java.util.stream.Collectors;
10+
11+
@SuppressWarnings("serial")
12+
public class BinderDemo extends VerticalLayout {
13+
14+
public BinderDemo() {
15+
Planet p = new Planet("A new planet");
16+
ChipField<String> chf5 = new ChipField<>(
17+
"Choose planet features (Binder demo, try with: 'Rings', 'Moons', 'Water', etc.)");
18+
chf5.setWidth("500px");
19+
chf5.setItems(Arrays.asList("Rings", "Moons", "Water", "Rocks", "Lava", "Ice", "Cold", "Heat", "Atmosphere"));
20+
Binder<Planet> binder = new Binder<>();
21+
binder.bind(chf5, Planet::getConfiguration, Planet::setConfiguration);
22+
binder.setBean(p);
23+
Button show = new Button("Show planet configuration");
24+
show.addClickListener(
25+
event -> Notification.show(
26+
"Planet: " + p.getName() + ", features: "
27+
+ p.getConfiguration().stream().collect(Collectors.joining(",")),
28+
5000, Position.BOTTOM_END));
29+
chf5.addValueChangeListener(
30+
newItem -> Notification.show("Items: " + newItem.getValue(), 5000, Position.BOTTOM_END));
31+
32+
add(chf5, show);
33+
}
34+
}

‎src/test/java/com/flowingcode/vaadin/addons/chipfield/ChipfieldDemoView.java‎

Lines changed: 116 additions & 0 deletions
Original file line numberDiff line numberDiff line change
@@ -0,0 +1,116 @@
1+
package com.flowingcode.vaadin.addons.chipfield;
2+
3+
import com.vaadin.flow.component.checkbox.Checkbox;
4+
import com.vaadin.flow.component.html.IFrame;
5+
import com.vaadin.flow.component.orderedlayout.VerticalLayout;
6+
import com.vaadin.flow.component.splitlayout.SplitLayout;
7+
import com.vaadin.flow.component.splitlayout.SplitLayout.Orientation;
8+
import com.vaadin.flow.component.tabs.Tab;
9+
import com.vaadin.flow.component.tabs.Tabs;
10+
import com.vaadin.flow.router.Route;
11+
12+
@SuppressWarnings("serial")
13+
@Route("chipfield")
14+
public class ChipfieldDemoView extends VerticalLayout {
15+
16+
private static final String DATAPROVIDER_DEMO = "Data Provider";
17+
private static final String RESTRICTED_DEMO = "Restricted";
18+
private static final String DISABLED_DEMO = "Disabled";
19+
private static final String BINDER_DEMO = "Binder";
20+
private static final String DATAPROVIDER_SOURCE = "https://github.com/FlowingCode/ChipFieldAddon/blob/master/src/test/java/com/flowingcode/vaadin/addons/chipfield/DataProviderDemo.java";
21+
private static final String RESTRICTED_SOURCE = "https://github.com/FlowingCode/ChipFieldAddon/blob/master/src/test/java/com/flowingcode/vaadin/addons/chipfield/RestrictedDemo.java";
22+
private static final String DISABLED_SOURCE = "https://github.com/FlowingCode/ChipFieldAddon/blob/master/src/test/java/com/flowingcode/vaadin/addons/chipfield/DisabledDemo.java";
23+
private static final String BINDER_SOURCE = "https://github.com/FlowingCode/ChipFieldAddon/blob/master/src/test/java/com/flowingcode/vaadin/addons/chipfield/BinderDemo.java";
24+
25+
public ChipfieldDemoView() {
26+
SplitLayout layout = new SplitLayout();
27+
layout.setOrientation(Orientation.HORIZONTAL);
28+
layout.addToPrimary(new DataProviderDemo());
29+
layout.setSizeFull();
30+
IFrame iframe = new IFrame();
31+
iframe.getElement().setAttribute("frameborder", "0");
32+
iframe.getElement().setAttribute("srcdoc", getSrcdoc(DATAPROVIDER_DEMO));
33+
iframe.setSizeFull();
34+
layout.addToSecondary(iframe);
35+
36+
Checkbox codeCB = new Checkbox("Show Source Code");
37+
codeCB.setValue(true);
38+
codeCB.addValueChangeListener(cb -> {
39+
if (cb.getValue()) {
40+
layout.setSplitterPosition(50);
41+
} else {
42+
layout.setSplitterPosition(100);
43+
}
44+
});
45+
Tabs tabs = new Tabs();
46+
Tab demo1 = new Tab(DATAPROVIDER_DEMO);
47+
Tab demo2 = new Tab(RESTRICTED_DEMO);
48+
Tab demo3 = new Tab(DISABLED_DEMO);
49+
Tab demo4 = new Tab(BINDER_DEMO);
50+
tabs.setWidthFull();
51+
tabs.add(demo1, demo2, demo3, demo4, codeCB);
52+
add(tabs, layout);
53+
54+
setSizeFull();
55+
56+
tabs.addSelectedChangeListener(e -> {
57+
this.removeAll();
58+
switch (e.getSelectedTab().getLabel()) {
59+
case DATAPROVIDER_DEMO:
60+
iframe.getElement().setAttribute("srcdoc", getSrcdoc(DATAPROVIDER_DEMO));
61+
layout.addToPrimary(new DataProviderDemo());
62+
layout.addToSecondary(iframe);
63+
add(tabs, layout);
64+
break;
65+
case "Restricted":
66+
iframe.getElement().setAttribute("srcdoc", getSrcdoc(RESTRICTED_DEMO));
67+
layout.addToPrimary(new RestrictedDemo());
68+
layout.addToSecondary(iframe);
69+
add(tabs, layout);
70+
break;
71+
case "Disabled":
72+
iframe.getElement().setAttribute("srcdoc", getSrcdoc(DISABLED_DEMO));
73+
layout.addToPrimary(new DisabledDemo());
74+
layout.addToSecondary(iframe);
75+
add(tabs, layout);
76+
break;
77+
case "Binder":
78+
iframe.getElement().setAttribute("srcdoc", getSrcdoc(BINDER_DEMO));
79+
layout.addToPrimary(new BinderDemo());
80+
layout.addToSecondary(iframe);
81+
add(tabs, layout);
82+
break;
83+
default:
84+
add(tabs, new DataProviderDemo());
85+
break;
86+
}
87+
});
88+
}
89+
90+
private String getSrcdoc(String demo) {
91+
String response;
92+
switch (demo) {
93+
case DATAPROVIDER_DEMO:
94+
response = "<html style=\"overflow-y:hidden; height:100%;\"><body style=\"overflow-y: scroll; height:100%;\"><script src=\"http://gist-it.appspot.com/"
95+
+ DATAPROVIDER_SOURCE + "\"></script></body></html>";
96+
break;
97+
case RESTRICTED_DEMO:
98+
response = "<html style=\"overflow-y:hidden; height:100%;\"><body style=\"overflow-y: scroll; height:100%;\"><script src=\"http://gist-it.appspot.com/"
99+
+ RESTRICTED_SOURCE + "\"></script></body></html>";
100+
break;
101+
case DISABLED_DEMO:
102+
response = "<html style=\"overflow-y:hidden; height:100%;\"><body style=\"overflow-y: scroll; height:100%;\"><script src=\"https://gist-it.appspot.com/"
103+
+ DISABLED_SOURCE + "\"></script></body></html>";
104+
break;
105+
case BINDER_DEMO:
106+
response = "<html style=\"overflow-y:hidden; height:100%;\"><body style=\"overflow-y: scroll; height:100%;\"><script src=\"https://gist-it.appspot.com/"
107+
+ BINDER_SOURCE + "\"></script></body></html>";
108+
break;
109+
default:
110+
response = "<html style=\"overflow-y:hidden; height:100%;\"><body style=\"overflow-y: scroll; height:100%;\"><script src=\"https://gist-it.appspot.com/"
111+
+ DATAPROVIDER_SOURCE + "\"></script></body></html>";
112+
break;
113+
}
114+
return response;
115+
}
116+
}

‎src/test/java/com/flowingcode/vaadin/addons/chipfield/DataProviderDemo.java‎

Lines changed: 55 additions & 0 deletions
Original file line numberDiff line numberDiff line change
@@ -0,0 +1,55 @@
1+
package com.flowingcode.vaadin.addons.chipfield;
2+
3+
import com.vaadin.flow.component.button.Button;
4+
import com.vaadin.flow.component.notification.Notification;
5+
import com.vaadin.flow.component.notification.Notification.Position;
6+
import com.vaadin.flow.component.orderedlayout.HorizontalLayout;
7+
import com.vaadin.flow.component.orderedlayout.VerticalLayout;
8+
import com.vaadin.flow.data.provider.ListDataProvider;
9+
import java.util.ArrayList;
10+
import java.util.Arrays;
11+
import java.util.List;
12+
import java.util.stream.Collectors;
13+
14+
@SuppressWarnings("serial")
15+
public class DataProviderDemo extends VerticalLayout {
16+
17+
public DataProviderDemo() {
18+
List<Planet> availablePlanets = new ArrayList<>(
19+
Arrays.asList(new Planet("Mercury"), new Planet("Venus"), new Planet("Earth"), new Planet("Mars"),
20+
new Planet("Jupiter"), new Planet("Saturn"), new Planet("Uranus"), new Planet("Neptune")));
21+
ListDataProvider<Planet> ldp = new ListDataProvider<>(availablePlanets);
22+
23+
ChipField<Planet> chf = new ChipField<>("Select some planets (Mercury, Venus, Earth, etc.)",
24+
planet -> planet.getName());
25+
chf.setWidth("100%");
26+
chf.setDataProvider(ldp);
27+
chf.setClosable(true);
28+
chf.setNewItemHandler(label -> new Planet(label));
29+
30+
Button b = new Button("Obtain selected planets");
31+
b.addClickListener(event -> Notification.show(
32+
"Planets: " + chf.getValue().stream().map(planet -> planet.getName()).collect(Collectors.joining(",")),
33+
5000, Position.BOTTOM_END));
34+
35+
Button b2 = new Button("Add random planet");
36+
b2.addClickListener(event -> {
37+
Planet p = new Planet("Planet" + Math.round(Math.random() * 10000));
38+
availablePlanets.add(p);
39+
ldp.refreshAll();
40+
chf.addSelectedItem(p);
41+
});
42+
43+
chf.addChipCreatedListener(
44+
ev -> Notification.show("Chip: " + ev.getChipLabel() + " Created by client: " + ev.isFromClient() + "!",
45+
5000, Position.BOTTOM_END));
46+
chf.addChipRemovedListener(
47+
ev -> Notification.show("Chip: " + ev.getChipLabel() + " Removed by client: " + ev.isFromClient() + "!",
48+
5000, Position.BOTTOM_END));
49+
chf.addChipClickedListener(
50+
ev -> Notification.show("Chip: " + ev.getChipLabel() + " Clicked!", 5000, Position.BOTTOM_END));
51+
52+
VerticalLayout vl = new VerticalLayout(chf, new HorizontalLayout(b, b2));
53+
add(vl);
54+
}
55+
}

‎src/test/java/com/flowingcode/vaadin/addons/chipfield/DemoView.java‎

Lines changed: 7 additions & 99 deletions
Original file line numberDiff line numberDiff line change
@@ -19,110 +19,18 @@
1919
*/
2020
package com.flowingcode.vaadin.addons.chipfield;
2121

22-
import com.vaadin.flow.component.button.Button;
23-
import com.vaadin.flow.component.notification.Notification;
24-
import com.vaadin.flow.component.notification.Notification.Position;
25-
import com.vaadin.flow.component.orderedlayout.HorizontalLayout;
2622
import com.vaadin.flow.component.orderedlayout.VerticalLayout;
27-
import com.vaadin.flow.data.binder.Binder;
28-
import com.vaadin.flow.data.provider.ListDataProvider;
23+
import com.vaadin.flow.router.BeforeEnterEvent;
24+
import com.vaadin.flow.router.BeforeEnterObserver;
2925
import com.vaadin.flow.router.Route;
30-
import java.util.ArrayList;
31-
import java.util.Arrays;
32-
import java.util.List;
33-
import java.util.stream.Collectors;
3426

3527
@SuppressWarnings("serial")
3628
@Route("")
37-
public class DemoView extends VerticalLayout {
29+
public class DemoView extends VerticalLayout implements BeforeEnterObserver {
3830

39-
public DemoView() {
40-
List<Planet> availablePlanets = new ArrayList<>(Arrays.asList(new Planet("Mercury"), new Planet("Venus"), new Planet("Earth")
41-
, new Planet("Mars"), new Planet("Jupiter"), new Planet("Saturn"), new Planet("Uranus"), new Planet("Neptune")));
42-
ListDataProvider<Planet> ldp = new ListDataProvider<>(availablePlanets);
43-
44-
ChipField<Planet> chf = new ChipField<>("Select some planets (Mercury, Venus, Earth, etc.)", planet->planet.getName());
45-
chf.setWidth("100%");
46-
chf.setDataProvider(ldp);
47-
chf.setClosable(true);
48-
chf.setNewItemHandler(label->new Planet(label));
31+
@Override
32+
public void beforeEnter(BeforeEnterEvent event) {
33+
event.forwardTo(ChipfieldDemoView.class);
34+
}
4935

50-
Button b = new Button("Obtain selected planets");
51-
b.addClickListener(event->Notification.show("Planets: " + chf.getValue().stream().map(planet->planet.getName()).collect(Collectors.joining(",")),5000,Position.BOTTOM_END));
52-
53-
Button b2 = new Button("Add random planet");
54-
b2.addClickListener(event->{
55-
Planet p = new Planet("Planet" + Math.round(Math.random()*10000));
56-
availablePlanets.add(p);
57-
ldp.refreshAll();
58-
chf.addSelectedItem(p);
59-
});
60-
61-
chf.addChipCreatedListener(ev->Notification.show("Chip: " + ev.getChipLabel() + " Created by client: " + ev.isFromClient() + "!",5000,Position.BOTTOM_END));
62-
chf.addChipRemovedListener(ev->Notification.show("Chip: " + ev.getChipLabel() + " Removed by client: " + ev.isFromClient() + "!",5000,Position.BOTTOM_END));
63-
chf.addChipClickedListener(ev->Notification.show("Chip: " + ev.getChipLabel() + " Clicked!", 5000, Position.BOTTOM_END));
64-
65-
VerticalLayout vl = new VerticalLayout(chf,new HorizontalLayout(b,b2));
66-
add(vl);
67-
68-
ChipField<String> chf3 = new ChipField<>("Select some planets (Restricted input, allowed pattern [a-zA-Z])");
69-
chf3.setWidth("500px");
70-
chf3.setAvailableItems(Arrays.asList("Mercury", "Venus", "Earth", "Mars", "Jupiter", "Saturn", "Uranus", "Neptune"));
71-
chf3.setAllowedPattern("[a-zA-Z]");
72-
chf3.setClosable(true);
73-
74-
vl = new VerticalLayout(chf3);
75-
add(vl);
76-
77-
ChipField<String> chf4 = new ChipField<>("Disabled", "Mercury", "Venus", "Earth");
78-
chf4.addSelectedItem("Mercury");
79-
chf4.addSelectedItem("Venus");
80-
chf4.setDisabled(true);
81-
82-
vl = new VerticalLayout(chf4);
83-
add(vl);
84-
85-
Planet p = new Planet("A new planet");
86-
ChipField<String> chf5 = new ChipField<>("Choose planet features (Binder demo, try with: 'Rings', 'Moons', 'Water', etc.)");
87-
chf5.setWidth("500px");
88-
chf5.setItems(Arrays.asList("Rings", "Moons", "Water", "Rocks", "Lava", "Ice", "Cold", "Heat", "Atmosphere"));
89-
Binder<Planet> binder = new Binder<>();
90-
binder.bind(chf5,Planet::getConfiguration,Planet::setConfiguration);
91-
binder.setBean(p);
92-
Button show = new Button("Show planet configuration");
93-
show.addClickListener(event->Notification.show("Planet: " + p.getName() + ", features: " + p.getConfiguration().stream().collect(Collectors.joining(",")),5000,Position.BOTTOM_END));
94-
chf5.addValueChangeListener(newItem->Notification.show("Items: " + newItem.getValue(),5000,Position.BOTTOM_END));
95-
96-
vl = new VerticalLayout(chf5,show);
97-
add(vl);
98-
99-
}
100-
101-
102-
public static class Planet {
103-
private String name;
104-
private List<String> configuration = new ArrayList<>();
105-
106-
public Planet(String name) {
107-
this.name = name;
108-
}
109-
110-
public String getName() {
111-
return name;
112-
}
113-
114-
public void setName(String name) {
115-
this.name = name;
116-
}
117-
118-
public List<String> getConfiguration() {
119-
return configuration;
120-
}
121-
122-
public void setConfiguration(List<String> configuration) {
123-
this.configuration = configuration;
124-
}
125-
126-
}
127-
12836
}

‎src/test/java/com/flowingcode/vaadin/addons/chipfield/DisabledDemo.java‎

Lines changed: 15 additions & 0 deletions
Original file line numberDiff line numberDiff line change
@@ -0,0 +1,15 @@
1+
package com.flowingcode.vaadin.addons.chipfield;
2+
3+
import com.vaadin.flow.component.orderedlayout.VerticalLayout;
4+
5+
@SuppressWarnings("serial")
6+
public class DisabledDemo extends VerticalLayout {
7+
public DisabledDemo() {
8+
ChipField<String> chf4 = new ChipField<>("Disabled", "Mercury", "Venus", "Earth");
9+
chf4.addSelectedItem("Mercury");
10+
chf4.addSelectedItem("Venus");
11+
chf4.setDisabled(true);
12+
13+
add(chf4);
14+
}
15+
}

‎src/test/java/com/flowingcode/vaadin/addons/chipfield/Planet.java‎

Lines changed: 30 additions & 0 deletions
Original file line numberDiff line numberDiff line change
@@ -0,0 +1,30 @@
1+
package com.flowingcode.vaadin.addons.chipfield;
2+
3+
import java.util.ArrayList;
4+
import java.util.List;
5+
6+
public class Planet {
7+
private String name;
8+
private List<String> configuration = new ArrayList<>();
9+
10+
public Planet(String name) {
11+
this.name = name;
12+
}
13+
14+
public String getName() {
15+
return name;
16+
}
17+
18+
public void setName(String name) {
19+
this.name = name;
20+
}
21+
22+
public List<String> getConfiguration() {
23+
return configuration;
24+
}
25+
26+
public void setConfiguration(List<String> configuration) {
27+
this.configuration = configuration;
28+
}
29+
}
30+

‎src/test/java/com/flowingcode/vaadin/addons/chipfield/RestrictedDemo.java‎

Lines changed: 18 additions & 0 deletions
Original file line numberDiff line numberDiff line change
@@ -0,0 +1,18 @@
1+
package com.flowingcode.vaadin.addons.chipfield;
2+
3+
import com.vaadin.flow.component.orderedlayout.VerticalLayout;
4+
import java.util.Arrays;
5+
6+
@SuppressWarnings("serial")
7+
public class RestrictedDemo extends VerticalLayout {
8+
public RestrictedDemo() {
9+
ChipField<String> chf3 = new ChipField<>("Select some planets (Restricted input, allowed pattern [a-zA-Z])");
10+
chf3.setWidth("500px");
11+
chf3.setAvailableItems(
12+
Arrays.asList("Mercury", "Venus", "Earth", "Mars", "Jupiter", "Saturn", "Uranus", "Neptune"));
13+
chf3.setAllowedPattern("[a-zA-Z]");
14+
chf3.setClosable(true);
15+
16+
add(chf3);
17+
}
18+
}

0 commit comments

Comments
 (0)