Writing your first Tobago app

/tobago-resource/
/tobago-resource/html/
/tobago-resource/html/standard/
/tobago-resource/html/standard/standard/
/tobago-resource/html/standard/standard/image/
/tobago-resource/html/standard/standard/image/foo.gif

Use <tc:image> to refer to this image, as follows:

<tc:image alt="foo" value="image/foo.gif"/>

[edit]

Displaying messages

Refer to the following document for displaying messages in JSF: http://www.jsf-faq.com/faqs/faces-messages.html

In tobago, use the following tag for displaying messages:

<tc:messages/>

[edit]

Migrating your native JSF app to Tobago

Key points:

<h:panelGroup> becomes <tc:panel>
<h:inputText> becomes <tx:in>
<h:commandButton> becomes <tc:button>
<h:outputText> becomes <tc:out>
<h:commandLink> becomes <tc:link>

[edit]

Advanced topics

[edit]

Slow performance issue due to theme includes

[edit]

Identifying the problem

<link rel="stylesheet" href="/org/apache/myfaces/tobago/renderkit/html/scarborough/standard/style/style.css" media="screen" type="text/css">
<link rel="stylesheet" href="/org/apache/myfaces/tobago/renderkit/html/scarborough/mozilla/style/style.css" media="screen" type="text/css">
<link rel="stylesheet" href="/org/apache/myfaces/tobago/renderkit/html/speyside/standard/style/style.css" media="screen" type="text/css">
<link rel="stylesheet" href="/org/apache/myfaces/tobago/renderkit/html/speyside/mozilla/style/style.css" media="screen" type="text/css">
<link rel="stylesheet" href="/org/apache/myfaces/tobago/renderkit/html/richmond/standard/style/style.css" media="screen" type="text/css">
<link rel="stylesheet" href="/org/apache/myfaces/tobago/renderkit/html/richmond/mozilla/style/style.css" media="screen" type="text/css">
<link rel="stylesheet" href="/tobago-resource/html/standard/standard/style/ecommendation.css" media="screen" type="text/css">
<script src="/org/apache/myfaces/tobago/renderkit/html/standard/standard/script/prototype.js" type="text/javascript"></script>
<script src="/org/apache/myfaces/tobago/renderkit/html/standard/standard/script/tobago.js" type="text/javascript"></script>
<script src="/org/apache/myfaces/tobago/renderkit/html/standard/standard/script/theme-config.js" type="text/javascript"></script>
<script src="/org/apache/myfaces/tobago/renderkit/html/scarborough/standard/script/theme-config.js" type="text/javascript"></script>
<script src="/org/apache/myfaces/tobago/renderkit/html/speyside/standard/script/theme-config.js" type="text/javascript"></script>

Initially I found the inclusion of all theme files puzzling because I was using the richmond theme only. However, I realized that the richmod theme depends on speyside, which depends on scarborough and so on. Thus, the framework automatically includes all file includes in every single page rendered through the framework.

The way these pages were rendered were through the resources servlet specified in web.xml.

<servlet>
	<servlet-name>ResourceServlet</servlet-name>
	<servlet-class>
		org.apache.myfaces.tobago.servlet.ResourceServlet
	</servlet-class>
</servlet>

<servlet-mapping>
	<servlet-name>ResourceServlet</servlet-name>
	<url-pattern>/org/apache/myfaces/tobago/renderkit/*</url-pattern>
</servlet-mapping>

Thus, each request sent from the client browser was being routed by tomcat to the resource servlet which was then sending the response back by reading it in the corresponding theme jar. No wonder why I was getting such the slow response.

The next step was to optimize performance.

[edit]

Solution

Reference: http://myfaces.apache.org/tobago/themes.html

Add the following snippet to your pom.xml

<!-- maven theme plugin, to automatically extract theme jars into the given resources directory -->
<plugin>
	<groupId>org.apache.myfaces.tobago</groupId>
	<artifactId>maven-theme-plugin</artifactId>
	<version>1.0.8</version>
	<executions>
		<execution>
			<goals>
				<goal>resources</goal>
			</goals>
		</execution>
	</executions>
</plugin>

Then execute the following maven goal.