You are viewing a plain text version of this content. The canonical link for it is here.
Posted to commits@clerezza.apache.org by re...@apache.org on 2014/08/01 19:18:49 UTC

[34/42] Revert "CLEREZZA-926: removed modules not in release"

http://git-wip-us.apache.org/repos/asf/clerezza/blob/74fe1745/platform.style.classic.webguiexamples/src/main/resources/CLEREZZA-INF/web-resources/web-gui-examples/table.xhtml
----------------------------------------------------------------------
diff --git a/platform.style.classic.webguiexamples/src/main/resources/CLEREZZA-INF/web-resources/web-gui-examples/table.xhtml b/platform.style.classic.webguiexamples/src/main/resources/CLEREZZA-INF/web-resources/web-gui-examples/table.xhtml
new file mode 100644
index 0000000..9158b2d
--- /dev/null
+++ b/platform.style.classic.webguiexamples/src/main/resources/CLEREZZA-INF/web-resources/web-gui-examples/table.xhtml
@@ -0,0 +1,227 @@
+<?xml version='1.0'?>
+<!--
+
+ Licensed to the Apache Software Foundation (ASF) under one
+ or more contributor license agreements.  See the NOTICE file
+ distributed with this work for additional information
+ regarding copyright ownership.  The ASF licenses this file
+ to you under the Apache License, Version 2.0 (the
+ "License"); you may not use this file except in compliance
+ with the License.  You may obtain a copy of the License at
+
+   http://www.apache.org/licenses/LICENSE-2.0
+
+ Unless required by applicable law or agreed to in writing,
+ software distributed under the License is distributed on an
+ "AS IS" BASIS, WITHOUT WARRANTIES OR CONDITIONS OF ANY
+ KIND, either express or implied.  See the License for the
+ specific language governing permissions and limitations
+ under the License.
+
+-->
+
+<!DOCTYPE html PUBLIC "-//W3C//DTD XHTML 1.0 Strict//EN"
+	"http://www.w3.org/TR/xhtml1/DTD/xhtml1-strict.dtd">
+
+<html xmlns="http://www.w3.org/1999/xhtml" xml:lang="en" lang="en">
+<head>
+<title>table - example</title>
+
+	<link href="/style/style.css" media="screen" rel="stylesheet" type="text/css" />
+	<link href="./style/demo.css" media="screen" rel="stylesheet" type="text/css" />	
+	
+</head>
+
+<body>
+
+<!-- content -->
+<div id="tx-content" class="demo">
+	
+	<!-- list / thumbnail -->	
+	<div class="tx-list">
+		
+		<table class="tx-table">
+		<!-- tablecell widths-->
+		<colgroup>
+			<col width="40" />
+			<col width="40" />
+			<col width="40" />
+			<col width="120" />
+			<col width="150" />
+			<col width="100" />
+			<col width="120" />
+		</colgroup>			
+		<thead>
+		<tr>
+			<th colspan="3"><a href="">File Type</a></th>
+			<!-- tx-on, highlighted table header cell -->
+			<th class="tx-on"><a href=""><span class="tx-icon-down tx-right"></span></a>Name</th>			  
+			<th><a href="">Size</a></th>
+			<!-- tx-icon-down, arrow down (for sorting), tx-icon-up, arrow up, tx-right "float: right"  -->
+			<th><a href=""><span class="tx-icon-up tx-right"></span></a>Source</th>
+			<th><a href="">Upload date</a></th>
+		</tr>
+		</thead>
+		<tbody>
+		<tr>
+			<td><a href=""><input type="checkbox" value="" /></a></td>
+			<td><a href=""><img src="temp/img/eye1.jpg" height="25" alt="" /></a></td>
+			<td>jpg</td>
+			<td>auge.jpg</td>
+			<td>45kb / 100x150 px</td>
+			<td>Flickr</td>
+			<td>24.05.2009</td>
+		</tr>
+		<tr>
+			<td><input type="checkbox" value="" /></td>
+			<td><a href=""><img src="temp/img/tiger1.jpg" height="25" alt="" /></a></td>
+			<td>jpg</td>
+			<td>tiger1.jpg</td>
+			<td>58kb / 378x287 px</td>
+			<td>intern</td>
+			<td>23.05.2009</td>
+		</tr>
+		<tr>
+			<td><input type="checkbox" value="" /></td>
+			<td><a href=""><img src="temp/img/tiger2.jpg" height="25" alt="" /></a></td>
+			<td>jpg</td>
+			<td>tiger2.jpg</td>
+			<td>66kb / 158x284 px</td>
+			<td>fotosource</td>
+			<td>22.05.2009</td>
+		</tr>
+		<tr>
+			<td><input type="checkbox" value="" /></td>
+			<td><a href=""><img src="temp/img/eye1.jpg" height="25" alt="" /></a></td>
+			<td>jpg</td>
+			<td>auge.jpg</td>
+			<td>450kb / 400x250 px</td>
+			<td>intern</td>
+			<td>24.05.2009</td>
+		</tr>
+		<tr>
+			<td><input type="checkbox" value="" /></td>
+			<td><a href=""><img src="temp/img/tiger1.jpg" height="25" alt="" /></a></td>
+			<td>jpg</td>
+			<td>tiger1.jpg</td>
+			<td>28kb / 378x287 px</td>
+			<td>intern</td>
+			<td>19.05.2009</td>
+		</tr>
+		<tr>
+			<td><input type="checkbox" value="" /></td>
+			<td><a href=""><img src="temp/img/tiger2.jpg" height="25" alt="" /></a></td>
+			<td>jpg</td>
+			<td>tiger2.jpg</td>
+			<td>227kb / 600x480 px</td>
+			<td>youtube</td>
+			<td>14.05.2009</td>
+		</tr>
+		<tr>
+			<td><input type="checkbox" value="" /></td>
+			<td><a href=""><img src="temp/img/tiger1.jpg" height="25" alt="" /></a></td>
+			<td>jpg</td>
+			<td>tiger8.jpg</td>
+			<td>58kb / 378x287 px</td>
+			<td>intern</td>
+			<td>05.05.2009</td>
+		</tr>
+		<tr>
+			<td><input type="checkbox" value="" /></td>
+			<td><a href=""><img src="temp/img/tiger2.jpg" height="25" alt="" /></a></td>
+			<td>jpg</td>
+			<td>tiger2.jpg</td>
+			<td>1.2Mb / 2258x1484 px</td>
+			<td>fotosource</td>
+			<td>22.05.2009</td>
+		</tr>
+		<tr>
+			<td><input type="checkbox" value="" /></td>
+			<td><a href=""><img src="temp/img/eye1.jpg" height="25" alt="" /></a></td>
+			<td>jpg</td>
+			<td>auge.jpg</td>
+			<td>450kb / 400x250 px</td>
+			<td>intern</td>
+			<td>24.05.2009</td>
+		</tr>
+		<tr>
+			<td><input type="checkbox" value="" /></td>
+			<td><a href=""><img src="temp/img/tiger1.jpg" height="25" alt="" /></a></td>
+			<td>jpg</td>
+			<td>tiger1.jpg</td>
+			<td>89kb / 500x300 px</td>
+			<td>youtube</td>
+			<td>12.05.2009</td>
+		</tr>
+		</tbody>
+		</table>
+
+		
+		<div id="demo">
+
+			<h3>Description</h3>
+			
+			The table is globaly defined in the css, so no special class are required.
+			<br/>
+			<br/>	
+			Use <strong>th.tx-on</strong> to define a highlighted table header cell.
+			<br/>
+			For the sorting arrow, refere the example code.
+			<br/>
+
+			
+		
+			<br/>
+			<br/>
+		
+			<h3>Example code</h3>
+
+			<pre>
+&lt;table class="tx-table"&gt;
+&lt;!-- tablecell widths--&gt;
+&lt;colgroup&gt;
+	&lt;col width="40" /&gt;
+	&lt;col width="40" /&gt;
+	&lt;col width="40" /&gt;
+	&lt;col width="120" /&gt;
+	&lt;col width="150" /&gt;
+	&lt;col width="100" /&gt;
+	&lt;col width="120" /&gt;
+&lt;/colgroup&gt;			
+&lt;thead&gt;
+&lt;tr&gt;
+	&lt;th colspan="3"&gt;&lt;a href=""&gt;File Type&lt;/a&gt;&lt;/th&gt;
+	&lt;!-- tx-on, highlighted table header cell --&gt;
+	&lt;th class="tx-on"&gt;&lt;a href=""&gt;&lt;span class="tx-icon-down tx-right"&gt;&lt;/span&gt;&lt;/a&gt;Name&lt;/th&gt;			  
+	&lt;th&gt;&lt;a href=""&gt;Size&lt;/a&gt;&lt;/th&gt;
+	&lt;!-- tx-icon-down, arrow down (for sorting), tx-icon-up, arrow up, tx-right "float: right"  --&gt;
+	&lt;th&gt;&lt;a href=""&gt;&lt;span class="tx-icon-up tx-right"&gt;&lt;/span&gt;&lt;/a&gt;Source&lt;/th&gt;
+	&lt;th&gt;&lt;a href=""&gt;Upload date&lt;/a&gt;&lt;/th&gt;
+&lt;/tr&gt;
+&lt;/thead&gt;
+&lt;tbody&gt;
+&lt;tr&gt;
+	&lt;td&gt;&lt;a href=""&gt;&lt;input type="checkbox" value="" /&gt;&lt;/a&gt;&lt;/td&gt;
+	&lt;td&gt;&lt;a href=""&gt;&lt;img src="temp/img/eye1.jpg" height="25" alt="" /&gt;&lt;/a&gt;&lt;/td&gt;
+	&lt;td&gt;jpg&lt;/td&gt;
+	&lt;td&gt;auge.jpg&lt;/td&gt;
+	&lt;td&gt;45kb / 100x150 px&lt;/td&gt;
+	&lt;td&gt;Flickr&lt;/td&gt;
+	&lt;td&gt;24.05.2009&lt;/td&gt;
+&lt;/tr&gt;
+&lt;/tbody&gt;
+&lt;/table&gt;
+			</pre>			
+		
+		
+		</div>	
+		
+	</div>
+	<!-- // list / thumbnail -->
+	
+</div>
+<!-- // content -->
+	
+</body>
+</html>
+

