Customizing the Welcome Page with an Overview over the last Changes and the Taxonomies

Transcription

1 Customizing the Welcome Page with an Overview over the last Changes and the Taxonomies Customizing the Welcome Page with an Overview over the last Changes and the Taxonomies The following tutorial gives you a comprehensive overview about customizing the Welcome page of your CentraSite distribution to have an overview over the Last changes to your assets as well as an overview over the taxonomies. For an introduction of the architecture of the Welcome page and how to install and customize it, please refer to the more general tutorial about Customizing the Welcome Page. Customizing the Welcome Page with an Overview over the last Changes and the Taxonomies Customizing Example 1. Welcome Page Frame 1.1 Setting the Icon/ Title/ Subtitle 1.2 Setting the Widgets 2. Creating new Widgets 2.1 Recent Additions Widget Recently Added Item 2.2 Recent Updates Widget Recently Updated Item 2.3 Taxonomy View Widget Creating the HTML Page with the Application Designer Creating the HTML Widget The Adapter 3. Deploying the New Welcome Page Customizing Example The following example shows all necessary steps to customize the welcome page for a look like in the picture below. Strictly speaking, we will change the icon in the upper left, as well as the Title and Subtitle of the page. Besides that we will create three new widgets and implement them into the page. These widgets will show the recent updates that took place on registry assets, the recent additions of registry assets in the registry and an overview over the taxonomies in the registry. The whole project for the welcome page is attached to this tutorial. 1. Welcome Page Frame The frame of the Welcome Page is represented by a java class called WelcomePage.java. This class implements the interface com.centrasite.control.ext.welcome.interfaces.iwelcomepage, which provides methods for customizing the text, pictures and widgets on the welcome page. Most of these methods are named very self explanatory, but in Listing 1.1 and 1.2 we show how to customize the most important ones to get a look like in the picture. 1.1 Setting the Icon/ Title/ Subtitle For customizing the title and subtitle on the welcome page there are methods returning the style for the component and methods returning the text to be shown. The style is always given as a string in CSS notation. To customize the icon in the upper left of the page, you have to return the path to the image. Best practice is to store all images in an images folder in your project.

