Theme:
Processing...
Description & Source Code
  • Description
  • View
    business_portal.zul
    portlet_calendar.zul
    portlet_personal.zul
    portlet_personal_max.zul
    portlet_twitter.html
    portlet_twitter_max.html
    portlet_report.zul
    Customize.css
  • Controller
    BusinessPortalController.java
    ReportController.java
    PortletPanel.java
    PersonalController.java
  • Model
    PortletData.java
    PortletInfo.java
    ReportData.java
    CandlestickChartEngine.java

ZK affords developers the functionality to create extensive business based portals quickly and effectively using our portal layout. The portal can be easily customized by adding widgets and changing the number of columns. In addition it includes all the functionality you have come to expect such as drag and drop, collapse and expand, minimize and maximize on each portlet.

business_portal.zul
<window id="main" border="none" apply="demo.layout.business_portal.BusinessPortalController">
	<style src="/widgets/layout/business_portal/Customize.css" />
	<radiogroup id="columnSelect">
		<vlayout>
			<groupbox closable="false" width="100%"> 
				<caption label="Add Widget" />
				<hlayout spacing="20px">
					<image src="/widgets/layout/business_portal/img/number1.png" />
					<listbox id="widgetListbox" mold="select" />
					<image src="/widgets/layout/business_portal/img/arrow.png" />
					<image src="/widgets/layout/business_portal/img/number2.png" />
					<hlayout spacing="0px">
						<radio selected="true" />
						<image src="/widgets/layout/business_portal/img/layout-l.png" />
						<radio />
						<image src="/widgets/layout/business_portal/img/layout-c.png" />
						<radio />
						<image src="/widgets/layout/business_portal/img/layout-r.png" />
					</hlayout>
					<image src="/widgets/layout/business_portal/img/arrow.png" />
					<image src="/widgets/layout/business_portal/img/number3.png" />
					<button id="addbtn" label="Add" dir="reverse"
						image="/widgets/layout/business_portal/img/plus.png" />
				</hlayout>
			</groupbox>
			<groupbox width="200px" closable="false" sclass="z-demo-config z-fieldset-center">
				<caption label="Columns" />
				<button id="singleColumnBtn" image="/widgets/layout/business_portal/img/layout.png" />
				<button id="twoColumnBtn" image="/widgets/layout/business_portal/img/layout-2-equal.png" />
				<button id="threeColumnBtn" image="/widgets/layout/business_portal/img/layout-3.png" disabled="true" />
			</groupbox>
		</vlayout>
	</radiogroup>
	<portallayout id="bussinessPortal" maximizedMode="whole">
		<portalchildren id="ptc1" width="30%" style="padding:5px;" />
		<portalchildren id="ptc2" width="40%" style="padding:5px;" />
		<portalchildren id="ptc3" width="30%" style="padding:5px;" />
	</portallayout>
</window>

portlet_calendar.zul
<div width="100%" height="100%" style="overflow:auto;">
	<separator height="13px"></separator>
	<calendar width="235px">
	</calendar>
</div>
portlet_personal.zul
<zk>
	<listbox class="simple-b">
		<listhead>
			<listheader align="center" width="40px" />
			<listheader align="center" width="40px" />
			<listheader sort="auto" />
		</listhead>
		<listitem height="2px" class="sep" />
		<listitem height="28px">
			<listcell image="/widgets/layout/business_portal/img/mails.png" />
			<listcell image="/widgets/layout/business_portal/img/inbox-document-text.png" />
			<listcell label="2 new mails." />
		</listitem>
		<listitem height="28px">
			<listcell image="/widgets/layout/business_portal/img/ArrowUpOrange-16x16.png" />
			<listcell image="/widgets/layout/business_portal/img/inbox-document-text.png" />
			<listcell class="important" label="1 important mails." />
		</listitem>
		<listitem height="28px">
			<listcell image="/widgets/layout/business_portal/img/cross-script.png" />
			<listcell image="/widgets/layout/business_portal/img/report--pencil.png" />
			<listcell label=" 2 ToDos are overdue" />
		</listitem>
		<listitem height="28px">
			<listcell image="/widgets/layout/business_portal/img/exclamation-red-frame.png" />
			<listcell image="/widgets/layout/business_portal/img/report--pencil.png" />
			<listcell label=" 1 ToDo due TODAY" />
		</listitem>
	</listbox>
	<div class="zk-v">Powered By ZK ${desktop.webApp.version} </div>