http://git-wip-us.apache.org/repos/asf/clerezza/blob/74fe1745/platform.style.classic.webguiexamples/src/main/resources/CLEREZZA-INF/web-resources/web-gui-examples/temp/img/eye1.jpg
----------------------------------------------------------------------
diff --git a/platform.style.classic.webguiexamples/src/main/resources/CLEREZZA-INF/web-resources/web-gui-examples/temp/img/eye1.jpg b/platform.style.classic.webguiexamples/src/main/resources/CLEREZZA-INF/web-resources/web-gui-examples/temp/img/eye1.jpg
new file mode 100644
index 0000000..c7c52dc
Binary files /dev/null and b/platform.style.classic.webguiexamples/src/main/resources/CLEREZZA-INF/web-resources/web-gui-examples/temp/img/eye1.jpg differ

http://git-wip-us.apache.org/repos/asf/clerezza/blob/74fe1745/platform.style.classic.webguiexamples/src/main/resources/CLEREZZA-INF/web-resources/web-gui-examples/temp/img/tiger1.jpg
----------------------------------------------------------------------
diff --git a/platform.style.classic.webguiexamples/src/main/resources/CLEREZZA-INF/web-resources/web-gui-examples/temp/img/tiger1.jpg b/platform.style.classic.webguiexamples/src/main/resources/CLEREZZA-INF/web-resources/web-gui-examples/temp/img/tiger1.jpg
new file mode 100644
index 0000000..5865f1b
Binary files /dev/null and b/platform.style.classic.webguiexamples/src/main/resources/CLEREZZA-INF/web-resources/web-gui-examples/temp/img/tiger1.jpg differ

http://git-wip-us.apache.org/repos/asf/clerezza/blob/74fe1745/platform.style.classic.webguiexamples/src/main/resources/CLEREZZA-INF/web-resources/web-gui-examples/temp/img/tiger2.jpg
----------------------------------------------------------------------
diff --git a/platform.style.classic.webguiexamples/src/main/resources/CLEREZZA-INF/web-resources/web-gui-examples/temp/img/tiger2.jpg b/platform.style.classic.webguiexamples/src/main/resources/CLEREZZA-INF/web-resources/web-gui-examples/temp/img/tiger2.jpg
new file mode 100644
index 0000000..6ec5f68
Binary files /dev/null and b/platform.style.classic.webguiexamples/src/main/resources/CLEREZZA-INF/web-resources/web-gui-examples/temp/img/tiger2.jpg differ

