Weblogic Console Customization labs

WEBLOGIC
CONSOLE
CUSTOMIZATION

LABS 
WEBLOGIC CONSOLE CUSTOMIZATION WWW.REDDIPPED.COM

Contents
WEBLOGIC CONSOLE CUSTOMIZATION

Generic information 5
Users 5
URLs 5
Lab 1 6
Create Weblogic Server 6
Add Weblogic Server as Netbeans service 7
Create a Weblogic Console Look-And-Feel project 7
Create new project 7
Initialize the project 8
Customize the login page 9
Lab 2 11
Explore the MBeanUtils class 11
Retrieve and print domain name 11
Make login panel bordercolor dynamic 13
Make the toolbar color dynamic 15
Adding environment to page header 16
Lab 3 17
Showing server health 20
Lab 4 21
Start the JSONP webserver 21
vTicker (jQuery) ticker tape 21
AngularJS message ticker 24
Lab 5 28
Start the JSONP webserver 28
Adding the Book 29
Creating portlets 31
Adding shortcuts to the Domain Structure 32
Lab 6 34
Add a book extension 34
Create a book 34
Create a portlet 35
Add the JSP 35
Adding a shortcut to the Domain Structure 37
Lab 7a Deploying and Exploring SysStats MBean 38
Deploying SysStats.ear 38
Exploring the SysStats MBean 38

Lab 7b Installing the Servlet and Console Extension 40
Install Java classes 40
Add Book, Portlet and JSP 41
Appendi 42
Useful websites 42
Relevant ﬁles 42
Solutions 43
Lab 2 Adding environment to page header 43
Lab 3 Showing server healthstate 44

Generic information
Users
URLs
Username Type Password
root Linux reddipped
developer Linux reddipped
weblogic Weblogic Reddipped1
Description URL
Weblogic Admin Console mydomain http://localhost:7001/console
WEBLOGIC CONSOLE CUSTOMIZATION Page of5 44

Lab 1
In this exercise you will setup the project and make the first customization.

 
Create Weblogic Server

In this step you will create a Weblogic server for a specific domain, during the exercises you will
be creating multiple domains and therefore servers. When instructed to create a Weblogic domain
use these instructions.

- Logon as Developer

- Start a Terminal session (Applications > System Tools > Terminal)

- Change to the Weblogic Domains Directory 
cd /home/developer/oracle/domains

- Create a new weblogic domain by executing the createdomain.sh script. The script uses the
first argument as the domain name. Create the domain 'mydomain' by executing the following
command. The Weblogic username used is weblogic with password Reddipped1.

- Wait until the message <Server state changed to RUNNING.> with message-id BEA-000365 is
displayed, then press control+C. The server will now be shutdown and is ready for use. 
./createdomain.sh mydomain 7001

Add Weblogic Server as Netbeans service
To be able to control the Weblogic server from Netbeans it has to be registered as a Netbeans
service. In the next few steps you will register the previously created Weblogic Server as a
Netbeans service.

- Start Netbeans

- Select the Services tab. If the tab is not shown then select Window > Services in the menu bar.

- Right click on Servers and select Add Server...

- Choose Oracle Weblogic Server

- Fill in the field Name the text WLS_Domain_mydomain

- Use the Server Location 
/home/developer/oracle/wls12130/wlserver

- Select or fill in the path to the domain directory. Domain homes are located under /home/
developer/oracle/domains. Select the domain home /home/developer/oracle/domains/
mydomain.

- Fill in the Username and Password for the domain. This are the Username and Password you
have chosen during the creation of the domain.

You are now able to control the Weblogic Server from the Services tab in Netbeans. Just right
click on the server name and choose the desired action from the context-menu.

Create a Weblogic Console Look-And-Feel project
This is the first Weblogic Console Look And Feel (LAF) project. These steps will familiarize you
with the initialization of a Weblogic Console LAF project and make your first small customization
and deploy it to your local Weblogic Server.

Create new project 
First create a new project Java Web project. We will not particulary need a Java Web project to
build a new LAF, but Netbeans offers the war.name property which can be extracted by the build
scripts which will be used to created the LAF filename.  
- Start Netbeans

- Open a new project (File > New Project)

- Select Web Application projects in category Java Web as a project type

- Use the following Name and Location 
Project Name: MyFirstLAF 
Project Location: /home/developer/NetBeansProjects

- In the server and Settings step choose the previously created server WLS_Domain_mydomain
and Java EE Version Java EE 6 Web

- Finish the wizard 
 

Initialize the project
In this step you will add the ant build file and the netuix-extension.xml to your project and
subsequently initialize the project. The build file simplifies the initial setup and compilation of a
LAF. The netuix-extension.xml is till at least version 12.1.2 incorrectly documented in the
documentation supplied by Oracle and therefore delivered separately. 
- Copy the build-laf.xml and the netuix-extension.xml to the root of the project. 
 
cp ~/Desktop/LAB files/Lab_01/build-laf.xml  
/home/developer/NetBeansProjects/MyFirstLAF/ 
 
cp ~/Desktop/LAB files/Lab_01/netuix-extension.xml  
/home/developer/NetBeansProjects/MyFirstLAF/ 
- Open the build-laf.xml in Netbeans and change the following properties. 
The build-laf.xml is hidden in the Project window, therefore select the Files window. If the tab is
not shown then select Window > Files in the menu bar. 
 
wl.home 
Change the value of this property matching the location of your weblogic home. Change the
value to /home/developer/oracle/wls12130/wlserver 
 
wl.domainhome 
Change the value of this property matching the location of the domain home. Change the value
to /home/developer/oracle/domains/mydomain 
If you chose to give your domain another name than written in the lab instruction, then change
to value of wl.domainhome accordingly. 
 
wl.serverport 
Set this property value to the listing port of the Weblogic server. 
 
wl.adminname 
This property contains the name of the Weblogic admin. Default value is weblogic 
 
wl.adminpassword 
Use this property for the Weblogic admin password. Change this value to the password for the
Weblogic admin specified in property wl.adminname. 
 
netuix properties 
You can optionally change the values of the netuix properties netuix.title, netuix.version,
netuix.description, netuix.author and netuix.url. These properties have no programmatic
significance and will be merged into the netuix-extension.xml. These settings are only relevant
for keeping track of version and author.  

- Initialize the project by running the ant target laf.project.initialize.

- Expand the build-laf.xml node which will reveal all ant targets.

- Right click on the ant target laf.project.initialize and select Run
Target.  
This target will cleanup temporary directories used for
compiling the LAF and unzip the laftemplate to extsource
folder located in the root of your project. The extsource folder
is your laf project location. After unzipping the laftemplate the
target makes the necessary name changes in the expanded
template to match the name of the chosen LAF project name.