</zk>
portlet_personal_max.zul
<div apply="demo.layout.business_portal.PersonalController">
	<hlayout class="z-pretty">
		<image src="/widgets/layout/business_portal/img/inbox-document-text.png" />
		ZK Mail Inbox
		<separator spacing="5px" />
		<a id="mailActionLink" width="320px" style="color:#008FD2;" label="@bind(vm.mailAction.label)" target="@bind(vm.mailAction.target)" href="@bind(vm.mailAction.href)"/>
	</hlayout>
	<listbox id="mailList" class="simple-rl">
		<listhead>
			<listheader align="center" width="40px" image="/widgets/layout/business_portal/img/ArrowsUpDown-16x16.png" />
			<listheader align="center" width="40px" image="/widgets/layout/business_portal/img/Envelope-16x16.png" />
			<listheader align="center" width="40px" image="/widgets/layout/business_portal/img/PaperClip-16x16.png" />
			<listheader label="Subject" sort="auto" />
			<listheader label="Received" sort="auto" />
		</listhead>
		<listitem height="28px" value="hasAttachment">
			<listcell image="/widgets/layout/business_portal/img/ArrowUpOrange-16x16.png" />
			<listcell image="/widgets/layout/business_portal/img/Envelope-16x16.png" />
			<listcell image="/widgets/layout/business_portal/img/PaperClip-16x16.png" />
			<listcell class="important" label="ZK ${desktop.webApp.version} Released!" />
			<listcell label="2011/08/29 17:41:29" />
		</listitem>
		<listitem height="28px">
			<listcell image="" />
			<listcell image="/widgets/layout/business_portal/img/EnvelopeOpen-16x16.png" />
			<listcell label="&#160;" />
			<listcell label="${execution.userAgent} has accessed the demo" />
			<listcell label="2011/06/12 17:41:29" />
		</listitem>
		<listitem height="28px">
			<listcell image="/widgets/layout/business_portal/img/ArrowDown-16x16.png" />
			<listcell image="/widgets/layout/business_portal/img/Envelope-16x16.png" />
			<listcell label="&#160;" />
			<listcell label="IP : ${session.remoteAddr } has accessed the demo" />
			<listcell label="2011/04/01 12:12:12" />
		</listitem>
		<listitem height="28px" value="hasAttachment">
			<listcell image="" />
			<listcell image="/widgets/layout/business_portal/img/EnvelopeOpen-16x16.png" />
			<listcell image="/widgets/layout/business_portal/img/PaperClip-16x16.png" />
			<listcell label="ZK 5 Released!" />
			<listcell label="2011/03/18 13:23:07" />
		</listitem>
		<listitem height="28px" value="hasAttachment">
			<listcell image="" />
			<listcell image="/widgets/layout/business_portal/img/EnvelopeOpen-16x16.png" />
			<listcell image="/widgets/layout/business_portal/img/PaperClip-16x16.png" />
			<listcell label="ZK 3.6.4 Released!" />
			<listcell label="2011/03/16 15:26:37" />
		</listitem>
	</listbox>
	<hlayout class="z-pretty">
		<image src="/widgets/layout/business_portal/img/report--pencil.png" />
		ZK TODO Checklist
		<div style="width:715px">
			<button class="z-flow-r" label="Delete" width="80px"
				image="/widgets/layout/business_portal/img/minus-button.png" onClick='alert(self.label)'/>
			<button class="z-flow-r" label="Add" width="80px"
				image="/widgets/layout/business_portal/img/plus-button.png" onClick='alert(self.label)'/>
			<button class="z-flow-r" label="Done" width="80px"
				image="/widgets/layout/business_portal/img/tick-button.png" onClick='alert(self.label)' />
		</div>
	</hlayout>
	<listbox id="ztodolist" class="simple-rl" checkmark="true" multiple="true">
		<listhead>
			<listheader width="40px" />
			<listheader align="center" width="40px" image="/widgets/layout/business_portal/img/question-button.png" />
			<listheader align="center" width="40px" image="/widgets/layout/business_portal/img/images.png" />
			<listheader label="Subject" sort="auto" />
			<listheader label="Deadline" sort="auto" width="200px" />
			<listheader align="center" width="40px" />
			<listheader align="center" width="40px" />
		</listhead>
		<listitem height="28px">
			<listcell image="" />
			<listcell image="/widgets/layout/business_portal/img/cross-script.png" />
			<listcell image="/widgets/layout/business_portal/img/diamond.png" />
			<listcell class="imp" label="Go and pick up my shopping" />
			<listcell label="2011/06/05 17:41:29" />
			<listcell image="/widgets/layout/business_portal/img/thumb-up.png" />
			<listcell image="/widgets/layout/business_portal/img/thumb.png" />
		</listitem>
		<listitem height="28px">
			<listcell image="" />
			<listcell image="/widgets/layout/business_portal/img/cross-script.png" />
			<listcell image="/widgets/layout/business_portal/img/media-player.png" />
			<listcell class="imp" label="Purchase a new phone" />
			<listcell label="2011/01/15 15:33:12" />
			<listcell image="/widgets/layout/business_portal/img/thumb-up.png" />
			<listcell image="/widgets/layout/business_portal/img/thumb.png" />
		</listitem>
		<listitem height="28px">
			<listcell image="" />
			<listcell image="/widgets/layout/business_portal/img/exclamation-red-frame.png" />
			<listcell image="/widgets/layout/business_portal/img/drive-download.png" />
			<listcell label="Download ZK 5 Right Now" />
			<listcell class="z-today" label="${$composer.deadline}"/>
			<listcell image="/widgets/layout/business_portal/img/thumb-up.png" />
			<listcell image="/widgets/layout/business_portal/img/thumb.png" />
		</listitem>
		<listitem height="28px">
			<listcell image="" />
			<listcell image="/widgets/layout/business_portal/img/tick.png" />
			<listcell image="/widgets/layout/business_portal/img/zkico.png" />
			<listcell label="Enquire about contributing to ZK" />
			<listcell label="2011/03/18 13:23:07" />
			<listcell image="/widgets/layout/business_portal/img/thumb-up.png" />
			<listcell image="/widgets/layout/business_portal/img/thumb.png" />
		</listitem>
		<listitem height="28px">
			<listcell image="" />
			<listcell image="/widgets/layout/business_portal/img/tick.png" />
			<listcell image="/widgets/layout/business_portal/img/beans.png" />
			<listcell label="Buy Beans : Ardi &amp; Geshi (Not JAVA Bean)" />
			<listcell label="2011/03/16 15:26:37" />
			<listcell image="/widgets/layout/business_portal/img/thumb-up.png" />
			<listcell image="/widgets/layout/business_portal/img/thumb.png" />
		</listitem>
	</listbox>
	<div class="zk-v">Powered By ZK ${desktop.webApp.version}</div>