http://git-wip-us.apache.org/repos/asf/clerezza/blob/74fe1745/platform.style.classic.webguiexamples/src/main/resources/CLEREZZA-INF/web-resources/web-gui-examples/thumbnail.xhtml
----------------------------------------------------------------------
diff --git a/platform.style.classic.webguiexamples/src/main/resources/CLEREZZA-INF/web-resources/web-gui-examples/thumbnail.xhtml b/platform.style.classic.webguiexamples/src/main/resources/CLEREZZA-INF/web-resources/web-gui-examples/thumbnail.xhtml
new file mode 100644
index 0000000..bce5398
--- /dev/null
+++ b/platform.style.classic.webguiexamples/src/main/resources/CLEREZZA-INF/web-resources/web-gui-examples/thumbnail.xhtml
@@ -0,0 +1,214 @@
+<?xml version='1.0'?>
+<!--
+
+ Licensed to the Apache Software Foundation (ASF) under one
+ or more contributor license agreements.  See the NOTICE file
+ distributed with this work for additional information
+ regarding copyright ownership.  The ASF licenses this file
+ to you under the Apache License, Version 2.0 (the
+ "License"); you may not use this file except in compliance
+ with the License.  You may obtain a copy of the License at
+
+   http://www.apache.org/licenses/LICENSE-2.0
+
+ Unless required by applicable law or agreed to in writing,
+ software distributed under the License is distributed on an
+ "AS IS" BASIS, WITHOUT WARRANTIES OR CONDITIONS OF ANY
+ KIND, either express or implied.  See the License for the
+ specific language governing permissions and limitations
+ under the License.
+
+-->
+
+<!DOCTYPE html PUBLIC "-//W3C//DTD XHTML 1.0 Strict//EN"
+	"http://www.w3.org/TR/xhtml1/DTD/xhtml1-strict.dtd">
+
+<html xmlns="http://www.w3.org/1999/xhtml" xml:lang="en" lang="en">
+<head>
+<title>thumbnail - example</title>
+
+	<link href="/style/style.css" media="screen" rel="stylesheet" type="text/css" />
+	<link href="./style/demo.css" media="screen" rel="stylesheet" type="text/css" />	
+	
+</head>
+
+<body>
+
+<!-- content -->
+<div id="tx-content" class="demo">
+	
+	<!-- list / thumbnail -->	
+	<div class="tx-list">
+    
+		<form action="" method="post">
+			<fieldset>
+				<!-- tx-size1, tx-size2, tx-size3, different thumbnail sizes -->
+				<ol class="tx-size3">
+					<li>
+						<!-- img.tx-height, portrait thumbnail format -->
+						<div class="tx-thumb"><a href=""><img src="temp/img/tiger1.jpg" alt="" class="tx-height" /></a></div>
+						<div>
+							<input type="checkbox" value="" />
+						</div>
+					</li>
+					<li>
+						<!-- img.tx-width, landscape thumbnail format -->
+						<div class="tx-thumb"><a href=""><img src="temp/img/tiger2.jpg" alt="" class="tx-width" /></a></div>
+						<div>
+							<input type="checkbox" value="" />
+						</div>
+					</li>
+					<li>
+						<div class="tx-thumb"><a href=""><img src="temp/img/eye1.jpg" alt="" class="tx-width" /></a></div>
+						<div>
+							<input type="checkbox" value="" />
+						</div>
+					</li>
+					<li>
+						<div class="tx-thumb"><a href=""><img src="temp/img/tiger1.jpg" alt="" class="tx-height" /></a></div>
+						<div>
+							<input type="checkbox" value="" />
+						</div>
+					</li>
+					<li>
+						<div class="tx-thumb"><a href=""><img src="temp/img/tiger2.jpg" alt="" class="tx-width" /></a></div>
+						<div>
+							<input type="checkbox" value="" />
+							<!-- custom defined icons, tx-right, global for "float: right" -->
+							<span class="tx-icon tx-icon-alert tx-right" title="The rights on this assets expire on 19.08.2009"></span>
+						</div>
+					</li>
+					<li>
+						<div class="tx-thumb"><a href=""><img src="temp/img/eye1.jpg" alt="" class="tx-width" /></a></div>
+						<div>
+							<input type="checkbox" value="" />
+						</div>
+					</li>
+					<li>
+						<div class="tx-thumb"><a href=""><img src="temp/img/eye1.jpg" alt="" class="tx-width" /></a></div>
+						<div>
+							<input type="checkbox" value="" />
+							<span class="tx-icon tx-icon-alert tx-right" title="The rights on this assets expire on 17.07.2009"></span>
+						</div>
+					</li>
+					<li>
+						<div class="tx-thumb"><a href=""><img src="temp/img/tiger1.jpg" alt="" class="tx-height" /></a></div>
+						<div>
+							<input type="checkbox" value="" />
+							<span class="tx-icon tx-icon-alert tx-right tx-tooltip" title="The rights on this assets expire on 24.06.2009"></span>
+						</div>
+					</li>
+					<li>
+						<div class="tx-thumb"><a href=""><img src="temp/img/tiger2.jpg" alt="" class="tx-width" /></a></div>
+						<div>
+							<input type="checkbox" value="" />
+						</div>
+					</li>
+					<li>
+						<div class="tx-thumb"><a href=""><img src="temp/img/tiger1.jpg" alt="" class="tx-height" /></a></div>
+						<div>
+							<input type="checkbox" value="" />
+							<span class="tx-icon tx-icon-alert tx-right tx-tooltip" title="The rights on this assets expire on 08.07.2009"></span>
+						</div>
+					</li>
+					<li>
+						<div class="tx-thumb"><a href=""><img src="temp/img/tiger2.jpg" alt="" class="tx-width" /></a></div>
+						<div>
+							<input type="checkbox" value="" />
+						</div>
+					</li>
+					<li>
+						<div class="tx-thumb"><a href=""><img src="temp/img/tiger2.jpg" alt="" class="tx-width" /></a></div>
+						<div>
+							<input type="checkbox" value="" />
+							<span class="tx-icon tx-icon-alert tx-right tx-tooltip" title="The rights on this assets expire on 12.08.2009"></span>
+						</div>
+					</li>
+					<li>
+						<div class="tx-thumb"><a href=""><img src="temp/img/eye1.jpg" alt="" class="tx-width" /></a></div>
+						<div>
+							<input type="checkbox" value="" />
+						</div>
+					</li>
+				</ol>
+			</fieldset>
+		</form>
+		
+		<div id="demo">
+
+			<h3>Description</h3>
+			
+			In the tx-content a &lt;div> with class <b>tx-list</b> is created. Within this <strong>div.tx-list</strong> an ordered list is placed.
+			<br/>
+			<br/>
+			
+			<strong>ol.tx-size3</strong>, <strong>ol.tx-size2</strong> and <strong>ol.tx-size1</strong> are the sizes of the thumbnail.
+			<br/>
+			<br/>
+			<strong>.tx-size3</strong>: 90px height or width<br/>
+			<strong>.tx-size2</strong>: 120px height or width<br/>
+			<strong>.tx-size1</strong>: 150px height or width<br/>			
+			<br/>
+			<br/>			
+			<strong>img.tx-width</strong> (landscape) and <strong>img.tx-height</strong> (portrait) defines the orientation of the thumbnails. 
+			<br/>
+			<br/>	
+			
+			<strong>div.tx-list</strong> is the main container for the list view. If no class is defined on the <strong>div.tx-list</strong> element the list has 100% width. 
+			<br/>
+			The classes <strong>.tx-show-panel</strong>, <strong>.tx-hide-panel</strong> and <strong>.tx-halfwidth-right</strong> define the position of the tree view.
+			<br/>
+			<br/>
+			
+			<strong>.tx-show-panel</strong>: position with a panel on the left side.<br/>
+			<strong>.tx-hide-panel</strong>: position with a panel on the left side, hidden.<br/>
+			<strong>.tx-halfwidth-right</strong>: position on the right, 50% width.<br/>
+			<br/>
+			<br/>
+			
+			<br/>
+			<br/>
+		
+			<h3>Example code</h3>
+
+			<pre>
+&lt;form action="" method="post"&gt;
+	&lt;fieldset&gt;
+		&lt;!-- tx-size1, tx-size2, tx-size3, different thumbnail sizes --&gt;
+		&lt;ol class="tx-size3"&gt;
+			&lt;li&gt;
+				&lt;!-- img.tx-height, portrait thumbnail format --&gt;
+				&lt;div class="tx-thumb"&gt;&lt;a href=""&gt;&lt;img src="temp/img/tiger1.jpg" alt="" class="tx-height" /&gt;&lt;/a&gt;&lt;/div&gt;
+				&lt;div&gt;
+					&lt;input type="checkbox" value="" /&gt;
+				&lt;/div&gt;
+			&lt;/li&gt;
+			&lt;li&gt;
+				&lt;!-- img.tx-width, landscape thumbnail format --&gt;
+				&lt;div class="tx-thumb"&gt;&lt;a href=""&gt;&lt;img src="temp/img/tiger2.jpg" alt="" class="tx-width" /&gt;&lt;/a&gt;&lt;/div&gt;
+				&lt;div&gt;
+					&lt;input type="checkbox" value="" /&gt;
+				&lt;/div&gt;
+			&lt;/li&gt;
+			&lt;li&gt;
+				&lt;div class="tx-thumb"&gt;&lt;a href=""&gt;&lt;img src="temp/img/tiger2.jpg" alt="" class="tx-width" /&gt;&lt;/a&gt;&lt;/div&gt;
+				&lt;div&gt;
+					&lt;input type="checkbox" value="" /&gt;
+					&lt;!-- custom defined icons, tx-right, global for "float: right" --&gt;
+					&lt;span class="tx-icon tx-icon-alert tx-right" title="The rights on this assets expire on 19.08.2009"&gt;&lt;/span&gt;
+				&lt;/div&gt;
+			&lt;/li&gt;
+
+		&lt;/ol&gt;
+	&lt;/fieldset&gt;
+&lt;/form&gt;
+			</pre>			
+		</div>	
+	</div>
+	<!-- // list / thumbnail -->
+</div>
+<!-- // content -->
+	
+</body>
+</html>
+

