From richfaces-svn-commits at lists.jboss.org Wed Mar 25 07:13:55 2009
Content-Type: multipart/mixed; boundary="===============8683821706700443640=="
MIME-Version: 1.0
From: richfaces-svn-commits at lists.jboss.org
To: richfaces-svn-commits at lists.jboss.org
Subject: [richfaces-svn-commits] JBoss Rich Faces SVN: r13170 -
 trunk/docs/realworld_app_guide/en/src/main/docbook/modules.
Date: Wed, 25 Mar 2009 07:13:54 -0400
Message-ID: <E1LmR3S-0003J7-7p@committer01.frg.pub.inap.atl.jboss.com>

--===============8683821706700443640==
Content-Type: text/plain; charset="utf-8"
MIME-Version: 1.0
Content-Transfer-Encoding: quoted-printable

Author: atsebro
Date: 2009-03-25 07:13:54 -0400 (Wed, 25 Mar 2009)
New Revision: 13170

Added:
   trunk/docs/realworld_app_guide/en/src/main/docbook/modules/how_it_works.=
xml
Log:
RF-5768: Real World Demo Application Tutorial Update for 3.3.1 release =


Added: trunk/docs/realworld_app_guide/en/src/main/docbook/modules/how_it_wo=
rks.xml
=3D=3D=3D=3D=3D=3D=3D=3D=3D=3D=3D=3D=3D=3D=3D=3D=3D=3D=3D=3D=3D=3D=3D=3D=3D=
=3D=3D=3D=3D=3D=3D=3D=3D=3D=3D=3D=3D=3D=3D=3D=3D=3D=3D=3D=3D=3D=3D=3D=3D=3D=
=3D=3D=3D=3D=3D=3D=3D=3D=3D=3D=3D=3D=3D=3D=3D=3D=3D
--- trunk/docs/realworld_app_guide/en/src/main/docbook/modules/how_it_works=
.xml	                        (rev 0)
+++ trunk/docs/realworld_app_guide/en/src/main/docbook/modules/how_it_works=
.xml	2009-03-25 11:13:54 UTC (rev 13170)
@@ -0,0 +1,93 @@
+<?xml version=3D"1.0" encoding=3D"UTF-8"?>
+<chapter id=3D"how_it_works" xreflabel=3D"how_it_works">
+    <?dbhtml filename=3D"how_it_works.html"?>
+    <chapterinfo>
+        <keywordset>
+            <keyword>RichFaces</keyword>
+            =

+        </keywordset>
+    </chapterinfo>
+    =

+    <title>How it works</title>
+      <section><title>General application overview</title>
+            <section><title>Used technologies overview</title>
+            <para>The PhotoAlbum is based on following technologies and fr=
ameworks:</para>
+            <itemizedlist>
+                  <listitem><para>Java Server Faces (JSF), technology that=
 provides a single, standard, productive way to use Java technologies to bu=
ild Web-based applications;</para></listitem>
+                  <listitem><para>Facelets, the technology that combines t=
he power of UI components and the flexibility of XML to accelerate JavaServ=
er Faces development. Facelets presents a compelling alternative to JSP as =
the markup technology of choice for next-generation JSF applications;</para=
></listitem>
+                  <listitem><para>Asynchronous JavaScript and XML (AJAX), =
several incorporated technologies. Ajax binds together standards-based pres=
entation using XHTML and CSS, dynamic display and interaction using the DOM=
, data interchange and manipulation using XML and XSLT, asynchronous data r=
etrieval using XMLHttpRequest and JavaScript;</para></listitem>
+                  <listitem><para>Seam technology that integrates previous=
 mentioned technologies with Java Persistence (JPA), Enterprise Java Beans =
(EJB 3.0) and Business Process Management (BPM) into a unified full-stack s=
olution;</para></listitem>
+                  <listitem><para>RichFaces, a framework and library of Aj=
ax-capable UI components for JSF framework that had been evolved from Ajax4=
JSF framework (merge of Ajax and JavaServer Faces technologies).</para></li=
stitem>
+            </itemizedlist>
+            <para>One of the main goals for the PhotoAlbum Demo is to demo=
nstrate the RichFaces.</para>
+            </section>
+            =

+            <section>
+                  <title>The main benefits of the RichFaces</title>
+                  <para>The RichFaces has set of benefits positioning this=
 library and framework with a difference to the wide range of similar libra=
ries. =

+                        All the RichFaces benefits are fully described in =
the <ulink url=3D"http://www.jboss.org/file-access/default/members/jbossric=
hfaces/freezone/docs/devguide/en/html/Introduction.html">Introduction to th=
e RichFaces</ulink>. =

