From 6c391efefdb8ca358b6539e74d115259f9258582 Mon Sep 17 00:00:00 2001
From: Carlos Munoz <camunoz@redhat.com>
Date: Fri, 8 Feb 2013 10:44:21 +1000
Subject: [PATCH] Migration of other JSF components to JSF2.

Dialogs and DataGrids.
Fixed a few issues in the Source files view.
---
 .../main/webapp/iteration/source_files.xhtml  |  35 ++++-
 zanata-war/src/main/webapp/profile/view.xhtml |  15 +--
 .../main/webapp/resources/css/jsf-skin.css    | 120 +++++++++++++++++-
 .../src/main/webapp/resources/css/zanata.css  |  69 ++--------
 4 files changed, 164 insertions(+), 75 deletions(-)

diff --git a/zanata-war/src/main/webapp/iteration/source_files.xhtml b/zanata-war/src/main/webapp/iteration/source_files.xhtml
index a5e3459dbc..448c1a0a88 100644
--- a/zanata-war/src/main/webapp/iteration/source_files.xhtml
+++ b/zanata-war/src/main/webapp/iteration/source_files.xhtml
@@ -46,12 +46,38 @@
             <richext:spacer height="10"/>
             <s:div style="text-align:center">
                 <rich:dataScroller id="data_table_scroller" for="data_table"
+                                   fastControls="hide"
                                    rendered="#{projectIterationFilesAction.iterationDocuments.size() > 20}">
-                    <f:facet name="next">
-                        <h:outputText value="next" style="font-size: 0.8em"/>
+                    <f:facet name="first">
+                        <h:outputText value="" styleClass="icon-to-start"/>
                     </f:facet>
                     <f:facet name="previous">
-                        <h:outputText value="prev" style="font-size: 0.8em"/>
+                        <h:outputText value="" styleClass="icon-left-open"/>
+                    </f:facet>
+                    <f:facet name="next">
+                        <h:outputText value="" styleClass="icon-right-open-1"/>
+                    </f:facet>
+                    <f:facet name="fastforward">
+                        <h:outputText value="" styleClass="icon-fast-fw-1"/>
+                    </f:facet>
+                    <f:facet name="last">
+                        <h:outputText value="" styleClass="icon-to-end"/>
+                    </f:facet>
+
+                    <f:facet name="first_disabled">
+                        <h:outputText value="" styleClass="icon-to-start"/>
+                    </f:facet>
+                    <f:facet name="previous_disabled">
+                        <h:outputText value="" styleClass="icon-left-open"/>
+                    </f:facet>
+                    <f:facet name="next_disabled">
+                        <h:outputText value="" styleClass="icon-right-open-1"/>
+                    </f:facet>
+                    <f:facet name="fastforward_disabled">
+                        <h:outputText value="" styleClass="icon-fast-fw-1"/>
+                    </f:facet>
+                    <f:facet name="last_disabled">
+                        <h:outputText value="" styleClass="icon-to-end"/>
                     </f:facet>
                 </rich:dataScroller>
             </s:div>
@@ -225,9 +251,10 @@
                 <s:fileUpload accept="*"
                               data="#{projectIterationFilesAction.documentFileUpload.fileContents}"
                               fileName="#{projectIterationFilesAction.documentFileUpload.fileName}"/>
+                <br/>
+                <h:outputLabel for="docPath" value="#{messages['jsf.iteration.files.DocumentPath']}"/>
                 <h:inputText id="docPath"
                              value="#{projectIterationFilesAction.documentFileUpload.documentPath}">
-                    <h:outputLabel for="docPath" value="#{messages['jsf.iteration.files.DocumentPath']}"/>
                 </h:inputText>
                 <br/>
                 <h:selectOneMenu value="#{projectIterationFilesAction.documentFileUpload.sourceLang}">
diff --git a/zanata-war/src/main/webapp/profile/view.xhtml b/zanata-war/src/main/webapp/profile/view.xhtml
index 1319d302a4..d19effc341 100644
--- a/zanata-war/src/main/webapp/profile/view.xhtml
+++ b/zanata-war/src/main/webapp/profile/view.xhtml
@@ -71,10 +71,9 @@
 
         <rich:tabPanel switchType="client"
                        inactiveTabClass="inactive_tab">
-            <rich:tab label="#{messages['jsf.MaintainedProjects']}"
-                    styleClass="tab_header">
+            <rich:tab header="#{messages['jsf.MaintainedProjects']} (#{personHome.instance.maintainerProjects.size})">
                 <h:form>