http://git-wip-us.apache.org/repos/asf/clerezza/blob/74fe1745/platform.style.classic.webguiexamples/src/main/resources/CLEREZZA-INF/web-resources/web-gui-examples/tree-edit.xhtml
----------------------------------------------------------------------
diff --git a/platform.style.classic.webguiexamples/src/main/resources/CLEREZZA-INF/web-resources/web-gui-examples/tree-edit.xhtml b/platform.style.classic.webguiexamples/src/main/resources/CLEREZZA-INF/web-resources/web-gui-examples/tree-edit.xhtml
new file mode 100644
index 0000000..c12040f
--- /dev/null
+++ b/platform.style.classic.webguiexamples/src/main/resources/CLEREZZA-INF/web-resources/web-gui-examples/tree-edit.xhtml
@@ -0,0 +1,301 @@
+<?xml version='1.0'?>
+<!--
+
+ Licensed to the Apache Software Foundation (ASF) under one
+ or more contributor license agreements.  See the NOTICE file
+ distributed with this work for additional information
+ regarding copyright ownership.  The ASF licenses this file
+ to you under the Apache License, Version 2.0 (the
+ "License"); you may not use this file except in compliance
+ with the License.  You may obtain a copy of the License at
+
+   http://www.apache.org/licenses/LICENSE-2.0
+
+ Unless required by applicable law or agreed to in writing,
+ software distributed under the License is distributed on an
+ "AS IS" BASIS, WITHOUT WARRANTIES OR CONDITIONS OF ANY
+ KIND, either express or implied.  See the License for the
+ specific language governing permissions and limitations
+ under the License.
+
+-->
+
+<!DOCTYPE html PUBLIC "-//W3C//DTD XHTML 1.0 Strict//EN"
+	"http://www.w3.org/TR/xhtml1/DTD/xhtml1-strict.dtd">
+
+<html xmlns="http://www.w3.org/1999/xhtml" xml:lang="en" lang="en">
+<head>
+<title>tree-edit - example</title>
+
+	<link href="/style/style.css" media="screen" rel="stylesheet" type="text/css" />
+
+	<script src="/jquery/jquery-1.3.2.min.js" type="text/javascript"></script>
+	<script src="/jquery/jquery.menu.js" type="text/javascript"></script>
+
+	<style type="text/css"> 
+		.col1 {
+			width: 7em; 
+		}
+		
+		.col2 {
+			width: 6em; 
+		}
+	</style>
+	
+</head>
+
+<body>
+
+<!-- header -->
+<div id="tx-header">
+	<!-- system -->
+	<div id="tx-system">
+
+		<!-- global search -->
+		<div id="tx-globalsearch">
+			<form action="/globalsearch/">
+			<fieldset>
+				<input type="text" name="globalsearch_value" /> <input type="submit" value="" class="tx-icon tx-icon-search"/>
+			</fieldset>	
+			</form>
+		</div>
+		
+		<!-- user information -->
+		<div id="tx-login">
+			<a href="" class="tx-icon tx-icon-user">actions</a> <span>Mans Huster</span> 
+		</div>
+		
+		<div id="tx-logo"><a href=""></a></div>
+		
+		<!-- main menu -->
+		<div id="tx-menu">
+		<ol>
+			<li><a href="">Dashboard</a></li>
+			<li><a href="">Modulgruppe 1</a>
+				<ol>
+					<li><a href="">Submenu 1</a></li>
+					<li><a href="">Submenu 2</a></li>
+					<li><a href="">Submenu 3</a></li>
+					<li><a href="">Submenu 4</a></li>
+				</ol>
+			</li>
+			<li><a href="">Modulgruppe 2</a>	
+				<ol>
+					<li><a href="">Submenu 1</a></li>
+					<li><a href="">Submenu 2</a></li>
+				</ol>
+			</li>
+			<li><a href="">Help</a>
+				<ol>
+					<li><a href="">About</a></li>
+					<li><a href="">What</a></li>
+					<li><a href="">Where</a></li>
+				</ol>
+			</li>
+		</ol>
+		</div>
+	</div>
+	<!-- //system -->
+	
+	<!-- module -->
+	<div id="tx-module">
+		<!-- module title -->
+		<h1>tree-edit example</h1>
+
+		<!-- page editing actions -->
+		<div id="tx-page-actions">
+			<ol>
+				<li><a href="" class="tx-button tx-button-generic">Page Editing</a></li>
+				<li><a href="" class="tx-button tx-button-generic-on">Preview</a></li>
+				<li><a href="" class="tx-button tx-button-generic">Page Data</a></li>
+				<li><a href="" class="tx-button tx-button-generic">Something</a></li>
+			</ol>
+		</div>	
+		
+	</div>
+	<!-- // module -->
+
+	<!-- moduletabs -->
+	<div id="tx-module-tabs">
+		<!-- moduletabs -->
+		<ol>
+			<li class="tx-active"><a href="#">Assets</a></li>	
+			<li><a href="#">Image Sets</a></li>	
+			<li><a href="#">My Lightboxes</a></li>
+			<li class="tx-active"><a href="#">My Something</a></li>
+			<li><a href="#">My Everything</a></li>	
+		</ol>
+		
+		<!--  -->
+		<div id="tx-contextual-buttons">
+			<ol>
+				<li><a href="#" class="tx-button tx-button-remove">Remove</a></li>
+				<li><a href="#" class="tx-button tx-button-create">Create</a></li>
+				<li><a href="#" class="tx-button tx-button-modify">Modify</a></li>
+				<li><a href="#" class="tx-button tx-button-generic">Generic</a></li>
+			</ol>
+		</div>
+	</div>	
+	<!-- // moduletabs -->
+	
+	<!-- moduleoptions -->
+	<div id="tx-module-options">	
+		<ol>
+			<li><a href="#" class="tx-icon tx-toggle-list-on">Table</a></li>
+			<li><a href="#" class="tx-icon tx-toggle-thumbnail-on">Thumbnail</a></li>
+			<li class="tx-spacer"><a href="#" class="tx-icon tx-toggle-tree-on">Tree</a></li>
+			
+			<li><a href="#" class="tx-icon tx-toggle-size1-on">Size 1</a></li>
+			<li><a href="#" class="tx-icon tx-toggle-size2-on">Size 2</a></li>
+			<li><a href="#" class="tx-icon tx-toggle-size3-on">Size 3</a></li>
+		</ol>	
+
+	</div>
+	<!-- // moduleoptions -->
+</div>
+<!-- // header -->
+
+<!-- content -->
+<div id="tx-content">
+	<!-- tree view -->
+	<!-- aligned left / ca. 50% width-->
+	<!-- tree view -->
+	<div class="tx-tree tx-halfwidth-left">
+    	
+		<!-- contains the tree -->
+		<div class="tx-tree-view">
+			<table class="tx-table">
+				<tr>
+					<th></th>
+					<th>Concepts</th>
+					<th class="col1">Tagged pages</th>
+					<th class="col2">In concepts</th>
+				</tr>
+			</table>
+			<!-- example folder structure -->
+			<ol>
+				<!--  tx-open, shows the arrow down on a "open" element -->
+				<li class="tx-open">
+					<!-- li content is wrapped inside a div to avoid some javascript event problems, eg. drag drop events can be assigned to the div instead -->
+					<div>
+						<!-- span class tx-info should be correspond with the table th widths -->
+						<span class="tx-info"><span class="col1">9</span><span class="col2">3</span></span>
+						<!-- drag icon -->
+						<div title=" Themes..." class="tx-icon tx-icon-drag">drag me</div>
+						<!-- checkbox -->
+						<input type="checkbox" /><!-- name --><a href=""></a><a href="">Themes...</a>
+					</div>
+					<!-- subelements of an li -->
+					<ol>
+						<li class="tx-open"><div>
+								<span class="tx-info"><span class="col1">29</span><span class="col2">2</span></span>
+								<div title=" Where" class="tx-icon tx-icon-drag">drag me</div>
+								<input type="checkbox" /><a href=""></a><a href=""> Where</a>
+							</div>
+							<ol>
+								<!-- li default shows an right arrow as background -->
+								<li><div>
+									<span class="tx-info"><span class="col1">51</span><span class="col2">5</span></span>
+									<div title="Africa" class="tx-icon tx-icon-drag">drag me</div>
+									<input type="checkbox" /><a href=""></a><a href="">Africa</a>
+								</div></li>
+								<li><div>
+									<span class="tx-info"><span class="col1">8</span><span class="col2">6</span></span>
+									<div title="Asia" class="tx-icon tx-icon-drag">drag me</div>
+									<input type="checkbox" /><a href=""></a><a href="">Asia</a>
+								</div></li>
+								<!-- tx-nobg, shows no arrow on a element, e.g. element has no subelements -->
+								<li class="tx-nobg"><div>
+									<span class="tx-info"><span class="col1">70</span><span class="col2">2</span></span>
+									<div title="Ecoregions" class="tx-icon tx-icon-drag">drag me</div>
+									<input type="checkbox" /><a href=""></a><a href="">Ecoregions</a>
+								</div></li>
+							</ol>
+						</li>		
+					</ol>
+				</li>
+			</ol>
+			<!-- // example folder structure-->
+		</div>
+		<!-- // tree view -->
+	</div>
+	<!-- // tree -->
+		
+	<!-- edit -->	
+	<!-- aligned right / ca. 50% width-->
+	<div class="tx-edit tx-halfwidth-right">
+
+		<div class="tx-edit-content">
+			<form action="" method="post">
+				<fieldset>
+					<ol>
+						<li class="tx-line"><label>Original format</label>
+							<div>jpg</div></li>
+						
+						<li class="tx-line"><label>Size</label>
+							<div>645 x 345 px (original size) <a href="">[view]</a><br />
+							512 x 257 px <a href="">[view]</a></div>
+						</li>
+						
+						<li class="tx-line"><label>Replace Image</label>
+							<input type="file" size="30" /></li>
+						
+						<li><label>Credit</label>
+							<input size="30" type="text" value="" /></li>
+						
+						<li><label>Licence type</label>
+							<select>
+								<option value="0">please select</option>
+								<option value="1" selected="selected">Royality Fee</option>
+								<option value="2">Open Photo</option>
+								<option value="3">Self made with natel</option>
+							</select></li>
+						
+						<li class="tx-line"><label>Caption</label>
+							<input size="30" type="text" value="test entry" /></li>
+						
+						<li class="tx-line"><label>Alternative description</label>
+							<textarea cols="40" rows="3">test entry</textarea></li>
+						
+						<li><label>Radio</label>
+							<input type="radio" name="radio1" value="" /> Yes <input type="radio" name="radio1" value="" /> No <input type="radio" name="radio1" value="" /> Maybe</li>	
+						
+						<li><label>Checkbox</label>
+							<input type="checkbox" value="" /> Yes <input type="checkbox" value="" /> No <input type="checkbox" value="" /> Maybe</li>	
+
+						<li class="tx-line"><label>Broader concepts:</label>
+							<div>
+								<span class="tx-item"><a class="tx-icon tx-icon-plus" href="#">Add</a></span>	
+							</div>				
+						</li>
+
+						<li class="tx-line"><label>Narrower concepts:</label>
+							<div>
+								<span class="tx-item tx-line"><a href="#" class="tx-icon tx-icon-delete">remove</a>India</span>
+								<span class="tx-item tx-line"><a href="#" class="tx-icon tx-icon-delete">remove</a>China</span>
+								<span class="tx-item"><a class="tx-icon tx-icon-plus" href="#">Add</a></span>		
+							</div>				
+						</li>
+
+						
+						<li class="tx-line"><label>Related concepts:</label>
+							<div>
+								<span class="tx-item tx-line"><a href="#" class="tx-icon tx-icon-delete">remove</a>Asia</span>
+								<span class="tx-item"><a class="tx-icon tx-icon-plus" href="#" id="tx-create-related">Add</a><input size="30" type="text" value="test entry" /></span>
+							</div>
+						</li>
+
+							
+					</ol>
+				</fieldset>
+			</form>
+		</div>
+	
+	</div>
+	<!-- // edit -->
+</div>
+<!-- // content -->
+	
+</body>
+</html>
+