</div>
portlet_twitter.html
<html>
<body>
	<script src="https://widgets.twimg.com/j/2/widget.js"></script>
	<script>
		new TWTR.Widget({
			version : 2,
			type : 'profile',
			rpp : 3,
			interval : 30000,
			width : 'auto',
			height : 300,
			theme : {
				shell : {
					background : '#cfcfcf',
					color : '#1c001c'
				},
				tweets : {
					background : '#ffffff',
					color : '#002440',
					links : '#008cb7'
				}
			},
			features : {
				scrollbar : false,
				loop : false,
				live : false,
				hashtags : true,
				timestamp : true,
				avatars : false,
				behavior : 'all'
			}
		}).render().setUser('zkoss').start();
	</script>
</body>
</html>
portlet_twitter_max.html
<html>
<body>
	<script src="https://widgets.twimg.com/j/2/widget.js"></script>
	<script>
		new TWTR.Widget({
			version : 2,
			type : 'profile',
			rpp : 10,
			interval : 30000,
			width : 'auto',
			height : 560,
			theme : {
				shell : {
					background : '#cfcfcf',
					color : '#1c001c'
				},
				tweets : {
					background : '#ffffff',
					color : '#002440',
					links : '#008cb7'
				}
			},
			features : {
				scrollbar : true,
				loop : false,
				live : true,
				hashtags : true,
				timestamp : true,
				avatars : true,
				behavior : 'all'
			}
		}).render().setUser('zkoss').start();
	</script>
</body>
</html>
portlet_report.zul
<div apply="demo.layout.business_portal.ReportController" style="overflow:auto;">
	<chart id="chart" width="325" height="420" fgAlpha="128"
		threeD="false" paneColor="#ffffff" type="candlestick" model="${$composer.chartModel }" engine="${$composer.engine }">
	</chart>
