...
- Custom Builder Plugin is used for extends to extend the builder feature in addition to the default form, list, userview & process builder.
- Custom Builder Plugin let app designer build extra definition which auto handles the load/store/merge/export/import by the platform.
- A useable usable Custom Builder Plugin must extend org.joget.apps.app.model.CustomBuilderAbstract abstract class.
...
The builder configuration in JSON format. Used to configure the builder callback event and the advanced tools available for the builder. Full available configuration as below. Please refer refer to Sample Plugins on how to use this config.
| Code Block | ||||||||
|---|---|---|---|---|---|---|---|---|
| ||||||||
{
builder : {
callbacks : { //methods name to call
initBuilder : "", //call after initialized the builder.
load : "", //Call to load the definition JSON
saveEditProperties : "", //Call after save edit properties event is trigger
cancelEditProperties : "" //Call after cancel edit properties event is trigger
}
},
advanced_tools : { //configure the advanced tools available
tree_viewer : { //tree viewer to view the tree structure of the definition
disabled : false, //to disable this tool
childs_properties : ["elements"], //the property name which hold editable plugins
matchers : { //matchers to customize the tree viewer
'sample' : { //sample matcher
match : function (viewer, deferreds, node, jsonObj, refObj) {
//do something
return false;
}
}
}
},
usage : { //to check usage of the definition of this builder
disabled : false //to disable this tool
},
i18n : { //to provide i18n editor for this builder
disabled : false, //to disable this tool
keywords : [ //The property names which allowed for i18n
"label"
]
},
permission : { //to provide permission editor for this builder
disabled : false, //to disable this tool
permission_plugin : "org.joget.apps.form.model.FormPermission", //the permission plugin class used for this builder
authorized : { //configure the authorized section
property : "", //the property name to store the authorized section value
default_value : "", //the default value for authorized property
options : [ //the sample option for authorized section
{
key : "vissible",
value : "",
label : get_cbuilder_msg("ubuilder.visible")
},
{
key : "hidden",
value : "true",
label : get_cbuilder_msg("ubuilder.hidden")
}
]
},
unauthorized : { //configure the unauthorized section
property : "", //the property name to store the unauthorized section value
default_value : "", //the default value for unauthorized property
options : [ //the sample option for unauthorized section
{
key : "vissible",
value : "",
label : get_cbuilder_msg("ubuilder.visible")
},
{
key : "hidden",
value : "true",
label : get_cbuilder_msg("ubuilder.hidden")
}
]
},
element_label_callback : "", //Method name to call for customize the element label
element_support_plugin : [], //Plugin class name which support permission plugin configuration
display_element_id : false, //to enable/disable to display the element id beside the element label
childs_properties : ["elements"], //The property name to loop the child elements(plugins)
ignore_classes : [], //The plugin class name to skip in the loop of child elements(plugins)
render_elements_callback : "" //The method name to call to customize the rendering of child elements(plugins)
},
customTabsCallback : "" //Method name to call to render additional tabs in Advanced Tools.
}
} |
Plugin Properties Options
- Please refer to Plugin Properties Options for more information.
Sample Plugins
getBuilderJS
public String getBuilderJS(String contextPath, String buildNumber);The JS files used in the builder. Please refer to Sample Plugins on how to implement this method.
Parameters:
contextPath - the http request context path.
buildNumber - Joget platform build number
getBuilderCSS
public String getBuilderCSS(String contextPath, String buildNumber);The CSS files used in the builder. Please refer to Sample Plugins on how to implement this method.
getBuilderHTML
public String getBuilderHTML(BuilderDefinition def, String json, HttpServletRequest request, HttpServletResponse response);The HTML of builder. Please refer to Sample Plugins on how to implement this method.
Parameters:
def - the definition object to edit/load
json - the JSON definition to edit/load
getBuilderResult
public Object getBuilderResult(String json, Map<String, Object> config);Retrieve the builder end result based on json definition. The end result can be a report PDF/HTML, an API document etc. Please refer to Sample Plugins on how to implement this method.
Parameters:
json - the JSON definition to generate the builder result.
config - the additional configuration/parameters use for generate the result.
Overridable Methods
createNewJSON
public String createNewJSON(String id, String name, String description, BuilderDefinition copyDef);Used to create the JSON definition of new object
getNameFromJSON
public String getNameFromJSON(String json);Retrieve name from the JSON definition
getDescriptionFromJSON
public String getDescriptionFromJSON(String json);Retrieve description from the JSON definition
getCreateNewPageHtml
public String getCreateNewPageHtml();HTML to add to the create new page
Plugin Properties Options
- Please refer to Plugin Properties Options for more information.
Custom Builder Javascript Object
| English |
|---|
| Utility methods and fields to use in the builder javascript. |
Fields
appId
The app id of current editing
appVersion
The app version of current editing
builderType
The builder object name return by the custom builder plugin
builderLabel
The builder object label return by the custom builder plugin
json
The JSON definition of current canvas
data
The dataobject of current canvas
paletteElements
The list of palette elements and its properties option and data.
Methods
CustomBuilder.callback(name, args)
To call a method by name
Parameters
- name - a method name.
- args - arguments to pass to the method call
CustomBuilder.initConfig(config)
To initialize the builder configuration by the platform
Parameters
- config - the configuration object.
CustomBuilder.initPropertiesOptions(options)
To initialize the builder properties tab by the platform
Parameters
- options - the builder properties options
CustomBuilder.initBuilder(callback)
To initialize the builder by the platform
Parameters
- callback - the callback method to call after builder initialized.
CustomBuilder.showPopUpBuilderProperties()
To show the builder properties in a popup editor.
CustomBuilder.saveBuilderProperties(container, properties)
To save the builder properties
Parameters
- container - the property editor container
- properties - the properties to save
CustomBuilder.initPaletteElement(category, className, label, icon, propertyOptions, defaultPropertiesValues, render, css, metaData)
To populate elements(plugins) in the side palette.
Parameters
- category - the category of the elements(plugins)
- className - the classname of the elements(plugins)
- label - the label of the elements(plugins)
- icon - the label of the elements(plugins)
- propertyOptions - the plugin properties options the edit the element(plugin)
- defaultPropertiesValues - the default properties values to set to a new element object added to canvas.
- render - set to false to not render the elements(plugins) in side palette
- css - the css class to palette element
- metaData - the additional data of the elements(plugins) to used by the builder
CustomBuilder.loadJson(json)
To load a json to the builder
Parameters
- json - the JSON definition to load
CustomBuilder.update(addToUndo)
Update the CustomBuilder.json based on the data stored in CustomBuilder.data
Parameters
- addToUndo - true to add the previous stored JSON definition to undo stack.
CustomBuilder.updateJson(json, addToUndo)
Update CustomBuilder.json to the pass in JSON.
Parameters
- json - the JSON definition to update to CustomBuilder.json.
- addToUndo - true to add the previous stored JSON definition to undo stack.
CustomBuilder.getJson()
Get the value in CustomBuilder.json.
CustomBuilder.mergeAndSave()
To save the builder JSON definition.
CustomBuilder.preview()
Preview the builder result of CustomBuilder.json in a new browser tab.
CustomBuilder.updateFromJson()
Update the CustomBuilder.json based on edited JSON in advance tool definition tab.
CustomBuilder.undo()
Load the latest stored JSON definition from undo stack and add current JSON definition to redo stack.
CustomBuilder.redo()
Load the latest stored JSON definition from redo stack and add current JSON definition to undo stack.
CustomBuilder.addToUndo(json)
Add JSON definition to undo stack.
Parameters
- json - the JSON definition to add to undo stack
CustomBuilder.adjustJson()
To trigger change event to update advance tools
CustomBuilder.updateSaveStatus(mode)
To update the save button status by the undo/redo function
Parameters
- mode - "+" or "-" to represent undo and redo
CustomBuilder.showMessage(message)
To fade in a message on top center of the builder
Parameters
- message - the message to show.
CustomBuilder.getCopiedElement()
To retrieve the current copied element.
Return a object with "type" and "object" attribute. The "object" is the element object.
CustomBuilder.copy(element, type)
To copy an element object to local storage.
Parameters
- element - the element object to copy
- type - the type of the element object
CustomBuilder.updatePasteIcon(type)
To enable/disable all paste icons based on the type
Parameters
- type - the type of the copied element
CustomBuilder.editProperties(elementClass, elementProperties)
To edit the properties of an element
Parameters
- elementClass - the element plugin class name
- elementProperties - the element properties to edit
CustomBuilder.uuid()
To generate uuid.
Create Custom Plugin Interface/Abstract Class for Custom Builder
- Create a maven project contains only plugin interface, abstract class and APIs. This maven project will share with other developers who want to extend the feature of a custom builder.
- Include the maven project as a dependency of the custom builder project.
Modify the custom builder project POM file to adding the package of plugin interface, abstract class and APIs to the <Export-Package>.
Code Block language java <Export-Package>org.joget.pbuilder,org.joget.pbuilder.api.*</Export-Package>Register the plugin interface and abstract class in Activator class
Code Block language java PluginManager.registerCustomPluginInterface(new CustomPluginInterface(PageWidget.class, "pageBuilder.pageWidget", PageBuilder.MESSAGE_PATH));
Sample Plugins
- Page Buider - page_builder.zipPage Buider