http://git-wip-us.apache.org/repos/asf/clerezza/blob/74fe1745/platform.style.classic.webguiexamples/src/main/resources/CLEREZZA-INF/web-resources/web-gui-examples/tree-thumbnail.xhtml
----------------------------------------------------------------------
diff --git a/platform.style.classic.webguiexamples/src/main/resources/CLEREZZA-INF/web-resources/web-gui-examples/tree-thumbnail.xhtml b/platform.style.classic.webguiexamples/src/main/resources/CLEREZZA-INF/web-resources/web-gui-examples/tree-thumbnail.xhtml
new file mode 100644
index 0000000..8e3fafc
--- /dev/null
+++ b/platform.style.classic.webguiexamples/src/main/resources/CLEREZZA-INF/web-resources/web-gui-examples/tree-thumbnail.xhtml
@@ -0,0 +1,320 @@
+<?xml version='1.0'?>
+<!--
+
+ Licensed to the Apache Software Foundation (ASF) under one
+ or more contributor license agreements.  See the NOTICE file
+ distributed with this work for additional information
+ regarding copyright ownership.  The ASF licenses this file
+ to you under the Apache License, Version 2.0 (the
+ "License"); you may not use this file except in compliance
+ with the License.  You may obtain a copy of the License at
+
+   http://www.apache.org/licenses/LICENSE-2.0
+
+ Unless required by applicable law or agreed to in writing,
+ software distributed under the License is distributed on an
+ "AS IS" BASIS, WITHOUT WARRANTIES OR CONDITIONS OF ANY
+ KIND, either express or implied.  See the License for the
+ specific language governing permissions and limitations
+ under the License.
+
+-->
+
+<!DOCTYPE html PUBLIC "-//W3C//DTD XHTML 1.0 Strict//EN"
+	"http://www.w3.org/TR/xhtml1/DTD/xhtml1-strict.dtd">
+
+<html xmlns="http://www.w3.org/1999/xhtml" xml:lang="en" lang="en">
+<head>
+<title>tree-thumbnail - example</title>
+
+	<link href="/style/style.css" media="screen" rel="stylesheet" type="text/css" />
+
+	<script src="/jquery/jquery-1.3.2.min.js" type="text/javascript"></script>
+	<script src="/jquery/jquery.menu.js" type="text/javascript"></script>
+		
+	
+</head>
+
+<body>
+
+<!-- header -->
+<div id="tx-header">
+	<!-- system -->
+	<div id="tx-system">
+
+		<!-- global search -->
+		<div id="tx-globalsearch">
+			<form action="/globalsearch/">
+			<fieldset>
+				<input type="text" name="globalsearch_value" /> <input type="submit" value="" class="tx-icon tx-icon-search"/>
+			</fieldset>	
+			</form>
+		</div>
+		
+		<!-- user information -->
+		<div id="tx-login">
+			<a href="" class="tx-icon tx-icon-user">actions</a> <span>Mans Huster</span> 
+		</div>
+		
+		<div id="tx-logo"><a href=""></a></div>
+		
+		<!-- main menu -->
+		<div id="tx-menu">
+		<ol>
+			<li><a href="">Dashboard</a></li>
+			<li><a href="">Modulgruppe 1</a>
+				<ol>
+					<li><a href="">Submenu 1</a></li>
+					<li><a href="">Submenu 2</a></li>
+					<li><a href="">Submenu 3</a></li>
+					<li><a href="">Submenu 4</a></li>
+				</ol>
+			</li>
+			<li><a href="">Modulgruppe 2</a>	
+				<ol>
+					<li><a href="">Submenu 1</a></li>
+					<li><a href="">Submenu 2</a></li>
+				</ol>
+			</li>
+			<li><a href="">Help</a>
+				<ol>
+					<li><a href="">About</a></li>
+					<li><a href="">What</a></li>
+					<li><a href="">Where</a></li>
+				</ol>
+			</li>
+		</ol>
+		</div>
+	</div>
+	<!-- //system -->
+	
+	<!-- module -->
+	<div id="tx-module">
+		<!-- module title -->
+		<h1>tree-thumbnail example</h1>
+
+		<!-- page editing actions -->
+		<div id="tx-page-actions">
+			<ol>
+				<li><a href="" class="tx-button tx-button-generic">Page Editing</a></li>
+				<li><a href="" class="tx-button tx-button-generic-on">Preview</a></li>
+				<li><a href="" class="tx-button tx-button-generic">Page Data</a></li>
+				<li><a href="" class="tx-button tx-button-generic">Something</a></li>
+			</ol>
+		</div>	
+		
+	</div>
+	<!-- // module -->
+
+	<!-- moduletabs -->
+	<div id="tx-module-tabs">
+		<!-- moduletabs -->
+		<ol>
+			<li class="tx-active"><a href="#">Assets</a></li>	
+			<li><a href="#">Image Sets</a></li>	
+			<li><a href="#">My Lightboxes</a></li>
+			<li class="tx-active"><a href="#">My Something</a></li>
+			<li><a href="#">My Everything</a></li>	
+		</ol>
+		
+		<!--  -->
+		<div id="tx-contextual-buttons">
+			<ol>
+				<li><a href="#" class="tx-button tx-button-remove">Remove</a></li>
+				<li><a href="#" class="tx-button tx-button-create">Create</a></li>
+				<li><a href="#" class="tx-button tx-button-modify">Modify</a></li>
+				<li><a href="#" class="tx-button tx-button-generic">Generic</a></li>
+			</ol>
+		</div>
+	</div>	
+	<!-- // moduletabs -->
+	
+	<!-- moduleoptions -->
+	<div id="tx-module-options">	
+		<ol>
+			<li><a href="#" class="tx-icon tx-toggle-list-on">Table</a></li>
+			<li><a href="#" class="tx-icon tx-toggle-thumbnail-on">Thumbnail</a></li>
+			<li class="tx-spacer"><a href="#" class="tx-icon tx-toggle-tree-on">Tree</a></li>
+			
+			<li><a href="#" class="tx-icon tx-toggle-size1-on">Size 1</a></li>
+			<li><a href="#" class="tx-icon tx-toggle-size2-on">Size 2</a></li>
+			<li><a href="#" class="tx-icon tx-toggle-size3-on">Size 3</a></li>
+		</ol>	
+
+	</div>
+	<!-- // moduleoptions -->
+</div>
+<!-- // header -->
+
+<!-- content -->
+<div id="tx-content">
+	<div class="tx-tree tx-halfwidth-left">
+    	
+		<!-- contains the tree -->
+		<div class="tx-tree-view">
+			<table class="tx-table">
+				<tr>
+					<th></th>
+					<th>Concepts</th>
+					<th style="width: 7em;">Tagged pages</th>
+					<th style="width: 6em;">In concepts</th>
+				</tr>
+			</table>
+
+			<!-- example folder structure -->
+			<ol>
+				<!--  tx-open, shows the arrow down on a "open" element -->
+				<li class="tx-open">
+					<!-- li content is wrapped inside a div to avoid some javascript event problems, eg. drag drop events can be assigned to the div instead -->
+					<div>
+						<!-- span class tx-info should be correspond with the table th widths -->
+						<span class="tx-info"><span style="width: 7em;">9</span><span style="width: 6em;">3</span></span>
+						<!-- drag icon -->
+						<div title=" Themes..." class="tx-icon tx-icon-drag">drag me</div>
+						<!-- checkbox -->
+						<input type="checkbox" /><!-- name --><a href=""></a><a href="">Themes...</a>
+					</div>
+					<!-- subelements of an li -->
+					<ol>
+						<li class="tx-open"><div>
+								<span class="tx-info"><span style="width: 7em;">29</span><span style="width: 6em;">2</span></span>
+								<div title=" Where" class="tx-icon tx-icon-drag">drag me</div>
+								<input type="checkbox" /><a href=""></a><a href=""> Where</a>
+							</div>
+							<ol>
+								<!-- li default shows an right arrow as background -->
+								<li><div>
+									<span class="tx-info"><span style="width: 7em;">51</span><span style="width: 6em;">5</span></span>
+									<div title="Africa" class="tx-icon tx-icon-drag">drag me</div>
+									<input type="checkbox" /><a href=""></a><a href="">Africa</a>
+								</div></li>
+								<li><div>
+									<span class="tx-info"><span style="width: 7em;">8</span><span style="width: 6em;">6</span></span>
+									<div title="Asia" class="tx-icon tx-icon-drag">drag me</div>
+									<input type="checkbox" /><a href=""></a><a href="">Asia</a>
+								</div></li>
+								<!-- tx-nobg, shows no arrow on a element, e.g. element has no subelements -->
+								<li class="tx-nobg"><div>
+									<span class="tx-info"><span style="width: 7em;">70</span><span style="width: 6em;">2</span></span>
+									<div title="Ecoregions" class="tx-icon tx-icon-drag">drag me</div>
+									<input type="checkbox" /><a href=""></a><a href="">Ecoregions</a>
+								</div></li>
+							</ol>
+						</li>		
+					</ol>
+				</li>
+			</ol>
+			<!-- // example folder structure-->
+		</div>
+		<!-- // tree view -->
+		
+	</div>
+	<!-- // tree -->
+	
+	<!-- list / thumbnail -->	
+	<!-- aligned right / ca. 50% width-->
+	<div class="tx-list tx-halfwidth-right">
+
+		<form action="" method="post">
+			<fieldset>
+				<!-- tx-size1, tx-size2, tx-size3, different thumbnail sizes -->
+				<ol class="tx-size3">
+					<li>
+						<!-- img.tx-height, portrait thumbnail format -->
+						<div class="tx-thumb"><a href=""><img src="temp/img/tiger1.jpg" alt="" class="tx-height" /></a></div>
+						<div>
+							<input type="checkbox" value="" />
+						</div>
+					</li>
+					<li>
+						<!-- img.tx-width, landscape thumbnail format -->
+						<div class="tx-thumb"><a href=""><img src="temp/img/tiger2.jpg" alt="" class="tx-width" /></a></div>
+						<div>
+							<input type="checkbox" value="" />
+						</div>
+					</li>
+					<li>
+						<div class="tx-thumb"><a href=""><img src="temp/img/eye1.jpg" alt="" class="tx-width" /></a></div>
+						<div>
+							<input type="checkbox" value="" />
+						</div>
+					</li>
+					<li>
+						<div class="tx-thumb"><a href=""><img src="temp/img/tiger1.jpg" alt="" class="tx-height" /></a></div>
+						<div>
+							<input type="checkbox" value="" />
+						</div>
+					</li>
+					<li>
+						<div class="tx-thumb"><a href=""><img src="temp/img/tiger2.jpg" alt="" class="tx-width" /></a></div>
+						<div>
+							<input type="checkbox" value="" />
+							<!-- custom defined icons, tx-right, global for "float: right" -->
+							<span class="tx-icon tx-icon-alert tx-right" title="The rights on this assets expire on 19.08.2009"></span>
+						</div>
+					</li>
+					<li>
+						<div class="tx-thumb"><a href=""><img src="temp/img/eye1.jpg" alt="" class="tx-width" /></a></div>
+						<div>
+							<input type="checkbox" value="" />
+						</div>
+					</li>
+					<li>
+						<div class="tx-thumb"><a href=""><img src="temp/img/eye1.jpg" alt="" class="tx-width" /></a></div>
+						<div>
+							<input type="checkbox" value="" />
+							<span class="tx-icon tx-icon-alert tx-right" title="The rights on this assets expire on 17.07.2009"></span>
+						</div>
+					</li>
+					<li>
+						<div class="tx-thumb"><a href=""><img src="temp/img/tiger1.jpg" alt="" class="tx-height" /></a></div>
+						<div>
+							<input type="checkbox" value="" />
+							<span class="tx-icon tx-icon-alert tx-right tx-tooltip" title="The rights on this assets expire on 24.06.2009"></span>
+						</div>
+					</li>
+					<li>
+						<div class="tx-thumb"><a href=""><img src="temp/img/tiger2.jpg" alt="" class="tx-width" /></a></div>
+						<div>
+							<input type="checkbox" value="" />
+						</div>
+					</li>
+					<li>
+						<div class="tx-thumb"><a href=""><img src="temp/img/tiger1.jpg" alt="" class="tx-height" /></a></div>
+						<div>
+							<input type="checkbox" value="" />
+							<span class="tx-icon tx-icon-alert tx-right tx-tooltip" title="The rights on this assets expire on 08.07.2009"></span>
+						</div>
+					</li>
+					<li>
+						<div class="tx-thumb"><a href=""><img src="temp/img/tiger2.jpg" alt="" class="tx-width" /></a></div>
+						<div>
+							<input type="checkbox" value="" />
+						</div>
+					</li>
+					<li>
+						<div class="tx-thumb"><a href=""><img src="temp/img/tiger2.jpg" alt="" class="tx-width" /></a></div>
+						<div>
+							<input type="checkbox" value="" />
+							<span class="tx-icon tx-icon-alert tx-right tx-tooltip" title="The rights on this assets expire on 12.08.2009"></span>
+						</div>
+					</li>
+					<li>
+						<div class="tx-thumb"><a href=""><img src="temp/img/eye1.jpg" alt="" class="tx-width" /></a></div>
+						<div>
+							<input type="checkbox" value="" />
+						</div>
+					</li>
+				</ol>
+			</fieldset>
+		</form>
+		
+	</div>
+	<!-- // list / thumbnail -->
+	
+</div>
+<!-- // content -->
+	
+</body>
+</html>
+