</div>
Customize.css
/*** Control Part (Layout) ***/
.z-vlayout {
    text-align: center;
}
/*** Panel ***/
.z-panel {
    padding-top: 5px;
}
/*** Personal Widget Customize***/
div.simple-b {
    border-left: 0 none;
    border-right: 0 none;
    border-top: 0 none;
}
div.simple-rl {
    border-left: 0 none;
    border-right: 0 none;
}
.sep {
    border: 1px solid black
}
.important div {
    font-weight: bold;
    font-size: 13px;
}
.z-today div {
    color: red;
    font-weight: bold;
}
.z-flow-r {
    float: right
}
.z-pretty {
    padding: 5px
}
.zk-v {
    padding: 5px;
    text-align: right;
    color: #939393;
    font-style: italic;
}
.zk-v span {
    font-size: 10px;
} 
BusinessPortalController.java
package demo.layout.business_portal;

import java.util.List;

import org.zkoss.zk.ui.Executions;
import org.zkoss.zk.ui.event.Event;
import org.zkoss.zk.ui.select.SelectorComposer;
import org.zkoss.zk.ui.select.annotation.Listen;
import org.zkoss.zk.ui.select.annotation.Wire;
import org.zkoss.zkmax.zul.Portalchildren;
import org.zkoss.zkmax.zul.Portallayout;
import org.zkoss.zul.Button;
import org.zkoss.zul.ListModelList;
import org.zkoss.zul.Listbox;
import org.zkoss.zul.Radiogroup;
import org.zkoss.zul.Window;
import org.zkoss.zul.theme.Themes;

public class BusinessPortalController extends SelectorComposer<Window> {

	private static final long serialVersionUID = -759550281994303480L;
	
	@Wire
	private Radiogroup columnSelect;
	
	@Wire
	private Listbox widgetListbox;
	
	@Wire
	private Portallayout bussinessPortal;
	
	@Wire("portalchildren")
	private List<Portalchildren> portalChildren;
	
	@Wire
	private Button singleColumnBtn, twoColumnBtn, threeColumnBtn;

	public void doAfterCompose(Window win) throws Exception {
		super.doAfterCompose(win);
		// Add Theme Class to window for customize Breeze theme (Customize.css)
		win.setSclass(Themes.getTheme(Executions.getCurrent()));
		// Initialize widgets collection list
		ListModelList<PortletInfo> listModelList = new ListModelList<PortletInfo>(PortletData.PORTLET_INFOS);
		listModelList.addToSelection(PortletData.PORTLET_INFOS.get(0));
		widgetListbox.setModel(listModelList);
		
		initPortlets();
	}
	
	private void initPortlets() {
		int count = 0;
		
		//iterate through the columns
		for(Portalchildren pc : this.portalChildren) {
			pc.appendChild(new PortletPanel(PortletData.PORTLET_INFOS.get(count++)));
			pc.appendChild(new PortletPanel(PortletData.PORTLET_INFOS.get(count++)));
		}
	}

	// Event Handling
	@Listen("onClick = #addbtn")
	public void addPortlet(Event e) {
		int selectedColumnIdx = columnSelect.getSelectedIndex();
		Portalchildren pc = (Portalchildren) bussinessPortal.getChildren().get(selectedColumnIdx);
		pc.appendChild(new PortletPanel(PortletData.PORTLET_INFOS.get(widgetListbox.getSelectedIndex())));
	}

	@Listen("onClick = #singleColumnBtn")
	public void switchToSingleColumn(Event e) {
		portalChildren.get(0).setWidth("100%");
		portalChildren.get(1).setVisible(false);
		portalChildren.get(2).setVisible(false);
		singleColumnBtn.setDisabled(true);
		twoColumnBtn.setDisabled(false);
		threeColumnBtn.setDisabled(false);
	}

	@Listen("onClick = #twoColumnBtn")
	public void switchToTwoColumn(Event e) {
		portalChildren.get(0).setWidth("50%");
		portalChildren.get(1).setWidth("50%");
		portalChildren.get(1).setVisible(true);
		portalChildren.get(2).setVisible(false);
		singleColumnBtn.setDisabled(false);
		twoColumnBtn.setDisabled(true);
		threeColumnBtn.setDisabled(false);
	}