- When finished the extsource directory structure will be similar
as the structure shown below. 
Get familiar with the structure by examining the directories and files.

 
Customize the login page
In this step you will make your first customization to the look and feel of the Weblogic Console.
After making the change the look and feel the Weblogic Console login page should look like the
example below. Here the login section has moved to the center of the screen, the border frame
has changed to red and a legal notice has been added.

.
└── MyFirstLAF
└── extsource
   ├── css
   ├── errors
   ├── framework
   ├── images
   ├── javascript
   ├── layouts
   ├── login
   └── WEB-INF

- Open the login.css in MyFirstLAF > extsource > css

- Find the css selector for the element with id login 
The selector starts at line 68

- Change the border property to 5 pixels with and the color red; 
border: 5px solid #C80000;

- Change the value of property ﬂoat from right to left

- Save and close login.css

- Open the LoginForm.jsp in MyFirstLAF > extsource > login

- Find the form element with id loginData

- Find the end tag of the form element and cut-and-paste the following paragraph element before
the end-tag.

- Save and close LoginForm.jsp

- Run the Ant target laf.build and verify if the build completes successfully.

- Copy the compiled MyFirstLAF.war to the console-ext directory in the domain home by
executing the ant target laf.deploy.

- Restart the Weblogic server from the services tab.

- Open the Weblogic Admin Console on http://127.0.0.1:7001/console using the installed
browser to test the changes to the Weblogic Console login-page. 

<p>This computer system is the property of Me It is for authorized use only.
By using this system, all users acknowledge notice of, and agree to comply
with, My Use of Information Technology Resources Policy ("AUP").</p>
Instead of executing the ant tasks laf.compile, laf.deploy and restarting the Weblogic
server from the services you can execute the ant task laf.buildanddeploy. This has
only the disadvantage that the server output is not shown within the IDE output
window.

Lab 2
In this exercise you will explore the existing code in the weblogic console template, learn from it
and customize the Weblogic console using this new knowledge. 
 
At the end of this lab you will have customized the Weblogic Console of which the border color of
the login window and the color of the toolbar depends on the domain name you are connected
with. In this lab we assume that the naming convention for domain names is
[DTAP]_{domain_name}. An example development domain then could be D_MyDomain and
P_MyDomain for a production domain.

 
Explore the MBeanUtils class
- Open the LoginForm.jsp file

- Note that the java class MBeanUtils is imported by a JSP page directive

- Find the jar containing the MBeanUtils class by executing the following instructions at the
command-line. 
Grep will return two different version of console.jar. Select the version in wlserver/server/lib/
consoleapp/webapp/WEB-INF/lib during this lab.  
- Start jd-gui and open console.jar

- Scroll through the methods and note that the scriptlet at line 6 - 19 in LoginForm.jsp also
invoke methods from the MBeanUtils class.

 
Retrieve and print domain name 
First step is to retrieve and print the domain name in the weblogic console.

- Open the LoginForm.jsp file

- Add the following scriptlet at approx line 20 right behind the first scriptlet. 
This scriptlet retrieves the domain name using the getDomainName method of the MBeanUtils
class.

# Go to the middleware home 
cd /home/developer/oracle/wls12130 
# Find the jar 
grep -r "com/bea/console/utils/MBeanUtils" *
<% 
String domainName = MBeanUtils.getDomainName() ;
%>

- Find the closing xml tag for the div element with attribute id and value login.  
The easiest way to find the closing tag is by finding the tag <div id="login">. Then select div, it
will be highlighted as well as the closing tag. 
- Insert the following html code right after the xml closing tag. 
The JSP expression <%=domainName%> prints the value of the String domainName which
defined in the scriptlet. 
- Now build and deploy the LAF and open the weblogic console. The domain name should be
printed on the right side of the login panel. 

<div id="product-brand-name">Domain name: <%=domainName%></div></br></br>
The Inspector of Firefox Web Developer tools can help you finding the location in the
JSP or HTML of the LAF source files for a specific location on a page.

Make login panel bordercolor dynamic
Now you are able to detect the name of the domain whereon the weblogic console is opened you
can differentiate actions. So for example you can make the color of the login frame change
depending on the first character of the domain name.

- Open the LoginForm.jsp file 
- Add the following code to the in the previously created scriptlet in the LoginForm.jsp. Add the
code after the declaration of the variable domainName.  
This Java code added to the scriptlet assigns a description of the detected environment type to
the String envIndication. A CSS color name is assigned to the string envCssColor. For example,
when opening a Weblogic Console on domain P_MyDomain the variables envIndication and
envCssColor will respectively contain the values Production and Red.  
The variable envCssColor is added as a session attribute so that it can be access anywhere in
this session. 
String envIndication = null ;
String envCssColor = null ; 
// Retrieve environment from first position of domain name
if (domainName.length() > 0) {
char envIndicator = domainName.charAt(0) ;
switch (Character.toUpperCase(envIndicator)) {
case 'D':
envIndication = "Development" ;
envCssColor = "LimeGreen" ;
break ;
case 'T':
envIndication = "Test" ;
envCssColor = "LimeGreen" ;
break ;
case 'A':
envIndication = "Acceptation" ;
envCssColor = "Yellow" ;
break ;
case 'G':
envIndication = "Production Acceptation" ;
envCssColor = "Orange" ;
break ;
case 'P':
envIndication = "Production" ;
envCssColor = "Red" ;
break ;
default:
envIndication = "Unspecified" ;
envCssColor = "Navy" ;
}
} 
// Add envCssColor as session attribute
session.setAttribute("envCssColor",envCssColor) ;

- The border color of div with attribute id and value login is deﬁned in login.css. This value can be
overridden from within the LoginForm.jsp using the style attribute. 
 
Change the <div id="login"> to <div id="login" style="border:5px solid <%=envCssColor%>"> 
 
Also here the JSP expression <%=envCssColor%> will be replaced at runtime with the CSS
color name assigned to the variable envCssColor in the scriptlet. 
- To print the environment name add the following html into the div with id product-brand-name
after the html printing the Domain name. 
 
</br></br>Environment: <span style="color:<%=envCssColor%>;"><%=envIndication%></
span></br></br> 
 
When done the div will look similar to the html snippet below.

- Now build and deploy the LAF and open the weblogic console. The environment name shown
on the login page should print unspeciﬁed and the color of the login frame should be blue. 
- Create a new domain, eg. P_MyDomain listening on port 7002 and add this new domain as a
service in Netbeans. 
- Deploy the LAF to the new domain. To deploy the LAF to the new domain, the property
wl.domainhome in build-laf.xml have to be changed to the new domain. Restart the Weblogic
server and open the weblogic console on port 7002. The login page now should look similar to
the example below.

<div id="product-brand-name">Domain name: <%=domainName%></br></br>
Environment: <span style="color:<%=envCssColor%>;"><%=envIndication%>
</span></br></br>

