import com.itmill.toolkit.demo.sampler.features.buttons.ButtonLink;
import com.itmill.toolkit.demo.sampler.features.buttons.ButtonPush;
import com.itmill.toolkit.demo.sampler.features.buttons.ButtonSwitch;
+import com.itmill.toolkit.demo.sampler.features.commons.Errors;
import com.itmill.toolkit.demo.sampler.features.commons.Icons;
import com.itmill.toolkit.demo.sampler.features.commons.Tooltips;
+import com.itmill.toolkit.demo.sampler.features.commons.Validation;
+import com.itmill.toolkit.demo.sampler.features.form.FormBasic;
import com.itmill.toolkit.demo.sampler.features.layouts.HorizontalLayoutBasic;
import com.itmill.toolkit.demo.sampler.features.layouts.LayoutAlignment;
import com.itmill.toolkit.demo.sampler.features.layouts.LayoutSpacing;
new Tabsheets(), //
new Accordions(), //
new Panels(), //
+ // new Forms(), not done yet
new Windows(), //
});
}
public Commons() {
super("Commons", new Feature[] {
//
- new Tooltips(), // tooltips
- new Icons(), // icons
+ new Tooltips(), //
+ new Icons(), //
+ new Errors(), //
+ new Validation(), //
});
}
}
}
}
+ public static class Forms extends FeatureSet {
+ public Forms() {
+ super("Forms", new Feature[] {
+ //
+ new FormBasic(), //
+ });
+ }
+ }
+
public static class Windows extends FeatureSet {
public Windows() {
super("Windows", new Feature[] {
--- /dev/null
+package com.itmill.toolkit.demo.sampler.features.commons;
+
+import com.itmill.toolkit.demo.sampler.APIResource;
+import com.itmill.toolkit.demo.sampler.Feature;
+import com.itmill.toolkit.demo.sampler.NamedExternalResource;
+import com.itmill.toolkit.demo.sampler.features.notifications.NotificationError;
+import com.itmill.toolkit.ui.Component;
+import com.itmill.toolkit.ui.Window;
+
+public class Errors extends Feature {
+
+ private static final String desc = "A <i>component error</i> can be set to"
+ + " indicate an error - an error indicator icon will appear,"
+ + " and the error message will appear as a 'tooltip' when"
+ + " mousing over.<br/>"
+ + "You can do this on almost any component, but please note"
+ + " that from a usability standpoint it's not always the best"
+ + " solution.<br/>"
+ + "<i>Component error</i> is most useful to indicate what is"
+ + " causing the error (e.g an 'email' TextField), so that the user"
+ + " can find and correct the problem. <br/>"
+ + "On the other hand, it is usually not a good idea to set an error"
+ + " on a Button: the user can not click 'Save' differently to"
+ + " correct the error.<br/>"
+ + "If there is no component causing the error, consider using a"
+ + " (styled) Label or a Notification to indicate the error.";
+
+ public String getDescription() {
+ return desc;
+ }
+
+ public APIResource[] getRelatedAPI() {
+ return new APIResource[] { new APIResource(Component.class),
+ new APIResource(Window.Notification.class) };
+ }
+
+ public Class[] getRelatedFeatures() {
+ // TODO link validation sample, form sample
+ return new Class[] { NotificationError.class };
+ }
+
+ public NamedExternalResource[] getRelatedResources() {
+ // TODO Auto-generated method stub
+ return null;
+ }
+
+}
--- /dev/null
+package com.itmill.toolkit.demo.sampler.features.commons;
+
+import com.itmill.toolkit.terminal.UserError;
+import com.itmill.toolkit.ui.Panel;
+import com.itmill.toolkit.ui.TextField;
+import com.itmill.toolkit.ui.VerticalLayout;
+
+public class ErrorsExample extends VerticalLayout {
+
+ public ErrorsExample() {
+ setSpacing(true);
+
+ Panel panel = new Panel("Configure this");
+ panel.setComponentError(new UserError("This panel contains errors"));
+ addComponent(panel);
+
+ TextField input = new TextField("Input");
+ input
+ .setComponentError(new UserError(
+ "This field is never satisfied."));
+ panel.addComponent(input);
+
+ }
+}
+ "Note that <i>description</i> is more generic term than"
+ " <i>tooltip</i> - a component might choose to show"
+ " the description in another way, if that's more appropriate"
- + " for that compoenent.)";
+ + " for that component.)";
}
@Override
--- /dev/null
+package com.itmill.toolkit.demo.sampler.features.commons;
+
+import com.itmill.toolkit.data.Validatable;
+import com.itmill.toolkit.data.Validator;
+import com.itmill.toolkit.demo.sampler.APIResource;
+import com.itmill.toolkit.demo.sampler.Feature;
+import com.itmill.toolkit.demo.sampler.NamedExternalResource;
+
+public class Validation extends Feature {
+
+ private static final String desc = "";
+
+ public String getDescription() {
+ return desc;
+ }
+
+ public APIResource[] getRelatedAPI() {
+ return new APIResource[] { new APIResource(Validatable.class),
+ new APIResource(Validator.class) };
+ }
+
+ public Class[] getRelatedFeatures() {
+ // TODO link form sample
+ return new Class[] { Errors.class };
+ }
+
+ public NamedExternalResource[] getRelatedResources() {
+ // TODO Auto-generated method stub
+ return null;
+ }
+
+}
--- /dev/null
+package com.itmill.toolkit.demo.sampler.features.commons;
+
+import java.util.HashSet;
+
+import com.itmill.toolkit.data.Validator;
+import com.itmill.toolkit.data.Property.ValueChangeEvent;
+import com.itmill.toolkit.data.Property.ValueChangeListener;
+import com.itmill.toolkit.data.validator.CompositeValidator;
+import com.itmill.toolkit.data.validator.StringLengthValidator;
+import com.itmill.toolkit.ui.Label;
+import com.itmill.toolkit.ui.TextField;
+import com.itmill.toolkit.ui.VerticalLayout;
+
+public class ValidationExample extends VerticalLayout {
+
+ HashSet usernames = new HashSet();
+
+ public ValidationExample() {
+ setSpacing(true);
+
+ TextField pin = new TextField("PIN");
+ pin.setWidth("50px");
+ // optional; validate at once instead of when clicking 'save' (e.g)
+ pin.setImmediate(true);
+ addComponent(pin);
+ // add the validator
+ pin.addValidator(new StringLengthValidator("Must be 4-6 characters", 4,
+ 6, false));
+
+ TextField username = new TextField("Username");
+ // optional; validate at once instead of when clicking 'save' (e.g)
+ username.setImmediate(true);
+ addComponent(username);
+ CompositeValidator usernameValidator = new CompositeValidator();
+ username.addValidator(usernameValidator);
+ usernameValidator.addValidator(new StringLengthValidator(
+ "Username must be at least 4 characters", 4, 255, false));
+ usernameValidator.addValidator(new Validator() {
+
+ public boolean isValid(Object value) {
+ return !usernames.contains(value);
+ }
+
+ public void validate(Object value) throws InvalidValueException {
+ if (!isValid(value)) {
+ throw new Validator.InvalidValueException("Username "
+ + value + " already in use");
+ }
+ usernames.add(value);
+ }
+ });
+ username.addListener(new ValueChangeListener() {
+ public void valueChange(ValueChangeEvent event) {
+ TextField tf = (TextField) event.getProperty();
+ tf.validate();
+ if (tf.isValid()) {
+ addComponent(new Label("Added " + tf.getValue()
+ + " to usernames"));
+ }
+ }
+ });
+
+ }
+}
--- /dev/null
+package com.itmill.toolkit.demo.sampler.features.form;
+
+import com.itmill.toolkit.demo.sampler.APIResource;
+import com.itmill.toolkit.demo.sampler.Feature;
+import com.itmill.toolkit.demo.sampler.NamedExternalResource;
+import com.itmill.toolkit.ui.Component;
+
+public class FormBasic extends Feature {
+
+ @Override
+ public Component getExample() {
+ return new FormPojoExample();
+ }
+
+ @Override
+ public String getDescription() {
+ return "A basic form";
+ }
+
+ @Override
+ public APIResource[] getRelatedAPI() {
+ // TODO Auto-generated method stub
+ return null;
+ }
+
+ @Override
+ public Class[] getRelatedFeatures() {
+ // TODO Auto-generated method stub
+ return null;
+ }
+
+ @Override
+ public NamedExternalResource[] getRelatedResources() {
+ // TODO Auto-generated method stub
+ return null;
+ }
+
+}
--- /dev/null
+package com.itmill.toolkit.demo.sampler.features.form;
+
+import java.util.Arrays;
+import java.util.Date;
+import java.util.UUID;
+
+import com.itmill.toolkit.data.Item;
+import com.itmill.toolkit.data.util.BeanItem;
+import com.itmill.toolkit.data.validator.StringLengthValidator;
+import com.itmill.toolkit.demo.sampler.ExampleUtil;
+import com.itmill.toolkit.ui.BaseFieldFactory;
+import com.itmill.toolkit.ui.Button;
+import com.itmill.toolkit.ui.ComboBox;
+import com.itmill.toolkit.ui.Component;
+import com.itmill.toolkit.ui.Field;
+import com.itmill.toolkit.ui.Form;
+import com.itmill.toolkit.ui.HorizontalLayout;
+import com.itmill.toolkit.ui.TextField;
+import com.itmill.toolkit.ui.VerticalLayout;
+import com.itmill.toolkit.ui.Window;
+import com.itmill.toolkit.ui.Button.ClickEvent;
+
+public class FormPojoExample extends VerticalLayout {
+
+ // the 'POJO' we're editing
+ Person person;
+
+ public FormPojoExample() {
+
+ person = new Person(); // a person POJO
+ BeanItem personItem = new BeanItem(person); // item from POJO
+
+ // create the Form
+ final Form personForm = new Form();
+ personForm.setWriteThrough(false); // we want explicit 'apply'
+ personForm.setInvalidCommitted(false); // no invalid values in datamodel
+ // FieldFactory for customizing the fields and adding validators
+ personForm.setFieldFactory(new PersonFieldFactory());
+ personForm.setItemDataSource(personItem); // bind to POJO via BeanItem
+ // determines which properties are shown, and in which order:
+ personForm.setVisibleItemProperties(Arrays.asList(new String[] {
+ "firstName", "lastName", "countryCode", "password",
+ "birthdate", "shoesize", "uuid" }));
+ addComponent(personForm); // add to layout
+
+ // the cancel / apply buttons
+ HorizontalLayout buttons = new HorizontalLayout();
+ buttons.setSpacing(true);
+ Button discardChanges = new Button("Discard changes",
+ new Button.ClickListener() {
+ public void buttonClick(ClickEvent event) {
+ personForm.discard();
+ }
+ });
+ discardChanges.setStyleName(Button.STYLE_LINK);
+ buttons.addComponent(discardChanges);
+ Button apply = new Button("Apply", new Button.ClickListener() {
+ public void buttonClick(ClickEvent event) {
+ personForm.commit();
+ }
+ });
+ buttons.addComponent(apply);
+ personForm.getLayout().addComponent(buttons);
+
+ // button for showing the internal state of the POJO
+ Button showPojoState = new Button("Show POJO internal state",
+ new Button.ClickListener() {
+ public void buttonClick(ClickEvent event) {
+ showPojoState();
+ }
+ });
+ addComponent(showPojoState);
+ // showPojoState();
+ }
+
+ private void showPojoState() {
+ Window.Notification n = new Window.Notification("POJO state",
+ Window.Notification.TYPE_TRAY_NOTIFICATION);
+ n.setPosition(Window.Notification.POSITION_CENTERED);
+ n.setDescription("First name: " + person.getFirstName()
+ + "<br/>Last name: " + person.getLastName() + "<br/>Country: "
+ + person.getCountryCode() + "<br/>Birthdate: "
+ + person.getBirthdate() + "<br/>Shoe size: "
+ + +person.getShoesize() + "<br/>Password: "
+ + person.getPassword() + "<br/>UUID: " + person.getUuid());
+ getWindow().showNotification(n);
+ }
+
+ private class PersonFieldFactory extends BaseFieldFactory {
+
+ final ComboBox countries = new ComboBox("Country");
+
+ public PersonFieldFactory() {
+ countries.setWidth("30em");
+ countries.setContainerDataSource(ExampleUtil.getISO3166Container());
+ countries
+ .setItemCaptionPropertyId(ExampleUtil.iso3166_PROPERTY_NAME);
+ countries.setItemIconPropertyId(ExampleUtil.iso3166_PROPERTY_FLAG);
+ countries.setFilteringMode(ComboBox.FILTERINGMODE_STARTSWITH);
+ }
+
+ @Override
+ public Field createField(Item item, Object propertyId,
+ Component uiContext) {
+ if ("countryCode".equals(propertyId)) {
+ // filtering ComboBox w/ country names
+ return countries;
+ }
+ Field f = super.createField(item, propertyId, uiContext);
+ if ("firstName".equals(propertyId)) {
+ TextField tf = (TextField) f;
+ tf.setRequired(true);
+ tf.setWidth("15em");
+ tf.addValidator(new StringLengthValidator(
+ "First Name must be 3-25 characters", 3, 25, false));
+ } else if ("lastName".equals(propertyId)) {
+ TextField tf = (TextField) f;
+ tf.setRequired(true);
+ tf.setWidth("20em");
+ tf.addValidator(new StringLengthValidator(
+ "Last Name must be 3-50 characters", 3, 50, false));
+ } else if ("password".equals(propertyId)) {
+ TextField tf = (TextField) f;
+ tf.setSecret(true);
+ tf.setRequired(true);
+ tf.setWidth("10em");
+ tf.addValidator(new StringLengthValidator(
+ "Password must be 6-20 characters", 6, 20, false));
+ } else if ("shoesize".equals(propertyId)) {
+ TextField tf = (TextField) f;
+ tf.setWidth("2em");
+ } else if ("uuid".equals(propertyId)) {
+ TextField tf = (TextField) f;
+ tf.setWidth("20em");
+ }
+
+ return f;
+ }
+ }
+
+ public class Person {
+ private String firstName = "";
+ private String lastName = "";
+ private Date birthdate;
+ private int shoesize = 42;
+ private String password = "";
+ private UUID uuid;
+ private String countryCode = "";
+
+ public Person() {
+ uuid = UUID.randomUUID();
+ }
+
+ public String getFirstName() {
+ return firstName;
+ }
+
+ public void setFirstName(String firstName) {
+ this.firstName = firstName;
+ }
+
+ public String getLastName() {
+ return lastName;
+ }
+
+ public void setLastName(String lastName) {
+ this.lastName = lastName;
+ }
+
+ public Date getBirthdate() {
+ return birthdate;
+ }
+
+ public void setBirthdate(Date birthdate) {
+ this.birthdate = birthdate;
+ }
+
+ public int getShoesize() {
+ return shoesize;
+ }
+
+ public void setShoesize(int shoesize) {
+ this.shoesize = shoesize;
+ }
+
+ public String getPassword() {
+ return password;
+ }
+
+ public void setPassword(String password) {
+ this.password = password;
+ }
+
+ public UUID getUuid() {
+ return uuid;
+ }
+
+ public String getCountryCode() {
+ return countryCode;
+ }
+
+ public void setCountryCode(String countryCode) {
+ this.countryCode = countryCode;
+ }
+
+ }
+}
delay
.setDescription("Delay before fading<br/>Pull all the way to the left to get -1, which means forever (click to hide).");
delay.setWidth("400px");
- delay.setHeight("20px");
delay.setMin(Notification.DELAY_FOREVER);
delay.setMax(10000);
addComponent(delay);