In this demonstration the PanelBar JavaBean is used in a JSP page and configured with Java to create the menu shown.
Step 1 - Create an instance of PanelBar on your page.
Import the PanelBar JavaBean and create a new PanelBar object.
<%@ page language="java" import="Coalesys.PanelBar.*" %>
<%
PanelBar objPB = new PanelBar();
Step 2 - Set the UserAgent property for automatic browser detection.
Setting the UserAgent property to the User-Agent string allows PanelBar to auto-detect the browser and to generate the code that is specific to it.
objPB.setUserAgent(request.getHeader("User-Agent"));
Step 3 - Add Group and Item objects to the menu.
The Groups and Items collections are used to manage the Group and Item objects. Here we add 2 Group with and their items.
Group objGroup = objPB.getGroups().Add();
objGroup.setCaption("Home");
Item objItem = objGroup.getItems().Add();
objItem.setCaption("News");
objItem.setURL("news.jsp");
objItem = objGroup.getItems().Add();
objItem.setCaption("About Us");
objItem.setURL("about.jsp");
objItem = objGroup.getItems().Add();
objItem.setCaption("Contact");
objItem.setURL("contact.jsp");
objGroup = objPB.getGroups().Add();
objGroup.setCaption("Products");
objItem = objGroup.getItems().Add();
objItem.setCaption("Super Widget");
objItem.setURL("SuperWidget.jsp");
objItem = objGroup.getItems().Add();
objItem.setCaption("Super Widget Pro");
objItem.setURL("superwidgetpro.jsp");
Step 5 - Generate the PanelBar output on the Page.
The main PanelBar object has methods to generate blocks of client code to the page in sections. Event handlers are also added to the BODY tag.
<html>
<head>
<title>Quick Start</title>
<style type="text/css">
<%=objPB.GenerateStyleSheet()%>
</style>
<script type="text/javascript">
<%=objPB.GenerateJavaScript(0)%>
</script>
</head>
<body
onload="<%=objPB.GenerateOnLoadEvent()%>"
onresize="<%=objPB.GenerateOnResizeEvent()%>">
<%=objPB.GeneratePanelBar(0)%>
</body>
</html>
Step 6 - The Completed Page.
Below is the complete JSP page.
<%@ page language="java" import="Coalesys.PanelBar.*" %>
<%
PanelBar objPB = new PanelBar();
objPB.setUserAgent(request.getHeader("User-Agent"));
Group objGroup = objPB.getGroups().Add();
objGroup.setCaption("Home");
Item objItem = objGroup.getItems().Add();
objItem.setCaption("News");
objItem.setURL("news.jsp");
objItem = objGroup.getItems().Add();
objItem.setCaption("About Us");
objItem.setURL("about.jsp");
objItem = objGroup.getItems().Add();
objItem.setCaption("Contact");
objItem.setURL("contact.jsp");
objGroup = objPB.getGroups().Add();
objGroup.setCaption("Products");
objItem = objGroup.getItems().Add();
objItem.setCaption("Super Widget");
objItem.setURL("SuperWidget.jsp");
objItem = objGroup.getItems().Add();
objItem.setCaption("Super Widget Pro");
objItem.setURL("superwidgetpro.jsp");
%>
<html>
<head>
<title>Quick Start</title>
<style type="text/css">
<%=objPB.GenerateStyleSheet()%>
</style>
<script type="text/javascript">
<%=objPB.GenerateJavaScript(0)%>
</script>
</head>
<body
onload="<%=objPB.GenerateOnLoadEvent()%>"
onresize="<%=objPB.GenerateOnResizeEvent()%>">
<%=objPB.GeneratePanelBar(0)%>
</body>
</html>