http://git-wip-us.apache.org/repos/asf/clerezza/blob/74fe1745/platform.style.classic.webguiexamples/src/main/resources/CLEREZZA-INF/web-resources/web-gui-examples/tree.xhtml
----------------------------------------------------------------------
diff --git a/platform.style.classic.webguiexamples/src/main/resources/CLEREZZA-INF/web-resources/web-gui-examples/tree.xhtml b/platform.style.classic.webguiexamples/src/main/resources/CLEREZZA-INF/web-resources/web-gui-examples/tree.xhtml
new file mode 100644
index 0000000..149bfea
--- /dev/null
+++ b/platform.style.classic.webguiexamples/src/main/resources/CLEREZZA-INF/web-resources/web-gui-examples/tree.xhtml
@@ -0,0 +1,207 @@
+<?xml version='1.0'?>
+<!--
+
+ Licensed to the Apache Software Foundation (ASF) under one
+ or more contributor license agreements.  See the NOTICE file
+ distributed with this work for additional information
+ regarding copyright ownership.  The ASF licenses this file
+ to you under the Apache License, Version 2.0 (the
+ "License"); you may not use this file except in compliance
+ with the License.  You may obtain a copy of the License at
+
+   http://www.apache.org/licenses/LICENSE-2.0
+
+ Unless required by applicable law or agreed to in writing,
+ software distributed under the License is distributed on an
+ "AS IS" BASIS, WITHOUT WARRANTIES OR CONDITIONS OF ANY
+ KIND, either express or implied.  See the License for the
+ specific language governing permissions and limitations
+ under the License.
+
+-->
+
+<!DOCTYPE html PUBLIC "-//W3C//DTD XHTML 1.0 Strict//EN"
+	"http://www.w3.org/TR/xhtml1/DTD/xhtml1-strict.dtd">
+
+<html xmlns="http://www.w3.org/1999/xhtml" xml:lang="en" lang="en">
+<head>
+<title>tree - example</title>
+
+	<link href="/style/style.css" media="screen" rel="stylesheet" type="text/css" />
+	<link href="./style/demo.css" media="screen" rel="stylesheet" type="text/css" />
+
+	<style type="text/css"> 
+		.col1 {
+			width: 7em; 
+		}
+		
+		.col2 {
+			width: 6em; 
+		}
+	</style>
+	
+</head>
+
+<body>
+
+<!-- content -->
+<div id="tx-content" class="demo">
+
+	<!-- tree view -->
+	<div class="tx-tree">
+    	
+		<!-- contains the tree -->
+		<div class="tx-tree-view">
+			<table class="tx-table">
+				<tr>
+					<th></th>
+					<th>Concepts</th>
+					<th class="col1">Tagged pages</th>
+					<th class="col2">In concepts</th>
+				</tr>
+			</table>
+			<!-- example folder structure -->
+			<ol>
+				<!--  tx-open, shows the arrow down on a "open" element -->
+				<li class="tx-open">
+					<!-- li content is wrapped inside a div to avoid some javascript event problems, eg. drag drop events can be assigned to the div instead -->
+					<div>
+						<!-- span class tx-info should be correspond with the table th widths -->
+						<span class="tx-info"><span class="col1">9</span><span class="col2">3</span></span>
+						<!-- drag icon -->
+						<div title=" Themes..." class="tx-icon tx-icon-drag">drag me</div>
+						<!-- checkbox -->
+						<input type="checkbox" /><!-- name --><a href=""></a><a href="">Themes...</a>
+					</div>
+					<!-- subelements of an li -->
+					<ol>
+						<li class="tx-open"><div>
+								<span class="tx-info"><span class="col1">29</span><span class="col2">2</span></span>
+								<div title=" Where" class="tx-icon tx-icon-drag">drag me</div>
+								<input type="checkbox" /><a href=""></a><a href=""> Where</a>
+							</div>
+							<ol>
+								<!-- li default shows an right arrow as background -->
+								<li><div>
+									<span class="tx-info"><span class="col1">51</span><span class="col2">5</span></span>
+									<div title="Africa" class="tx-icon tx-icon-drag">drag me</div>
+									<input type="checkbox" /><a href=""></a><a href="">Africa</a>
+								</div></li>
+								<li><div>
+									<span class="tx-info"><span class="col1">8</span><span class="col2">6</span></span>
+									<div title="Asia" class="tx-icon tx-icon-drag">drag me</div>
+									<input type="checkbox" /><a href=""></a><a href="">Asia</a>
+								</div></li>
+								<!-- tx-nobg, shows no arrow on a element, e.g. element has no subelements -->
+								<li class="tx-nobg"><div>
+									<span class="tx-info"><span class="col1">70</span><span class="col2">2</span></span>
+									<div title="Ecoregions" class="tx-icon tx-icon-drag">drag me</div>
+									<input type="checkbox" /><a href=""></a><a href="">Ecoregions</a>
+								</div></li>
+							</ol>
+						</li>		
+					</ol>
+				</li>
+			</ol>
+			<!-- // example folder structure-->
+		</div>
+		<!-- // tree view -->
+
+		<div id="demo">
+			<h3>Description</h3>
+
+			In the tx-content a &lt;div> with class <b>tx-tree</b> is created.
+			<br/>
+			<br/>			
+			
+			In the <strong>li</strong> elements of the <strong>tx-tree-view</strong> are the <strong>span.tx-info</strong>, which referes to the <strong>table th</strong>. 
+			<br/>
+			<br/>
+			
+			<strong>tx-tree-view</strong> contains the tree view. for a better description, how the tree view is defined, refer the source code (context highlighting in the browser) 
+			<br/>
+			<br/>
+			The current example has no ids or names defined, if necessary they have to be defined contextually.
+			<br/>
+			
+			
+			<strong>div.tx-tree</strong> is the main container for the tree view. If no class is defined on the <strong>div.tx-tree</strong> element the tree has 100% width. 
+			<br/>
+			The classes <strong>.tx-show-panel</strong>, <strong>.tx-hide-panel</strong> and <strong>.tx-halfwidth-left</strong> define the position of the tree view.
+			<br/>
+			<br/>
+			
+			<strong>.tx-show-panel</strong>: position with a panel on the left side.<br/>
+			<strong>.tx-hide-panel</strong>: position with a panel on the left side, hidden.<br/>
+			<strong>.tx-halfwidth-left</strong>: position on the left side 50% width.<br/>
+			<br/>
+			<br/>
+			
+			
+
+			<h3>Example code</h3>
+			
+			<pre>
+&lt;!-- contains the tree --&gt;
+&lt;div class="tx-tree-view"&gt;
+	&lt;table class="tx-table"&gt;
+		&lt;tr&gt;
+			&lt;th&gt;&lt;/th&gt;
+			&lt;th&gt;Concepts&lt;/th&gt;
+			&lt;th class="col1"&gt;Tagged pages&lt;/th&gt;
+			&lt;th class="col2"&gt;In concepts&lt;/th&gt;
+		&lt;/tr&gt;
+	&lt;/table&gt;
+	&lt;!-- example folder structure --&gt;
+	&lt;ol&gt;
+		&lt;!--  tx-open, shows the arrow down on a "open" element --&gt;
+		&lt;li class="tx-open"&gt;
+			&lt;!-- li content is wrapped inside a div to avoid some javascript event problems, eg. drag drop events can be assigned to the div instead --&gt;
+			&lt;div&gt;
+				&lt;!-- span class tx-info should be correspond with the table th widths --&gt;
+				&lt;span class="tx-info"&gt;&lt;span class="col1"&gt;9&lt;/span&gt;&lt;span class="col2"&gt;3&lt;/span&gt;&lt;/span&gt;
+				&lt;!-- drag icon --&gt;
+				&lt;div title=" Themes..." class="tx-icon tx-icon-drag"&gt;drag me&lt;/div&gt;
+				&lt;!-- checkbox --&gt;
+				&lt;input type="checkbox" /&gt;&lt;!-- name --&gt;&lt;a href=""&gt;&lt;/a&gt;&lt;a href=""&gt;Themes...&lt;/a&gt;
+			&lt;/div&gt;
+			&lt;!-- subelements of an li --&gt;
+			&lt;ol&gt;
+				&lt;li class="tx-open"&gt;&lt;div&gt;
+						&lt;span class="tx-info"&gt;&lt;span class="col1"&gt;29&lt;/span&gt;&lt;span class="col2"&gt;2&lt;/span&gt;&lt;/span&gt;
+						&lt;div title=" Where" class="tx-icon tx-icon-drag"&gt;drag me&lt;/div&gt;
+						&lt;input type="checkbox" /&gt;&lt;a href=""&gt;&lt;/a&gt;&lt;a href=""&gt; Where&lt;/a&gt;
+					&lt;/div&gt;
+					&lt;ol&gt;
+						&lt;!-- li default shows an right arrow as background --&gt;
+						&lt;li&gt;&lt;div&gt;
+							&lt;span class="tx-info"&gt;&lt;span class="col1"&gt;51&lt;/span&gt;&lt;span class="col2"&gt;5&lt;/span&gt;&lt;/span&gt;
+							&lt;div title="Africa" class="tx-icon tx-icon-drag"&gt;drag me&lt;/div&gt;
+							&lt;input type="checkbox" /&gt;&lt;a href=""&gt;&lt;/a&gt;&lt;a href=""&gt;Africa&lt;/a&gt;
+						&lt;/div&gt;&lt;/li&gt;
+						&lt;!-- tx-nobg, shows no arrow on a element, e.g. element has no subelements --&gt;
+						&lt;li class="tx-nobg"&gt;&lt;div&gt;
+							&lt;span class="tx-info"&gt;&lt;span class="col1"&gt;70&lt;/span&gt;&lt;span class="col2"&gt;2&lt;/span&gt;&lt;/span&gt;
+							&lt;div title="Ecoregions" class="tx-icon tx-icon-drag"&gt;drag me&lt;/div&gt;
+							&lt;input type="checkbox" /&gt;&lt;a href=""&gt;&lt;/a&gt;&lt;a href=""&gt;Ecoregions&lt;/a&gt;
+						&lt;/div&gt;&lt;/li&gt;
+					&lt;/ol&gt;
+				&lt;/li&gt;		
+			&lt;/ol&gt;
+		&lt;/li&gt;
+	&lt;/ol&gt;
+	&lt;!-- // example folder structure--&gt;
+&lt;/div&gt;
+&lt;!-- // tree view --&gt;
+			</pre>
+
+		</div>
+	</div>	
+</div>
+<!-- // content -->
+
+
+	
+</body>
+</html>
+