	@Listen("onClick = #threeColumnBtn")
	public void switchToThreeColumn(Event e) {
		portalChildren.get(0).setWidth("30%");
		portalChildren.get(1).setWidth("40%");
		portalChildren.get(1).setVisible(true);
		portalChildren.get(2).setWidth("30%");
		portalChildren.get(2).setVisible(true);
		singleColumnBtn.setDisabled(false);
		twoColumnBtn.setDisabled(false);
		threeColumnBtn.setDisabled(true);
	}
}
ReportController.java
package demo.layout.business_portal;

import org.zkoss.zk.ui.Component;
import org.zkoss.zk.ui.select.SelectorComposer;
import org.zkoss.zkex.zul.impl.JFreeChartEngine;
import org.zkoss.zul.HiLoModel;
import org.zkoss.zul.SimpleHiLoModel;

import demo.chart.candlestick.CandlestickChartEngine;

public class ReportController extends SelectorComposer<Component> {
	private static final long serialVersionUID = 1467106005361518387L;
	
	private static final JFreeChartEngine chartEngine = new CandlestickChartEngine();

	public HiLoModel getChartModel() {
		HiLoModel hilomodel = new SimpleHiLoModel();
		
		for(ReportData.Stock stock : ReportData.getData()) {
			hilomodel.addValue(stock.getTime(), stock.getOpen(), stock.getHigh(), stock.getLow(), stock.getClose(), stock.getVolume());
		}
		
		return hilomodel;
	}
	
	public JFreeChartEngine getEngine() {
		return chartEngine;
	}
	
}
PortletPanel.java
package demo.layout.business_portal;

import org.zkoss.zk.ui.Component;
import org.zkoss.zk.ui.event.Event;
import org.zkoss.zk.ui.event.EventListener;
import org.zkoss.zk.ui.event.Events;
import org.zkoss.zk.ui.event.MaximizeEvent;
import org.zkoss.zul.Iframe;
import org.zkoss.zul.Include;
import org.zkoss.zul.Panel;
import org.zkoss.zul.Panelchildren;

import demo.layout.business_portal.PortletInfo.PortletType;

public class PortletPanel extends Panel {
	
	private static final long serialVersionUID = -431782012982443982L;
	
	private static final String KEY_PANEL_INFO = "KEY_PANEL_INFO";
	
	public PortletPanel(PortletInfo info) {
		this.setBorder("normal");
		this.setCollapsible(true);
		this.setClosable(true);
		this.setMaximizable(true);
		this.appendChild(new Panelchildren());
		
		this.addEventListener(Events.ON_MAXIMIZE, new EventListener<Event>() {
			// This event listener handle the click of maximize button of panel
			@Override
			public void onEvent(Event event) throws Exception {
				MaximizeEvent maxEvent = (MaximizeEvent) event;
				Panel p = (Panel) maxEvent.getTarget();
				PortletInfo pInfo = (PortletInfo) p.getAttribute(KEY_PANEL_INFO);

				Component innerComp = (Component) p.getPanelchildren().getChildren().get(0);
				if (pInfo.getType().equals(PortletType.IFRAME)) { // External Resource
					((Iframe) innerComp).setSrc(maxEvent.isMaximized() ? pInfo.getUrlMax() : pInfo.getUrlMin());
				} else {// Internal Resource - we do not use Iframe
					((Include) innerComp).setSrc(maxEvent.isMaximized() ? pInfo.getUrlMax() : pInfo.getUrlMin());
				}
			}
		});
		
		this.setAttribute(KEY_PANEL_INFO, info);
		this.setHeight(info.getMinSize());
		this.setTitle(info.getName());
		
		if (info.getType().equals(PortletType.IFRAME)) {
			this.getPanelchildren().appendChild(new PortletIframe(info));
		} else {
			this.getPanelchildren().appendChild(new PortletInclude(info));
		}
	}
	
	private class PortletIframe extends Iframe{
		private static final long serialVersionUID = -1687305299974971137L;

		public PortletIframe(PortletInfo info) {
			super();
			
			this.setSrc(info.getUrlMin());
			this.setScrolling(info.getScroll());
			
			this.setWidth("100%");
			this.setHeight("100%");
		}
	}
	
	private class PortletInclude extends Include {
		private static final long serialVersionUID = -8697286520073322551L;

		public PortletInclude(PortletInfo info) {
			super(info.getUrlMin());
			
			this.setWidth("100%");
			this.setHeight("100%");
		}
	}
}
PersonalController.java
package demo.layout.business_portal;

