[richfaces-svn-commits] JBoss Rich Faces SVN: r19199 - trunk/examples/output-demo/src/main/webapp/examples and 5 other directories.

Author: Alex.Kolonitsky Date: 2010-09-14 11:38:08 -0400 (Tue, 14 Sep 2010) New Revision: 19199 Added: trunk/examples/output-demo/src/main/webapp/examples/tabPanel.xhtml trunk/examples/output-demo/src/main/webapp/qunit/tabPanel.xhtml trunk/examples/output-demo/src/main/webapp/resources/tests/richfaces-tab-panel-qunit.js trunk/ui/output/ui/src/main/resources/META-INF/resources/org.richfaces/Tab.js trunk/ui/output/ui/src/main/resources/META-INF/resources/org.richfaces/TabPanel.js Modified: branches/RF-7944/ui/output/ui/src/main/java/org/richfaces/renderkit/html/TabPanelRenderer.java branches/RF-7944/ui/output/ui/src/main/java/org/richfaces/renderkit/html/TabRenderer.java trunk/examples/output-demo/src/main/webapp/templates/template.xhtml trunk/ui/output/ui/src/main/java/org/richfaces/component/AbstractTogglePanel.java trunk/ui/output/ui/src/main/java/org/richfaces/component/UITogglePanelTitledItem.java trunk/ui/output/ui/src/main/resources/META-INF/resources/org.richfaces/tabPanel.ecss Log: RF-7944 Tab Panel Component Modified: branches/RF-7944/ui/output/ui/src/main/java/org/richfaces/renderkit/html/TabPanelRenderer.java =================================================================== --- branches/RF-7944/ui/output/ui/src/main/java/org/richfaces/renderkit/html/TabPanelRenderer.java 2010-09-14 15:19:59 UTC (rev 19198) +++ branches/RF-7944/ui/output/ui/src/main/java/org/richfaces/renderkit/html/TabPanelRenderer.java 2010-09-14 15:38:08 UTC (rev 19199) @@ -22,10 +22,14 @@ package org.richfaces.renderkit.html; +import org.ajax4jsf.javascript.JSObject; import org.richfaces.component.AbstractTabPanel; +import org.richfaces.component.AbstractTogglePanel; +import org.richfaces.component.AbstractTogglePanelItem; import org.richfaces.component.AbstractTogglePanelTitledItem; import org.richfaces.component.html.HtmlTab; import org.richfaces.component.util.HtmlUtil; +import org.richfaces.renderkit.HtmlConstants; import org.richfaces.renderkit.RenderKitUtils; import javax.faces.application.ResourceDependencies; @@ -34,8 +38,13 @@ import javax.faces.context.FacesContext; import javax.faces.context.ResponseWriter; import java.io.IOException; +import java.util.Map; +import static org.richfaces.component.AbstractTogglePanelTitledItem.HeaderStates.*; +import static org.richfaces.component.AbstractTogglePanelTitledItem.HeaderStates.active; +import static org.richfaces.component.html.HtmlAccordion.PropertyKeys.height; import static org.richfaces.component.util.HtmlUtil.concatClasses; +import static org.richfaces.component.util.HtmlUtil.concatStyles; import static org.richfaces.renderkit.RenderKitUtils.renderPassThroughAttributes; /** @@ -46,10 +55,12 @@ @ResourceDependency(library = "javax.faces", name = "jsf.js"), @ResourceDependency(name = "jquery.js"), @ResourceDependency(name = "richfaces.js"), + @ResourceDependency(name = "richfaces-event.js"), @ResourceDependency(name = "richfaces-base-component.js"), @ResourceDependency(library = "org.richfaces", name = "tabPanel.ecss"), @ResourceDependency(library = "org.richfaces", name = "TogglePanel.js"), - @ResourceDependency(library = "org.richfaces", name = "script/TabPanel.js") }) + @ResourceDependency(library = "org.richfaces", name = "TabPanel.js") +}) public class TabPanelRenderer extends TogglePanelRenderer { private static final RenderKitUtils.Attributes HEADER_ATTRIBUTES = RenderKitUtils.attributes() @@ -66,81 +77,103 @@ @Override protected void doEncodeBegin(ResponseWriter w, FacesContext context, UIComponent comp) throws IOException { -// super.doEncodeBegin(writer, context, component); + super.doEncodeBegin(w, context, comp); + writeJavaScript(w, context, comp); - // TODO id, class, user styles :) (inherit form toogle panel) - w.startElement(DIV, comp); - w.writeAttribute(STYLE, "width: 100%;", null); + writeTabsLine(w, context, comp); + writeTabsLineSeparator(w); + } + private void writeTabsLineSeparator(ResponseWriter writer) throws IOException { + writer.write("<div class='rf-tb-hdr_border'></div>"); + } + + private void writeTabsLine(ResponseWriter w, FacesContext context, UIComponent comp) throws IOException { w.startElement(DIV, comp); - w.writeAttribute(CLASS, "rftp_toptab_tabline_vis", null); + w.writeAttribute(CLASS, "rf-tb-hdr_tabline_vis", null); w.startElement("table", comp); - w.writeAttribute("class", "rftp_toptab_tabs", null); + w.writeAttribute("class", "rf-tb-hdr_tabs", null); + w.writeAttribute("cellspacing", "0", null); w.startElement("tbody", comp); w.startElement("tr", comp); writeTopTabFirstSpacer(w, comp); - writeTopTabHeader(w, comp, "Tab name 1", true); - writeTopTabSpacer(w, comp); - writeTopTabHeader(w, comp, "Tab name 2", false); - writeTopTabSpacer(w, comp); + + for (AbstractTogglePanelItem item : ((AbstractTogglePanel) comp).getRenderedItems()) { + AbstractTogglePanelTitledItem tab = (AbstractTogglePanelTitledItem) item; + writeTopTabHeader(context, w, tab); + writeTopTabSpacer(w, comp); + } + writeTopTabLastSpacer(w, comp); w.endElement("tr"); w.endElement("tbody"); w.endElement("table"); - writeTopTabsControl(w, comp, "rftp_toptab_scroll_left rftp_hidden", "«"); - writeTopTabsControl(w, comp, "rftp_toptab_tabslist rftp_hidden", "↓"); - writeTopTabsControl(w, comp, "rftp_toptab_scroll_right rftp_hidden", "»"); + writeTopTabsControl(w, comp, "rf-tb-hdr_scroll_left rftp_hidden", "«"); + writeTopTabsControl(w, comp, "rf-tb-hdr_tabslist rftp_hidden", "↓"); + writeTopTabsControl(w, comp, "rf-tb-hdr_scroll_right rftp_hidden", "»"); w.endElement("div"); + } - w.startElement("div", comp); - w.writeAttribute("class", "rftp_toptab_border", null); - w.endElement("div"); + @Override + protected String getStyle(UIComponent component) { + return concatStyles(attributeAsString(component, "style"), "width: 100%;"); } - private void encodeTabHeader(FacesContext context, UIComponent component, ResponseWriter writer) throws IOException { + @Override + protected String getStyleClass(UIComponent component) { + return HtmlUtil.concatClasses("rf-tbp", attributeAsString(component, "styleClass")); + } - writer.startElement("div", component); - writer.writeAttribute("class", concatClasses("rf-tab-hdr", attributeAsString(component, HtmlTab.PropertyKeys.headerClass)), null); - writer.writeAttribute("id", component.getClientId() + ":header", null); - renderPassThroughAttributes(context, component, HEADER_ATTRIBUTES); - AbstractTogglePanelTitledItem titledItem = (AbstractTogglePanelTitledItem) component; - boolean isActive = titledItem.isActive(); - boolean isDisabled = titledItem.isDisabled(); - encodeTabHeader(context, titledItem, writer, AbstractTogglePanelTitledItem.HeaderStates.inactive, !isActive && !isDisabled); - encodeTabHeader(context, titledItem, writer, AbstractTogglePanelTitledItem.HeaderStates.active, isActive && !isDisabled); - encodeTabHeader(context, titledItem, writer, AbstractTogglePanelTitledItem.HeaderStates.disable, isDisabled); + private void writeTopTabHeader(FacesContext context, ResponseWriter writer, AbstractTogglePanelTitledItem tab) throws IOException { + writer.startElement("td", tab); + writer.writeAttribute("id", tab.getClientId() + ":header", null); + writer.writeAttribute("class", concatClasses("rf-tb-hdr", attributeAsString(tab, HtmlTab.PropertyKeys.headerClass)), null); + renderPassThroughAttributes(context, tab, HEADER_ATTRIBUTES); - writer.endElement("div"); - } + boolean isActive = tab.isActive(); + boolean isDisabled = tab.isDisabled(); + encodeTabHeader(context, tab, writer, inactive, !isActive && !isDisabled); + encodeTabHeader(context, tab, writer, active, isActive && !isDisabled); + encodeTabHeader(context, tab, writer, disable, isDisabled); + + writer.endElement("td"); + } - private void encodeTabHeader(FacesContext facesContext, AbstractTogglePanelTitledItem component, ResponseWriter writer, + private void encodeTabHeader(FacesContext context, AbstractTogglePanelTitledItem tab, ResponseWriter writer, AbstractTogglePanelTitledItem.HeaderStates state, Boolean isDisplay) throws IOException { - writer.startElement("div", component); + writer.startElement("div", tab); + writer.writeAttribute("id", tab.getClientId() + ":header:" + state, null); + writer.writeAttribute("style", concatStyles("white-space: nowrap", isDisplay ? "" : "display : none"), null); - if (!isDisplay) { - writer.writeAttribute("style", "display : none", null); - } - String name = "headerClass" + capitalize(state.toString()); - writer.writeAttribute("class", concatClasses("rf-tab-hdr-" + state.abbreviation(), attributeAsString(component, name)), null); + writer.writeAttribute("class", concatClasses("rf-tb-hdr-" + state.abbreviation(), attributeAsString(tab, name)), null); - UIComponent headerFacet = component.getHeaderFacet(state); + writeTopTabIcon(context, tab, writer, "rftp_icon", "ico.gif"); + + writer.startElement("span", tab); + writer.writeAttribute("class", "rftp_label", null); + + UIComponent headerFacet = tab.getHeaderFacet(state); if (headerFacet != null && headerFacet.isRendered()) { - headerFacet.encodeAll(facesContext); + headerFacet.encodeAll(context); } else { - Object headerText = component.getAttributes().get("header"); + Object headerText = tab.getAttributes().get("header"); if (headerText != null && !headerText.equals("")) { writer.writeText(headerText, null); } } + writer.endElement("span"); + + writeTopTabIcon(context, tab, writer, "rftp_close", "close_act.gif"); + writer.endElement("div"); } @@ -153,46 +186,29 @@ w.endElement("div"); } - private void writeTopTabHeader(ResponseWriter w, UIComponent comp, String text, boolean active) throws IOException { - w.startElement("td", comp); - w.writeAttribute("class", HtmlUtil.concatClasses("rftp_toptab", active ? "rftp_active_top" : ""), null); - w.startElement("div", comp); - w.writeAttribute("style", "white-space: nowrap;", null); - - writeTopTabIcon(w, comp, "rftp_icon", "ico.gif"); - - w.startElement("span", comp); - w.writeAttribute("class", "rftp_label", null); - w.writeText(text, null); - w.endElement("span"); - - writeTopTabIcon(w, comp, "rftp_close", "close_act.gif"); - - w.endElement("div"); - w.endElement("td"); + private void writeTopTabIcon(FacesContext context, UIComponent comp, ResponseWriter writer, String styleClass, String image) throws IOException { + writer.startElement("img", comp); + writer.writeAttribute("width", 16, null); + writer.writeAttribute("height", 16, null); + writer.writeAttribute("class", styleClass, null); + + String imagePath = context.getApplication().getResourceHandler().createResource("org.richfaces/" + image).getRequestPath(); + writer.writeAttribute("src", imagePath, null); } - private void writeTopTabIcon(ResponseWriter w, UIComponent comp, String styleClass, String image) throws IOException { - w.startElement("img", comp); - w.writeAttribute("width", 16, null); - w.writeAttribute("height", 16, null); - w.writeAttribute("class", styleClass, null); - w.writeAttribute("src", image, null); - } - private void writeTopTabFirstSpacer(ResponseWriter w, UIComponent comp) throws IOException { - writeTopTabSpacer_(w, comp, "padding-left: 5px;", "rftp_toptab_spacer"); + writeTopTabSpacer(w, comp, "padding-left: 5px;", "rf-tb-hdr_spacer"); } private void writeTopTabSpacer(ResponseWriter w, UIComponent comp) throws IOException { - writeTopTabSpacer_(w, comp, "", "rftp_toptab_spacer rftp_horizonttab_tabspacer_width"); + writeTopTabSpacer(w, comp, "", "rf-tb-hdr_spacer rftp_horizonttab_tabspacer_width"); } private void writeTopTabLastSpacer(ResponseWriter w, UIComponent comp) throws IOException { - writeTopTabSpacer_(w, comp, "padding-right: 5px; width: 100%;", "rftp_toptab_spacer"); + writeTopTabSpacer(w, comp, "padding-right: 5px; width: 100%;", "rf-tb-hdr_spacer"); } - private void writeTopTabSpacer_(ResponseWriter w, UIComponent comp, String style, String classStyle) throws IOException { + private void writeTopTabSpacer(ResponseWriter w, UIComponent comp, String style, String classStyle) throws IOException { w.startElement("td", comp); w.writeAttribute(STYLE, style, null); w.writeAttribute(CLASS, classStyle, null); @@ -202,11 +218,25 @@ @Override protected void doEncodeEnd(ResponseWriter writer, FacesContext context, UIComponent component) throws IOException { - writer.endElement("div"); -// super.doEncodeEnd(writer, context, component); + writer.endElement(HtmlConstants.DIV_ELEM); } @Override + protected JSObject getScriptObject(FacesContext context, UIComponent component) { + return new JSObject("RichFaces.ui.TabPanel", + component.getClientId(), getScriptObjectOptions(context, component)); + } + + @Override + protected Map<String, Object> getScriptObjectOptions(FacesContext context, UIComponent component) { + Map<String, Object> options = super.getScriptObjectOptions(context, component); + options.put("isKeepHeight", !attributeAsString(component, height).isEmpty()); + options.remove("items"); + + return options; + } + + @Override protected Class<? extends UIComponent> getComponentClass() { return AbstractTabPanel.class; } Modified: branches/RF-7944/ui/output/ui/src/main/java/org/richfaces/renderkit/html/TabRenderer.java =================================================================== --- branches/RF-7944/ui/output/ui/src/main/java/org/richfaces/renderkit/html/TabRenderer.java 2010-09-14 15:19:59 UTC (rev 19198) +++ branches/RF-7944/ui/output/ui/src/main/java/org/richfaces/renderkit/html/TabRenderer.java 2010-09-14 15:38:08 UTC (rev 19199) @@ -44,8 +44,11 @@ @ResourceDependency(library = "javax.faces", name = "jsf.js"), @ResourceDependency(name = "jquery.js"), @ResourceDependency(name = "richfaces.js"), + @ResourceDependency(name = "richfaces-event.js"), @ResourceDependency(name = "richfaces-base-component.js"), - @ResourceDependency(library = "org.richfaces", name = "script/Tab.js") }) + @ResourceDependency(library = "org.richfaces", name = "TogglePanelItem.js"), + @ResourceDependency(library = "org.richfaces", name = "Tab.js") +}) public class TabRenderer extends TogglePanelItemRenderer { @Override @@ -57,7 +60,7 @@ @Override protected String getStyleClass(UIComponent component) { - return concatClasses("rf-tab", attributeAsString(component, "styleClass")); + return concatClasses("rf-tb", attributeAsString(component, "styleClass")); } @Override @@ -82,7 +85,7 @@ private void encodeContentBegin(UIComponent component, ResponseWriter writer) throws IOException { writer.startElement("div", component); - writer.writeAttribute("class", concatClasses("rf-tab-cnt", attributeAsString(component, "contentClass")), null); + writer.writeAttribute("class", concatClasses("rf-tb-cnt", attributeAsString(component, "contentClass")), null); writer.writeAttribute("id", component.getClientId() + ":content", null); AbstractTogglePanelTitledItem item = (AbstractTogglePanelTitledItem) component; Added: trunk/examples/output-demo/src/main/webapp/examples/tabPanel.xhtml =================================================================== --- trunk/examples/output-demo/src/main/webapp/examples/tabPanel.xhtml (rev 0) +++ trunk/examples/output-demo/src/main/webapp/examples/tabPanel.xhtml 2010-09-14 15:38:08 UTC (rev 19199) @@ -0,0 +1,31 @@ +<!DOCTYPE html PUBLIC "-//W3C//DTD XHTML 1.0 Transitional//EN" "http://www.w3.org/TR/xhtml1/DTD/xhtml1-transitional.dtd"> +<html xmlns="http://www.w3.org/1999/xhtml" + xmlns:h="http://java.sun.com/jsf/html" + xmlns:f="http://java.sun.com/jsf/core" + xmlns:ui="http://java.sun.com/jsf/facelets" + xmlns:pn="http://richfaces.org/output"> + +<body> +<ui:composition template="/templates/template.xhtml"> + + <ui:define name="title">Tab Panel Example</ui:define> + <ui:define name="body_head">Tab Panel Example</ui:define> + + <ui:define name="body"> + <p>Page</p> + + <h:form id="f"> + <pn:tabPanel id="panel" switchType="ajax"> + <pn:tab header="tab1 header"> + Content will be here. Content will be here. Content will be here. Content will be here. Content will be here. Content will be here. Content will be here. Content will be here. Content will be here. Content will be here. Content will be here. Content will be here. Content will be here. Content will be here. + </pn:tab> + <pn:tab header="tab2 header"> + He he + </pn:tab> + </pn:tabPanel> + </h:form> + </ui:define> +</ui:composition> +</body> +</html> + Added: trunk/examples/output-demo/src/main/webapp/qunit/tabPanel.xhtml =================================================================== --- trunk/examples/output-demo/src/main/webapp/qunit/tabPanel.xhtml (rev 0) +++ trunk/examples/output-demo/src/main/webapp/qunit/tabPanel.xhtml 2010-09-14 15:38:08 UTC (rev 19199) @@ -0,0 +1,47 @@ +<!DOCTYPE html PUBLIC "-//W3C//DTD XHTML 1.0 Transitional//EN" "http://www.w3.org/TR/xhtml1/DTD/xhtml1-transitional.dtd"> +<html xmlns="http://www.w3.org/1999/xhtml" + xmlns:h="http://java.sun.com/jsf/html" + xmlns:f="http://java.sun.com/jsf/core" + xmlns:ui="http://java.sun.com/jsf/facelets" + xmlns:pn="http://richfaces.org/output"> + +<body> +<ui:composition template="/templates/template.xhtml"> + + <ui:define name="scripts"> + <h:outputScript name="qunit/qunit.js" /> + <h:outputScript name="qunit/richfaces-qunit.js" /> + + <h:outputStylesheet name="qunit/qunit.css" /> + </ui:define> + + <ui:define name="title">Tab Panel Example</ui:define> + <ui:define name="body_head">Tab Panel Example</ui:define> + + <ui:define name="body"> + <p>Page</p> + + <h:form id="f"> + <pn:tabPanel id="panel" switchType="ajax"> + <pn:tab header="tab1 header"> + Content will be here. Content will be here. Content will be here. Content will be here. Content will be here. Content will be here. Content will be here. Content will be here. Content will be here. Content will be here. Content will be here. Content will be here. Content will be here. Content will be here. + </pn:tab> + <pn:tab header="tab2 header"> + He he + </pn:tab> + </pn:tabPanel> + </h:form> + + <p>Result</p> + <div> + <ol id="qunit-tests"></ol> + + <div id="testDiv" style="margin-top:10px; border:1px solid #a0a0a0">Main Test Div</div> + + </div> + <h:outputScript name="tests/richfaces-tab-panel-qunit.js" /> + </ui:define> +</ui:composition> +</body> +</html> + Added: trunk/examples/output-demo/src/main/webapp/resources/tests/richfaces-tab-panel-qunit.js =================================================================== --- trunk/examples/output-demo/src/main/webapp/resources/tests/richfaces-tab-panel-qunit.js (rev 0) +++ trunk/examples/output-demo/src/main/webapp/resources/tests/richfaces-tab-panel-qunit.js 2010-09-14 15:38:08 UTC (rev 19199) @@ -0,0 +1,84 @@ +/* + * JBoss, Home of Professional Open Source + * Copyright ${year}, Red Hat, Inc. and individual contributors + * by the @authors tag. See the copyright.txt in the distribution for a + * full listing of individual contributors. + * + * This is free software; you can redistribute it and/or modify it + * under the terms of the GNU Lesser General Public License as + * published by the Free Software Foundation; either version 2.1 of + * the License, or (at your option) any later version. + * + * This software is distributed in the hope that it will be useful, + * but WITHOUT ANY WARRANTY; without even the implied warranty of + * MERCHANTABILITY or FITNESS FOR A PARTICULAR PURPOSE. See the GNU + * Lesser General Public License for more details. + * + * You should have received a copy of the GNU Lesser General Public + * License along with this software; if not, write to the Free + * Software Foundation, Inc., 51 Franklin St, Fifth Floor, Boston, MA + * 02110-1301 USA, or see the FSF site: http://www.fsf.org. + */ + +RichFaces.QUnit.run(function() { + module("richfaces-tab-panel"); + + var TAB_PANEL_ID = "f:panel"; + + function handler (msg, returnValue) { + return function () { + ok(true, msg); + + if (returnValue != undefined) { + return returnValue; + } + }; + } + + test("RichFaces.ui.TabPanel test constructor", function () { + var c = RichFaces.$(TAB_PANEL_ID); + + ok(c instanceof RichFaces.ui.TabPanel, "inctance of RichFaces.ui.TabPanel"); + equals(c.id, TAB_PANEL_ID, "id"); + }); + + test("RichFaces.ui.TabPanel test public api", function () { + var c = RichFaces.$(TAB_PANEL_ID); + + var PUBLIC_API = [/* ... */]; + + for (var i in PUBLIC_API) { + var funcName = PUBLIC_API[i]; + ok(c[funcName], funcName + "present in component"); + // TODO check other functions + check is it function + } + }); + + test("RichFaces.ui.TabPanel test events", function () { + var componentId = TAB_PANEL_ID; + var c = RichFaces.$(componentId); + + expect(5); + var beforeitemchngeHandler = function (event, comp, data) { + ok(true, "beforeitemchnge handler invouked"); + + same(data.id, componentId, "component id"); + same(data.oldItem.getName(), c.items[0].getName(), "old item"); + same(data.newItem.getName(), c.items[1].getName(), "new item"); + + return true; + }; + + var beforeitemchngeHandlerWrapper = RichFaces.Event.bindById(componentId, "beforeitemchange", beforeitemchngeHandler); + + var itemchangeHandler = handler("itemchnge handler invouked", undefined); + var itemchangeHandlerWrapper = RichFaces.Event.bindById(componentId, "itemchange", itemchangeHandler); + + c.switchToItem("name2"); + + RichFaces.Event.unbindById(componentId, "beforeitemchange", beforeitemchngeHandlerWrapper); + RichFaces.Event.unbindById(componentId, "itemchange", itemchangeHandlerWrapper); + + c.switchToItem("name1"); + }); +}); Modified: trunk/examples/output-demo/src/main/webapp/templates/template.xhtml =================================================================== --- trunk/examples/output-demo/src/main/webapp/templates/template.xhtml 2010-09-14 15:19:59 UTC (rev 19198) +++ trunk/examples/output-demo/src/main/webapp/templates/template.xhtml 2010-09-14 15:38:08 UTC (rev 19199) @@ -10,157 +10,6 @@ </title> <meta http-equiv="content-type" content="text/xhtml; charset=UTF-8" /> - - <style type="text/css"> - * { - font-family: verdana - } - - .rftp_toptab { - display: table-cell; - border: 1px solid #A6A6A6; - padding: 0px 0px 3px 0px; - vertical-align: bottom; - background: url(tab_bg.gif) top repeat-x #DAE7F5; - } - - .rftp_active_top { - border-bottom: 0px; - font-weight: bold; - padding: 3px 0px 0px 0px; - vertical-align: top; - background: url(acttab_bg.gif) top repeat-x #C9DBEF; - } - - .rftp_active2_top { - border-bottom: 0px; - font-weight: bold; - padding: 3px 0px 0px 0px; - vertical-align: top; - background: url(acttab2_bg.gif) top repeat-x #FFFFFF; - } - - .rftp_toptab_tabline_vis { - border: 1px solid #a6a6a6; - background: url(tabline_bg.gif) top repeat-x #EEF4FB; - border-bottom: 0px; - padding-top: 2px; - overflow: hidden; - height: 23px; - white-space: nowrap; - position: relative; - } - - .rftp_toptab_tabline_dis { - border-bottom: 0px; - padding-top: 2px; - overflow: hidden; - height: 25px; - white-space: nowrap; - position: relative; - } - - .rftp_toptab_tabs { - display: table; - border: 0px; - width: 100%; - height: 100%; - } - - .rftp_toptab_spacer { - display: table-cell; - border-bottom: 1px solid #A6A6A6; - } - - .rftp_horizonttab_tabspacer_width { - padding-left: 1px; - } - - .rftp_icon { - display: table-cell; - vertical-align: middle; - padding: 0px 5px 0px 5px; - } - - .rftp_close { - display: table-cell; - vertical-align: middle; - padding: 0px 3px 0px 15px; - } - - .rftp_label { - display: table-cell; - vertical-align: middle; - font-family: verdana; - font-size: 11px; - } - - .rftp_toptab_scroll_left { - background: url(acttab_bg.gif) top repeat-x #C9DBEF; - position: absolute; - top: 1px; - left: 1px; - width: 15px; - height: 250px; - border: 1px solid #a6a6a6; - font-weight: bold; - text-align: center; - font-family: verdana; - font-size: 11px; - padding-top: 6px; - } - - .rftp_toptab_scroll_right { - background: url(acttab_bg.gif) top repeat-x #C9DBEF; - position: absolute; - top: 1px; - right: 17px; - width: 15px; - height: 250px; - border: 1px solid #a6a6a6; - font-weight: bold; - text-align: center; - font-family: verdana; - font-size: 11px; - padding-top: 6px; - } - - .rftp_toptab_tabslist { - background: url(acttab_bg.gif) top repeat-x #C9DBEF; - position: absolute; - top: 1px; - right: 1px; - width: 15px; - height: 250px; - border: 1px solid #a6a6a6; - font-weight: bold; - text-align: center; - font-family: verdana; - font-size: 14px; - padding-top: 2px; - } - - .rftp_toptab_border { - border: 1px solid #A6A6A6; - border-top: 0px; - height: 2px; - background: #C9DBEF; - } - - .rftp_toptab_content { - border: 1px solid #A6A6A6; - border-top: 0px; - font-family: verdana; - font-size: 11px; - padding: 10px; - background: #ffffff; - } - - .rftp_hidden { - display: none - } - </style> - </h:head> <h:body> Modified: trunk/ui/output/ui/src/main/java/org/richfaces/component/AbstractTogglePanel.java =================================================================== --- trunk/ui/output/ui/src/main/java/org/richfaces/component/AbstractTogglePanel.java 2010-09-14 15:19:59 UTC (rev 19198) +++ trunk/ui/output/ui/src/main/java/org/richfaces/component/AbstractTogglePanel.java 2010-09-14 15:38:08 UTC (rev 19199) @@ -459,9 +459,9 @@ } public AbstractTogglePanelItem getItemByIndex(final int index) { - List<AbstractTogglePanelItem> children = getRenderedChildren(); + List<AbstractTogglePanelItem> children = getRenderedItems(); if (isCycledSwitching()) { - int size = getRenderedChildren().size(); + int size = getRenderedItems().size(); return children.get((size + index) % size); } else if (index < 0 || index >= children.size()) { return null; @@ -470,7 +470,7 @@ } } - private List<AbstractTogglePanelItem> getRenderedChildren() { + public List<AbstractTogglePanelItem> getRenderedItems() { List<AbstractTogglePanelItem> res = new ArrayList<AbstractTogglePanelItem>(getChildCount()); for (UIComponent child : getChildren()) { if (child.isRendered() && child instanceof AbstractTogglePanelItem) { @@ -516,7 +516,7 @@ } public AbstractTogglePanelItem getLastItem() { - return getItemByIndex(getRenderedChildren().size() - 1); + return getItemByIndex(getRenderedItems().size() - 1); } public int getChildIndex(String name) { @@ -524,7 +524,7 @@ throw new IllegalArgumentException("Name is required parameter."); } - List<AbstractTogglePanelItem> items = getRenderedChildren(); + List<AbstractTogglePanelItem> items = getRenderedItems(); for (int ind = 0; ind < items.size(); ind++) { if (name.equals(items.get(ind).getName())) { return ind; Modified: trunk/ui/output/ui/src/main/java/org/richfaces/component/UITogglePanelTitledItem.java =================================================================== --- trunk/ui/output/ui/src/main/java/org/richfaces/component/UITogglePanelTitledItem.java 2010-09-14 15:19:59 UTC (rev 19198) +++ trunk/ui/output/ui/src/main/java/org/richfaces/component/UITogglePanelTitledItem.java 2010-09-14 15:38:08 UTC (rev 19199) @@ -44,7 +44,7 @@ } public String getHeader() { - return (String) getStateHelper().eval(PropertyKeys.header); + return (String) getStateHelper().eval(PropertyKeys.header, getName()); } public void setHeader(String header) { Added: trunk/ui/output/ui/src/main/resources/META-INF/resources/org.richfaces/Tab.js =================================================================== --- trunk/ui/output/ui/src/main/resources/META-INF/resources/org.richfaces/Tab.js (rev 0) +++ trunk/ui/output/ui/src/main/resources/META-INF/resources/org.richfaces/Tab.js 2010-09-14 15:38:08 UTC (rev 19199) @@ -0,0 +1,130 @@ +/* + * JBoss, Home of Professional Open Source + * Copyright ${year}, Red Hat, Inc. and individual contributors + * by the @authors tag. See the copyright.txt in the distribution for a + * full listing of individual contributors. + * + * This is free software; you can redistribute it and/or modify it + * under the terms of the GNU Lesser General Public License as + * published by the Free Software Foundation; either version 2.1 of + * the License, or (at your option) any later version. + * + * This software is distributed in the hope that it will be useful, + * but WITHOUT ANY WARRANTY; without even the implied warranty of + * MERCHANTABILITY or FITNESS FOR A PARTICULAR PURPOSE. See the GNU + * Lesser General Public License for more details. + * + * You should have received a copy of the GNU Lesser General Public + * License along with this software; if not, write to the Free + * Software Foundation, Inc., 51 Franklin St, Fifth Floor, Boston, MA + * 02110-1301 USA, or see the FSF site: http://www.fsf.org. + */ + +(function ($, rf) { + + rf.ui = rf.ui || {}; + + rf.ui.Tab = rf.ui.TogglePanelItem.extendClass({ + // class name + name:"Tab", + + /** + * @class AccordionItem + * @name AccordionItem + * + * @constructor + * @param {String} componentId - component id + * @param {Hash} options - params + * */ + init : function (componentId, options) { + rf.ui.TogglePanelItem.call(this, componentId, options); + this.index = options["index"]; + this.getTogglePanel().getItems()[this.index] = this; + + rf.Event.bindById(this.id + ":header", "click", this.__onHeaderClick, this) + }, + + /***************************** Public Methods ****************************************************************/ + + __onHeaderClick : function (comp) { + this.getTogglePanel().switchToItem(this.getName()); + }, + + /** + * @param state {string} = inactive | active | disabled + * in that case looking header by css class appropriate to this state + * + * @return {jQuery Object} + * */ + __header : function (state) { + var res = $(rf.getDomElement(this.id + ":header")); + if (state) { + return $(rf.getDomElement(this.id + ":header:" + state)); + } + + return res; + }, + + /** + * @return {jQuery Object} + * */ + __content : function () { + if (!this.__content_) { + this.__content_ = $(rf.getDomElement(this.id)); + } + return this.__content_; + }, + + /** + * @private + * + * used in TogglePanel + * */ + __enter : function () { + + this.__content().show(); + this.__header("inactive").hide(); + this.__header("active").show(); + + return this.__fireEnter(); + }, + + getHeight : function (recalculate) { + if (recalculate || !this.__height) { + this.__height = $(rf.getDomElement(this.id)).outerHeight(true) + } + + return this.__height; + }, + + /** + * @private + * + * used in TogglePanel + * */ + __leave : function () { + var continueProcess = this.__fireLeave(); + if (!continueProcess) { + return false; + } + + this.__content().hide(); + this.__header("active").hide(); + this.__header("inactive").show(); + + return true; + }, + + /***************************** Private Methods ********************************************************/ + + + destroy: function () { + var parent = this.getTogglePanel(); + delete parent.getItems()[this.index]; + + rf.Event.unbindById(this.id, "."+this.namespace); + + this.$super.destroy.call(this); + } + }); +})(jQuery, RichFaces); Added: trunk/ui/output/ui/src/main/resources/META-INF/resources/org.richfaces/TabPanel.js =================================================================== --- trunk/ui/output/ui/src/main/resources/META-INF/resources/org.richfaces/TabPanel.js (rev 0) +++ trunk/ui/output/ui/src/main/resources/META-INF/resources/org.richfaces/TabPanel.js 2010-09-14 15:38:08 UTC (rev 19199) @@ -0,0 +1,59 @@ +/* + * JBoss, Home of Professional Open Source + * Copyright ${year}, Red Hat, Inc. and individual contributors + * by the @authors tag. See the copyright.txt in the distribution for a + * full listing of individual contributors. + * + * This is free software; you can redistribute it and/or modify it + * under the terms of the GNU Lesser General Public License as + * published by the Free Software Foundation; either version 2.1 of + * the License, or (at your option) any later version. + * + * This software is distributed in the hope that it will be useful, + * but WITHOUT ANY WARRANTY; without even the implied warranty of + * MERCHANTABILITY or FITNESS FOR A PARTICULAR PURPOSE. See the GNU + * Lesser General Public License for more details. + * + * You should have received a copy of the GNU Lesser General Public + * License along with this software; if not, write to the Free + * Software Foundation, Inc., 51 Franklin St, Fifth Floor, Boston, MA + * 02110-1301 USA, or see the FSF site: http://www.fsf.org. + */ + +(function ($, rf) { + + rf.ui = rf.ui || {}; + + rf.ui.TabPanel = rf.ui.TogglePanel.extendClass({ + // class name + name:"TabPanel", + + /** + * @class TabPanel + * @name TabPanel + * + * @constructor + * @param {String} componentId - component id + * @param {Hash} options - params + * */ + init : function (componentId, options) { + rf.ui.TogglePanel.call(this, componentId, options); + this.items = []; + + this.isKeepHeight = options["isKeepHeight"] || false + }, + + /***************************** Public Methods ****************************************************************/ + + + + /***************************** Private Methods ********************************************************/ + + + destroy: function () { + rf.Event.unbindById(this.id, "."+this.namespace); + + rf.ui.TogglePanel.destroy.call(this); + } + }); +})(jQuery, RichFaces); Modified: trunk/ui/output/ui/src/main/resources/META-INF/resources/org.richfaces/tabPanel.ecss =================================================================== --- trunk/ui/output/ui/src/main/resources/META-INF/resources/org.richfaces/tabPanel.ecss 2010-09-14 15:19:59 UTC (rev 19198) +++ trunk/ui/output/ui/src/main/resources/META-INF/resources/org.richfaces/tabPanel.ecss 2010-09-14 15:38:08 UTC (rev 19199) @@ -1,78 +1,420 @@ -*{font-family : verdana /*generalFamilyFont*/} -.rftp_bottomtab {border : 1px solid #A6A6A6 /*panelBorderColor*/; vertical-align : top; background : url(#{resource['org.richfaces:tab_bg.gif']})/*gradient - from generalBackgroundColor to tabBackgroundColor*/ top repeat-x #DAE7F5 /*tabBackgroundColor*/;} -.rftp_active_bottom {border-top : 0px; font-weight : bold; vertical-align : top; background : url(#{resource['org.richfaces:acttab_bottom_bg.gif']})/*gradient - from tabBackgroundColor to generalBackgroundColor*/ top repeat-x #C9DBEF /*additionalBackgroundColor*/;} +.rftp_bottomtab { + border: "1px solid #{richSkin.panelBorderColor}"; + vertical-align: top; +/*gradient - from generalBackgroundColor to tabBackgroundColor*/ + background: "url(#{resource['org.richfaces:tab_bg.gif']}) top repeat-x #{richSkin.tabBackgroundColor}"; +} -.rftp_bottomtab_tabline_vis {padding-bottom : 2px; overflow : hidden; height : 25px; white-space : nowrap; position : relative;} -.rftp_bottomtab_tabs {border : 0px; width : 100%; height : 100%;} -.rftp_bottomtab_spacer {border-top : 1px solid #A6A6A6 /*panelBorderColor*/;} +.rftp_active_bottom { + border-top: 0px; + font-weight: bold; + vertical-align: top; +/*gradient - from tabBackgroundColor to generalBackgroundColor*/ + background: "url(#{resource['org.richfaces:acttab_bottom_bg.gif']}) top repeat-x #{richSkin.additionalBackgroundColor}"; +} -.rftp_bottomtab_border {border : 1px solid #A6A6A6 /*panelBorderColor*/; border-bottom : 0px; height : 2px; background : #C9DBEF /*additionalBackgroundColor*/ /*tabBackgroundColor*/;} -.rftp_bottomtab_content {border : 1px solid #A6A6A6 /*panelBorderColor*/; border-bottom : 0px; font-family : verdana /*generalFamilyFont*/; font-size : 11px /*generalSizeFont*/; padding : 10px; background : #ffffff /*generalBackgroundColor*/;} +.rftp_bottomtab_tabline_vis { + padding-bottom: 2px; + overflow: hidden; + height: 25px; + white-space: nowrap; + position: relative; +} -.rftp_bottomtab_scroll_left {background : url(#{resource['org.richfaces:acttab_bg.gif']})/*gradient - from tabBackgroundColor to generalBackgroundColor*/ bottom repeat-x #C9DBEF /*additionalBackgroundColor*/; position : absolute; bottom : 1px; left : 1px; width : 15px; height : 25px; border : 1px solid #A6A6A6 /*panelBorderColor*/; font-weight : bold; text-align : center; font-family : verdana /*generalFamilyFont*/; font-size : 11px /*generalSizeFont*/; padding-top : 6px;} -.rftp_bottomtab_scroll_right {background : url(#{resource['org.richfaces:acttab_bg.gif']})/*gradient - from tabBackgroundColor to generalBackgroundColor*/ bottom repeat-x #C9DBEF /*additionalBackgroundColor*/; position : absolute; bottom : 1px; right : 17px; width : 15px; height : 25px; border : 1px solid #A6A6A6 /*panelBorderColor*/; font-weight : bold; text-align : center; font-family : verdana /*generalFamilyFont*/; font-size : 11px /*generalSizeFont*/; padding-top : 6px;} -.rftp_bottomtab_tabslist {background : url(#{resource['org.richfaces:acttab_bg.gif']})/*gradient - from tabBackgroundColor to generalBackgroundColor*/ bottom repeat-x #C9DBEF /*additionalBackgroundColor*/; position : absolute; bottom : 1px; right : 1px; width : 15px; height : 25px; border : 1px solid #A6A6A6 /*panelBorderColor*/; font-weight : bold; text-align : center; font-family : verdana /*generalFamilyFont*/; font-size : 14px; padding-top : 2px;} +.rftp_bottomtab_tabs { + border: 0px; + width: 100%; + height: 100%; +} +.rftp_bottomtab_spacer { + border-top: "1px solid #{richSkin.panelBorderColor}"; +} +.rftp_bottomtab_border { + border: "1px solid #{richSkin.panelBorderColor}"; + border-bottom: 0px; + height: 2px; + background: '#{richSkin.additionalBackgroundColor}' +/*tabBackgroundColor*/; +} -.rftp_toptab {border : 1px solid #A6A6A6 /*panelBorderColor*/; vertical-align : top; background : url(#{resource['org.richfaces:tab_bg.gif']})/*gradient - from generalBackgroundColor to tabBackgroundColor*/ top repeat-x #DAE7F5 /*tabBackgroundColor*/;} -.rftp_active_top {border-bottom : 0px; font-weight : bold; vertical-align : top; background : url(#{resource['org.richfaces:acttab_bg.gif']})/*gradient - from tabBackgroundColor to generalBackgroundColor*/ top repeat-x #C9DBEF /*additionalBackgroundColor*/;} +.rftp_bottomtab_content { + border: "1px solid #{richSkin.panelBorderColor}"; + border-bottom: 0px; + font-family: '#{richSkin.generalFamilyFont}'; + font-size: '#{richSkin.generalSizeFont}'; + padding: 10px; + background: '#{richSkin.generalBackgroundColor}'; +} -.rftp_toptab_tabline_vis {padding-top : 2px; overflow : hidden; height : 25px; white-space : nowrap; position : relative;} -.rftp_toptab_tabs {border : 0px; width : 100%; height : 100%;} -.rftp_toptab_spacer {border-bottom : 1px solid #A6A6A6 /*panelBorderColor*/;} +.rftp_bottomtab_scroll_left { +/*gradient - from tabBackgroundColor to generalBackgroundColor*/ + background: "url(#{resource['org.richfaces:acttab_bg.gif']}) bottom repeat-x #{richSkin.additionalBackgroundColor}"; + position: absolute; + bottom: 1px; + left: 1px; + width: 15px; + height: 25px; + border: "1px solid #{richSkin.panelBorderColor}"; + font-weight: bold; + text-align: center; + font-family: '#{richSkin.generalFamilyFont}'; + font-size: '#{richSkin.generalSizeFont}'; + padding-top: 6px; +} -.rftp_horizonttab_tabspacer_width {padding-left : 1px;} +.rftp_bottomtab_scroll_right { +/*gradient - from tabBackgroundColor to generalBackgroundColor*/ + background: "url(#{resource['org.richfaces:acttab_bg.gif']}) bottom repeat-x #{richSkin.additionalBackgroundColor}"; + position: absolute; + bottom: 1px; + right: 17px; + width: 15px; + height: 25px; + border: "1px solid #{richSkin.panelBorderColor}"; + font-weight: bold; + text-align: center; + font-family: '#{richSkin.generalFamilyFont}'; + font-size: '#{richSkin.generalSizeFont}'; + padding-top: 6px; +} -.rftp_icon {position : absolute; top : 4px; left : 4px} -.rftp_close {position : absolute; top : 4px; right : 4px} -.rftp_label {white-space : nowrap; font-family : verdana /*generalFamilyFont*/; font-size : 11px /*generalSizeFont*/;} +.rftp_bottomtab_tabslist { +/*gradient - from tabBackgroundColor to generalBackgroundColor*/ + background: "url(#{resource['org.richfaces:acttab_bg.gif']}) bottom repeat-x #{richSkin.additionalBackgroundColor}"; + position: absolute; + bottom: 1px; + right: 1px; + width: 15px; + height: 25px; + border: "1px solid #{richSkin.panelBorderColor}"; + font-weight: bold; + text-align: center; + font-family: '#{richSkin.generalFamilyFont}'; + font-size: 14px; + padding-top: 2px; +} -.rftp_label_container {position : relative; padding : 5px 37px 0px 22px;} +.rf-tb-hdr { + border: "1px solid #{richSkin.panelBorderColor}"; + vertical-align: top; + + /*gradient - from generalBackgroundColor to tabBackgroundColor*/ + background: "url(#{resource['org.richfaces:tab_bg.gif']}) top repeat-x #DAE7F5"; /* #{richSkin.tabBackgroundColor} */ +} -.rftp_toptab_scroll_left {background : url(#{resource['org.richfaces:acttab_bg.gif']}) top repeat-x #C9DBEF /*additionalBackgroundColor*/; position : absolute; top : 1px; left : 1px; width : 15px; height : 25px; border : 1px solid #A6A6A6 /*panelBorderColor*/; font-weight : bold; text-align : center; font-family : verdana /*generalFamilyFont*/; font-size : 11px /*generalSizeFont*/; padding-top : 6px;} -.rftp_toptab_scroll_right {background : url(#{resource['org.richfaces:acttab_bg.gif']}) top repeat-x #C9DBEF /*additionalBackgroundColor*/; position : absolute; top : 1px; right : 17px; width : 15px; height : 25px; border : 1px solid #A6A6A6 /*panelBorderColor*/; font-weight : bold; text-align : center; font-family : verdana /*generalFamilyFont*/; font-size : 11px /*generalSizeFont*/; padding-top : 6px;} -.rftp_toptab_tabslist {background : url(#{resource['org.richfaces:acttab_bg.gif']}) top repeat-x #C9DBEF /*additionalBackgroundColor*/; position : absolute; top : 1px; right : 1px; width : 15px; height : 25px; border : 1px solid #A6A6A6 /*panelBorderColor*/; font-weight : bold; text-align : center; font-family : verdana /*generalFamilyFont*/; font-size : 14px; padding-top : 2px;} +.rf-tb-hdr { + cursor : pointer; + border : 1px solid #A6A6A6; + padding : 0px 0px 3px 0px; + vertical-align : top; + background-image: 'url(#{resource['org.richfaces:tab_bg.gif']})'; + background-position: top; + background-color: #DAE7F5; + background-repeat: repeat-x; +} -.rftp_toptab_border {border : 1px solid #A6A6A6 /*panelBorderColor*/; border-top : 0px; height : 2px; background : #C9DBEF /*additionalBackgroundColor*/;} -.rf-tab-cnt {border : 1px solid #A6A6A6 /*panelBorderColor*/; border-top : 0px; font-family : verdana /*generalFamilyFont*/; font-size : 11px /*generalSizeFont*/; padding : 10px; background : #ffffff /*generalBackgroundColor*/;} -.rftp_hidden {display : none} +.rf-tb-hdr-act { + border-bottom: 0px; + font-weight: bold; + vertical-align: top; -.rftp_topmultitab_tabline_vis {border-bottom : 0px; padding-top : 2px; white-space : nowrap; position : relative;} -.rftp_topmultitab_tabs_first { border : 0px; width : 100%; height : 100%; height : 25px} -.rftp_topmultitab_tabs { border : 0px; width : 100%; height : 100%; height : 25px; margin-bottom : -1px;} -.rftp_topmultitab_spacer {border-bottom : 0px;} -.rftp_topmultitab_border {border : 1px solid #A6A6A6 /*panelBorderColor*/; border-top : 0px; height : 3px; background : #C9DBEF /*additionalBackgroundColor*/;} + /*gradient - from tabBackgroundColor to generalBackgroundColor*/ + background: "url(#{resource['org.richfaces:acttab_bg.gif']}) top repeat-x #{richSkin.additionalBackgroundColor}"; +} -.rftp_multitab_line_1 {width : 17%} -.rftp_multitab_line_2 {width : 50%} +rf-tb-hdr-inact { +} +rf-tb-hdr-dis { +} -.rftp_bottommultitab_tabline_vis {border : 1px solid #A6A6A6 /*panelBorderColor*/; background :url(#{resource['org.richfaces:tabline_bg.gif']}) top repeat-x #EEF4FB; border-top : 0px; padding-bottom : 2px; white-space : nowrap; position : relative;} -.rftp_bottommultitab_tabs_first { border : 0px; width : 100%; height : 100%; height : 25px} -.rftp_bottommultitab_tabs { border : 0px; width : 100%; height : 100%; height : 25px; margin-top : -1px;} -.rftp_bottommultitab_spacer {border-top : 0px;} -.rftp_bottommultitab_border {border : 1px solid #A6A6A6 /*panelBorderColor*/; border-bottom : 0px; height : 3px; background : #C9DBEF /*additionalBackgroundColor*/;} +.rf-tb-hdr_tabline_vis { + padding-top: 2px; + overflow: hidden; + height: 25px; + white-space: nowrap; + position: relative; +} +.rf-tb-hdr_tabs { + border: 0px; + width: 100%; + height: 100%; +} -.rftp_label_vert {white-space : nowrap; font-family : verdana /*generalFamilyFont*/; font-size : 11px /*generalSizeFont*/; padding : 5px 0px 5px 0px;} -.rftp_label_container_vert {position : relative; padding : 0px 37px 0px 22px;} +.rf-tb-hdr_spacer { + border-bottom: "1px solid #{richSkin.panelBorderColor}"; +} +.rftp_horizonttab_tabspacer_width { + padding-left: 1px; +} +.rftp_label { + white-space: nowrap; + font-family: '#{richSkin.generalFamilyFont}'; + font-size: '#{richSkin.generalSizeFont}'; +} -.rftp_lefttab {border : 1px solid #A6A6A6 /*panelBorderColor*/; padding : 2px 0px 2px 0px; vertical-align : middle; background : url(#{resource['org.richfaces:tab_bg.gif']}) top right repeat-x #DAE7F5; margin-right : -1px} -.rftp_lefttab_active {border-right : 0px; font-weight : bold; vertical-align : middle; background : url(#{resource['org.richfaces:actlefttab_bg.gif']}) top left repeat-y #C9DBEF /*additionalBackgroundColor*/; width : 100%;} -.rftp_verttab_spacer {padding-top : 1px;} +.rftp_label_container { + position: relative; + padding: 5px 37px 0px 22px; +} -.rftp_lefttab_border {border : 1px solid #A6A6A6 /*panelBorderColor*/; padding-left : 2px; background : #C9DBEF /*additionalBackgroundColor*/;} -.rftp_lefttab_content {width : 100%; border : 1px solid #A6A6A6 /*panelBorderColor*/; border-left : 0px; font-family : verdana /*generalFamilyFont*/; font-size : 11px /*generalSizeFont*/; padding : 10px; background : #ffffff /*generalBackgroundColor*/; vertical-align : top;} +.rf-tb-hdr_scroll_left { + background: "url(#{resource['org.richfaces:acttab_bg.gif']}) top repeat-x #{richSkin.additionalBackgroundColor}"; + position: absolute; + top: 1px; + left: 1px; + width: 15px; + height: 25px; + border: "1px solid #{richSkin.panelBorderColor}"; + text-align: center; + font-weight: bold; + font-family: '#{richSkin.generalFamilyFont}'; + font-size: '#{richSkin.generalSizeFont}'; + padding-top: 6px; +} +.rf-tb-hdr_scroll_right { + background: "url(#{resource['org.richfaces:acttab_bg.gif']}) top repeat-x #{richSkin.additionalBackgroundColor}"; + position: absolute; + top: 1px; + right: 17px; + width: 15px; + height: 25px; + border: "1px solid #{richSkin.panelBorderColor}"; + text-align: center; + font-family: '#{richSkin.generalFamilyFont}'; + font-size: '#{richSkin.generalSizeFont}'; + font-weight: bold; + padding-top: 6px; +} -.rftp_righttab {border : 1px solid #A6A6A6 /*panelBorderColor*/; padding : 2px 0px 2px 0px; vertical-align : middle; background : url(#{resource['org.richfaces:tab_bg.gif']}) top right repeat-x #DAE7F5; margin-left : -1px} -.rftp_righttab_active {border-left : 0px; font-weight : bold; vertical-align : middle; background : url(#{resource['org.richfaces:actrighttab_bg.gif']}) top right repeat-y #C9DBEF /*additionalBackgroundColor*/; width : 100%;} -.rftp_righttab_spacer {padding-top : 1px;} +.rf-tb-hdr_tabslist { + background: "url(#{resource['org.richfaces:acttab_bg.gif']}) top repeat-x #{richSkin.additionalBackgroundColor}"; + position: absolute; + top: 1px; + right: 1px; + width: 15px; + height: 25px; + border: "1px solid #{richSkin.panelBorderColor}"; + font-weight: bold; + text-align: center; + font-family: '#{richSkin.generalFamilyFont}'; + font-size: 14px; + padding-top: 2px; +} -.rftp_righttab_border {border : 1px solid #A6A6A6 /*panelBorderColor*/; padding-right : 2px; background : #C9DBEF /*additionalBackgroundColor*/;} -.rftp_righttab_content {width : 100%; border : 1px solid #A6A6A6 /*panelBorderColor*/; border-right : 0px; font-family : verdana /*generalFamilyFont*/; font-size : 11px /*generalSizeFont*/; padding : 10px; background : #ffffff /*generalBackgroundColor*/; vertical-align : top;} +.rf-tb-hdr_border { + border: "1px solid #{richSkin.panelBorderColor}"; + border-top: 0px; + height: 2px; + background: '#{richSkin.additionalBackgroundColor}'; +} +.rf-tb-cnt { + border: "1px solid #{richSkin.panelBorderColor}"; + border-top: 0px; + font-family: '#{richSkin.generalFamilyFont}'; + font-size: '#{richSkin.generalSizeFont}'; + padding: 10px; + background: '#{richSkin.generalBackgroundColor}'; +} + +.rftp_hidden { + display: none +} + +.rftp_topmultitab_tabline_vis { + border-bottom: 0px; + padding-top: 2px; + white-space: nowrap; + position: relative; +} + +.rftp_topmultitab_tabs_first { + border: 0px; + width: 100%; + height: 100%; + height: 25px +} + +.rftp_topmultitab_tabs { + border: 0px; + width: 100%; + height: 100%; + height: 25px; + margin-bottom: -1px; +} + +.rftp_topmultitab_spacer { + border-bottom: 0px; +} + +.rftp_topmultitab_border { + border: "1px solid #{richSkin.panelBorderColor}"; + border-top: 0px; + height: 3px; + background: '#{richSkin.additionalBackgroundColor}'; +} + +.rftp_multitab_line_1 { + width: 17% +} + +.rftp_multitab_line_2 { + width: 50% +} + +.rftp_bottommultitab_tabline_vis { + border: "1px solid #{richSkin.panelBorderColor}"; + background: "url(#{resource['org.richfaces:tabline_bg.gif']}) top repeat-x #EEF4FB"; + border-top: 0px; + padding-bottom: 2px; + white-space: nowrap; + position: relative; +} + +.rftp_bottommultitab_tabs_first { + border: 0px; + width: 100%; + height: 100%; + height: 25px +} + +.rftp_bottommultitab_tabs { + border: 0px; + width: 100%; + height: 100%; + height: 25px; + margin-top: -1px; +} + +.rftp_bottommultitab_spacer { + border-top: 0px; +} + +.rftp_bottommultitab_border { + border: "1px solid #{richSkin.panelBorderColor}"; + border-bottom: 0px; + height: 3px; + background: '#{richSkin.additionalBackgroundColor}'; +} + +.rftp_label_vert { + white-space: nowrap; + font-family: '#{richSkin.generalFamilyFont}'; + font-size: '#{richSkin.generalSizeFont}'; + padding: 5px 0px 5px 0px; +} + +.rftp_label_container_vert { + position: relative; + padding: 0px 37px 0px 22px; +} + +.rftp_lefttab { + border: "1px solid #{richSkin.panelBorderColor}"; + padding: 2px 0px 2px 0px; + vertical-align: middle; + background: "url(#{resource['org.richfaces:tab_bg.gif']}) top right repeat-x #DAE7F5"; + margin-right: -1px +} + +.rftp_lefttab_active { + border-right: 0px; + font-weight: bold; + vertical-align: middle; + background: "url(#{resource['org.richfaces:actlefttab_bg.gif']}) top left repeat-y #{richSkin.additionalBackgroundColor}"; + width: 100%; +} + +.rftp_verttab_spacer { + padding-top: 1px; +} + +.rftp_lefttab_border { + border: "1px solid #{richSkin.panelBorderColor}"; + padding-left: 2px; + background: '#{richSkin.additionalBackgroundColor}'; +} + +.rftp_lefttab_content { + width: 100%; + border: "1px solid #{richSkin.panelBorderColor}"; + border-left: 0px; + font-family: '#{richSkin.generalFamilyFont}'; + font-size: '#{richSkin.generalSizeFont}'; + padding: 10px; + background: '#{richSkin.generalBackgroundColor}'; + vertical-align: top; +} + +.rftp_righttab { + border: "1px solid #{richSkin.panelBorderColor}"; + padding: 2px 0px 2px 0px; + vertical-align: middle; + background: "url(#{resource['org.richfaces:tab_bg.gif']}) top right repeat-x #DAE7F5"; + margin-left: -1px +} + +.rftp_righttab_active { + border-left: 0px; + font-weight: bold; + vertical-align: middle; + background: "url(#{resource['org.richfaces:actrighttab_bg.gif']}) top right repeat-y #{richSkin.additionalBackgroundColor}"; + width: 100%; +} + +.rftp_righttab_spacer { + padding-top: 1px; +} + +.rftp_righttab_border { + border: "1px solid #{richSkin.panelBorderColor}"; + padding-right: 2px; + background: '#{richSkin.additionalBackgroundColor}'; +} + +.rftp_righttab_content { + width: 100%; + border: "1px solid #{richSkin.panelBorderColor}"; + border-right: 0px; + font-family: '#{richSkin.generalFamilyFont}'; + font-size: '#{richSkin.generalSizeFont}'; + padding: 10px; + background: '#{richSkin.generalBackgroundColor}'; + vertical-align: top; +} + +.rftp_active_top { cursor : default; border-bottom : 1px solid #C9DBEF; font-weight : bold; padding : 0px 0px 0px 0px; vertical-align : top; background : url(acttab_bg.gif) top repeat-x #C9DBEF;} +.rftp_active2_top { cursor : default; border-bottom : 1px solid #FFFFFF; font-weight : bold; padding : 0px 0px 0px 0px; vertical-align : top; background : url(acttab2_bg.gif) top repeat-x #FFFFFF;} + +.rftp_toptab_tabline_vis {border : 1px solid #a6a6a6; background :url(tabline_bg.gif) top repeat-x #EEF4FB; border-bottom : 0px; padding-top : 2px; overflow : hidden; white-space : nowrap; position : relative;} +.rftp_toptab_tabline_dis {border-bottom : 0px; padding-top : 2px; overflow : hidden; white-space : nowrap; position : relative;} + +.rftp_toptab_tabs {border-collapse : collapse; border : 0px; height : 100%;} +.rftp_toptab_spacer {border-bottom : 1px solid #A6A6A6;} +.rftp_horizonttab_tabspacer_width {padding-left : 1px;} + +.rftp_icon {margin : 4px 0px 0px 5px; vertical-align : top;} +.rftp_close {margin : 4px 5px 0px 10px; vertical-align : top;} +.rftp_label {display : inline-block; font-family : verdana; font-size : 11px; padding : 5px 0px 2px 0px;} + +.rftp_toptab_scroll_left {background : url(acttab_bg.gif) top repeat-x #C9DBEF; position : absolute; top : 1px; left : 1px; width : 15px; height : 250px; border : 1px solid #a6a6a6; font-weight : bold; text-align : center; font-family : verdana; font-size : 11px; padding-top : 6px;} +.rftp_toptab_scroll_right {background : url(acttab_bg.gif) top repeat-x #C9DBEF; position : absolute; top : 1px; right : 17px; width : 15px; height : 250px; border : 1px solid #a6a6a6; font-weight : bold; text-align : center; font-family : verdana; font-size : 11px; padding-top : 6px;} +.rftp_toptab_tabslist {background : url(acttab_bg.gif) top repeat-x #C9DBEF; position : absolute; top : 1px; right : 1px; width : 15px; height : 250px; border : 1px solid #a6a6a6; font-weight : bold; text-align : center; font-family : verdana; font-size : 14px; padding-top : 2px;} + +.rf-tb-hdr_border { + border : 1px solid #A6A6A6; + border-top : 0px; + height : 2px; + background : #C9DBEF; +} + +.rftp_toptab_content {border : 1px solid #A6A6A6; border-top : 0px; font-family : verdana; font-size : 11px; padding : 10px; background : #ffffff;} +.rftp_hidden {display : none}