http://git-wip-us.apache.org/repos/asf/clerezza/blob/74fe1745/platform.style.classic.webguiexamples/src/main/resources/META-INF/documentation.nt
----------------------------------------------------------------------
diff --git a/platform.style.classic.webguiexamples/src/main/resources/META-INF/documentation.nt b/platform.style.classic.webguiexamples/src/main/resources/META-INF/documentation.nt
new file mode 100644
index 0000000..93a1f05
--- /dev/null
+++ b/platform.style.classic.webguiexamples/src/main/resources/META-INF/documentation.nt
@@ -0,0 +1,13 @@
+<bundle:///webguiexamples-content> <http://www.w3.org/1999/02/22-rdf-syntax-ns#type> <http://discobits.org/ontology#XHTMLInfoDiscoBit> .
+<bundle:///webguiexamples-content> <http://discobits.org/ontology#infoBit> "The following list gives an overview of all gui elements and the corresponding styles available on clerezza to create your on wep apps. To use the style the file \"style.css\" has to be linked to the source HTML document with the LINK element: \n<br xmlns=\"http://www.w3.org/1999/xhtml\"></br>\n&lt;link href=\"/style/style.css\" media=\"screen\" rel=\"stylesheet\" type=\"text/css\" /&gt;\n<br xmlns=\"http://www.w3.org/1999/xhtml\"></br>\n<br xmlns=\"http://www.w3.org/1999/xhtml\"></br>\n<ul xmlns=\"http://www.w3.org/1999/xhtml\">\n<li>\n<a href=\"/web-gui-examples/buttons.xhtml\" target=\"_blank\">buttons</a>\n</li>\n<li>\n<a href=\"/web-gui-examples/header.xhtml\" target=\"_blank\">header</a>\n</li>\n<li>\n<a href=\"/web-gui-examples/panel.xhtml\" target=\"_blank\">panel</a>\n</li>\n<li>\n<a href=\"/web-gui-examples/thumbnail.xhtml\" target=\"_blank\">thumbnail view</a>\n</li>\n<li>\n<a href=\"/web-gui-exam
 ples/tree.xhtml\" target=\"_blank\">tree view</a>\n</li>\n<li>\n<a href=\"/web-gui-examples/edit.xhtml\" target=\"_blank\">edit view</a>\n</li>\n<li>\n<a href=\"/web-gui-examples/table.xhtml\" target=\"_blank\">table view</a>\n</li>\n<li>\n<a href=\"/web-gui-examples/panel-thumbnail.xhtml\" target=\"_blank\">panel-thumbnail view</a>\n</li>\n<li>\n<a href=\"/web-gui-examples/panel-tree.xhtml\" target=\"_blank\">panel-tree view</a>\n</li>\n<li>\n<a href=\"/web-gui-examples/tree-edit.xhtml\" target=\"_blank\">tree-edit view</a>\n</li>\n<li>\n<a href=\"/web-gui-examples/tree-thumbnail.xhtml\" target=\"_blank\">tree-thumbnail view</a>\n</li>\n<li>\n<a href=\"/web-gui-examples/overlay.xhtml\" target=\"_blank\">overlay</a>\n</li><li><a href=\"/web-gui-examples/alert.xhtml\" target=\"_blank\">alert message</a></li>\n</ul>"^^<http://www.w3.org/1999/02/22-rdf-syntax-ns#XMLLiteral> .