+                        The &lt;Photo Album&gt; covers some of the most im=
portant of them and demonstrates: </para>
+                  <itemizedlist>
+                        <listitem><para><emphasis>wide variety of UI compo=
nents</emphasis>, which provides Lego-like way of building user interfaces =
for web applications;</para></listitem>
+                        <listitem><para><emphasis>built-in Ajax capability=
</emphasis>, which offers both component-wide and a lot more flexible page-=
wide Ajax support;</para></listitem>
+                        <listitem><para><emphasis>highly customizable look=
-and-feel</emphasis> (the RichFaces have special feature called =

+                              &quot;<ulink url=3D"http://www.jboss.org/fil=
e-access/default/members/jbossrichfaces/freezone/docs/devguide/en/html/Arch=
itectureOverview.html#Skinnability">Skinnability</ulink>&quot;).</para></li=
stitem>
+                  </itemizedlist>
+            </section>
+            =

+            <section>
+                  <title>The main structure and organization of the PhotoA=
lbum</title>
+                  <para>Since the application uses Facelets technology the=
 main page <code>index.xhtml</code> represents an &lt;include&gt; (or facel=
et) wrapped with the <emphasis role=3D"bold">&lt;ui:composition&gt;</emphas=
is> tag. =

+                        This tag is used to trim unnecessary markup in the=
 facelet. Any content outside of <emphasis role=3D"bold">&lt;ui:composition=
&gt;</emphasis> tag will be ignored by the Facelets view handler. =

+                        A facelet can be incorporated into another page or=
 facelet with the help of <emphasis role=3D"bold">&lt;ui:define&gt;</emphas=
is> and <emphasis role=3D"bold">&lt;ui:include&gt;</emphasis> tags pointed =
to by the <emphasis role=3D"bold">&lt;ui:include&gt;</emphasis> &quot;src&q=
uot; attribute. =

+                        The facelet may simply contain a fragment of XHTML=
 or XML to be included.</para>
+                  =

+                  <para>Here is <code>index.xhtml</code> page source code:=
</para>
+                  <programlisting role=3D"XML"><![CDATA[<!DOCTYPE composit=
ion PUBLIC "-//W3C//DTD XHTML 1.0 Transitional//EN" =

+                      "http://www.w3.org/TR/xhtml1/DTD/xhtml1-transitional=
.dtd">
+<ui:composition xmlns=3D"http://www.w3.org/1999/xhtml"
+		    xmlns:s=3D"http://jboss.com/products/seam/taglib"
+		    xmlns:ui=3D"http://java.sun.com/jsf/facelets"
+		    xmlns:f=3D"http://java.sun.com/jsf/core"
+		    xmlns:h=3D"http://java.sun.com/jsf/html"
+		    xmlns:rich=3D"http://richfaces.org/rich"
+		    xmlns:a4j=3D"http://richfaces.org/a4j"
+		    xmlns:richx=3D"http://richfaces.org/richx"
+		    template=3D"layout/template.xhtml">
+	=

+	<ui:define name=3D"searchWidget">
+		<ui:include src=3D"includes/search/searchWidget.xhtml" />
+	</ui:define>
+	=

+	<ui:define name=3D"menu">
+		<ui:include src=3D"/includes/index/menu.xhtml" />
+	</ui:define>
+	=

+	<ui:define name=3D"tree">
+		<ui:include src=3D"/includes/index/tree.xhtml" />
+	</ui:define>
+	=

+	<ui:define name=3D"body">
+		<h:panelGroup id=3D"mainArea" layout=3D"block">
+			<h:panelGroup styleClass=3D"content_box" layout=3D"block">
+				<ui:include src=3D"#{model.mainArea.template}" />
+			</h:panelGroup>
+			<ui:include src=3D"includes/misc/errorPanel.xhtml" />
+		</h:panelGroup>
+	</ui:define>
+
+</ui:composition>]]>
+                  </programlisting>
+                  =

+                  <para>The snippet above shows that the <code>index.xhtml=
</code> page does not contain sources for application functional parts but =
includes them as templates that are rendered depending on conditions and ev=
ents taking place during user interaction with the PhotoAlbum. =

+                        The illustration below shows <code>index.xhtml</co=
de> page schematically with it &qout;includes&quot; and paths to them:</par=
a>
+                  <mediaobject>
+                        <imageobject>
+                              <imagedata fileref=3D"images/indexxhtml.png"=
/>
+                        </imageobject>
+                  </mediaobject>
+                  =

+            </section>
+   =

+</chapter>
+


--===============8683821706700443640==--