Custom UIs are a user preferred way to add their own UI implementations into the registry. It is associated with Media types (To learn more information about Media types, please, visit the Adding a Resource page). By adding a few entries to the component.xml
, custom UIs can be plugged in to WSO2 products.We will be using the custom UI sample located at $GREG_HOME/samples/custom-ui/
to explain the process of writing a custom UI.
component.xml
contains the Custom UI configuration. The user has to define the:
uiType
mediaType
uiPath
Let us take a look at the component.xml
located at src/main/resources/META-INF
directory.
<component xmlns="http://products.wso2.org/carbon"> <customUI> <uiType>view</uiType> <mediaType>epr</mediaType> <uiPath>../registry/custom/endpoint/epr_main_ajaxprocessor.jsp</uiPath> </customUI> <customUI> <uiType>add</uiType> <mediaType>epr</mediaType> <uiPath>../registry/custom/endpoint/epr_add_ajaxprocessor.jsp</uiPath> </customUI> <customUI> <uiType>view</uiType> <mediaType>topic</mediaType> <uiPath>../registry/custom/endpoint/topic_ajaxprocessor.jsp</uiPath> </customUI> </component>
There are three types of UIs that can be used:
- add
- edit
- view
For each UI type, you can specify the corresponding media type it will be associated to and the respective JSP that will be called. In the given example component.xml
, when a epr
Media type is added, the respective epr_add_ajaxprocessor.jsp
is called.
Please, take a look at the respective JPSs available in the source of the sample to have a better understanding of the implementation details. Basically, this JSP, will be what is displayed when the custom UI event occurs.