Integrate Server Push with ListModel - SimpleListModelSharer

Dennis Chen, Engineer, Potix Corporation
October 12, 2007

Version

Applicable to zk-3.0.0-FL-2007-10-11 and later.

Introduction

In the latest version of ZK, 3.0 RC, we provide a new feature – Server Push, which let you access desktop and all of its children components out of a ZK Event, such as chat room, or a thread which monitors the outside data and updates the multiple desktops.

In this article, I will show you a convenient class called SimpleListModelSharer, which integrates Server Push and ListModel to share single ListModel to multiple desktops. You can just update one single ListModel in a thread, and all the concerned grid and listbox will be updated automatically in different desktops.

Concept

The concept of SimpleListModelSharer is proxy and asynchronized updating. It will create multiple coped list models called Proxy of ListModel which will be assigned to different grid or listbox in different desktop.

In each desktop, there will be an Operation Thread which monitors an operation queue. When the major data-processing thread is processing(1) and modify the global ListModel(2), the SimpleListModelSharer will receive a ListDataEvent(3), and it will put the corresponding operations into the operation queue of each desktop(4). Then, each thread in desktop will aware the operation and start processing. It will activate the desktop(5), execute the operation(6,7) on the proxy, and then deactivate the desktop(8). After the round trip, the OperationThread stays and waits for next run.

Live Demo

I demonstrate a Stock Quotes Board as the example, so anyone who browses the demo page will see the same stock quotes information. You can run it with http://localhost:8080/modelsharer/stockquotes.zul in demo war.

Note: the data in the example is randomly generated.

The Code

stockquotes.zul

<zk>
	<zscript>
		import org.zkoss.zulex.demo.stock.*; 
		
		if(!desktop.isServerPushEnabled()){
			desktop.enableServerPush(true);
		}
		StockUpdateService service = StockUpdateService.lookup();
		ListModel model = service.getProxy(desktop);
		StockRowRenderer renderer = new StockRowRenderer();
	</zscript>
	<hbox>
		Stock:
		<textbox id="stock" value="BCC"/>
		<button id="addbtn" label="add" onClick="service.addStock(stock.value)"/>
	</hbox>
	<separator/>
	<groupbox width="300px">
	<caption label="Live Stock Quotes Demo" />
	<grid model="${model}" rowRenderer="${renderer}" >
		<columns>
			<column label="Symbol" width="100px"/>
			<column label="Price" />
			<column label="Change" />
		</columns>
	</grid>
	</groupbox>
</zk>

• Enable server push by desktop.enableServerPush(true);.
• Get a Proxy of ListModel by call getProxy(desktop).
• Call addStock(value) when onClick
• Assign model to grid.

StockUpdateService.java

public class StockUpdateService {
	...
	private StockUpdateService(){
		stockModel = new ListModelList();
		modelSharer = new SimpleListModelSharer(stockModel);
		...
		new Thread(new UpdateRunnable()).start();
	}
	
	public ListModel getProxy(Desktop desktop){
		return modelSharer.getProxy(desktop);
	}
	
	...
	class UpdateRunnable implements Runnable{
		...
		public void run() {
			while(running){
				...
				StockInfo si = getCurrentStockQuotes(index);//get current stock quotes			
				stockModel.set(index,si);//and update it
				...
			}
		}
	}
}

• New a SimpleModelSharer with stockModel.
• Start a thread which will update stockModel periodically.
• Modify stockModel without any tedious code, modelSharer will update all proxies automatically with Server Push.

Download

• The runnable demo can be downloaded here : modelsharer.war

Summary

The SimpleListModelSharer integrates ServerPush and ListModel to share data to different desktops. By simply updating a single model, all its views on each desktop is updated automatically. That is the power of the server-centric Ajax framework, ZK. We hope you enjoy this feature and please feel free to give us any comments.