[seam-commits] Seam SVN: r15064 - in branches/community/Seam_2_3/examples-ee6/seamdiscs/seamdiscs-web: src/main/webapp and 3 other directories.

Author: vdedik Date: 2012-08-22 09:47:21 -0400 (Wed, 22 Aug 2012) New Revision: 15064 Modified: branches/community/Seam_2_3/examples-ee6/seamdiscs/seamdiscs-web/pom.xml branches/community/Seam_2_3/examples-ee6/seamdiscs/seamdiscs-web/src/main/webapp/WEB-INF/web.xml branches/community/Seam_2_3/examples-ee6/seamdiscs/seamdiscs-web/src/main/webapp/artist.xhtml branches/community/Seam_2_3/examples-ee6/seamdiscs/seamdiscs-web/src/main/webapp/artists.xhtml branches/community/Seam_2_3/examples-ee6/seamdiscs/seamdiscs-web/src/main/webapp/disc.xhtml branches/community/Seam_2_3/examples-ee6/seamdiscs/seamdiscs-web/src/main/webapp/discs.xhtml branches/community/Seam_2_3/examples-ee6/seamdiscs/seamdiscs-web/src/main/webapp/home.xhtml branches/community/Seam_2_3/examples-ee6/seamdiscs/seamdiscs-web/src/main/webapp/layout/footer.xhtml branches/community/Seam_2_3/examples-ee6/seamdiscs/seamdiscs-web/src/main/webapp/layout/menu.xhtml branches/community/Seam_2_3/examples-ee6/seamdiscs/seamdiscs-web/src/main/webapp/layout/template.xhtml branches/community/Seam_2_3/examples-ee6/seamdiscs/seamdiscs-web/src/main/webapp/login.xhtml branches/community/Seam_2_3/examples-ee6/seamdiscs/seamdiscs-web/src/main/webapp/stylesheet/skin.css branches/community/Seam_2_3/examples-ee6/seamdiscs/seamdiscs-web/src/main/webapp/stylesheet/theme.css Log: - JBSEAM-5017 - Richfaces removed due to integration problems with trinidad. Modified: branches/community/Seam_2_3/examples-ee6/seamdiscs/seamdiscs-web/pom.xml =================================================================== --- branches/community/Seam_2_3/examples-ee6/seamdiscs/seamdiscs-web/pom.xml 2012-08-21 17:32:44 UTC (rev 15063) +++ branches/community/Seam_2_3/examples-ee6/seamdiscs/seamdiscs-web/pom.xml 2012-08-22 13:47:21 UTC (rev 15064) @@ -58,18 +58,6 @@ <artifactId>trinidad-impl</artifactId> </dependency> <dependency> - <groupId>org.richfaces.core</groupId> - <artifactId>richfaces-core-api</artifactId> - </dependency> - <dependency> - <groupId>org.richfaces.core</groupId> - <artifactId>richfaces-core-impl</artifactId> - </dependency> - <dependency> - <groupId>org.richfaces.ui</groupId> - <artifactId>richfaces-components-ui</artifactId> - </dependency> - <dependency> <groupId>org.apache.myfaces.trinidad</groupId> <artifactId>trinidad-api</artifactId> <scope>provided</scope> Modified: branches/community/Seam_2_3/examples-ee6/seamdiscs/seamdiscs-web/src/main/webapp/WEB-INF/web.xml =================================================================== --- branches/community/Seam_2_3/examples-ee6/seamdiscs/seamdiscs-web/src/main/webapp/WEB-INF/web.xml 2012-08-21 17:32:44 UTC (rev 15063) +++ branches/community/Seam_2_3/examples-ee6/seamdiscs/seamdiscs-web/src/main/webapp/WEB-INF/web.xml 2012-08-22 13:47:21 UTC (rev 15064) @@ -7,18 +7,14 @@ <param-value>.xhtml</param-value> </context-param> <!-- Facelets development mode (disable in production) --> + <!--<context-param>--> + <!--<param-name>javax.faces.PROJECT_STAGE</param-name>--> + <!--<param-value>Development</param-value>--> + <!--</context-param>--> <context-param> - <param-name>javax.faces.PROJECT_STAGE</param-name> - <param-value>Development</param-value> - </context-param> - <context-param> <param-name>org.apache.myfaces.trinidad.CACHE_VIEW_ROOT</param-name> <param-value>false</param-value> </context-param> - <context-param> - <param-name>org.richfaces.skin</param-name> - <param-value>blueSky</param-value> - </context-param> <filter> <filter-name>Seam Filter</filter-name> <filter-class>org.jboss.seam.servlet.SeamFilter</filter-class> Modified: branches/community/Seam_2_3/examples-ee6/seamdiscs/seamdiscs-web/src/main/webapp/artist.xhtml =================================================================== --- branches/community/Seam_2_3/examples-ee6/seamdiscs/seamdiscs-web/src/main/webapp/artist.xhtml 2012-08-21 17:32:44 UTC (rev 15063) +++ branches/community/Seam_2_3/examples-ee6/seamdiscs/seamdiscs-web/src/main/webapp/artist.xhtml 2012-08-22 13:47:21 UTC (rev 15064) @@ -5,15 +5,12 @@ xmlns:ui="http://java.sun.com/jsf/facelets" xmlns:f="http://java.sun.com/jsf/core" xmlns:h="http://java.sun.com/jsf/html" - xmlns:rich="http://richfaces.org/rich" xmlns:tr="http://myfaces.apache.org/trinidad" - xmlns:a="http://richfaces.org/a4j" template="layout/template.xhtml"> <ui:define name="body"> - <rich:panel> - <f:facet name="header"><tr:outputText value="#{artist.name} (#{messages[artist.class.name]})" rendered="#{artist.name ne null}" /></f:facet> + <tr:panelBox text="Artist" background="medium"> <h:form id="artist"> <s:validateAll> <tr:panelFormLayout> @@ -23,11 +20,6 @@ <tr:iterator value="#{artist.bandMembers}" var="bandMember"> <li> <tr:inputText simple="true" value="#{bandMember.name}" readOnly="#{not identity.loggedIn}" id="bandMember"/> - <rich:autocomplete for="bandMember" selfRendered="true" minChars="3" suggestionAction="#{bandMemberFinder.getBandMembers}" var="bandMember"> - <h:column> - <h:outputText value="#{bandMember.name}" /> - </h:column> - </rich:autocomplete> </li> </tr:iterator> </ul> @@ -37,7 +29,7 @@ </tr:panelLabelAndMessage> <tr:panelLabelAndMessage label="Details"> <tr:inputText simple="true" value="#{artist.description}" rendered="#{identity.loggedIn}" rows="4" columns="60" id="description"> - <a:ajax event="keyup" render="description_preview" requestDelay="3000" ignoreDupResponces="true" eventsQueue="previewQueue" /> + <f:ajax event="keyup" render="description_preview" requestDelay="3000" ignoreDupResponces="true" eventsQueue="previewQueue" /> </tr:inputText> <s:div style="width: 300px" id="description_preview"> @@ -57,7 +49,7 @@ <f:facet name="header"> Released </f:facet> - <tr:inputNumberSpinbox label="Release Date" value="#{disc.release}" minimum="1900" maximum="2010" stepSize="1" readOnly="#{not identity.loggedIn}" /> + <tr:inputNumberSpinbox label="Release Date" value="#{disc.release}" minimum="1900" maximum="2100" stepSize="1" readOnly="#{not identity.loggedIn}" columns="4" /> </tr:column> <f:facet name="detailStamp"> <s:div style="width: 300px;"> @@ -79,7 +71,7 @@ <s:button action="cancel" value="Cancel" id="cancel"/> </tr:panelButtonBar> </h:form> - </rich:panel> + </tr:panelBox> </ui:define> </ui:composition> Modified: branches/community/Seam_2_3/examples-ee6/seamdiscs/seamdiscs-web/src/main/webapp/artists.xhtml =================================================================== --- branches/community/Seam_2_3/examples-ee6/seamdiscs/seamdiscs-web/src/main/webapp/artists.xhtml 2012-08-21 17:32:44 UTC (rev 15063) +++ branches/community/Seam_2_3/examples-ee6/seamdiscs/seamdiscs-web/src/main/webapp/artists.xhtml 2012-08-22 13:47:21 UTC (rev 15064) @@ -5,28 +5,20 @@ xmlns:ui="http://java.sun.com/jsf/facelets" xmlns:f="http://java.sun.com/jsf/core" xmlns:h="http://java.sun.com/jsf/html" - xmlns:rich="http://richfaces.org/rich" - xmlns:a="http://richfaces.org/a4j" xmlns:tr="http://myfaces.apache.org/trinidad" template="layout/template.xhtml"> <ui:define name="body"> - <rich:panel> - <f:facet name="header">Artists</f:facet> + <tr:panelBox text="Artists" background="medium"> <tr:form> <tr:inputText value="#{exampleArtist.name}" label="Filter by artist name"> - <a:ajax render="artists" event="keyup" requestDelay="1" /> + <f:ajax render="artists" event="keyup" requestDelay="1" /> </tr:inputText> &#160; - <a:status> - <f:facet name="start"> - <h:graphicImage value="/img/spinner.gif" /> - </f:facet> - </a:status> </tr:form> - <a:outputPanel id="artists"> + <h:panelGroup id="artists"> <tr:form> <tr:table value="#{artists.dataModel}" var="artist" rows="#{artists.maxResults}"> @@ -66,7 +58,7 @@ </f:facet> </tr:table> </tr:form> - </a:outputPanel> + </h:panelGroup> <tr:panelButtonBar rendered="#{identity.loggedIn}"> <s:button action="artist" value="Add artist" id="addArtist"> <f:param name="artistId" value="" /> @@ -77,7 +69,7 @@ <f:param name="type" value="band" /> </s:button> </tr:panelButtonBar> - </rich:panel> + </tr:panelBox> </ui:define> </ui:composition> Modified: branches/community/Seam_2_3/examples-ee6/seamdiscs/seamdiscs-web/src/main/webapp/disc.xhtml =================================================================== --- branches/community/Seam_2_3/examples-ee6/seamdiscs/seamdiscs-web/src/main/webapp/disc.xhtml 2012-08-21 17:32:44 UTC (rev 15063) +++ branches/community/Seam_2_3/examples-ee6/seamdiscs/seamdiscs-web/src/main/webapp/disc.xhtml 2012-08-22 13:47:21 UTC (rev 15064) @@ -5,25 +5,17 @@ xmlns:ui="http://java.sun.com/jsf/facelets" xmlns:f="http://java.sun.com/jsf/core" xmlns:h="http://java.sun.com/jsf/html" - xmlns:rich="http://richfaces.org/rich" xmlns:tr="http://myfaces.apache.org/trinidad" - xmlns:a="http://richfaces.org/a4j" template="layout/template.xhtml"> <ui:define name="body"> - - <rich:panel> - <f:facet name="header"> - <s:fragment rendered="#{disc.name ne null}"> - <i><tr:outputText value="#{disc.name}" /></i> - <tr:outputText value=" by #{disc.artist.name}" /> - </s:fragment> - </f:facet> + + <tr:panelBox text="Disc" background="medium"> <tr:form id="disc"> <s:validateAll> <tr:panelFormLayout> <tr:inputText label="Disc" value="#{disc.name}" readOnly="#{not identity.loggedIn}" required="true" /> - <tr:inputNumberSpinbox label="Release Date" value="#{disc.release}" minimum="1900" maximum="2010" stepSize="1" readOnly="#{not identity.loggedIn}" /> + <tr:inputNumberSpinbox label="Release Date" value="#{disc.release}" minimum="1900" maximum="2100" stepSize="1" readOnly="#{not identity.loggedIn}" columns="4"/> <tr:selectOneChoice value="#{disc.artist}" label="Artist" required="true" readOnly="#{not identity.loggedIn}"> <s:selectItems value="#{allArtists.resultList}" var="artist" label="#{artist.name}" noSelectionLabel="Please Select..." hideNoSelectionLabel="true" /> <!--<s:convertEntity />--> @@ -31,7 +23,7 @@ </tr:selectOneChoice> <tr:panelLabelAndMessage label="Details"> <tr:inputText simple="true" value="#{disc.description}" rendered="#{identity.loggedIn}" rows="4" columns="60" id="description"> - <a:ajax event="keyup" render="description_preview" requestDelay="3000" ignoreDupResponces="true" eventsQueue="previewQueue" /> + <f:ajax event="keyup" render="description_preview" requestDelay="3000" ignoreDupResponces="true" eventsQueue="previewQueue" /> </tr:inputText> <s:div style="width: 300px;" id="description_preview"> <s:formattedText value="#{disc.description}" rendered="#{not empty disc.description}" /> @@ -48,7 +40,7 @@ <s:button action="cancel" value="Cancel" id="cancel"/> </tr:panelButtonBar> </tr:form> - </rich:panel> + </tr:panelBox> </ui:define> </ui:composition> Modified: branches/community/Seam_2_3/examples-ee6/seamdiscs/seamdiscs-web/src/main/webapp/discs.xhtml =================================================================== --- branches/community/Seam_2_3/examples-ee6/seamdiscs/seamdiscs-web/src/main/webapp/discs.xhtml 2012-08-21 17:32:44 UTC (rev 15063) +++ branches/community/Seam_2_3/examples-ee6/seamdiscs/seamdiscs-web/src/main/webapp/discs.xhtml 2012-08-22 13:47:21 UTC (rev 15064) @@ -5,14 +5,12 @@ xmlns:ui="http://java.sun.com/jsf/facelets" xmlns:f="http://java.sun.com/jsf/core" xmlns:h="http://java.sun.com/jsf/html" - xmlns:rich="http://richfaces.org/rich" xmlns:tr="http://myfaces.apache.org/trinidad" template="layout/template.xhtml"> <ui:define name="body"> - - <rich:panel id="discs"> - <f:facet name="header">Discs</f:facet> + + <tr:panelBox text="Discs" background="medium" id="discs"> <tr:form> <tr:table value="#{discs.dataModel}" var="disc" rows="#{discs.maxResults}"> <tr:column sortable="true" sortProperty="disc.name"> @@ -43,7 +41,7 @@ </s:button> </tr:panelButtonBar> </tr:form> - </rich:panel> + </tr:panelBox> </ui:define> </ui:composition> Modified: branches/community/Seam_2_3/examples-ee6/seamdiscs/seamdiscs-web/src/main/webapp/home.xhtml =================================================================== --- branches/community/Seam_2_3/examples-ee6/seamdiscs/seamdiscs-web/src/main/webapp/home.xhtml 2012-08-21 17:32:44 UTC (rev 15063) +++ branches/community/Seam_2_3/examples-ee6/seamdiscs/seamdiscs-web/src/main/webapp/home.xhtml 2012-08-22 13:47:21 UTC (rev 15064) @@ -5,14 +5,12 @@ xmlns:ui="http://java.sun.com/jsf/facelets" xmlns:f="http://java.sun.com/jsf/core" xmlns:h="http://java.sun.com/jsf/html" - xmlns:rich="http://richfaces.org/rich" xmlns:tr="http://myfaces.apache.org/trinidad" template="layout/template.xhtml"> <ui:define name="body"> - <rich:panel> - <f:facet name="header">Welcome to Seam Discs!</f:facet> + <tr:panelBox text="Welcome to Seam Discs!" background="medium"> <p>This application allows you to catalogue your favourite bands, and albums they've released. It uses:</p> @@ -28,12 +26,8 @@ the techniques used in creating this application.</p> <p>You can log in as <code>administrator</code>/<code>administrator</code>.</p> - </rich:panel> - <rich:panel> - <f:facet name="header"> - <tr:outputText value="Artists &amp; Discs" /> - </f:facet> - + </tr:panelBox> + <tr:panelBox text="Artists &amp; Discs" background="medium"> <tr:form> <tr:tree value="#{artistHome.tree}" var="var"> <f:facet name="nodeStamp"> @@ -51,8 +45,7 @@ </f:facet> </tr:tree> </tr:form> - - </rich:panel> + </tr:panelBox> </ui:define> </ui:composition> Modified: branches/community/Seam_2_3/examples-ee6/seamdiscs/seamdiscs-web/src/main/webapp/layout/footer.xhtml =================================================================== --- branches/community/Seam_2_3/examples-ee6/seamdiscs/seamdiscs-web/src/main/webapp/layout/footer.xhtml 2012-08-21 17:32:44 UTC (rev 15063) +++ branches/community/Seam_2_3/examples-ee6/seamdiscs/seamdiscs-web/src/main/webapp/layout/footer.xhtml 2012-08-22 13:47:21 UTC (rev 15064) @@ -1,424 +1,178 @@ <ui:composition xmlns="http://www.w3.org/1999/xhtml" - xmlns:s="http://jboss.org/schema/seam/taglib" xmlns:ui="http://java.sun.com/jsf/facelets" - xmlns:f="http://java.sun.com/jsf/core" xmlns:h="http://java.sun.com/jsf/html" - xmlns:rich="http://richfaces.org/rich" xmlns:tr="http://myfaces.apache.org/trinidad"> - <rich:popupPanel id="creating" width="450" height="250"> - <f:facet name="header"> - Creating SeamDiscs - </f:facet> - <f:facet name="controls"> - <a href="#" onclick="#{rich:component('creating')}.hide()">X</a> - </f:facet> - <p>This example was built using seam-gen. To add in Trinidad, the trinidad-api jar was added to - the ear (and referenced from <a href="#" onclick="#{rich:component('applicationxml')}.show()"> - <code>application.xml</code></a>) and the trinidad-impl jar, <code>jboss-seam-trinidad.jar</code> - (Seam-Trinidad integration) &amp; <code>a4j-trinidad.jar</code> (RichFaces Ajax-Trinidad integration) - were added to <code>WEB-INF/lib</code>.</p> - - <p>A few alterations were needed in <a href="#" onclick="#{rich:component('webxml')}.show()"> - <code>web.xml</code></a> and <a href="#" onclick="#{rich:component('facesconfigxml')}.show()"> - <code>faces-config.xml</code></a>.</p> - - <p>The <code>trinidad-config.xml</code> file was used to disable client-side validation for a - more consistent user experience.</p> - - <p>Of course Trinidad and RichFaces offer some complementary components (e.g. tables, trees) - - it's up to you which you choose!</p> - </rich:popupPanel> - - <rich:popupPanel id="webxml" width="450" height="500" left="50"> - <f:facet name="header"> - <code>web.xml</code> - </f:facet> - <f:facet name="controls"> - <a href="#" onclick="#{rich:component('webxml')}.hide()">X</a> - </f:facet> - <pre style="height: 420px;" class="source-code"><code> -&lt;context-param&gt; - &lt;param-name&gt; - org.apache.myfaces.trinidad.ALTERNATE_VIEW_HANDLER - &lt;/param-name&gt; - &lt;param-value&gt; - com.sun.facelets.FaceletViewHandler - &lt;/param-value&gt; -&lt;/context-param&gt; - -&lt;filter&gt; - &lt;filter-name&gt;Trinidad&lt;/filter-name&gt; - &lt;filter-class&gt; - org.apache.myfaces.trinidad.webapp.TrinidadFilter - &lt;/filter-class&gt; -&lt;/filter&gt; - -&lt;filter-mapping&gt; - &lt;filter-name&gt;Trinidad&lt;/filter-name&gt; - &lt;url-pattern&gt;*.seam&lt;/url-pattern&gt; -&lt;/filter-mapping&gt; - -&lt;servlet&gt; - &lt;servlet-name&gt;Trinidad Resources&lt;/servlet-name&gt; - &lt;servlet-class&gt; - org.apache.myfaces.trinidad.webapp.ResourceServlet - &lt;/servlet-class&gt; -&lt;/servlet&gt; - -&lt;servlet-mapping&gt; - &lt;servlet-name&gt;Trinidad Resources&lt;/servlet-name&gt; - &lt;url-pattern&gt;/adf/*&lt;/url-pattern&gt; -&lt;/servlet-mapping&gt;</code></pre> - </rich:popupPanel> - - <rich:popupPanel id="facesconfigxml" width="450" height="300" left="50"> - <f:facet name="header"> - <code>faces-config.xml</code> - </f:facet> - <f:facet name="controls"> - <a href="#" onclick="#{rich:component('facesconfigxml')}.hide()">X</a> - </f:facet> - <pre class="source-code"><code> -&lt;application&gt; - &lt;!-- Disabled when using RichFaces or Trinidad --&gt; - &lt;!-- - &lt;view-handler&gt; - com.sun.facelets.FaceletViewHandler - &lt;/view-handler&gt; - --&gt; - &lt;!-- Enable Trinidad renderkit --&gt; - &lt;default-render-kit-id&gt; - org.apache.myfaces.trinidad.core - &lt;/default-render-kit-id&gt; -&lt;/application&gt;</code></pre> - </rich:popupPanel> - - <rich:popupPanel id="applicationxml" width="450" height="200" left="50"> - <f:facet name="header"> - <code>application.xml</code> - </f:facet> - <f:facet name="controls"> - <a href="#" onclick="#{rich:component('applicationxml')}.hide()">X</a> - </f:facet> - <pre class="source-code"><code> -&lt;module&gt; - &lt;java&gt;trinidad-api-2.0.1.jar&lt;/java&gt; -&lt;/module&gt;</code></pre> - </rich:popupPanel> - - <rich:popupPanel id="ajax" width="450" height="370"> - <f:facet name="header"> - RichFaces Ajax and Trinidad - </f:facet> - <f:facet name="controls"> - <a href="#" onclick="#{rich:component('ajax')}.hide()">X</a> - </f:facet> - <p>Trinidad and RichFaces Ajax both provide partial page refresh and submit.</p> - <p> - If you want to use RichFaces' partial page refresh with Trinidad - components then you'll need to disable Trinidad's compressed style - keys: - </p> - <pre class="source-code"><code>&lt;context-param&gt; - &lt;param-name&gt; - org.apache.myfaces.trinidadinternal.DISABLE_CONTENT_COMPRESSION - &lt;/param-name&gt; - &lt;param-value&gt;true&lt;/param-value&gt; -&lt;/context-param&gt;</code></pre> - </rich:popupPanel> - - <rich:popupPanel id="inplace" width="450" height="300"> - <f:facet name="header"> - Inplace editing - </f:facet> - <f:facet name="controls"> - <a href="#" onclick="#{rich:component('inplace')}.hide()">X</a> - </f:facet> - <p>The example also shows how you can use Trinidad components to achieve "in-place" editing - the same views are used to display and edit - informtation. A casual visitor to the site navigates around, and see's the components in read only mode; once logged in, - these components are editable, and button's are rendered to submit information.</p> - - <pre class="source-code"><code> -&lt;tr:inputText - label=&quot;Artist&quot; - value=&quot;#<span>{artist.name}</span>&quot; - readOnly=&quot;#<span>{not identity.loggedIn}</span>&quot; - required=&quot;true&quot; - autoSubmit=&quot;true&quot;/&gt;</code></pre> - - <p>Trinidad makes it easy by providing a <code>readOnly</code> attribute for components - but you could easily achieve the - same using Seam's <code>&lt;s:decorate /&gt;</code> tag.</p> - </rich:popupPanel> - - <rich:popupPanel id="framework" width="450" height="250"> - <f:facet name="header"> - Seam Application Framework - </f:facet> - <f:facet name="controls"> - <a href="#" onclick="#{rich:component('framework')}.hide()">X</a> - </f:facet> - <p>The example uses the Seam Application Framework. Where possible XML is used, - using extension only where extra functionality is needed.</p> - - <p>An <a href="#" onclick="#{rich:component('componentsxml')}.show()"><code>EntityHome</code></a> - and is used for each CRUD, and an - <a href="#" onclick="#{rich:component('componentsxml')}.show()"><code>EntityQuery</code></a> - for clickable lists.</p> - - <p>If you extend <code>EntityHome</code> you can make the component an - EJB3 stateful session bean by adding <code>@Stateful</code> and a local - interface. You'll need to declare methods like <code>persist()</code> - and <code>isManaged()</code> from <code>EntityHome</code> on the - interface. The <code>ArtistHome</code> is a stateful session bean in - this example.</p> - - <p>Each item in the list can be clicked - an <code>&lt;s:link /&gt;</code> and an - <code>&lt;f:param /&gt;</code> is used to <a href="#" onclick="#{rich:component('clickablelist')}.show()">link</a> - to the detail view. It's wired using <a href="#" onclick="#{rich:component('clickablelist')}.show()"><code>pages.xml</code></a>. - </p> - - <p>The CRUD page uses the <code>EntityHome</code> object to <a href="#" onclick="#{rich:component('crud')}.show()">create, update or - delete</a> the entity as necessary. <a href="#" onclick="#{rich:component('crud')}.show()"><code>pages.xml</code></a> - is used to direct the user back to the list view.</p> - </rich:popupPanel> - - <rich:popupPanel id="clickablelist" width="450" height="350" left="50"> - <f:facet name="header"> - <code>Clickable lists</code> - </f:facet> - <f:facet name="controls"> - <a href="#" onclick="#{rich:component('clickablelist')}.hide()">X</a> - </f:facet> - <pre class="source-code"><code> -&lt;s:link action=&quot;artist&quot;&gt; - &lt;tr:outputText value=&quot;#<span>{artist.name}</span>&quot; /&gt; - &lt;f:param name=&quot;artistId&quot; value=&quot;#<span>{artist.id}</span>&quot; /&gt; -&lt;/s:link&gt;</code></pre> - <pre class="source-code"><code> -&lt;page&gt; - &lt;param name=&quot;artistId&quot; value=&quot;#<span>{artistHome.id}</span>&quot; - converterId=&quot;javax.faces.Integer&quot;/&gt; - &lt;navigation&gt; - &lt;rule if-outcome=&quot;artist&quot;&gt; - &lt;begin-conversation flush-mode=&quot;manual&quot;/&gt; - &lt;redirect view-id=&quot;/artist.xhtml&quot;/&gt; - &lt;/rule&gt; - &lt;/navigation&gt; -&lt;/page&gt;</code></pre> - </rich:popupPanel> - - <rich:popupPanel id="componentsxml" width="450" height="330" left="50"> - <f:facet name="header"> - <code>components.xml</code> - </f:facet> - <f:facet name="controls"> - <a href="#" onclick="#{rich:component('componentsxml')}.hide()">X</a> - </f:facet> - - <pre class="source-code"><code> -&lt;framework:entity-home - entity-class=&quot;org.jboss.seam.example.seamdiscs.model.Disc&quot; - name=&quot;discHome&quot;/&gt; -&lt;factory - name=&quot;disc&quot; - value=&quot;#<span>{discHome.instance}</span>&quot;/&gt;</code></pre> + <script type="text/javascript"> + //<![CDATA[ + var ID; - <pre class="source-code"><code> -&lt;framework:entity-query - name=&quot;discs&quot; - ejbql=&quot;select disc from Disc disc&quot; - order=&quot;disc.name ASC&quot; - max-results=&quot;5&quot;/&gt;</code></pre> - - </rich:popupPanel> - - <rich:popupPanel id="crud" width="450" height="480" left="50"> - <f:facet name="header"> - <code>CRUD</code> - </f:facet> - <f:facet name="controls"> - <a href="#" onclick="#{rich:component('crud')}.hide()">X</a> - </f:facet> - - <pre class="source-code"><code> -&lt;h:commandButton action=&quot;#<span>{artistHome.update}</span>&quot; - value=&quot;Save&quot; rendered=&quot;#<span>{artistHome.managed}</span>&quot; /&gt; -&lt;h:commandButton action=&quot;#<span>{artistHome.persist}</span>&quot; - value=&quot;Save&quot; rendered=&quot;#<span>{not artistHome.managed}</span>&quot; /&gt; -&lt;s:button action=&quot;cancel&quot; value=&quot;Cancel&quot; /&gt;</code></pre> + function popup(id){ + $("#opaque").toggle(); + $("#" + id).toggle(); + ID = id; + } - <pre class="source-code"><code> -&lt;page&gt; - &lt;param name=&quot;artistId&quot; value=&quot;#<span>{artistHome.id}</span>&quot; - converterId=&quot;javax.faces.Integer&quot;/&gt; - &lt;navigation&gt; - &lt;rule if-outcome=&quot;cancel&quot;&gt; - &lt;end-conversation/&gt; - &lt;redirect view-id=&quot;/artists.xhtml&quot; /&gt; - &lt;/rule&gt; - &lt;rule if-outcome=&quot;updated&quot;&gt; - &lt;end-conversation/&gt; - &lt;redirect view-id=&quot;/artists.xhtml&quot; /&gt; - &lt;/rule&gt; - &lt;rule if-outcome=&quot;persisted&quot;&gt; - &lt;end-conversation/&gt; - &lt;redirect view-id=&quot;/artists.xhtml&quot; /&gt; - &lt;/rule&gt; - &lt;/navigation&gt; -&lt;/page&gt;</code></pre> - </rich:popupPanel> - - <rich:popupPanel id="tree" width="450" height="250"> - <f:facet name="header"> - Using Trinidad's Tree - </f:facet> - <f:facet name="controls"> - <a href="#" onclick="#{rich:component('tree')}.hide()">X</a> - </f:facet> - <p>It's been said that the quality of a tree component is an indication of - the quality of a component set. Trinidad has a really robust tree component, - - but it's <code>TreeModel</code> can be a bit confusing. Luckily it provides - a good default implementation - the <code>ChildPropertyTreeModel</code>.</p> - - <p>The <code>ChildPropertyTreeModel</code> takes two parameters - the <code>Collection</code> - to use for the tree's nodes, and a <code>String</code> property which specifies - the field or get/set pair to use for accessing each elements child. If the property - returns <code>null</code>, then the node is a leaf-node.</p> - - <p>The example uses a slightly modified - <a href="#" onclick="#{rich:component('treecode')}.show()"><code>ChildPropertyTreeModel</code></a> - - one that says discs are the leaves of the tree. - <a href="#" onclick="#{rich:component('treecode')}.show()">Different labels</a> are - rendered depending on the type of node. - </p> - - </rich:popupPanel> + $(document).ready(function() { + $(".closeButton").append('[<a href="#" onclick="popup(ID)">close</a>]'); + }); + //]]> + </script> - <rich:popupPanel id="treecode" width="450" height="500" left="50"> - <f:facet name="header"> - <code>Tree</code> - </f:facet> - <f:facet name="controls"> - <a href="#" onclick="#{rich:component('treecode')}.hide()">X</a> - </f:facet> - - <pre class="source-code"><code> -public TreeModel getTree() { - return new ChildPropertyTreeModel(artists, &quot;discs&quot;) { - protected Object getChildData(Object parentData) { - if (parentData instanceof Artist) { - return super.getChildData(parentData); - } else { - return null; - } - } - }; -}</code></pre> - - <pre class="source-code"><code> -&lt;tr:tree value=&quot;#<span>{artistHome.tree}</span>&quot; var=&quot;var&quot;&gt; - &lt;f:facet name=&quot;nodeStamp&quot;&gt; - &lt;ui:fragment&gt; - &lt;s:link - action=&quot;artist&quot; - rendered=&quot;#<span>{var.class.simpleName eq 'Artist' - or var.class.simpleName eq 'Band'}</span>&quot;&gt; - &lt;tr:outputText value=&quot;#<span>{var.name}</span>&quot; /&gt; - &lt;f:param name=&quot;artistId&quot; value=&quot;#<span>{var.id}</span>&quot; /&gt; - &lt;/s:link&gt; - &lt;/ui:fragment&gt; - &lt;/f:facet&gt; -&lt;/tr:tree&gt;</code></pre> - - </rich:popupPanel> - - <rich:popupPanel id="skinning" width="450" height="180"> - <f:facet name="header"> - Look and Feel - </f:facet> - <f:facet name="controls"> - <a href="#" onclick="#{rich:component('skinning')}.hide()">X</a> - </f:facet> - <p>Both Trinidad and RichFaces have powerful and mature skinning/theming APIs - - so you all you need to do is write some CSS! For seamdiscs, we took a RichFaces - skin, and adjusted the trinidad skin to fit with it. To do this, we added - the skin to <code>trinidad-skins.xml</code>, and told Trinidad to use it in - <code>trinidad-config.xml</code>. You can find more information about Trinidad - skinning on the Trinidad wiki.</p> - <p>You'll notice that Trinidad and RichFaces components don't provide - a consistent look-and-feel out of the box - there are plans afoot to improve this!</p> - </rich:popupPanel> - - <rich:popupPanel id="datamodel" width="450" height="500"> - <f:facet name="header"> - Enhanced <code>DataModel</code> - </f:facet> - <f:facet name="controls"> - <a href="#" onclick="#{rich:component('datamodel')}.hide()">X</a> - </f:facet> - <p>JSF component sets like Trinidad, Tomahawk and IceFaces give you an enhanced - <code>h:dataTable</code> which has built-in sorting, paging and other goodies. - However, there is one big flaw - the entire data set is loaded and sorted/paged - in memory, when really you want to get your persistence layer (be it an ORM or - just a database) to do this for - a sort translates naturally to an <code>ORDER BY</code>, - and paging translates naturally to a <code>LIMIT</code> clauses.</p> + <div id="opaque" onclick="popup(ID)"></div> - <p>Seam on the other hand provides tight integration to your persistence layer, - and supports paging and sorting of queries through the <code>Query</code> - object in the Seam Application Framework - but you have to write a load more JSF - to get it integrated. We can get the best of both worlds by using the enhanced - <code>DataModel</code> in Trinidad, which supports paging and sorting backed by - a <code>Query</code>.</p> + <div id="footer"> + <div class="left"> + <h:outputText value="Powered by "/><a href="http://www.seamframework.org">Seam</a> - <p>The <code>jboss-seam-trinidad.jar</code> (built using the build file in the - <code>trinidad</code> directory in Seam CVS) provides a <code>DataModel</code> - which, when backed by a <code>Query</code>, provides lazy loading of data for - paging, sorting in the persistence context and strong row keys. You can use - it by adding the <code>jboss-seam-trinidad.jar</code> to your <code>WEB-INF/lib</code> - - no need to alter your facelet. One caveat is that you must ensure the rows property - on the <code>Query</code> is the same as the <code>maxResults</code> property on - the <code>Query</code>. Take a look at the seamdiscs example in the - <code>trinidad/examples</code> directory to see it in action.</p> - <pre class="source-code"><code> -&lt;tr:table - value=&quot;#<span>{discs.dataModel}</span>&quot; - rows=&quot;#<span>{discs.maxResults}</span>&quot;&gt; + <span class="separator">&#8226;</span> + <a onclick="popup('creating')" href="#">Creating Seamdiscs</a> + + <span class="separator">&#8226;</span> + <a onclick="popup('inplace')" href="#">Inplace editing</a> + + <span class="separator">&#8226;</span> + <a onclick="popup('framework')" href="#">Seam Application Framework</a> + + <span class="separator">&#8226;</span> + <a onclick="popup('tree')" href="#">Using Trinidad's Tree</a> + + <span class="separator">&#8226;</span> + <a onclick="popup('skinning')" href="#">Look and Feel</a> + + <span class="separator">&#8226;</span> + <a onclick="popup('datamodel')" href="#">Enhanced DataModel</a> + </div> + <div class="right"> + <h:outputText value="Generated by seam-gen"/> + </div> + </div> + + <div class="popupContainer"> + <tr:panelBox background="medium" text="Creating Seamdiscs" styleClass="popup" id="creating"> + <p>This example was built using seam-gen. To add in Trinidad, the trinidad-api jar was added to + the ear (and referenced from <code>application.xml</code>) and the trinidad-impl jar, + <code>jboss-seam-trinidad.jar</code> (Seam-Trinidad integration) &amp; <code>a4j-trinidad.jar</code> + (RichFaces Ajax-Trinidad integration) were added to <code>WEB-INF/lib</code>.</p> + + <p>A few alterations were needed in <code>web.xml</code> and <code>faces-config.xml</code>.</p> + + <p>The <code>trinidad-config.xml</code> file was used to disable client-side validation for a + more consistent user experience.</p> + + <p>Of course Trinidad and RichFaces offer some complementary components (e.g. tables, trees) + - it's up to you which you choose!</p> + + <div class="closeButton"></div> + </tr:panelBox> + + <tr:panelBox background="medium" text="Inplace editing" styleClass="popup" id="inplace"> + <p>The example also shows how you can use Trinidad components to achieve "in-place" editing - the same views are used to display and edit + informtation. A casual visitor to the site navigates around, and see's the components in read only mode; once logged in, + these components are editable, and button's are rendered to submit information.</p> + + <pre class="source-code"><code>&lt;tr:inputText label=&quot;Artist&quot; + value=&quot;#<span>{artist.name}</span>&quot; + readOnly=&quot;#<span>{not identity.loggedIn}</span>&quot; + required=&quot;true&quot; + autoSubmit=&quot;true&quot;/&gt;</code></pre> + + <p>Trinidad makes it easy by providing a <code>readOnly</code> attribute for components - but you could easily achieve the + same using Seam's <code>&lt;s:decorate /&gt;</code> tag.</p> + + <div class="closeButton"></div> + </tr:panelBox> + + <tr:panelBox background="medium" text="Seam Application Framework" styleClass="popup" id="framework"> + <p>The example uses the Seam Application Framework. Where possible XML is used, + using extension only where extra functionality is needed.</p> + + <p>An <code>EntityHome</code> and is used for each CRUD, and an <code>EntityQuery</code> + for clickable lists.</p> + + <p>If you extend <code>EntityHome</code> you can make the component an + EJB3 stateful session bean by adding <code>@Stateful</code> and a local + interface. You'll need to declare methods like <code>persist()</code> + and <code>isManaged()</code> from <code>EntityHome</code> on the + interface. The <code>ArtistHome</code> is a stateful session bean in + this example.</p> + + <p>Each item in the list can be clicked - an <code>&lt;s:link /&gt;</code> and an + <code>&lt;f:param /&gt;</code> is used to link to the detail view. + It's wired using <code>pages.xml</code>. + </p> + + <p>The CRUD page uses the <code>EntityHome</code> object to create, update or + delete the entity as necessary. <code>pages.xml</code> + is used to direct the user back to the list view.</p> + + <div class="closeButton"></div> + </tr:panelBox> + + <tr:panelBox background="medium" text="Using Trinidad's Tree" styleClass="popup" id="tree"> + <p>It's been said that the quality of a tree component is an indication of + the quality of a component set. Trinidad has a really robust tree component, + - but it's <code>TreeModel</code> can be a bit confusing. Luckily it provides + a good default implementation - the <code>ChildPropertyTreeModel</code>.</p> + + <p>The <code>ChildPropertyTreeModel</code> takes two parameters - the <code>Collection</code> + to use for the tree's nodes, and a <code>String</code> property which specifies + the field or get/set pair to use for accessing each elements child. If the property + returns <code>null</code>, then the node is a leaf-node.</p> + + <p>The example uses a slightly modified <code>ChildPropertyTreeModel</code> + - one that says discs are the leaves of the tree. Different labels are + rendered depending on the type of node. + </p> + + <div class="closeButton"></div> + </tr:panelBox> + + <tr:panelBox background="medium" text="Look and Feel" styleClass="popup" id="skinning"> + <p>Both Trinidad and RichFaces have powerful and mature skinning/theming APIs + - so you all you need to do is write some CSS! For seamdiscs, we took a RichFaces + skin, and adjusted the trinidad skin to fit with it. To do this, we added + the skin to <code>trinidad-skins.xml</code>, and told Trinidad to use it in + <code>trinidad-config.xml</code>. You can find more information about Trinidad + skinning on the Trinidad wiki.</p> + <p>You'll notice that Trinidad and RichFaces components don't provide + a consistent look-and-feel out of the box - there are plans afoot to improve this!</p> + + <div class="closeButton"></div> + </tr:panelBox> + + <tr:panelBox background="medium" text="Enhanced DataModel" styleClass="popup" id="datamodel"> + <p>JSF component sets like Trinidad, Tomahawk and IceFaces give you an enhanced + <code>h:dataTable</code> which has built-in sorting, paging and other goodies. + However, there is one big flaw - the entire data set is loaded and sorted/paged + in memory, when really you want to get your persistence layer (be it an ORM or + just a database) to do this for - a sort translates naturally to an <code>ORDER BY</code>, + and paging translates naturally to a <code>LIMIT</code> clauses.</p> + + <p>Seam on the other hand provides tight integration to your persistence layer, + and supports paging and sorting of queries through the <code>Query</code> + object in the Seam Application Framework - but you have to write a load more JSF + to get it integrated. We can get the best of both worlds by using the enhanced + <code>DataModel</code> in Trinidad, which supports paging and sorting backed by + a <code>Query</code>.</p> + + <p>The <code>jboss-seam-trinidad.jar</code> (built using the build file in the + <code>trinidad</code> directory in Seam CVS) provides a <code>DataModel</code> + which, when backed by a <code>Query</code>, provides lazy loading of data for + paging, sorting in the persistence context and strong row keys. You can use + it by adding the <code>jboss-seam-trinidad.jar</code> to your <code>WEB-INF/lib</code> + - no need to alter your facelet. One caveat is that you must ensure the rows property + on the <code>Query</code> is the same as the <code>maxResults</code> property on + the <code>Query</code>. Take a look at the seamdiscs example in the + <code>trinidad/examples</code> directory to see it in action.</p> + <pre class="source-code"><code> +&lt;tr:table value=&quot;#<span>{discs.dataModel}</span>&quot; rows=&quot;#<span>{discs.maxResults}</span>&quot;&gt; &lt;tr:column&gt; - ... + ... &lt;/tr:column &lt;/tr:table&gt;</code></pre> - </rich:popupPanel> - <rich:toolbar itemSeparator="square"> - <rich:toolbarGroup> - Powered by <a href="http://labs.jboss.com/jbossseam">Seam</a> - </rich:toolbarGroup> - <rich:toolbarGroup itemSeparator="square"> - <s:fragment> - <a href="#" onclick="#{rich:component('creating')}.show()">Creating SeamDiscs</a> - </s:fragment> - <s:fragment> - <a href="#" onclick="#{rich:component('ajax')}.show()">RichFaces Ajax and Trinidad</a> - </s:fragment> - <s:fragment> - <a href="#" onclick="#{rich:component('inplace')}.show()">Inplace Editing</a> - </s:fragment> - <s:fragment> - <a href="#" onclick="#{rich:component('framework')}.show()">Seam Application Framework</a> - </s:fragment> - <s:fragment> - <a href="#" onclick="#{rich:component('skinning')}.show()">Look and Feel</a> - </s:fragment> - <s:fragment> - <a href="#" onclick="#{rich:component('datamodel')}.show()">Enhanced DataModel</a> - </s:fragment> - <s:fragment> - <a href="#" onclick="#{rich:component('tree')}.show()">Tree Component</a> - </s:fragment> - </rich:toolbarGroup> - <rich:toolbarGroup location="right"> - Generated by seam-gen. - </rich:toolbarGroup> - </rich:toolbar> -</ui:composition> \ No newline at end of file + <div class="closeButton"></div> + </tr:panelBox> + </div> +</ui:composition> Modified: branches/community/Seam_2_3/examples-ee6/seamdiscs/seamdiscs-web/src/main/webapp/layout/menu.xhtml =================================================================== --- branches/community/Seam_2_3/examples-ee6/seamdiscs/seamdiscs-web/src/main/webapp/layout/menu.xhtml 2012-08-21 17:32:44 UTC (rev 15063) +++ branches/community/Seam_2_3/examples-ee6/seamdiscs/seamdiscs-web/src/main/webapp/layout/menu.xhtml 2012-08-22 13:47:21 UTC (rev 15064) @@ -1,20 +1,22 @@ -<rich:toolbar - xmlns="http://www.w3.org/1999/xhtml" - xmlns:ui="http://java.sun.com/jsf/facelets" - xmlns:h="http://java.sun.com/jsf/html" - xmlns:f="http://java.sun.com/jsf/core" - xmlns:s="http://jboss.org/schema/seam/taglib" - xmlns:rich="http://richfaces.org/rich" - itemSeparator="line"> - <rich:toolbarGroup> +<ui:composition + xmlns="http://www.w3.org/1999/xhtml" + xmlns:ui="http://java.sun.com/jsf/facelets" + xmlns:h="http://java.sun.com/jsf/html" + xmlns:f="http://java.sun.com/jsf/core" + xmlns:s="http://jboss.org/schema/seam/taglib"> + + <div id="navigation"> + <div class="left"> <h:outputText value="#{projectName}:"/> <s:link view="/home.xhtml" value="Home" propagation="none"/> <s:link view="/artists.xhtml" id="manageArtists" value="Artists" propagation="none"/> <s:link view="/discs.xhtml" id="manageDiscs" value="Discs" propagation="none"/> - </rich:toolbarGroup> - <rich:toolbarGroup location="right"> + </div> + <div class="right"> <h:outputText value="Welcome, #{identity.username}" rendered="#{identity.loggedIn}"/> <s:link view="/login.xhtml" id="loginlink" value="Login" rendered="#{not identity.loggedIn}"/> - <s:link view="/home.xhtml" id="logout" action="#{identity.logout}" value="Logout" rendered="#{identity.loggedIn}"/> - </rich:toolbarGroup> -</rich:toolbar> + <s:link view="/home.xhtml" id="logout" action="#{identity.logout}" value="Logout" + rendered="#{identity.loggedIn}"/> + </div> + </div> +</ui:composition> Modified: branches/community/Seam_2_3/examples-ee6/seamdiscs/seamdiscs-web/src/main/webapp/layout/template.xhtml =================================================================== --- branches/community/Seam_2_3/examples-ee6/seamdiscs/seamdiscs-web/src/main/webapp/layout/template.xhtml 2012-08-21 17:32:44 UTC (rev 15063) +++ branches/community/Seam_2_3/examples-ee6/seamdiscs/seamdiscs-web/src/main/webapp/layout/template.xhtml 2012-08-22 13:47:21 UTC (rev 15064) @@ -6,13 +6,13 @@ xmlns:f="http://java.sun.com/jsf/core" xmlns:s="http://jboss.org/schema/seam/taglib" xmlns:trh="http://myfaces.apache.org/trinidad/html" - xmlns:tr="http://myfaces.apache.org/trinidad" - xmlns:rich="http://richfaces.org/rich"> + xmlns:tr="http://myfaces.apache.org/trinidad"> <h:head> <meta http-equiv="Content-Type" content="text/html; charset=UTF-8" /> <title>SeamDiscs</title> <link href="stylesheet/theme.css" rel="stylesheet" type="text/css" /> <trh:styleSheet /> + <script type="text/javascript" src="//ajax.googleapis.com/ajax/libs/jquery/1.8.0/jquery.min.js"... </h:head> <body> Modified: branches/community/Seam_2_3/examples-ee6/seamdiscs/seamdiscs-web/src/main/webapp/login.xhtml =================================================================== --- branches/community/Seam_2_3/examples-ee6/seamdiscs/seamdiscs-web/src/main/webapp/login.xhtml 2012-08-21 17:32:44 UTC (rev 15063) +++ branches/community/Seam_2_3/examples-ee6/seamdiscs/seamdiscs-web/src/main/webapp/login.xhtml 2012-08-22 13:47:21 UTC (rev 15064) @@ -5,16 +5,14 @@ xmlns:ui="http://java.sun.com/jsf/facelets" xmlns:f="http://java.sun.com/jsf/core" xmlns:h="http://java.sun.com/jsf/html" - xmlns:rich="http://richfaces.org/rich" + xmlns:tr="http://myfaces.apache.org/trinidad" template="layout/template.xhtml"> <ui:define name="body"> <h:form id="login"> - - <rich:panel> - <f:facet name="header">Login</f:facet> - + + <tr:panelBox text="Login" background="medium"> <p>You can log in as administrator/administrator</p> <div class="dialog"> @@ -31,7 +29,7 @@ </h:panelGrid> </div> - </rich:panel> + </tr:panelBox> <div class="actionButtons"> <h:commandButton value="Login" id="loginbutton" action="#{identity.login}"/> Modified: branches/community/Seam_2_3/examples-ee6/seamdiscs/seamdiscs-web/src/main/webapp/stylesheet/skin.css =================================================================== --- branches/community/Seam_2_3/examples-ee6/seamdiscs/seamdiscs-web/src/main/webapp/stylesheet/skin.css 2012-08-21 17:32:44 UTC (rev 15063) +++ branches/community/Seam_2_3/examples-ee6/seamdiscs/seamdiscs-web/src/main/webapp/stylesheet/skin.css 2012-08-22 13:47:21 UTC (rev 15064) @@ -1,7 +1,15 @@ -af|column::header-text {color: white} -af|showDetailHeader::level-one {color: grey} -.AFDarkForeground:alias {color: grey} +af|column::header-text { + color: white +} +af|showDetailHeader::level-one { + color: grey +} + +.AFDarkForeground:alias { + color: grey +} + .source-code { font-family: Andale Mono, Lucida Console, Monaco, fixed, monospace; color: #000000; @@ -11,5 +19,25 @@ line-height: 14px; padding: 5px; overflow: auto; - width: 420px; + width: 580px; +} + +af|panelBox::body { + font-size: 11px; + width: 100%; +} + +af|panelBox::header { + background-color: #BED6F8; + color: black; + font-weight: bold; + padding: 5px 10px; +} + +af|panelBox::content { + background-color: white; + border-width: 1px; + border-color: #BED6F8; + border-style: solid; + padding: 10px; } \ No newline at end of file Modified: branches/community/Seam_2_3/examples-ee6/seamdiscs/seamdiscs-web/src/main/webapp/stylesheet/theme.css =================================================================== --- branches/community/Seam_2_3/examples-ee6/seamdiscs/seamdiscs-web/src/main/webapp/stylesheet/theme.css 2012-08-21 17:32:44 UTC (rev 15063) +++ branches/community/Seam_2_3/examples-ee6/seamdiscs/seamdiscs-web/src/main/webapp/stylesheet/theme.css 2012-08-22 13:47:21 UTC (rev 15064) @@ -1,289 +1,409 @@ a:active, a:link, a:visited { - color: #0D5798; + color: #0D5798; } + a:hover { - color: #8CAFCD; + color: #8CAFCD; } input, textarea { - border: 1px solid #BBBBBB; - font-size: 10px; - background: #F0F8FF; - color: black; + border: 1px solid #BBBBBB; + font-size: 10px; + background: #F0F8FF; + color: black; } input[type='submit'], input[type='button'] { - background: #4477AA; - color: white; - margin: 5px; - border-color: gray; + background: #4477AA; + color: white; + margin: 5px; + border-color: gray; } .tableControl, .actionButtons { - width: 100%; + width: 100%; } .tableControl { - text-align: right; + text-align: right; } .footer { - text-align: center; - font-size: 10px; + text-align: center; + font-size: 10px; } .rich-table { - width:100%; + width: 100%; } h1 { - font-family: Arial,sans-serif; - color: #578BB8; - font-size: 1.6em; - margin-top: 0; + font-family: Arial, sans-serif; + color: #578BB8; + font-size: 1.6em; + margin-top: 0; } body { - margin: 0px; - font-family: Arial,sans-serif; - color: #616161; + margin: 0px; + font-family: Arial, sans-serif; + color: #616161; } .body { - padding: 30px; + padding: 30px; } -.columnHeader:hover -{ - color: #FF6600; +.columnHeader:hover { + color: #FF6600; } .message { - border: 1px solid #FFCC00; - padding: 5px; - margin-top: 5px; - margin-bottom: 5px; - background-color: #F0F8FF; - font-size: 12px; + border: 1px solid #FFCC00; + padding: 5px; + margin-top: 5px; + margin-bottom: 5px; + background-color: #F0F8FF; + font-size: 12px; } .name { - vertical-align: top; - font-weight: bold; - width: 115px; - float: left; - padding: 5px; - margin-top: 3px; - clear: left; + vertical-align: top; + font-weight: bold; + width: 115px; + float: left; + padding: 5px; + margin-top: 3px; + clear: left; } + .value { - float: left; - padding: 5px; + float: left; + padding: 5px; } + .error { - margin-left: 20px; - margin-top: 5px; - float: left; - padding: 5px; - border: 1px solid red; + margin-left: 20px; + margin-top: 5px; + float: left; + padding: 5px; + border: 1px solid red; } .errors { - color: red; + color: red; } + .errors input { - border: 1px solid red; + border: 1px solid red; } + .errors textarea { - border: 1px solid red; + border: 1px solid red; } + .required { - color: red; - padding-left: 2px; + color: red; + padding-left: 2px; } /* date picker style */ -div.seam-date -{ - margin-top: 5px; - border: 1px solid #AAAAAA; - background-color: #FFFFFF; - color: #505050; - font-family: Tahoma, Arial, Helvetica, sans-serif; - font-size: 12px; +div.seam-date { + margin-top: 5px; + border: 1px solid #AAAAAA; + background-color: #FFFFFF; + color: #505050; + font-family: Tahoma, Arial, Helvetica, sans-serif; + font-size: 12px; } table.seam-date td { - font-family: Tahoma, Arial, Helvetica, sans-serif; - font-weight: 12px; + font-family: Tahoma, Arial, Helvetica, sans-serif; + font-weight: 12px; } -.seam-date-monthNames -{ - width: 70px; - border: 1px solid #dddddd; - border-right: 3px solid #444444; - border-bottom: 3px solid #444444; - background-color: #ffffff; - font-size: 12px; - cursor: pointer; - font-family: Tahoma, Arial, Helvetica, sans-serif; - font-weight: normal; +.seam-date-monthNames { + width: 70px; + border: 1px solid #dddddd; + border-right: 3px solid #444444; + border-bottom: 3px solid #444444; + background-color: #ffffff; + font-size: 12px; + cursor: pointer; + font-family: Tahoma, Arial, Helvetica, sans-serif; + font-weight: normal; } -a.seam-date-monthNameLink, a.seam-date-monthNameLink:visited -{ - text-align: center; - display: block; - color: #555555; +a.seam-date-monthNameLink, a.seam-date-monthNameLink:visited { + text-align: center; + display: block; + color: #555555; } -a.seam-date-monthNameLink:hover -{ - background-color: #CCCCCC; - color: red; +a.seam-date-monthNameLink:hover { + background-color: #CCCCCC; + color: red; } -.seam-date-years -{ - height: 10em; - overflow: auto; - width: 60px; - border: 1px solid #dddddd; - border-right: 3px solid #444444; - border-bottom: 3px solid #444444; - background-color: #ffffff; - font-size: 12px; - cursor: pointer; - font-family: Tahoma, Arial, Helvetica, sans-serif; - font-weight: normal; +.seam-date-years { + height: 10em; + overflow: auto; + width: 60px; + border: 1px solid #dddddd; + border-right: 3px solid #444444; + border-bottom: 3px solid #444444; + background-color: #ffffff; + font-size: 12px; + cursor: pointer; + font-family: Tahoma, Arial, Helvetica, sans-serif; + font-weight: normal; } -a.seam-date-yearLink, a.seam-date-yearLink:visited -{ - text-align: center; - display: block; - color: #555555; +a.seam-date-yearLink, a.seam-date-yearLink:visited { + text-align: center; + display: block; + color: #555555; } -a.seam-date-yearLink:hover -{ - background-color: #CCCCCC; - color: red; -} +a.seam-date-yearLink:hover { + background-color: #CCCCCC; + color: red; +} -tr.seam-date-header -{ - padding: 2px 0px 2px 0px; +tr.seam-date-header { + padding: 2px 0px 2px 0px; } - -td.seam-date-header -{ - padding: 0px 8px 0px 8px; - text-align: center; - color: gray; - font-family: Tahoma, Arial, Helvetica, sans-serif; - font-weight: bold; - font-size: 12px; + +td.seam-date-header { + padding: 0px 8px 0px 8px; + text-align: center; + color: gray; + font-family: Tahoma, Arial, Helvetica, sans-serif; + font-weight: bold; + font-size: 12px; } -td.seam-date-header-prevMonth -{ - background-image: url("../img/cal-prev.png"); - background-repeat: no-repeat; - background-position: center; - padding: 0px 2px 0px 2px; - width: 17px; - height: 16px; - margin-left: 2px; +td.seam-date-header-prevMonth { + background-image: url("../img/cal-prev.png"); + background-repeat: no-repeat; + background-position: center; + padding: 0px 2px 0px 2px; + width: 17px; + height: 16px; + margin-left: 2px; } -td.seam-date-header-nextMonth -{ - background-image: url("../img/cal-next.png"); - background-repeat: no-repeat; - background-position: center; - padding: 0px 2px 0px 2px; - width: 17px; - height: 16px; - margin-right: 2px; +td.seam-date-header-nextMonth { + background-image: url("../img/cal-next.png"); + background-repeat: no-repeat; + background-position: center; + padding: 0px 2px 0px 2px; + width: 17px; + height: 16px; + margin-right: 2px; } -tr.seam-date-headerDays -{ - color: white; - font-weight: normal; +tr.seam-date-headerDays { + color: white; + font-weight: normal; } -tr.seam-date-headerDays > td -{ - background-color: #CCCCCC; - border: 1px solid #AAAAAA; - color: white; - text-align: center; - width: 26px; +tr.seam-date-headerDays > td { + background-color: #CCCCCC; + border: 1px solid #AAAAAA; + color: white; + text-align: center; + width: 26px; } -tr.seam-date-footer -{ - background-color: white; - color: #505050; - font-weight: bold; +tr.seam-date-footer { + background-color: white; + color: #505050; + font-weight: bold; } -tr.seam-date-footer > td -{ - text-align: center; +tr.seam-date-footer > td { + text-align: center; } -td.seam-date-inMonth -{ - background-color: white; - color: black; - font-weight: normal; - cursor: pointer; - border: 1px solid #ece9d8; +td.seam-date-inMonth { + background-color: white; + color: black; + font-weight: normal; + cursor: pointer; + border: 1px solid #ece9d8; } -td.seam-date-outMonth -{ - background-color: white; - color: #999999; - font-weight: normal; - cursor: pointer; - border: 1px solid #ece9d8; +td.seam-date-outMonth { + background-color: white; + color: #999999; + font-weight: normal; + cursor: pointer; + border: 1px solid #ece9d8; } -td.seam-date-selected -{ - background-color: #CCCCCC; - border: 1px solid #AAAAAA; - color: black; - font-weight: normal; +td.seam-date-selected { + background-color: #CCCCCC; + border: 1px solid #AAAAAA; + color: black; + font-weight: normal; } -td.seam-date-dayOff-inMonth -{ - background-color: #efefef; - color: black; - font-weight: normal; - cursor: pointer; - border: 1px solid #ece9d8; +td.seam-date-dayOff-inMonth { + background-color: #efefef; + color: black; + font-weight: normal; + cursor: pointer; + border: 1px solid #ece9d8; } -td.seam-date-dayOff-outMonth -{ - background-color: #efefef; - color: #999999; - font-weight: normal; - cursor: pointer; - border: 1px solid #ece9d8; +td.seam-date-dayOff-outMonth { + background-color: #efefef; + color: #999999; + font-weight: normal; + cursor: pointer; + border: 1px solid #ece9d8; } -td.seam-date-hover -{ - background-color: #CCCCCC; - border: 1px solid #AAAAAA; - cursor: pointer; - color: red; +td.seam-date-hover { + background-color: #CCCCCC; + border: 1px solid #AAAAAA; + cursor: pointer; + color: red; +} + +#navigation, #footer { + font-size: 11px; + color: black; + font-weight: bold; + left: 0px; + right: 0px; + background-color: #BED6F8; + padding: 5px; + overflow: auto; +} + +#navigation a { + padding-left: 5px; +} + +.left { + float: left; +} + +.right { + float: right; +} + +.separator { + padding-left: 10px; + padding-right: 10px; +} + +input, select, textarea, button, keygen, isindex, legend, a { + font-size: 11px; + font-family: Arial, Verdana, sans-serif; + color: #000000; +} + +fieldset { + border-width: 1px; + border-style: solid; + padding: 10px; + border-color: #BED6F8; +} + +hr { + border-width: 1px; + border-style: solid; + border-color: #BED6F8; +} + +a { + color: #0078D0; +} + +a:hover { + color: #0090FF; +} + +a:visited { + color: #0090FF; +} + +input, select, textarea, button, keygen, isindex { + border-width: 1px; + border-color: #BED6F8; + color: #000000; +} + +button, input[type="reset"], input[type="submit"], input[type="button"] { + border-width: 1px; + border-color: #BED6F8; + font-size: 11px; + font-family: Arial, Verdana, sans-serif; + color: #000000; + background-color: #BED6F8; +} + +button:hover, input[type="reset"]:hover, input[type="submit"]:hover, input[type="button"]:hover { + background-color: #BED6F8; +} + +button[disabled], input[type="reset"][disabled], input[type="submit"][disabled], input[type="button"][disabled] { + color: #8DB7F3; + border-color: #cccccc; + background-color: #cccccc; +} + +textarea, input[type="text"], input[type="password"], select { + border-width: 1px; + border-style: solid; + border-color: #BED6F8; + font-size: 11px; + font-family: Arial, Verdana, sans-serif; + color: #000000; + background-color: #ffffff; +} + +textarea[disabled], input[type="text"][disabled], input[type="password"][disabled], select[disabled] { + color: #BED6F8; + cursor: default; +} + +.popupContainer { + top: 50%; + left: 50%; + position: absolute; +} + +.popup { + position: relative; + + width: 600px; + margin-left: -300px; + + margin-top: -200px; + + display: none; + + z-index: 9999; +} + +.closeButton { + text-align: right; + width: 100%; +} + +#opaque { + position: fixed; + top: 0px; + left: 0px; + width: 100%; + height: 100%; + z-index: 99; + display: none; + background-color: black; + filter: alpha(opacity = 40); + opacity: 0.4; } \ No newline at end of file