import java.text.DateFormat;
import java.text.SimpleDateFormat;
import java.util.Date;

import org.zkoss.zk.ui.Component;
import org.zkoss.zk.ui.event.SelectEvent;
import org.zkoss.zk.ui.select.SelectorComposer;
import org.zkoss.zk.ui.select.annotation.Listen;
import org.zkoss.zk.ui.select.annotation.Wire;
import org.zkoss.zul.A;
import org.zkoss.zul.Listbox;
import org.zkoss.zul.Listcell;
import org.zkoss.zul.Listitem;

public class PersonalController extends SelectorComposer<Component> {

	DateFormat sdf = new SimpleDateFormat("yyyy/MM/dd HH:mm:ss");
	private String deadline = sdf.format(new Date());

	@Wire
	private Listbox mailList;
	
	@Wire
	private A mailActionLink;
	
	public String getDeadline() {
		return deadline;
	}
	
	@Listen("onSelect = #mailList")
	public void onMailSelect(SelectEvent<Listitem, Object> event) {
		Boolean hasAttachment = "hasAttachment".equals(mailList.getSelectedItem().getValue());
		if(hasAttachment) {
			mailActionLink.setLabel("Download Attachment");
			mailActionLink.setTarget("z_new");
			mailActionLink.setHref("http://www.zkoss.org/download/zk");
		} else {
			mailActionLink.setLabel("View Detail");
			mailActionLink.setTarget(null);
			mailActionLink.setHref(null);
		}
	}

}
PortletData.java
package demo.layout.business_portal;

import java.util.ArrayList;
import java.util.List;

import demo.layout.business_portal.PortletInfo.PortletType;

public class PortletData {
	/**
	 * portletInfos contains <Title String, PortletInfo> in it
	 */
	public static final List<PortletInfo> PORTLET_INFOS = new ArrayList<PortletInfo>();
	static {
		// Initialize Portlet info objects
		PORTLET_INFOS.add(new PortletInfo("Calendar", "/widgets/layout/business_portal/portlet_calendar.zul",
				"/widgets/application/zk_calendar/zk_calendar.zul", PortletType.INCLUDE, null, "250px"));

		PORTLET_INFOS.add(new PortletInfo("Twitter", "/widgets/layout/business_portal/portlet_twitter.html",
				"/widgets/layout/business_portal/portlet_twitter_max.html", PortletType.IFRAME, "yes", "460px"));

		PORTLET_INFOS.add(new PortletInfo("Stock Reports", "/widgets/layout/business_portal/portlet_report.zul",
				"/widgets/grid/hierarchy/hierarchy.zul", PortletType.INCLUDE, null, "480px"));
		PORTLET_INFOS.add(new PortletInfo("Todo", "/widgets/layout/business_portal/portlet_personal.zul",
				"/widgets/layout/business_portal/portlet_personal_max.zul", PortletType.INCLUDE, null, "200px"));

		PORTLET_INFOS
				.add(new PortletInfo(
						"Major World Indices",
						"/widgets/layout/business_portal/portlet_empty.zul",
						"/widgets/layout/business_portal/portlet_empty.zul", PortletType.IFRAME, "no", "190px"));

		
		PORTLET_INFOS
		.add(new PortletInfo(
				"ZK News",
				"/widgets/layout/business_portal/portlet_empty.zul",
				"/widgets/layout/business_portal/portlet_empty.zul",
				PortletType.IFRAME, "yes", "380px"));
		
		PORTLET_INFOS
				.add(new PortletInfo(
						"Hurricane Watcher",
						"/widgets/layout/business_portal/portlet_empty.zul",
						"/widgets/layout/business_portal/portlet_empty.zul",
						PortletType.IFRAME, "no", "400px"));

	}
	
}
PortletInfo.java
package demo.layout.business_portal;

/**
 * PortletInfo save resource of each portlet <br />
 * 1. urlMin : Widget default url <br />
 * 2. urlMax : Widget maximized url <br />
 * 3. type : use Iframe or Include <br />
 * 4. scroll : Weather the inner Iframe scrolling <br />
 * 4. minSize : Default height of widget
 * 
 * @author Ryan
 * 
 */
class PortletInfo {
	private String urlMin;
	private String urlMax;
	private PortletType type;
	private String scroll;
	private String minSize;
	private String name;