Make the toolbar color dynamic
Now the look and feel of the login page is made dependent on the domain environment it is time
to change the LAF of the console portal.

- Login to the Admin Console and logon. 
- Activate the Inspector Web developer tool in Firefox from the menu bar 
Tools > Web Developer > Inspector 
- Determine that the background color of the toolbar is defined in the content.css file and applied
on the division (<div>) with class toolbar.  
- Search the extsource directory structure for jsp files containing an html division element with
class toolbar. You will notice that there is no such file. This HTML is generated by a server-side
servlet or portlet. Therefore it is not possible to modify the style of division element in a LAF file
as in the LoginPage.jsp.  
Another approach to change the toolbar color is by changing the style of an existing toolbar
class using javascript. The best location for placing such a Javascript is the head of the page
which is defined in head.jsp. 
- Open head.jsp and add the following scriptlet after the <skeleton:children/> xml tag. 
This will retrieve the color from the session attribute envCssColor set in LoginForm.jsp 
- Now we have retrieved the value from the session attribute, the background color style of
element(s) toolbar has to be changed. Because it is obvious that the content in header will be
rendered before any content on the page you must make sure the page is fully rendered before
making style changes. Add the following javascript after the previously added scriptlet. 
The window.onload eventhandler executes the function when the window's load event fires.
When fired all elements of class toolbar in the document are retrieved. And for each element
retrieved the css property backgroundColor is changed to the value in JSP variable
envCssColor.

<jsp:scriptlet>
String envCssColor = (String) pageContext.getAttribute("envCssColor") ;
</jsp:scriptlet>
<script type="text/javascript">
window.onload = function () {
var elems = document.getElementsByClassName("toolbar");
for(x = 0 ; x < elems.length; x++) {
elems[x].style.backgroundColor = "${envCssColor}" ;
}
} ;
</script>

- Deploy the LAF to the new domain. To deploy the LAF to the new domain, the property
wl.domainhome in build-laf.xml has to be changed to the new domain. Restart the Weblogic
server and open the weblogic console on port 7002. The login page now should look similar to
the example below. 
Adding environment to page header
 
Another way of diﬀerentiate the environment of the weblogic console is by printing the
environment into the header.  
 
Now it is up to you to change the LAF yourself. Change the LAF such that the environment is
printed in the header of the page in the color of the toolbar.


Lab 3

In this lab you will add a list of managed server names and their state to the Weblogic Console
login page. To realize this existing methods in the imported MBeanUtils class are utilized.
Weblogic monitoring data is exposed through Runtime Server MBeans. Each server has an
MBean Server exposing the Runtime Server MBeans of that speciﬁc host. To retrieve the status of
all managed servers, a list of all MBean Servers has to be obtained. For each MBean Server the
Server Runtime has to be accessed to retrieve the server state.

- Open the console.jar with JD-GUI

- Look up the method getServerRuntimeMBeans()  
Note that this method uses the Domain RuntimeService MBean to get a list of all server
runtimes and returns an array of ServerRuntimeMBean instances. Therefore the following line
will instantiate an ServerRuntimeMBean array with all available server runtimes.

- Very convenient, the MBeanUtils class contains the method getServerName(RuntimeMBean
runtimeMBean) which returns the server name as a String. (look it up!) A list of all server names
can be acquired by looping through elements of svrRuntimes and invoking the
MBeanUtils.getServerName method for each ServerRuntimeMBean instance.

- No so convenient, there is no method in MBeanUtils to retrieve the state of an server. Because
we are accessing an MBean, the attributes can be retrieved or changed using getters and
setters. Open the Weblogic MBean Reference, lookup the ServerRuntimeMBean and it's
attributes. Note there is a State attribute for which is a getState() and setState() method. The
state of a speciﬁc server therefore can be obtained by invoking the getState() method on that
servers ServerRuntimeMBean.

ServerRuntimeMBean[] svrRuntimes = MBeanUtils.getServerRuntimeMBeans() ;
String serverName = MBeanUtils.getServerName(svrRuntimes[x]) ;
String serverState = svrRuntimes[x].getState() ;

- Now add the following few lines to the scriptlet in LoginForm.jsp you created previously. Add
the code after the first few declarations in the scriptlet. 
Note that there is an unused invocation of method
getDomainRuntimeMBeanServerConnection. Try to find explain why this method is necessary.
Look up the methods getDomainRuntimeMBeanServerConnection and
getServerRuntimeMBeans. Also investigate the weblogic server log after you build and deploy
the extension after commenting out the line with the
getDomainRuntimeMBeanServerConnection method to see what happens without this
invocation. 
- By adding the few lines above into the scriptlet, new previously not used classed need to be
imported into the LoginForm.jsp. Add the next two jsp page directives to the beginning of the
LoginForm.jsp file.

- The Array mngdServers[] now contains a list of managed servers with their actual state. Insert
the following JSP expression right after the previously added printing of the environment at
approximately line 160.

String[] mngdServers = new String[0] ;
// Connect to DomainRuntimeMBeanServer
try {
// Find out yourself why this statement is necessary
MBeanServerConnection msc = MBeanUtils.getDomainRuntimeMBeanServerConnection() ;
// If serverConnection can be established retrieve server runtime MBeans
 
mngdServers = new String[svrRuntimes.length] ;
for (int s=0 ; s < svrRuntimes.length; s++) {
mngdServers[s] = MBeanUtils.getServerName(svrRuntimes[s]) + " [" +
svrRuntimes[s].getState() + "]" ;
}
} catch (Exception e) { } ;
<%@ page import="weblogic.management.runtime.ServerRuntimeMBean"%>
<%@ page import="javax.management.MBeanServerConnection"%>
<c:if test="<%=mngdServers.length > 0 %>">
Servers:<br/>
<c:forEach var="svrState" items="<%=mngdServers%>">
- <c:out value="${svrState}"/><br/>
</c:forEach>
</c:if>

- Build and deploy the LAF. Restart the Weblogic server and open the Weblogic console. The
login page now should look similar to the example below.

The list of servers and their state are now shown until after the ﬁrst successful login. Explain why
you need to logon once to show the server state on the logon page. Hint; Take a closer look at the
used MBeanUtils methods using JD-GUI.


Showing server health
A running server still can have a Warning state. Change the LAF so that the state of the servers
also is shown on the login page like in the example below.  

 

Lab 4
When working in large organizations it is hard notify the right correct persons with important
information about pending changes, known issues, etc. Something what can be useful is a 'ticker-
tape' which shows important messages in the Weblogic Console. In this lab you will implement a
ticker tape using two different frameworks. The first implementation is based on vTicker a jQuery
plug-in, the second implementation is a AngularJS application. 
 
