Tutorial08 - Building UI Elements Into Wizards
Introduction
Build in new UI elements into Datameer X wizards to store, access, and use properties values. This can be accomplished using the Java method populateDetailsWizardPage()
How to Build a UI Element
Overwrite the code within
populateDetailsWizardPage() (see example) below) in Datameer's SDK.
Example
package datameer.das.plugin.tutorial07;
import java.io.InputStream;
import java.util.List;
import org.apache.hadoop.conf.Configuration;
import org.apache.hadoop.mapred.InputSplit;
import datameer.com.google.common.collect.Lists;
import datameer.dap.sdk.common.Field;
import datameer.dap.sdk.common.GenericConfiguration;
import datameer.dap.sdk.common.RawRecord;
import datameer.dap.sdk.common.RawRecordCollector;
import datameer.dap.sdk.filestore.FileStore;
import datameer.dap.sdk.importjob.ParseConfiguration;
import datameer.dap.sdk.importjob.RecordParser;
import datameer.dap.sdk.importjob.RecordSchemaDetector;
import datameer.dap.sdk.importjob.TextBasedFileType;
import datameer.dap.sdk.property.FileUploadPropertyDefinition;
import datameer.dap.sdk.property.NumberValidator;
import datameer.dap.sdk.property.PropertyDefinition;
import datameer.dap.sdk.property.PropertyGroupDefinition;
import datameer.dap.sdk.property.PropertyType;
import datameer.dap.sdk.property.WizardPageDefinition;
import datameer.dap.sdk.property.handler.FileUploadHandler;
import datameer.dap.sdk.schema.ValueType;
import datameer.dap.sdk.widget.Option;
import datameer.dap.sdk.widget.OptionGroup;
public class ExamplePropertyFileType extends TextBasedFileType {
public static boolean _showTextarea = true;
@Override
public String getId() {
return ExamplePropertyFileType.class.getName();
}
@Override
public String getName() {
return "Example Property Types";
}
@Override
public RecordSchemaDetector<String> createRecordSchemaDetector(
datameer.dap.sdk.importjob.ImportFileType.FileTypeModel<String> model) {
// useless example implementation
return new RecordSchemaDetector<String>() {
@Override
public Field[] detectFields(InputSplit arg0, List<String> arg1) {
return new Field[] { new Field("firstColumn", ValueType.STRING) };
}
@Override
public boolean needsDataForSchemaDetection() {
return false;
}
};
}
@Override
public RecordParser<String> createRecordParser(Field[] fields, Configuration conf,
datameer.dap.sdk.importjob.ImportFileType.FileTypeModel<String> model) {
// useless example implementation
return new RecordParser<String>() {
@Override
public void configureRecordCollector(RawRecordCollector arg0) {
}
@Override
public void initSplit(InputSplit arg0) {
}
@Override
public void parse(ParseConfiguration arg0, RawRecordCollector arg1, String arg2) throws Exception {
arg1.collect(new RawRecord("B", 1));
}
};
}
@Override
public boolean canAutoMergeNewFields() {
return false;
}
@Override
public void populateDetailsWizardPage(WizardPageDefinition page) {
PropertyGroupDefinition groupBasic = page.addGroup("BASIC DATA");
// add the property to a property group
groupBasic.addPropertyDefinition(createInputTextField());
groupBasic.addPropertyDefinition(createLongText());
groupBasic.addPropertyDefinition(createCheckBoxNotPreChecked());
groupBasic.addPropertyDefinition(createCheckBoxPreChecked());
groupBasic.addPropertyDefinition(createRadioButton());
groupBasic.addPropertyDefinition(createSelectionGroup());
PropertyGroupDefinition dataGroup = page.addGroup("DATE");
dataGroup.addPropertyDefinition(createDateInputField());
PropertyGroupDefinition encodedData = page.addGroup("ENCODED DATA");
encodedData.addPropertyDefinition(createTextEncoded());
encodedData.addPropertyDefinition(createPasswordInputField());
PropertyGroupDefinition descriptiveElements = page.addGroup("DESCRIPTIVE ELEMENTS");
descriptiveElements.addPropertyDefinition(createInformation());
PropertyGroupDefinition groupSpecial = page.addGroup("SPECIAL DATA");
groupSpecial.addPropertyDefinition(createGroupSelection());
PropertyDefinition propertyDefinition = new PropertyDefinition("SEPARATOR", "SEPARATOR",
PropertyType.SEPARATOR);
groupSpecial.addPropertyDefinition(propertyDefinition);
propertyDefinition = new PropertyDefinition("HIDDEN_KEY", PropertyType.HIDDEN);
groupSpecial.addPropertyDefinition(propertyDefinition);
groupSpecial.addPropertyDefinition(createMultiValueGroupedSelection());
groupSpecial.addPropertyDefinition(createMulitSelection());
groupSpecial.addPropertyDefinition(createFileInputDuringWizard());
}
private PropertyDefinition createInputTextField() {
PropertyDefinition textFieldElement = new PropertyDefinition("property.example.string", "PropertyType.STRING",
PropertyType.STRING);
// In the Datameer X UI this textfield will be required to be filled out
// by the Datameer X User
textFieldElement.setRequired(true);
// the help text on the right side of the field
textFieldElement.setHelpText("Helptext: Inputfield String, which allows only numbers greater than 0.");
// Datameer X SDK is providing several Validators. All Validators
// inheriting from the class PropertyDefinitionValueValidator.
// The Validator will be applied on submit of the wizard-step by
// clicking "Next"
textFieldElement.addValidator(new NumberValidator(1));
// Textfields can be also made read-only. The immutable value is then
// set via the setDefaultValue method:
// textFieldElement.setDefaultValue("read-only value");
// textFieldElement.setReadOnly(true);
return textFieldElement;
}
private PropertyDefinition createDateInputField() {
PropertyDefinition dateElement = new PropertyDefinition("property.example.date", "PropertyType.DATE",
PropertyType.DATE);
dateElement.setHelpText("Helptext: Date");
return dateElement;
}
private PropertyDefinition createLongText() {
PropertyDefinition longtextElement = new PropertyDefinition("property.example.longtext",
"PropertyType.LONG_TEXT", PropertyType.LONG_TEXT);
longtextElement.setHelpText("Helptext: Long text");
return longtextElement;
}
private PropertyDefinition createPasswordInputField() {
PropertyDefinition passwordElement = new PropertyDefinition("property.example.password",
"PropertyType.PASSWORD", PropertyType.PASSWORD);
passwordElement.setHelpText("Helptext: Password");
passwordElement.setRequired(true);
return passwordElement;
}
private PropertyDefinition createCheckBoxNotPreChecked() {
PropertyDefinition checkboxElement = new PropertyDefinition("property.example.checkbox.notselected",
"PropertyType.BOOLEAN - not checked", PropertyType.BOOLEAN);
checkboxElement.setHelpText("Helptext: checkbox is not selected");
return checkboxElement;
}
private PropertyDefinition createCheckBoxPreChecked() {
PropertyDefinition checkboxElement = new PropertyDefinition("property.example.checkbox.selected",
"PropertyType.BOOLEAN - checked", PropertyType.BOOLEAN);
// preselect the checkbox when the Datameer X user is entering the
// wizard-step
checkboxElement.setDefaultValue("true");
checkboxElement.setHelpText("Helptext: checkbox is selected");
return checkboxElement;
}
private PropertyDefinition createInformation() {
PropertyDefinition informationElement = new PropertyDefinition("property.example.information",
"PropertyType.INFORMATION", PropertyType.INFORMATION);
// add the information to show in the UI when the Datameer X user is
// entering the wizard-step
informationElement.setDefaultValue("This is an information");
informationElement
.setHelpText("Helptext: This UI element is a read only element to provide the user informaiton.");
return informationElement;
}
private PropertyDefinition createMulitSelection() {
PropertyDefinition multiSelectionElement = new PropertyDefinition("property.example.multiselection",
"PropertyType.MULTISELECTION", PropertyType.MULTISELECTION);
multiSelectionElement.setHelpText("Helptext: selection of multiple values");
multiSelectionElement.addOption(new Option("selection_1_value", "selection_1"));
multiSelectionElement.addOption(new Option("selection_2_value", "selection_2"));
return multiSelectionElement;
}
private PropertyDefinition createTextEncoded() {
PropertyDefinition textEncodedElement = new PropertyDefinition("property.example.text-encoded",
"PropertyType.TEXT_ENCODED", PropertyType.TEXT_ENCODED);
textEncodedElement.setHelpText("Helptext: text encoded");
return textEncodedElement;
}
private PropertyDefinition createRadioButton() {
PropertyDefinition radioButtonElement = new PropertyDefinition("property.example.radiobutton",
"PropertyType.RADIO", PropertyType.RADIO);
radioButtonElement.setHelpText("Helptext: radio button");
radioButtonElement.addOption(new Option("radio_1_value", "radio_1_label"));
radioButtonElement.addOption(new Option("radio_2_value", "radio_2_label"));
// preselect the second option
radioButtonElement.setDefaultValue("radio_2_value");
return radioButtonElement;
}
private PropertyDefinition createFileInputDuringWizard() {
final PropertyDefinition fileUploadElement = new FileUploadPropertyDefinition("property.example.file.upload",
"PropertyType.INPUT_FILE_UPLOAD", PropertyType.INPUT_FILE_UPLOAD, new FileUploadHandler() {
@Override
public String upload(GenericConfiguration conf, FileStore fileStore, InputStream inputStream,
String propertyName, String originalFilename) throws Exception {
fileStore.create("folder" + "/" + originalFilename, inputStream);
return originalFilename;
}
});
fileUploadElement.setHelpText("Helptext: some file");
fileUploadElement.setRequired(true);
return fileUploadElement;
}
private PropertyDefinition createMultiValueGroupedSelection() {
PropertyDefinition mulitValueGroupedSelectionElement = new PropertyDefinition(
"property.example.grouped.selection", "PropertyType.MULTI_VALUE_GROUPED_SELECTION",
PropertyType.MULTI_VALUE_GROUPED_SELECTION);
mulitValueGroupedSelectionElement.setHelpText("Helptext: grouped seleciton of multiple values");
OptionGroup optGroup = new OptionGroup("mulitselect");
List<Option> options = Lists.newArrayList(new Option("selection_1_value", "selection_1"),
new Option("selection_2_value", "selection_2"));
optGroup.setOptions(options);
OptionGroup optGroup2 = new OptionGroup("mulitselect - 2");
List<Option> options2 = Lists.newArrayList(new Option("selection_2_1_value", "selection_2_1"),
new Option("selection_2_2_value", "selection_2_2"));
optGroup2.setOptions(options2);
List<OptionGroup> optionGroups = Lists.newArrayList(optGroup, optGroup2);
mulitValueGroupedSelectionElement.setOptionGroups(optionGroups);
return mulitValueGroupedSelectionElement;
}
private PropertyDefinition createGroupSelection() {
PropertyDefinition groupedSelectionElement = new PropertyDefinition("property.example.selection",
"PropertyType.GROUPED_SELECTION", PropertyType.GROUPED_SELECTION);
OptionGroup optGroup = new OptionGroup("mulitselect");
List<Option> options = Lists.newArrayList(new Option("selection_1_value", "selection_1_1"),
new Option("selection_2_value", "selection_1_2"));
optGroup.setOptions(options);
OptionGroup optGroup2 = new OptionGroup("mulitselect 2");
List<Option> options2 = Lists.newArrayList(new Option("selection_1_value", "selection_2_1"),
new Option("selection_2_value", "selection_2_2"));
optGroup2.setOptions(options2);
List<OptionGroup> optionGroups = Lists.newArrayList(optGroup, optGroup2);
groupedSelectionElement.setOptionGroups(optionGroups);
groupedSelectionElement.setHelpText("Helptext: grouped selection");
return groupedSelectionElement;
}
private PropertyDefinition createSelectionGroup() {
PropertyDefinition selectionElement = new PropertyDefinition("property.example.selection",
"PropertyType.SELECTION", PropertyType.SELECTION);
selectionElement.setHelpText("Helptext: selection");
selectionElement.setRequired(true);
selectionElement.addOption(new Option("selection_1_value", "selection_1"));
selectionElement.addOption(new Option("selection_2_value", "selection_2"));
return selectionElement;
}
}
After the plug-in has been installed, the UI in the import/export wizard displays your custom fields and text.