	public PortletInfo(String name, String urlMin, String urlMax, PortletType type, String scroll, String minSize) {
		this.urlMin = urlMin;
		this.urlMax = urlMax;
		this.type = type;
		this.scroll = scroll;
		this.minSize = minSize;
		this.name = name;
	}

	public String getUrlMin() {
		return urlMin;
	}

	public String getUrlMax() {
		return urlMax;
	}

	public PortletType getType() {
		return type;
	}

	public String getScroll() {
		return scroll;
	}

	public String getMinSize() {
		return minSize;
	}

	public String getName() {
		return name;
	}

	public String toString() {
		return name;
	}
	
	public enum PortletType {
		IFRAME, INCLUDE;
	}
}
ReportData.java
package demo.layout.business_portal;

import java.util.ArrayList;
import java.util.Date;
import java.util.List;
import java.util.TimeZone;

public class ReportData {
	
	public static Date time(int year, int month, int day, int hour, int minute,
			int second) {
		final java.util.Calendar calendar = java.util.Calendar
				.getInstance(TimeZone.getTimeZone("GMT"));
		calendar.set(year, month - 1, day, hour, minute, second);
		final Date result = calendar.getTime();
		return result;
	}

	private static List<Stock> data = new ArrayList<Stock>();
	static {
		data.add(new Stock(time(2010, 5, 6, 13, 57, 0), 1116.50, 1119.50,
				1115.75, 1118.75, 26534));
		data.add(new Stock(time(2010, 5, 6, 13, 58, 0), 1118.75, 1118.75,
				1113.75, 1115.50, 22715));
		data.add(new Stock(time(2010, 5, 6, 13, 59, 0), 1115.75, 1116.00,
				1110.75, 1112.75, 20766));
		data.add(new Stock(time(2010, 5, 6, 14, 0, 0), 1112.75, 1112.75,
				1103.25, 1106.00, 30059));
		data.add(new Stock(time(2010, 5, 6, 14, 1, 0), 1105.75, 1115.25,
				1105.50, 1113.00, 20329));
		data.add(new Stock(time(2010, 5, 6, 14, 2, 0), 1112.75, 1116.50,
				1110.50, 1116.25, 20395));
		data.add(new Stock(time(2010, 5, 6, 14, 3, 0), 1116.50, 1121.00,
				1115.75, 1120.00, 23156));
		data.add(new Stock(time(2010, 5, 6, 14, 4, 0), 1120.00, 1121.25,
				1117.75, 1119.00, 22293));
		data.add(new Stock(time(2010, 5, 6, 14, 5, 0), 1119.00, 1123.50,
				1116.75, 1123.50, 27369));
		data.add(new Stock(time(2010, 5, 6, 14, 6, 0), 1123.50, 1124.00,
				1120.25, 1121.75, 22120));
		data.add(new Stock(time(2010, 5, 6, 14, 7, 0), 1121.75, 1126.50,
				1121.00, 1126.00, 24415));
		data.add(new Stock(time(2010, 5, 6, 14, 8, 0), 1126.25, 1131.25,
				1125.50, 1131.25, 27627));
		data.add(new Stock(time(2010, 5, 6, 14, 9, 0), 1131.00, 1131.75,
				1125.00, 1126.25, 28348));
		data.add(new Stock(time(2010, 5, 6, 14, 10, 0), 1126.50, 1128.00,
				1125.75, 1127.75, 18702));
		data.add(new Stock(time(2010, 5, 6, 14, 11, 0), 1128.00, 1128.00,
				1117.50, 1118.25, 25499));
		data.add(new Stock(time(2010, 5, 6, 14, 12, 0), 1118.25, 1122.25,
				1117.75, 1120.25, 16323));
		data.add(new Stock(time(2010, 5, 6, 14, 13, 0), 1120.25, 1122.50,
				1119.00, 1121.25, 11372));
		data.add(new Stock(time(2010, 5, 6, 14, 14, 0), 1121.25, 1121.75,
				1119.25, 1119.75, 8121));
		data.add(new Stock(time(2010, 5, 6, 14, 15, 0), 1119.75, 1121.25,
				1118.00, 1120.25, 15347));
		data.add(new Stock(time(2010, 5, 6, 14, 16, 0), 1120.25, 1122.75,
				1120.25, 1122.00, 12236));
		data.add(new Stock(time(2010, 5, 6, 14, 17, 0), 1121.75, 1125.50,
				1121.00, 1125.00, 12052));
		data.add(new Stock(time(2010, 5, 6, 14, 18, 0), 1125.00, 1125.75,
				1118.50, 1118.75, 21474));
		data.add(new Stock(time(2010, 5, 6, 14, 19, 0), 1119.00, 1119.00,
				1115.25, 1115.75, 20824));
		data.add(new Stock(time(2010, 5, 6, 14, 20, 0), 1115.75, 1116.00,
				1111.75, 1112.25, 20310));
		data.add(new Stock(time(2010, 5, 6, 14, 21, 0), 1112.00, 1113.50,
				1108.00, 1113.25, 23136));
		data.add(new Stock(time(2010, 5, 6, 14, 22, 0), 1113.25, 1116.75,
				1112.50, 1114.50, 13819));
		data.add(new Stock(time(2010, 5, 6, 14, 23, 0), 1114.75, 1115.50,
				1111.50, 1112.50, 14484));
		data.add(new Stock(time(2010, 5, 6, 14, 24, 0), 1112.50, 1113.50,
				1111.75, 1112.25, 7490));
		data.add(new Stock(time(2010, 5, 6, 14, 25, 0), 1112.25, 1112.25,
				1108.25, 1108.50, 14881));
		data.add(new Stock(time(2010, 5, 6, 14, 26, 0), 1108.25, 1112.00,
				1106.50, 1107.25, 19247));
		data.add(new Stock(time(2010, 5, 6, 14, 27, 0), 1107.25, 1111.25,
				1106.50, 1110.00, 11622));
		data.add(new Stock(time(2010, 5, 6, 14, 28, 0), 1110.00, 1111.00,
				1109.00, 1110.50, 8758));
		data.add(new Stock(time(2010, 5, 6, 14, 29, 0), 1110.50, 1118.00,
				1110.00, 1117.50, 16857));
		data.add(new Stock(time(2010, 5, 6, 14, 30, 0), 1117.75, 1122.00,
				1116.50, 1121.50, 17153));
	}
	