Both ticker tape examples use JSONP to retrieve the messages from a remote webserver.
`JSONP or "JSON with padding" is a communication technique used in JavaScript programs
running in web browsers to request data from a server in a different domain, something which is
prohibited by typical web browsers when making JSON requests using AJAX because of the
same-origin policy.`
1
Start the JSONP webserver

- Change to the LAB folder 
cd ~/Desktop/LAB files/Lab_04/JSONPServer

- Start the webserver using the following command. 
 
./jsonweb.sh -p 8024 -j demomessages.json 
 
This wil make the webserver listen on port 8024 and return a JSONP message. This can be
tested by opening the URL http://127.0.0.1:8024/. If no callback function is requested it will
return the function JSONP_CALLBACK. A specific callback function can be requested by
assigning the requested callback function to the URL variable callback. E.g. http://
127.0.0.1:8024/?callback=MyCallBackFunction.

- Stop the webserver by executing the following instruction. 
 
./jsonweb.sh -k 8024

vTicker (jQuery) ticker tape
Before making these changes to the LAF of the Weblogic Console, make a copy of the footer.jsp.
This file needs to be restored later on when implementing a AngularJS version of the message
ticker.

Because this message ticker is based on a jQuery plug-in, jQuery must be loaded. The best
location is in the file head.jsp which renders the HTML head section. 
- Create the directory ext in MyFirstLAF/extsource/javascript/ext

http://en.wikipedia.org/wiki/JSONP1

- Copy the file jquery.min.js and jquery.vticker.min.js from LAB files/Lab_03_Ticker/jQueryTicker/
js to the directory MyFirstLAF/extsource/javascript/ext in the root of your NetBeansProjects
folder.

- Open the Files view in your Netbeans LAF project and navigate to extsource > framework >
skeletons > MyFirstLAF.

- Open the head.jsp

- Add the following javascript import within the HTML head elements and save the file

- Open the footer.jsp

- Find the opening tag div with attribute id and value console-footer , and add the following code
after this tag. This code section consists of three blocks 
- Import of javascript for the vTicker jQuery plug-iin

- Style declarations for the message ticker

- HTML div element with class and id tickerMessage containing an unordered list. The list-
item elements in this unordered list will be updated with the ticker messages 
<script src="${pageContext.request.contextPath}/javascript/ext/jquery.min.js"></script>
<script
src="${pageContext.request.contextPath}/javascript/ext/jquery.vticker.min.js"
type="text/javascript" charset="utf-8">
</script>
<style>
div.tickerMessage > ul > li {
font-size:20px;
}
div.tickerMessage > ul > li > a {
font-size:20px;
font-style: italic;
color:white;
}
div.tickerMessage { height: 20px ;}
</style> 
 
<div id="tickerMessage" class="tickerMessage" style="font-size: 16px;">
<ul>
<li>No news yet...</li>
</ul>
</div>

- Add the Javascript below right after where you just copied the previous code. This Javascript
makes the JSONP requests, processes the JSON data in the callback function and update the
list-items in the vTicker div element.

- Now build and deploy the LAF and restart the Weblogic Server.

- Logon to the Weblogic Console and see that the messages in the JSON ﬁle appear in the footer
of the Weblogic Console. (Make sure the JSONP webserver is running to see the messages) 

<script type="text/javascript" charset="utf-8">
var htmlData = "<ul><li>Ticker was not successfully initialized</li></ul>" ;
// callback function for JSONP ajax request
function msgsJsonCallback(jsonData) {
htmlData = "<ul>" ;
// get all msg values from JSON data
// JSON format ([{"msg":"message 1"{,{"msg":"message 2},......])
$.each(jsonData, function() {
htmlData += "<li>" + this['msg'] + "</li>" ;
}) ;
httmlData = htmlData + "</ul>" ;
$('#tickerMessage').vTicker('stop');
$('#tickerMessage ul').replaceWith(htmlData);
$('#tickerMessage').vTicker('init',{speed: 1500, pause: 10000});
}
// Make AJAX to retrieve JSONP object containing messages
function RefreshMessages() {
var url= "http://localhost:8024" ;
$.ajax({
type: 'GET',
url: url,
jsonpCallback: 'msgsJsonCallback',
dataType: 'jsonp',
timeout: 5000
});
// schedule next refresh
setTimeout(function() {
RefreshMessages();
}, 60000);
}
// initialize message ticker on document-ready
$(document).ready(function() {
RefreshMessages();
}) ;
</script>

AngularJS message ticker
This message ticker is another variant based on AngularJS instead of jQuery and does not
required an external module like vTicker. It also has an indicator which shows the status of the
connection with the JSONP server. 
 
If you have implemented the vTicker message ticker in this lab then replace the existing footer.jsp
with the copy made at the start of this lab. 
- Copy all image files from LAB files/Lab_04/AngularJSTicker/images to the folder MyFirstLAF/
extsource/images in the root of your NetBeansProjects folder.

- Copy the file angular.min.js from LAB files/Lab_04/AngularJSTicker/js to the folder MyFirstLAF/
extsource/javascript/ext in the root of your NetBeansProjects folder.

- Open the Files view in your Netbeans LAF project and navigate to extsource > framework >
skeletons > MyFirstLAF.

- Open the footer.jsp

- Find the tag div with attribute id and value console-footer , and add the following code after this
tag. This code section consists of three blocks 
- Import of javascript delivering the AngularJS framework

- Style declarations for the message ticker

- AngularJS directives for the AngularJS ngSimpleTicker application  
<script src="${pageContext.request.contextPath}/javascript/ext/angular.min.js"></
script>  
 
 
<style>
div.ngtickerMessage > ul > li {
font-size:20px;
display:initial;
padding: 2px 0px 2px 0px;
margin:0px;
}
div.ngtickerMessage > ul {
margin:0px ;
padding:0px;
}
div.ngticker { height:28px; }
div.ngtickerStatus { float:left; }
div.ngtickerStatus > img { padding: 6px ;}
div.ngtickerMessage { float:left;}
#ngtickerMessage .msgitem {
position: absolute;
-webkit-transition: all 2.0s;
transition: all 2.0s;
}
</style>

- Add the Javascript show on the next page right after where you just copied the previous code.
This Javascript is the controller for the ngSimpleTicker application.

<div data-ng-app="ngSimpleTicker"
data-ng-controller="messagesController"
data-ng-init="msgs=[{msg:'Awaiting first message'}]"
class="ngticker">
<div class="ngtickerStatus">
<img
src="images/Aqua-Ball-{{ statusOK() && 'Green' || 'Red'}}-
icon.png">
</img>
</div>
<div id="ngtickerMessage" class="ngtickerMessage">
{{ updateModel("JSONP","http://127.0.0.1:8024/?callback=JSON_CALLBACK") }}
<ul>
<li class="msgitem" ng-style="{opacity:setVisible($index)}" data-ng-
repeat="msgObj in msgs track by $index">{{msgObj.msg}}</li>
</ul>
</div>
</div>