-                    <rich:dataGrid value="#{personHome.instance.maintainerProjects.toArray()}" var="project" columns="2" styleClass="noBorderTable" style="border:0px">
+                    <rich:dataGrid value="#{personHome.instance.maintainerProjects.toArray()}" var="project" columns="2" styleClass="noBorderDataGrid" style="border:0px">
                         <s:link id="project" styleClass="table_link" value="#{project.name} " propagation="none"
                                 view="/project/project.xhtml">
                             <f:param name="slug" value="#{project.slug}"/>
@@ -82,22 +81,20 @@
                     </rich:dataGrid>
                 </h:form>
             </rich:tab>
-            <rich:tab label="#{messages['jsf.LanguageTeams']}"
-                    styleClass="tab_header">
+            <rich:tab header="#{messages['jsf.LanguageTeams']} (#{personHome.instance.languageMemberships.size})">
                 <h:outputText value="None Available" rendered="#{empty personHome.instance.languageMemberships}"/>
                 <h:form>
-                    <rich:dataGrid value="#{personHome.instance.languageMemberships.toArray()}" var="language" columns="6" styleClass="noBorderTable" style="border:0px">
+                    <rich:dataGrid value="#{personHome.instance.languageMemberships.toArray()}" var="language" columns="6" styleClass="noBorderDataGrid" style="border:0px">
                         <s:link view="/language/language.xhtml" propagation="none" value="#{language.localeId.id}" styleClass="table_link">
                             <f:param name="id" value="#{language.localeId.id}" />
                         </s:link>
                     </rich:dataGrid>
                 </h:form>
             </rich:tab>
-            <rich:tab label="#{messages['jsf.MaintainedGroups']}"
-                      styleClass="tab_header">
+            <rich:tab header="#{messages['jsf.MaintainedGroups']} (#{personHome.instance.maintainerVersionGroups.size})">
                 <h:outputText value="None Available" rendered="#{empty personHome.instance.maintainerVersionGroups}"/>
                 <h:form>
-                    <rich:dataGrid value="#{personHome.instance.maintainerVersionGroups.toArray()}" var="group" columns="3" styleClass="noBorderTable" style="border:0px">
+                    <rich:dataGrid value="#{personHome.instance.maintainerVersionGroups.toArray()}" var="group" columns="3" styleClass="noBorderDataGrid" style="border:0px">
                         <s:link view="/version-group/version_group.xhtml" propagation="none" value="#{group.name}" styleClass="table_link">
                             <f:param name="versionGroupSlug" value="#{group.slug}" />
                         </s:link>
diff --git a/zanata-war/src/main/webapp/resources/css/jsf-skin.css b/zanata-war/src/main/webapp/resources/css/jsf-skin.css
index bf64c86fa1..d2bd9e907b 100644
--- a/zanata-war/src/main/webapp/resources/css/jsf-skin.css
+++ b/zanata-war/src/main/webapp/resources/css/jsf-skin.css
@@ -130,4 +130,122 @@ div.rf-p {
     border-color: #EEEEEE;
 }
 