	public static List<Stock> getData(){
		return new ArrayList<Stock>(data);
	}

	public static class Stock {

		private Date time;
		private Number open, high, low, close, volume;

		public Stock(Date time, Number open, Number high, Number low,
				Number close, Number volume) {
			this.time = time;
			this.open = open;
			this.high = high;
			this.low = low;
			this.close = close;
			this.volume = volume;
		}

		public Date getTime() {
			return time;
		}

		public Number getOpen() {
			return open;
		}

		public Number getHigh() {
			return high;
		}

		public Number getLow() {
			return low;
		}

		public Number getClose() {
			return close;
		}

		public Number getVolume() {
			return volume;
		}

	}

}
CandlestickChartEngine.java
package demo.chart.candlestick;

import org.jfree.chart.JFreeChart;
import org.jfree.chart.axis.NumberAxis;
import org.jfree.chart.plot.XYPlot;
import org.jfree.chart.renderer.xy.CandlestickRenderer;
import org.jfree.chart.renderer.xy.XYItemRenderer;
import org.zkoss.zkex.zul.impl.JFreeChartEngine;
import org.zkoss.zul.Chart;

import demo.chart.ChartColors;

/*
 * you are able to do many advanced chart customization by extending ChartEngine
 */
public class CandlestickChartEngine extends JFreeChartEngine {

	//This method used to define the margin of axis
	protected boolean prepareJFreeChart(JFreeChart jfchart, Chart chart) {
		XYPlot xyplot = (XYPlot) jfchart.getPlot();
		// Define margin of y-axis
		NumberAxis numberaxis = (NumberAxis) xyplot.getRangeAxis();
		numberaxis.setUpperMargin(0.0D);
		numberaxis.setLowerMargin(0.0D);
		// Second axis shows volume
		NumberAxis rangeAxis2 = new NumberAxis("TotalVolume");
		rangeAxis2.setUpperMargin(78410);  
		numberaxis.setAutoRangeIncludesZero(false);
		xyplot.setRangeAxis( 1, rangeAxis2 );
		CandlestickRenderer renderer = (CandlestickRenderer)xyplot.getRenderer();
		renderer.setSeriesPaint(0, ChartColors.COLOR_1);
		renderer.setDownPaint(ChartColors.COLOR_5);
		renderer.setUpPaint(ChartColors.COLOR_2);
		
		return false;
	}
}