- Now build and deploy the LAF and restart the Weblogic Server.

- Logon to the Weblogic Console and see that the messages in the JSON ﬁle appear in the footer
of the Weblogic Console.  
 

Lab 5
When you are responsible for managing a substantial number of domains it can be useful to have
the essential relevant data on hand when having to perform actions on a domain. A logical place
to present this information is the Weblogic Console. In this lab you will add an extra 'Domain Info'
tab to the generic domain configuration tabs, add details subtabs and add shortcuts to the
domain structure to these subtabs. Each tab shows specific information related to the domain you
are logged on to. This information is stored on a central location to simplify the administration of
domain support information. The relevant support information in the Weblogic Console is retrieved
from a central webserver using JSON and presented in the Domain Info sub-tabs.

Start the JSONP webserver

- Change to the LAB folder 
cd ~/Desktop/LAB files/Lab_05/JSONPServer

- Start the webserver using the following command. 
 
./jsonweb.sh -p 8088 -j domaininfo.json 
 
This wil make the webserver listen on port 8088 and return a JSONP message. This can be
tested by opening the URL http://127.0.0.1:8088/. If no callback function is requested it will
return the function JSONP_CALLBACK. A specific callback function can be requested by
assigning the requested callback function to the URL variable callback. E.g. http://
127.0.0.1:8088/?callback=MyCallBackFunction.


- Stop the webserver by executing the following instruction. 
 
./jsonweb.sh -k 8088
Adding the Book
Start by adding a book extension to the netuix-extension.xml. Create a book-extension which
appends the book-file to the CoreDomainConfigGeneralBook that will create a tab with sub-tabs.

Now we have added the location of the book-file we can create the book-file defining the tab,
sub-tabs and the portlets shown in the tabs. Create the file /controls/domaininfo.book in the
extsource folder using the book-file shown on the next page. The <netuix:singleLevelMenu />
element will make that each page in the book-file will be rendered as a sub-page. The value
assigned to the title attribute for each book (main tab) or page (sub tab) is the value shown on the
tab.

The backingFile attribute for each page contains the class which will be invoked when the page is
loaded. We will add this class later in this lab to add these sub-tabs to the Domain Structure.

 
<book-extension>
<book-location>
<parent-label-location label="CoreDomainConfigGeneralBook"/>
<book-insertion-point action="append"/>
</book-location>
<book-content content-uri="/controls/domaininfo.book"/>
</book-extension>

<?xml version="1.0" encoding="UTF-8"?>
<portal:root
xmlns:netuix="http://www.bea.com/servers/netuix/xsd/controls/netuix/1.0.0"
xmlns:html="http://www.w3.org/1999/xhtml-netuix-modified/1.0.0"
xmlns:xsi="http://www.w3.org/2001/XMLSchema-instance"
xmlns:portal="http://www.bea.com/servers/netuix/xsd/portal/support/1.0.0"
xsi:schemaLocation="http://www.bea.com/servers/netuix/xsd/portal/support
/1.0.0 portal-support-1_0_0.xsd">
<netuix:book markupName="book" markupType="Book"
definitionLabel="DomainInfoPage" title="Domain Info">
<netuix:singleLevelMenu markupType="Menu"  
markupName="singleLevelMenu"
presentationClass="multi-level1"/>
<netuix:meta name="skeleton-resource-bundle" content="Bundle"/>
<netuix:content>
<netuix:page markupName="page" markupType="Page"
definitionLabel="DomainInfoPage_1" title="Owner details"
presentationClass="page-table"
backingFile="com.reddipped.consoleext.DomainInfoNavTreeExtension">
<netuix:content>
<netuix:portletInstance markupType="Portlet"
instanceLabel="DomainInfoPagePortlet_1"
contentUri="/portlets/DomainInfoPage_1.portlet"/>
</netuix:content>
</netuix:page>
<netuix:page markupName="page" markupType="Page"
definitionLabel="DomainInfoPage_2" title="Support info"
presentationClass="page-table"
backingFile="com.reddipped.consoleext.DomainInfoNavTreeExtension">
<netuix:content>
<netuix:portletInstance markupType="Portlet"
instanceLabel="DomainInfoPagePortlet_2"
contentUri="/portlets/DomainInfoPage_2.portlet"/>
</netuix:content>
</netuix:page>
</netuix:content>
</netuix:book>
</portal:root>

Creating portlets
Now create the 2 portlets DomainInfoPage_1 and DomainInfoPage_2 using the sample code
below. Make sure the definitionLabel for each created portlet is unique.

You now created the definitions of the main tab Domain Info with the sub-tabs Owner details and
Support info. The Owner details tab contains the portlet DomainInfoPage_1 which loads
domaininfo_1.jsp. Tab Support Info now contains the portlet DomainInfoPage_2 loading the
domaininfo_2.jsp. Each tab will show specific domain specific information. To be able to retrieve
domain specific information the name of the domain is required. To get the domain name we will
use the same data source as the Weblogic Console for the toolbar.

Log on to the Weblogic console and open the uri http://localhost:7002//console/data/diagnostics/
toolbar in that same session. This uri returns data in JSON format containing various data
including the domain name.

The domaininfo_?.jsp files make use of an AngularJS module which retrieves the domain name by
retrieving the toolbar JSON data. After making this request and extracting the domain name from
the JSON data, it retrieves data in JSON format using JSONP from the webserver we have setup
at the beginning of this lab. This JSON data contains the Domain Information we want to show on
the domain info pages.

 
Add the AngularJS controller domainInfoController to the project by copying the file domainInfo.js
from Lab_05/lab_files/js to /javascript/ext in the project folder.