-/* ====================== Rich Data Panel =========================== */
\ No newline at end of file
+/* ====================== Rich Data Panel =========================== */
+
+/* ====================== Rich Tab Panel & Tabs =========================== */
+
+/* Header (where the tabs go) */
+div.rf-tab-hdr-tabline-vis.rf-tab-hdr-tabline-top {
+    background: none;
+    border: none;
+}
+
+/* Header seaparator from content */
+div.rf-tab-hdr-brd {
+    border: none;
+    background-color: transparent;
+}
+
+/* Tab (common) */
+td.rf-tab-hdr-act.rf-tab-hdr-top {
+    background-image: none;
+    border: 1px solid #461446;
+    border-top-right-radius: 5px;
+    border-top-left-radius: 5px;
+    padding: 5px 20px 0 20px;
+}
+
+/* Inactive Tab */
+td.rf-tab-hdr-inact.rf-tab-hdr-top {
+    color: #461446;
+    background-color: #eeeeee;
+    background-image: none;
+    border: 1px solid #461446;
+    border-top-right-radius: 5px;
+    border-top-left-radius: 5px;
+    padding: 5px 20px 0 20px;
+}
+
+/* Active Tab */
+td.rf-tab-hdr-act.rf-tab-hdr-top {
+    color: #ffffff;
+    background-color: #461446;
+}
+
+/* Tab contents */
+div.rf-tab-cnt {
+    border: none;
+    border-radius: 5px;
+    background-color: #eeeeee;
+}
+
+div.rf-tab-hdr-brd {
+    height: 0px;
+}
+
+/* ====================== End Rich Tab Panel & Tabs =========================== */
+
+/* ====================== Rich Dialogs =========================== */
+
+/* Dialog content */
+div.rf-pp-cntr {
+    border-radius: 5px;
+    border-color: transparent;
+}
+
+/* Dialog Shadow */
+div.rf-pp-shdw {
+    border-radius: 5px;
+}
+
+/* Header */
+div.rf-pp-hdr {
+    background-image: none;
+    background-color: #461446;
+    border-top-right-radius: 5px;
+    border-top-left-radius: 5px;
+    padding: 7px;
+}
+
+/* Body */
+div.rf-pp-cnt {
+    border-bottom-left-radius: 5px;
+    border-bottom-right-radius: 5px;
+}
+
+/* ====================== End Rich Dialogs =========================== */
+
+/* TODO Remove these as they no longer have any effect */
+/* Copy of Richfaces Simple toggle styles*/
+.rich-stglpanel-header {
+    background-image: none;
+    padding:10px 8px;
+    font-size:12px;
+    border-radius: 3px;
+    background-color: #461446;
+    color: white;
+    font-weight: bold;
+    font-family: Arial, Verdana, sans-serif;
+}
+
+.rich-stglpanel {
+    background-image: none;
+    padding: 2px 3px;
+    border-radius: 5px;
+    border:none;
+}
+
+.rich-stglpanel-body {
+    overflow: auto;
+    background:#EEE;
+}
+
+.rich-stglpanel-body .noBorderTable {
+    background:#FFFFFF;
+    box-shadow:none;
+}
+
+.rich-stglpanel-body .noBorderTable tr:hover {
+    background-color:inherit;
+}
+/* End of Richfaces Simple toggle styles */
\ No newline at end of file
diff --git a/zanata-war/src/main/webapp/resources/css/zanata.css b/zanata-war/src/main/webapp/resources/css/zanata.css
index 612634f79c..b266ab5de0 100644
--- a/zanata-war/src/main/webapp/resources/css/zanata.css
+++ b/zanata-war/src/main/webapp/resources/css/zanata.css
@@ -706,77 +706,24 @@ a.readonly_link,a.readonly_link:visited,a.readonly_link:link {
 
 /* -----------------------  JSF components CSS  -------------------------*/
 
-
-/* Copy of Richfaces Simple toggle styles*/
-.rich-stglpanel-header {
-	background-image: none;
-	padding:10px 8px;
-	font-size:12px;
-	border-radius: 3px;
-	background-color: #461446;
-	color: white;
-	font-weight: bold;
-	font-family: Arial, Verdana, sans-serif;
-}
-
-.rich-stglpanel {
-	background-image: none;
-	padding: 2px 3px;
-	border-radius: 5px;
-	border:none;
-}
-
-.rich-stglpanel-body {
-	overflow: auto;
-	background:#EEE;
-}
-
-.rich-stglpanel-body .noBorderTable {
-	background:#FFFFFF;
-	box-shadow:none;
-}
-
-.rich-stglpanel-body .noBorderTable tr:hover {
-	background-color:inherit;
-}
-/* End of Richfaces Simple toggle styles */
-
-
 .inline_cell_item {
 	width: 100%;
 	float: left;
 	margin: 0px;
 }
 
-.rich-dtascroller-table { 
-	border:none;
-}
-
-.rich-mpnl-header
-{
-	background:#461446;
-	border-color:#461446;
-}
-
-/* Richfaces Tab panel styles */
-.rich-tab-active {
-    background-color: #461446;
-    border-color: #461446;
-    color: #ffffff;
-}
+/* -----------------------  End JSF components CSS  -------------------------*/
 
-.rich-tab-inactive {
-    background-color: #eeeeee;
+/* -----------------------  Data Grid with no borders  -------------------------*/
+table.noBorderDataGrid {
+    border: none;
+    background-color: transparent;
 }
 
-.rich-tabpanel-content{
-    background:white;
+td.rf-dg-c {
+    border: none;
+    padding: 7px;
 }
-/* End Richfaces Tab panel styles */
-
-/* -----------------------  End JSF components CSS  -------------------------*/
-
-
 
 /* -----------------------  Login form CSS  -------------------------*/
 input[type="text"].loginForm_input, input[type="password"].loginForm_input {