2 Listing 1.1: getimage()/ gettitle() public String gettitlestyle() { return "color:#0d5b7e;white-space:nowrap;font-family:verdana;font-weight:bold;font-size:25pt"; public String getsubtitlestyle() { return "color:#0d5b7e;white-space:nowrap;font-family:verdana;font-size:25pt"; public String gettitle() { return new String ("Welcome"); public String getsubtitle() { return new String ("Customized welcome page" ); public String getimage() { return "images/your_image.gif"; 1.2 Setting the Widgets The more interesting part of customizing the welcome page is customizing or changing the widgets. The IWelcomePage interface also provides a method to set these widgets, which is shown in Listing 1.2. This method creates and returns an array of IWidgets. These widgets are shown on the welcome page in ascending order. That means that the first widget added to the array is shown as the most left widget on the page. Listing 1.2: getwidgets() public IWidget[] getwidgets(){ ArrayList<IWidget> widgets = new ArrayList<IWidget>(); widgets.add( new RecentAdditionsWidget()); widgets.add( new RecentUpdatesWidget()); widgets.add( new TaxonomyViewWidget()); return widgets.toarray( new IWidget[widgets.size()]); 2. Creating new Widgets When creating a new Widget we have to be aware which kind of widget we will need for our purposes. Actual there are three different kinds of widgets: Single-Column Widget In this widget, the executable actions are displayed as a table consisting of a single column. Each table cell contains one executable action. Each cell can also have an icon beside it. There is a header text above the table. [ CWP] Multi-Column Widget In this widget, the executable actions are displayed as a table consisting of two or more columns. Each table cell contains one executable action. Each cell can also have an icon beside it. There is a header text above each column of the table.[ CWP] HTML-Style Widget In this widget, the contents are freely programmable as HTML code. The HTML statements you use must be valid within the context of an HTML table cell, i.e. there is an implicit HTML <td> element enclosing the HTML code you supply.[ CWP] 2.1 Recent Additions Widget This widget shall show a list of the last ten assets that were added to the registry and are visible in the QuickBrowse list. Every item in that list is a link to the assets detail view page. The most important method in that widget is the one where the items, i.e. the shown assets, are set. This method needs to query the registry to get all the recently added assets.

3 We will just have a look on the setitems() method of the widget. All other methods look similar in every other widget and are self explanatory. A little challenge is to get all the desired assets that were recently updated. To make it a little easier we decided to show the last ten assets that were added so we don't have to think of a reasonable threshold. Anyhow, the threshold can be changed, if desired. Listing 2.1 shows the method to get all these assets Get the Connection. (See m1- m2) Get all the Concepts that are classified as ObjectType and that are visible in the quickbrowse list. (See m2- m3) Create a predicate string for the names of the objecttypes. (See m3- m4) Get all the names of these object types and put them into a predicate. (See m4- m5) Declare a threshhold. In our case we take one long ago, because we then take the last ten of them. (See m4- m5) Query the registry for all object types, that match the criteria and where modified after the threshold. (See m6- m7) Add the first ten of them (last created) into our item list. (See m7 - end)

4 Listing 2.1: getitems() public void setitems() { items = new ArrayList<IItem>(); /*m1*/ Connection con = actioncontext.getconnector().getconnection();// get connection out of the actioncontext try { /*m2*/ RegistryService regservice = con.getregistryservice(); CentraSiteQueryManager cqm = (CentraSiteQueryManager) regservice.getbusinessquerymanager(); CentraSiteBusinessQuery bq = cqm.createcentrasitebusinessquery(constants.object_type_name_concept, null ); // get all concepts... bq.addpredicate( "$ro/cs:parent = \"" + Constants.CLASSIFICATION_SCHEME_OBJECT_TYPE + "\""); //...that are classified as objects bq.addpredicate( "$ro/cs:classifications/cs:classification/cs:concept = \"" + Constants.CENTRASITETYPES_KEY_VisibleInQuickBrowseList //...and are visible in the QuickBrowse list + "\""); BulkResponse br = bq.execute(); /*m3*/ StringBuilder predicate = new StringBuilder(); predicate.append( "$ro/@objecttype = (\""); /*m4*/ String delim = ""; for (Concept concept : (Collection<Concept>) br.getcollection()) { predicate.append(delim); if (JaxrTypeUtil.isPredefinedJaxrType(concept)) { // if it is a predefined JAXR type... String typename = concept.getvalue(); typename = "{" + Constants.NAMESPACE + "" //...put namespace in front of typename... + typename.substring(0, 1).toLowerCase() + typename.substring(1); predicate.append(typename); //...and add the typename to the query predicate string else { predicate.append(concept.getvalue()); // else there already is the namespace in front of the typename and it can be added immediately delim = "\", \""; predicate.append( "\")"); /*m5*/ String objectinfo = "{" + Constants.NAMESPACE + "objectinfo"; Timestamp threshold = new Timestamp( System.currentTimeMillis()); String thresholdstring = " T00:00:00"; // declare a date threshold /*m6*/ Collection findqualifiers = Collections.singleton(FindQualifier.SORT_BY_DATE_DESC); // sort criteria: by date, descending CentraSiteBusinessQuery bq1 = cqm.createcentrasitebusinessquery(objectinfo, findqualifiers); // create query bq1.addpredicate( "$ro/@crt >= xs:datetime(\"" + thresholdstring + "\")"); // all types, that were created (@crt) after the threshhold date bq1.addpredicate(predicate.tostring()); // of these typenames (see above) BulkResponse br1 = bq1.execute(); /*m7*/ Collection col = br1.getcollection(); Iterator iter = col.iterator(); for ( int i=0; i<10; ++i) { // take the last 10 of the assets of the query to be shown in the widget items.add( new RecentlyUpdatedItem((RegistryObject) iter.next())); catch (JAXRException e) { e.printstacktrace(); Recently Added Item

5 As you can see, we put every object of our query, that we want to show in the widget, into a RecentlyAddedItem object. These items extend from the class AbstractActionItem which extends from IActionItem. The Abstract Action Item is implemented by Software AG and provides a method execute() that handles the event management when you click on it. So to speak it is just a link. The RecentlyAddedditem class is provided by us in a separate utility.jar file. In our case these items will give us a link to the detail view page of the asset they represent. ItemsUtil.jar 2.2 Recent Updates Widget This widget shall show a list of the last ten updates that were assigned to assets which are visible in the QuickBrowse list. Every item in that list is a link to the assets detail view page. For that purpose we gonna decide to take the ISingleColumnWidget because it gives us all the features we need in here. Again we need a method to query the registry. This time for all assets that were recently updated. And again we will just have a look on that method. It looks similar to the method in listing 2.1 except one little line of code, where we do not query for added but for updated assets. Listing 2.2 shows the method to get all these assets Get the Connection. (See m1- m2) Get all the Concepts that are classified as ObjectType and that are visible in the quickbrowse list. (See m2- m3) Create a predicate string for the names of the objecttypes. (See m3- m4) Get all the names of these object types and put them into a predicate. (See m4- m5) Declare a threshhold. In our case we take one long ago, because we then take the last ten of them. (See m4- m5) Query the registry for all object types, that match the criteria and where modified after the threshold. (See m6- m7) Add the first ten of them (last modified) into our item list. (See m7 - end)

6 Listing 2.2: getitems() public void setitems() { items = new ArrayList<IItem>(); /*m1*/ Connection con = actioncontext.getconnector().getconnection();// get connection out of the actioncontext try { /*m2*/ RegistryService regservice = con.getregistryservice(); CentraSiteQueryManager cqm = (CentraSiteQueryManager) regservice.getbusinessquerymanager(); CentraSiteBusinessQuery bq = cqm.createcentrasitebusinessquery(constants.object_type_name_concept, null ); // get all concepts... bq.addpredicate( "$ro/cs:parent = \"" + Constants.CLASSIFICATION_SCHEME_OBJECT_TYPE + "\""); //...that are classified as objects bq.addpredicate( "$ro/cs:classifications/cs:classification/cs:concept = \"" + Constants.CENTRASITETYPES_KEY_VisibleInQuickBrowseList //...and are visible in the QuickBrowse list + "\""); BulkResponse br = bq.execute(); /*m3*/ StringBuilder predicate = new StringBuilder(); predicate.append( "$ro/@objecttype = (\""); /*m4*/ String delim = ""; for (Concept concept : (Collection<Concept>) br.getcollection()) { predicate.append(delim); if (JaxrTypeUtil.isPredefinedJaxrType(concept)) { // if it is a predefined JAXR type... String typename = concept.getvalue(); typename = "{" + Constants.NAMESPACE + "" //...put namespace in front of typename... + typename.substring(0, 1).toLowerCase() + typename.substring(1); predicate.append(typename); //...and add the typename to the query predicate string else { predicate.append(concept.getvalue()); // else there already is the namespace in front of the typename and it can be added immediately delim = "\", \""; predicate.append( "\")"); /*m5*/ String objectinfo = "{" + Constants.NAMESPACE + "objectinfo"; Timestamp threshold = new Timestamp( System.currentTimeMillis()); String thresholdstring = " T00:00:00"; // declare a date threshold /*m6*/ Collection findqualifiers = Collections.singleton(FindQualifier.SORT_BY_DATE_DESC); // sort criteria: by date, descending CentraSiteBusinessQuery bq1 = cqm.createcentrasitebusinessquery(objectinfo, findqualifiers); // create query bq1.addpredicate( "$ro/@mod >= xs:datetime(\"" + thresholdstring + "\")"); // all types, that were modified (@mod) after the threshhold date bq1.addpredicate(predicate.tostring()); // of these typenames (see above) BulkResponse br1 = bq1.execute(); /*m7*/ Collection col = br1.getcollection(); Iterator iter = col.iterator(); for ( int i=0; i<10; ++i) { // take the last 10 of the assets of the query to be shown in the widget items.add( new RecentlyUpdatedItem((RegistryObject) iter.next())); catch (JAXRException e) { e.printstacktrace(); Recently Updated Item

7 As you can see, we put every object of our query that we want to show in the widget into a RecentlyUpdatedItem object. These items extend from the class AbstractActionItem which extends from IActionItem. The Abstract Action Item is implemented by Software AG and provides a method execute() that handles the event management when you click on it. So to speak it is just a link. The RecentlyUpdateditem class is provided by us in a separate utility.jar file. In our case these items will give us a link to the detail view page of the asset they represent. ItemsUtil.jar 2.3 Taxonomy View Widget This widget shall show a Combobox control, which shows all the taxonomies in the registry. If one of the taxonomies is chosen, the chosen taxonomy shall be shown in a tree structure, including all its concepts and child-concepts. The Taxonomy View Widget is the most difficult one. We have to design the whole widget ourselves since there are no available components which satisfy our needs. We will use the HTML Widget, where we can do everything HTML and CSS allow us to do. However, since we want to access the registry to have access to all the taxonomies, we have to make sure that we have a binding for that purpose. This is only possible when the HTML page is created with the Application Designer since only these components will offer us that binding, i.e. a connection to the registry. Given this fact, we have to get familiar with Application Designer to design our HTML page. The designed page then has just to be called inside an <iframe> element inside the HTML widget and voila - we have a totally valid binding to our elements. How this works in particular is shown in the following steps of this tutorial Creating the HTML Page with the Application Designer Using the Application Designer is not a part of this tutorial and therefor we will only have a quick look on some important parts. When creating a HTML page providing interactive controls (such as trees, comboboxes, etc.), we need to also create an adapter which handles events and initializes these controls. This adapter has to be declared inside our page and, basically, is a Java class. We declare this adapter in the model part of the basic properties of our page. (see the red arrow on the picture) Application Designer Documentation When we have done this, we can start to design the page via drag and drop of the certain components we want to add to it. In our case, we want to have a dynamic Combobox for the list of taxonomies in our registry and a tree, which shows the chosen taxonomy to the user. Certainly, we have to give names to these components to be able to access them inside the adapter class. For comprehensive introductions to the control components, please refer to COMBODYN2 and TREENODE3 (COMBODYN2 Control)

8 (TREEVIEW3 Control) After finishing the layout in the Application Designer we can now save the whole page and it will be automatically generated. In our case we modified the empty.html layout from the arg folder in our CentraSite distribution. Certainly, you can and should change the name of the page into something referring to the content of it. Note: If you do so, make clear you also change the name of the generated XML file in the /arg/xml folder of your distribution. A best practice is to copy both files to another location and rename them afterwards. Normally the naming should also be possible in the Application Designer, but in this case, it was not. You should try to do it in there first Creating the HTML Widget For the creation of the HTML widget we create a class TaxonomyViewWidget.java which implements the interface IHtmlWidget.java this widget type provides basically the same standard methods from the IWidget.java Interface, but leaves all the design features up to the programmer. Therefore, it provides a method gethtml() where you can put in any kind of HTML code inside a <td> block. Listing shows you, how to customize the widget in order to get show the page taxonomywidget.html inside the <iframe>. Additionally to the page URL we have to pass the session id to be able to get access to a connection in our adapter class, which will handle all events for our components inside the HTML page. Listing 2.3.2: TaxonomyViewWidget.java public class TaxonomyViewWidget implements IHtmlWidget { private ActionContext actioncontext = null; public void setactioncontext(actioncontext actioncontext) { this.actioncontext = actioncontext; [...] public String gethtml() { String sess = ((AbstractActionContext)actionContext).getWorkplaceAdapter().findSessionId(); // get the session id // create the html string StringBuilder html = new StringBuilder(); html.append( "<td>"); // set the widget title in a <div> block html.append("<div style='background-color:#fbfcfd; vertical-align:middle; color:#0d5b7e;font-family:verdana; font-size:20pt; white-space:nowrap'>"); html.append( "Taxonomy View" ); html.append( "</div>"); // set the actual page into an <iframe> block and also pass the session id for the binding html.append("<iframe style='border:0; background-color:#fbfcfd; height:800px' " + "src='http: //localhost:53307/pluggableui/servlet/startcispage?pageurl=/arg/taxonomywidget.html&sessionid=" + sess + "&ONLOADBEHAVIOUR=NOTHING'>"); html.append( "</iframe>"); html.append( "</td>"); return html.tostring(); The Adapter The adapter is the part, where we will do all the event handling for our generated page. In our case this is mainly initializing the combobox and reacting on selecting a value out of that box. When a value out of the combobox is selected, we need to initialize the treeview with the chosen taxonomy. We will now go through all of the needed methods to achieve these purposes. All the methods are implemented in a class TaxonomyViewAdapter.java which extends the com.softwareag.cis.server.adapter.

9 The first method we will need is one, that returns us a valid connection to the registry from our session. Therefor, we create a method getconnector() that returns us a Connector. This Connector can then return us a valid connection to the registry. See Listing 2.3.3a. Listing 2.3.3a: getconnector() public Connector getconnector() { ILookupContext ctx = findsessioncontext(); Object obj = ctx.lookup(controlconstants.session_connector, true); Connector con = (Connector) obj; return con; The next method we need is a method which gets us all the taxonomies out of the registry. This method uses the Connector for establishing the connection to the registry and then queries all the taxonomies and returns them. Listing 2.3.3b: gettaxonomies() public Collection<ClassificationScheme> gettaxonomies() throws JAXRException { Collection<ClassificationScheme> taxonomies = null ; // declare a collection of ClassificationSchemes (taxonomies) Connection con = getconnector().getconnection(); // get a connection RegistryService regservice = con.getregistryservice(); // get registry service from connection CentraSiteQueryManager cqm = (CentraSiteQueryManager) regservice.getbusinessquerymanager(); // get a business query manager out of the registry service BusinessLifeCycleManager blm = regservice.getbusinesslifecyclemanager(); Collection< String> findqualifiers = Collections.singleton(FindQualifier.SORT_BY_NAME_ASC); // find qualifiers: sort alphabetically Collection< String> objecttypes = Collections.singleton(Constants.OBJECT_TYPE_NAME_ClassificationScheme); // object types: ClassificationSchemes BulkResponse br = cqm.findobjects(findqualifiers, objecttypes, null, null ); // process query taxonomies = br.getcollection(); // put all taxonomies into our collection return taxonomies; After creating a method for getting all the taxonomies out of the registry, we have to put their names into our combobox. This is achieved in the init() method which comes with the Adapter class. Inside this method we first clear all the values inside the combobox and also the treeview. Then we call our method which gives us all the taxonomies and put them into the COMBODYN2 control as valid values. These valis values consist out of two feilds, one for the text to be shown and one for an ID. We will use the key from the taxonomy as the ID and the name as the text to be shown. Therefor we have to convert the name, which comes as an international string, into a local string with the locale of our machine. Listing 2.3.3c: init() public void init() { tree.clear(); taxvalues.clear(); try { for (ClassificationScheme cs : gettaxonomies()) { if (!((CentraSiteRegistryObject) cs).isclassifiedwith(constants.cs_classifications_key_internal)) { // only taxonomies which are not classified as internal CentraSiteInternationalString is = (CentraSiteInternationalString) cs.getname(); taxvalues.addvalidvalue(cs.getkey().getid(), is.getlocalstringvalue(locale.getdefault())); catch (JAXRException e) { e.printstacktrace(); After the initialization of the COMBOBOX we will now see all the names of the taxonomies in the drop-down list. Except of being able to select them, however, nothing happens when selecting one of the values. Anyhow, before we can handle a event that uses our TREENODE3 component, we have to take care of some things. The first thing is to build a class, which represents the tree-nodes in our tree structure. This class does already exist with com.softwareag.cis.server.util.nodeinfo but we will extend it for our purposes. See _Listing

10 2.3.3d_. In particular, that means, we will only allow ClassificationSchemes and Concepts as values and will create a method, which puts an icon before each node. Furthermore, we will declare the event, when a node is toggled. Our TreeItem class is a nested class in our TaxonomyViewAdapter. Listing 2.3.3d: TreeItem.java public class TreeItem extends NODEInfo { private Concept concept; private String imagename; private Boolean subnodesavailable = false; public TreeItem(ClassificationScheme cs, RegistryObjectItem roi) throws Exception { CentraSiteInternationalString is = (CentraSiteInternationalString) cs.getname(); this.settext(is.getlocalstringvalue(locale.getdefault()).tostring()); setimagename(iconaccessor.get().getvalue(roi)); public TreeItem(Concept concept, RegistryObjectItem roi) throws Exception { this.concept = concept; CentraSiteInternationalString is = (CentraSiteInternationalString) concept.getname(); this.settext(is.getlocalstringvalue(locale.getdefault()).tostring()); if (concept.getchildconceptcount() > 0) { subnodesavailable = true; imagename = roi.getimageurl(); setimagename(iconaccessor.get().getvalue(roi)); public String getimagename() { return imagename; public void setimagename( String value) { imagename = value; public void reactontoggle() { if (subnodesavailable == true) { try { addsubnodesfor( this, concept); catch (Exception e) { e.printstacktrace(); public void reactonselect() { // end class TreeItem For the reaction on toggling one of the treenodes we want to show all of the other concepts and child concepts of that taxonomy. Because there are some taxonomies that are very big, we don't want to load them all in once, but to load the child concepts only, if needed, i.e. if a node with child concepts is toggled. For that purpose we will implement a method, that adds us the subnodes to a given node, called in the reactontoggle() method in our TreeItem class. Listing 2.3.3e shows that method.

11 Listing 2.3.3e: addsubnodes private void addsubnodesfor(treeitem top, Concept concept) throws Exception { TreeItem sub; Collection<Concept> concepts; try { concepts = concept.getchildrenconcepts(); // get child concepts, if available for (Concept c : concepts) { CentraSiteInternationalString is = (CentraSiteInternationalString) c.getname(); // get name of concept RegistryObjectItem roi = new RegistryObjectItem(concept, getconnector()); // create new RegistryObjectItem with that concept sub = new TreeItem(c, roi); // create the TreeItem as subnode sub.setdisabletextinput( true); tree.addsubnode(sub, top, false, false ); // add subnode to tree sub.setopened(treecollection.st_closed); // initialize it as closed catch (JAXRException e) { e.printstacktrace(); After being able to create treenodes for our TREENODE3 component and being able to dynamically load subnodes to each node of the tree, we need a method which loads us the first level of the taxonomy tree when we select it from the COMBOBOX. Listing 2.3.3f shows that method which, in particular, just loads a taxonomy and creates treenodes for it and the first level of child concepts. Listing 2.3.3f: loadfirstlevel() private void loadfirstlevel( String key) throws Exception { ClassificationScheme cs = gettaxonomy(key); RegistryObjectItem roi = new RegistryObjectItem(cs, getconnector()); TreeItem top = new TreeItem(cs, roi); tree.addtopnode(top, false); Collection<Concept> concepts = cs.getchildrenconcepts(); TreeItem sub; for (Concept c : concepts) { roi = new RegistryObjectItem(c, getconnector()); sub = new TreeItem(c, roi); sub.setdisabletextinput( true); tree.addsubnode(sub, top, false, false); sub.setopened(treecollection.st_closed); The loading of the taxonomy is done in a separate method. This method just takes the UDDI key of the taxonomy to be loaded and then queries the registry for it. Listing 2.3.3g: gettaxonomy() public ClassificationScheme gettaxonomy( String key) throws JAXRException { ClassificationScheme taxonomy = null; Connection con = getconnector().getconnection(); RegistryService regservice = con.getregistryservice(); CentraSiteQueryManager cqm = (CentraSiteQueryManager) regservice.getbusinessquerymanager(); taxonomy = (ClassificationScheme) cqm.getregistryobject(key); return taxonomy; Last but not least we need the method, that triggers the loading of our tree. That method has to be bound to our COMBODYN2 component and should react on selecting one of the values in the COMBOBOX. And here, again, the second picture from section comes into play. In there we named all the fields of the COMBODYN2 control. The last two of these fields now play a role in our event handling. We have to name the method exactly like the method in the _flush method_ field. In our case this is onselect(). _Listing 2.3.3h_ shows that method. The variable taxonomybox has to be named exactly like the field valueprop in the COMBODYN2. It is then initialized with the ID of the selected value of the COMBOBOX. In our case, that ID is the key of the taxonomy.

12 Listing 2.3.3h: onselect() private String taxonomybox; public String gettaxonomybox() { return taxonomyboxselectedvalue; public void settaxonomyboxselectedvalue( String value) { this.taxonomybox = value; public void onselect() { tree.clear(); try { loadfirstlevel(taxonomybox); catch (Exception e) { e.printstacktrace(); 3. Deploying the New Welcome Page See section Installing the Welcome Page in the Customizing the Welcome Page tutorial.