<?xml version="1.0" encoding="UTF-8"?>
<portal:root xmlns:html="http://www.w3.org/1999/xhtml-netuix-modified/1.0.0"
xmlns:portal="http://www.bea.com/servers/netuix/xsd/portal/support/1.0.0"
xmlns:netuix="http://www.bea.com/servers/netuix/xsd/controls/netuix/1.0.0"
xmlns:xsi="http://www.w3.org/2001/XMLSchema-instance"
xsi:schemaLocation="http://www.bea.com/servers/netuix/xsd/portal/
support/1.0.0 portal-support-1_0_0.xsd">
<netuix:portlet definitionLabel="DomainInfo_1_Portlet"  
presentationClass="wlsc-window" >
<netuix:content>
<netuix:jspContent contentUri="/jspext/domaininfo_1.jsp"/>
</netuix:content>
</netuix:portlet>
</portal:root>
{"body":{"loggedInUser":"weblogic","domain":"P_MyDomain","localeSettings":
{"locale":"en_US","numberFormat":
{"decimalSeparator":".","minusSign":"-","percent":"%","groupingSeparator":",",
"groupingSize":3},"dateTimeFormat":{"amPmStrings":["AM","PM"],"shortMonths":
["Jan","Feb","Mar","Apr","May","Jun","Jul","Aug","Sep","Oct","Nov","Dec",""],"
dateTimePattern":"M/d/yy h:mm:ss a","localizedDateTimePattern":"M/d/yy h:mm:ss
a","datePattern":"M/d/yy","localizedDatePattern":"M/d/
yy","timePattern":"h:mm:ss a","localizedTimePattern":"h:mm:ss
a"}}},"messages":[]}

Copy the JSP files domaininfo_1.jsp and domaininfo_2.jsp from Lab_05/files/jsp to /jspext. Both
JSP files are very similar, the difference is the data which presented. Notice that the data is
presented by an AngularJS application, ngGetDomainInfo. The Angular application is initialized by
calling function updateModel with three arguments. The first argument is the HTTP method used
to invoke our web-server, the second the URL to the web-server including the URL parameter
callback specifying the requested callback function. You can invoke this URL from the browser to
view the data which will be used to build the domain info pages. The last argument is the URI to
retrieve the toolbar data. The JSP pageContext is used to construct this URL. In this way the
scheme, hostname and portnumber is used as is for accessing the Weblogic Console.  
 
Test the new Tabs and sub-tabs by building and deploying the Console Extension.

Adding shortcuts to the Domain Structure
It can be convenient to add specific pages to the Domain Structure. You can
append or insert single nodes or complete node-trees. In this lab you will
append a node-tree to the existing Domain. You will add a root-node Domain
Information with two child nodes, Owner details and Support Info which will
contain hyperlinks to the corresponding tabs you created in the previous steps
of this lab.

First review the /controls/domaininfo.book created earlier in this lab and note
that both page definitions have an attribute backingFile. This attribute defines
the class which is invoked when the pages are loaded.

Copy the file DomainInfoNavTreeExtension.java from Lab_05/lab_files/classes to MyFirstLAF/
extsource/classes/com/reddipped/consoleext. Review the code of this Java class . Only the2
PageBackingContext of the parent node is available when the getTreeExtension method is
invoked. So when DomainInfoPage_1 is loaded only the PageBackingContext of this page is
available. Therefore for any other TreeNode in the node-structure created by this method, the
nodeId, nodeName and nodeUrl has to be hardcoded. 
If imported classes cannot be found, go to Projects tab and choose Add Library from the context2
menu in the Libraries folder. Then add the WeblogicLAF library and restart Netbeans.
<div data-ng-app="ngGetDomainInfo"
data-ng-controller="domainInfoController"
data-ng-init="updateModel('JSONP','http://127.0.0.1:8088/?
callback=JSON_CALLBACK',
'${pageContext.request.scheme}://$
{pageContext.request.localName}:${pageContext.request.serverPort}$
{pageContext.request.contextPath}/data/diagnostics/toolbar')"
class="ngDomainInfo">

The extract from the DomainInfoNavTreeExtension.java on the next page creates a Parent node
ﬁrstLevelNode with nodeId 'DomainInfoPage' and nodeName 'Domain Information'. The value of
the nodeName is the value shown in the NodeTree. Two child nodes are added to the parent
node, for the ﬁrst child node the values are retrieved from the PageBackingContext of
DomainInfoPage_1. Because the PageBackingContext of DomainInfoPage_2 is not available the
values from this context have to be added as static values. Last an NavTreeExtensionEvent is
created which appends the Parent node to '/', the root the navigation tree.

Test the extension of the navigation tree by building and deploying the Console Extension.

public class DomainInfoNavTreeExtension extends NavTreeExtensionBacking {
public NavTreeExtensionEvent getTreeExtension(PageBackingContext ppCtx, String
extensionUrl){
// Construct the first TreeNode
TreeNode firstLevelNode = new TreeNode("DomainInfoPage","Domain Information","") ;
// Add the Page as a child node to the first node based on the backing context
// This will be the page DomainInfoPage_1 defined in the domainInfo.book
TreeNode secondLevelNode1 = new TreeNode(ppCtx.getDefinitionLabel(),
ppCtx.getTitle(),extensionUrl,firstLevelNode);
// Add additional pages using a hardcoded definitionLabel, title and url
TreeNode secondLevelNode2 = new TreeNode("DomainInfoPage_2",
"Support Info","/console/console.portal?
_nfpb=true&_pageLabel=DomainInfoPage_2",firstLevelNode);
// Add TreeExtension to root of DomainStructure
NavTreeExtensionEvent evt = new
NavTreeExtensionEvent("/",firstLevelNode,NavTreeExtensionEvent.APPEND_ACTION);
return evt;
}

Lab 6
In this lab you will add a tab to the CoreDomainConfigGeneralBook with some, but less,
guidance, than in the previous labs. If you get stuck, you can always take a peek into Lab_06/
lab_files/resolution. After finishing this lab you will have added a the Server Status tab showing
the server health and status in a table. You will also be able to access this tab directly through a
link in the Domain Structure.

Add a book extension
The first step is to add a book extension to the netuix-extension.xml. Add the book extension to
the CoreDomainConfigGeneralBook which loads the book content from /controls/MyFirst.book.

Create a book
Now we need to create the book file MyFirst.book in /controls. Create the book-file which defines
a page using the following attributes.

definitionLabel MyFirstPage

title Server Status

presentationClass page-table

Add a netuix:content element to the page which loads an instance of portlet /portlets/
MyFirst.portlet.


Create a portlet
Create the portlet MyFirst.portlet in /portlets which loads the content from the JSP-ﬁle MyFirst.jsp
in /jspext.

Add the JSP
Now it is time to add the actual content to the tab by creating the JSP MyFirst.jsp. Create the ﬁle
MyFirst.jsp in /jspext using the example code below.

<jsp:root version="2.0" xmlns:jsp="http://java.sun.com/JSP/Page"
xmlns:c="http://java.sun.com/jsp/jstl/core"
xmlns:template="http://beehive.apache.org/netui/tags-template-1.0">
<jsp:directive.page import="com.bea.console.utils.MBeanUtils"/>
<jsp:directive.page import="weblogic.management.runtime.ServerRuntimeMBean"/>
<jsp:directive.page import="javax.management.MBeanServerConnection"/>
<jsp:directive.page import="com.bea.console.utils.HealthUtils"/>
<jsp:directive.page import="weblogic.health.HealthState"/>
<jsp:directive.page import="java.util.HashMap"/>
<jsp:directive.page import="java.util.List"/>
<jsp:directive.page import="java.util.ArrayList"/>
<jsp:scriptlet>
List mngdServers = new ArrayList<HashMap<String,String>>() ;
try {
// Prevent java.io.IOException due to anonymous logons
MBeanServerConnection msc = MBeanUtils.getDomainRuntimeMBeanServerConnection() ;
String healthStateTxt = "" ;
HealthState health = HealthUtils.getIntegratedHealthState(svrRuntimes[s]);
int healthState = -1 ;
if (health != null) {
healthState = health.getState();
}
switch (healthState) {
case 0:
healthStateTxt = "ok";
break;
case 1:
healthStateTxt = "warning";
break;
case 2:
healthStateTxt = "critical";
break;
case 3:
healthStateTxt = "failed";
break;
case 4:
healthStateTxt = "overloaded";
break;
default:
healthStateTxt = "unknown";
}

Compile the Weblogic Console extension by executing the target laf.buildanddeploy. Review the
outcome of the build process and correct the changes if necessary. Login to the Weblogic
Console and select P_MyDomain in the Domain Structure. Select the tab Server Status to review
the console extension.

HashMap mgdSvr = new HashMap<String,String>() ;
mgdSvr.put("name",MBeanUtils.getServerName(svrRuntimes[s])) ;
mgdSvr.put("state",svrRuntimes[s].getState()) ;
mgdSvr.put("health",healthStateTxt) ;
mngdServers.add(mgdSvr) ;
}
} catch (Exception e) { } ;
request.setAttribute("mngdServers",mngdServers) ;
</jsp:scriptlet>
<table class="summaryTable" datatable="0" summary="" style="margin:3px;">
<tbody>
<tr>
<th scope="col">Managed Server</th>
<th scope="col">State</th>
<th scope="col">Health</th>
</tr>
<c:forEach var="svrState" items="${mngdServers}">
<tr>
<td>${svrState.name}</td>
<td>${svrState.state}</td>
<td>${svrState.health}</td>
</tr>
</c:forEach>
</tbody>
</table>
</jsp:root>

Adding a shortcut to the Domain Structure
Now you have added a Server Status tab to the CoreDomainConfigGeneralBook, a link can be
added to the Domain Structure redirecting to the new tab directly.

Create the java class com.reddipped.consoleext.MyFirstTreeExtension which adds a node to /
Environment using the data from the PageBackingContext and URL of the Page. Create the file in
the project folder /classes/com/reddipped/consoleext. Use the following java class as a jumpstart.

To invoke this backingFile, the class has to be added as a backingFile attribute to the page
defined previously in MyFirst.book. Add an backingFile attribute to the netuix:page element in the
book file and assign the class name including the package to this attribute.

Compile and deploy the Weblogic Console extension and determine that the node Server Status
is added to the Domain Structure.

package com.reddipped.consoleext;
import com.bea.netuix.servlets.controls.page.PageBackingContext;
import com.bea.jsptools.tree.TreeNode;
import com.bea.console.utils.NavTreeExtensionBacking;
import com.bea.console.utils.NavTreeExtensionEvent;
public class MyFirstTreeExtension extends NavTreeExtensionBacking {
@Override
public NavTreeExtensionEvent getTreeExtension(PageBackingContext ppCtx, String extensionUrl) {
// Add your code here
return evt;
}
}

Lab 7a Deploying and Exploring SysStats MBean
In this lab you will import, compile and deploy the SysStats.ear which will make the SysStats
MBean available within your domain. After successful deployment you will explore the attributes
and operations of this bean using JConsole.

Deploying SysStats.ear
In the next few steps you will import the projects in NetBeans to build and deploy the
SysStats.ear file containing the SysStatsMBean.

• Open the Projects Window in NetBeans by pressing Control+1.

• Import the projects SysStatsMBean, SysStats-war and SysStats.

• Repeat the following steps for each project

• Select File > Import Project > From ZIP

• Select the ZIP-file corresponding with the project name from  
LAB files/Lab_07/netbeans_projects

• Use the Folder /home/developer/NetBeansProjects

• Select Import

• Determine that there are 3 projects added to the projects window

• Select the SysStats projects and right click to bring up the context-
menu. Select Clean and Build from the context-menu to compile
the project.

• Deploy the project SysStats.ear by selecting Deploy from the
SysStats context-menu.

If all steps were successfully executed, SysStats will now be active. A way to check this is by
selecting Deployments in the Domain Structure of the Weblogic Console. The deployment
SysStats should have the State Active and Health OK.

Exploring the SysStats MBean
In this lab you will be using JConsole to access the MBeans available in the Weblogic Domain and
explore the attributes and operations of the SysStats MBean.

• Start JConsole from the Desktop and make a local connection to the weblogic.Server
process.

• Select Insecure when a ConnectionFailed SSL1 is shown.

• Select the tab MBeans

• On the left side of the window a list of MBeans will be shown, select the MBean
com.reddipped.systats.jmx.bean.

• Expand the branches Attributes and Operation of MBean myserver and type SysStats.

• There are 2 different types of Attributes.


• SimpleType attributes which contain a single value. 
 
Explore one SimpleType Attribute, e.g. CPULoadAverage. 
Select the Refresh button to get the actual value of the Attribute. 
• ArrayType attributes containing an array of values. 
 
Explore an ArrayType Attribute, e.g. AvgCPULoadHistory. 
The presented value is javax.management.openmbean.CompositeData[50]. 
Double-click on this value to explore the values. The values are shown in a Composite
Navigator showing the current and total number of composites.  
 
The example below shows value 1 of 50. 
 
The original Type for AvgCPULoadHistory is
java.util.List<com.reddipped.sysstats.jmx.mbean.impl.CPULoadHistoryMBeanImpl>, a
List of CPULoadHistoryMBeanImpl MBeans. These beans have two attributes, load an
timestamp. By navigating through the values of AvgCPULoadHistory you go through a
list of MBeans and displaying it's attributes values for load and timestamp. 
• For each History Attribute value there is an operation which adds a sample to the History
attribute. For example, the Operation takeAvgCPULoadHistorySample adds an sample to
Attribute AvgCPULoadHistory. 
• Explore the first value of attribute AvgCPULoadHistory.

• Now invoke the operation takeAvgCPULoadHistorySample

• Explore the first value of attribute AvgCPULoadHistory again. 
Has the first value of the attribute been changed or has something else changed in the
values of AvgCPULoadHistory?

• When invoking a takeAvgCPULoadHistorySample operation, a new sample is added to the
AvgCPULoadHistory. If the total number of values in AvgCPULoadHistory is larger than the
value of attribute HistorySize the oldest value is removed from the list.

• Now explore the HeapUsageHistory bean values and try to explain the data structure. 
 
 

Lab 7b Installing the Servlet and Console Extension
When finishing this lab you will have installed the Servlet which will convert the data in the
SysStats MBean to JSON data structure. You also will have added an extra page containing a
portlet with JSP content. This extension will periodically make requests to the servlet to get the
current data from the SysStats MBean in JSON format.

Install Java classes
Create the folder /classes/com/reddipped/controller/json and /classes/com/reddipped/model.
Copy the file JChartJSONObjects.java from LAB files/Lab_07/lab_files/classes to the project
folder /classes/com/reddipped/controller/json. And copy the file JChartJSONHelper from LAB
files/Lab_07/lab_files/classes to the project folder /classes/com/reddipped/model. 
 
To make the JChartJSONObjects to be accessible from a browser, the servlet container must
know which servlets have to be deployed and which URL's are mapped to the servet. This has to
be done in the web.xml. Open the web.xml in /extsource/WEB-INF and add the following servlet
and servlet-mapping elements.

Compile and deploy the Weblogic Console extension. Logon to the Weblogic Console and open a
new tab in the Webbrowser. Open the URL http://localhost:7002/console/JChartJSONObjects?
chartType=cpuLoadRadarChart. The returned content is the data from the attribute
AvgCPULoadHistory of the SysStats MBean in JSON format. The JSON format has the structure
required for a Chart.js Radar Chart. More details about this format can be found at http://
www.chartjs.org/docs/#radar-chart.  
 
Try to replace the value for url variable chartType with heapSizeStackedChart or
loadedClassesLineChart. Notice that each chart has its own JSON format.

<servlet>
<servlet-name>JChartJSONObjects</servlet-name>
<servlet-class>com.reddipped.controller.json.JChartJSONObjects</servlet-class>
</servlet>
<servlet-mapping>
<servlet-name>JChartJSONObjects</servlet-name>
<url-pattern>/JChartJSONObjects</url-pattern>
</servlet-mapping>

Add Book, Portlet and JSP
You will be adding a book to the Weblogic Console which will be positioned below the Change
Center which will show the different graphs. The Console has two layout locations, the right part
of the Weblogic Console with layout-location "0" and the left small column with layout-location
"1". The first Book at layout-location "1" is the Change Center which has placeholder-position "0".
To insert a new book just below the Change Center the layout-location and placeholde-postion
have both to be set to 1. 
 
Add the following page-extension definition to the netuix-extension.xml to insert the book defined
in /controls/systemresources.book

Copy the file systemresources.book from LAB files/Lab_07/lab_files to MyFirstLAF/extsource/
controls. The systemresources.book loads the systemresources.portlet, copy the
systemresources.portlet from LAB files/Lab_07/lab_files to MyFirstLAF/extsource/portlets. As last
copy the systemresources.jsp from LAB files/Lab_07/lab_files to MyFirstLAF/extsource/jspext.

The systemresources.jsp requires bxslider, chart.js and the chart.js extension
Chart.StackedBar.js. Copy jquery.bxslider.min.js from LAB files/Lab_07/lab_files/js to MyFirstLAF/
extsource/javascript/ext.  
Copy the folder bxslider from LAB files/Lab_07/lab_files/css to MyFirstLAF/extsource/css.

Copy Chart.min.js and Chart.StackedBar.js from LAB files/Lab_07/lab_files/js to MyFirstLAF/
extsource/javascript/ext.

Compile and deploy the Weblogic Console extension. Logon to the Weblogic Console and wait a
some minutes to be able to gather some samples and feed the graphs with some historical data.

Note: For demo purposes the Java classes and MBean do contain some extra code to virtualize
extra Managed Servers and the metrics.

<page-extension>
<page-location>
<parent-label-location label="page"/>
<page-insertion-point layout-location="1" placeholder-position="1"/>
</page-location>
<book-content content-uri="/controls/systemresources.book"/>
</page-extension>

Appendi
Useful websites
Developing Enterprise JavaBeans, Version 2.1, for Oracle WebLogic Server

http://docs.oracle.com/middleware/1213/wls/EJBPG/appc_ejbc.htm

Tutorialspoint JSP

http://www.tutorialspoint.com/jsp

Extending the Administration Console for Oracle WebLogic Server

http://docs.oracle.com/middleware/1212/wls/CNSLX/title.htm#BEGIN

Weblogic server MBean reference

docs.oracle.com/middleware/1212/wls/WLMBR/core/index.html

AngularJS

http://www.w3schools.com/angular/default.asp

http://campus.codeschool.com/courses/shaping-up-with-angular-js

Bxslider

http://bxslider.com

Chart.JS

http://chartjs.org

https://github.com/Regaddi/Chart.StackedBar.js

Relevant ﬁles
Netuix schema deﬁnitions

<WL_HOME>/server/lib/consoleapp/APP-INF/lib/netuix-schemas.jar 

Solutions
Lab 2 Adding environment to page header
Add the following line session.setAttribute("envIndication",envIndication) ;

to the scriptlet LoginForm.jsp just before or after line
session.setAttribute("envCssColor",envCssColor) ;

Add the line <span id="product-brand-name" style="padding-left:100px;color:${envCssColor}">$
{envIndication}</span> after <span id="product-name"><fmt:message key='product.name'
bundle="${current_bundle}"/></span> at line 34 of header.jsp


Lab 3 Showing server healthstate

<%@ page language="java"%>
<%@ page import="com.bea.console.utils.MBeanUtils"%>
<%@ page import="weblogic.management.runtime.ServerRuntimeMBean"%>
<%@ page import="javax.management.MBeanServerConnection"%>
<%@ page import="com.bea.console.utils.HealthUtils"%>
<%@ page import="weblogic.health.HealthState"%>
<%@ taglib uri="http://java.sun.com/jsp/jstl/fmt" prefix="fmt"%>
<%@ taglib uri="http://java.sun.com/jsp/jstl/core" prefix="c"%>
<%@ taglib uri="/WEB-INF/console-html.tld" prefix="wl"%>
.....
<%
String envIndication = null ;
String envCssColor = null ;
String[] mngdServers = new String[0] ;
try {
// Prevent java.io.IOException due to anonymous logons
MBeanServerConnection msc =
MBeanUtils.getDomainRuntimeMBeanServerConnection() ;
mngdServers = new String[svrRuntimes.length] ;
String healthStateTxt = "" ;
HealthState health =
HealthUtils.getIntegratedHealthState(svrRuntimes[s]);
int healthState = -1 ;
if (health != null) {
healthState = health.getState();
}
switch (healthState) {
case 0:
healthStateTxt = "ok";
break;
case 1:
healthStateTxt = "warning";
break;
case 2:
healthStateTxt = "critical";
break;
case 3:
healthStateTxt = "failed";

Weblogic Console Customization labs

More Related Content

What's hot (20)

Similar to Weblogic Console Customization labs (20)

Recently uploaded (20)

Weblogic Console Customization labs