+_:AX2dX304e41c0X3aX1274283458aX3aXX2dX7e4e <http://www.w3.org/1999/02/22-rdf-syntax-ns#type> <http://discobits.org/ontology#Entry> .
+_:AX2dX304e41c0X3aX1274283458aX3aXX2dX7e4e <http://discobits.org/ontology#pos> "0" .
+_:AX2dX304e41c0X3aX1274283458aX3aXX2dX7e4e <http://discobits.org/ontology#holds> <bundle:///webguiexamples-title> .
+<bundle:///webguiexamples> <http://www.w3.org/1999/02/22-rdf-syntax-ns#type> <http://discobits.org/ontology#TitledContent> .
+<bundle:///webguiexamples> <http://discobits.org/ontology#contains> _:AX2dX304e41c0X3aX1274283458aX3aXX2dX7e4e .
+<bundle:///webguiexamples> <http://discobits.org/ontology#contains> _:AX2dX304e41c0X3aX1274283458aX3aXX2dX7e4d .
+<bundle:///webguiexamples-title> <http://discobits.org/ontology#infoBit> "Web Gui Examples"^^<http://www.w3.org/1999/02/22-rdf-syntax-ns#XMLLiteral> .
+<bundle:///webguiexamples-title> <http://www.w3.org/1999/02/22-rdf-syntax-ns#type> <http://discobits.org/ontology#XHTMLInfoDiscoBit> .
+_:AX2dX304e41c0X3aX1274283458aX3aXX2dX7e4d <http://www.w3.org/1999/02/22-rdf-syntax-ns#type> <http://discobits.org/ontology#Entry> .
+_:AX2dX304e41c0X3aX1274283458aX3aXX2dX7e4d <http://discobits.org/ontology#pos> "1" .
+_:AX2dX304e41c0X3aX1274283458aX3aXX2dX7e4d <http://discobits.org/ontology#holds> <bundle:///webguiexamples-content> .

http://git-wip-us.apache.org/repos/asf/clerezza/blob/74fe1745/site/deploy.sh
----------------------------------------------------------------------
diff --git a/site/deploy.sh b/site/deploy.sh
new file mode 100644
index 0000000..45275be
--- /dev/null
+++ b/site/deploy.sh
@@ -0,0 +1,9 @@
+svn co https://svn.apache.org/repos/asf/clerezza/site/production/ /tmp/site-production
+curl -u admin:admin "http://localhost:8080/admin/offline/download?baseUri=http://localhost:8080/&targetUri=http://clerezza.apache.org/&formatExtension=xhtml&formatExtension=rdf&formatExtension=png&formatExtension=html&formatExtension=js&formatExtension=jpeg&formatExtension=css"  > /tmp/site-production.zip
+cd ..
+mvn javadoc:aggregate
+cp -r ./target/site/apidocs /tmp/site-production/
+unzip -o /tmp/site-production.zip -d /tmp/site-production
+cd /tmp/site-production 
+svn add * --force
+svn commit -m "Auto commit by site deploy script" .