6 Replies Latest reply on Mar 20, 2009 6:08 AM by Nick Belaevski

    RichFaces skin problem

    Marius Semenas Newbie

      Hi all,

      I'm using RichFaces 3.1.5.GA (I need to support JSF 1.1). AJAX support components works fine. But visual components (Panel, ModalPanel) appears with no style applied. Everything looks fine when I deploy RichFaces test application to Tomcat as a separate application. It seems as if XCSS files aren't converted to a CSS in my application. HTML file contains links to stylesheets:

      <link rel='stylesheet' class='component' type='text/css' href='/epts/faces/a4j_3_1_5.GAorg/richfaces/renderkit/html/css/modalPanel.xcss/DATB/eAGLZKr5DAADWQHL' />
      <link rel='stylesheet' class='component' type='text/css' href='/epts/faces/a4j_3_1_5.GAcss/panel.xcss/DATB/eAGLZKr5DAADWQHL' />
      


      Contents of the first stylesheet:

      <template xmlns:f="http:/jsf.exadel.com/template" xmlns:u="http:/jsf.exadel.com/template/util"
       xmlns="http://www.w3.org/1999/xhtml">
       <verbatim></verbatim>
       <selector name=".dr-pnl">
       <style name="background-color" skin="generalBackgroundColor"></style>
       <style name="border-color" skin="panelBorderColor"></style>
       </selector>
       <selector name=".dr-pnl-h">
       <style name="background-color" skin="headerBackgroundColor"></style>
       <style name="border-color" skin="headerBackgroundColor"></style>
       <style name="font-size" skin="headerSizeFont"></style>
       <style name="color" skin="headerTextColor"></style>
       <style name="font-weight" skin="headerWeightFont"></style>
       <style name="font-family" skin="headerFamilyFont"></style>
       <style name="background-image">
       <resource f:key="org.richfaces.renderkit.html.GradientA"></resource>
       </style>
       </selector>
       <selector name=".dr-pnl-b">
       <style name="font-size" skin="generalSizeFont"></style>
       <style name="color" skin="generalTextColor"></style>
       <style name="font-family" skin="generalFamilyFont"></style>
       </selector>
      </template>
      


      RichFaces test application generated a little bit different link to a stylesheet:

      <link rel='stylesheet' class='component' type='text/css' href='/richfaces-test-jsp/a4j_3_1_5.GAorg/richfaces/renderkit/html/css/modalPanel.xcss/DATB/eAGb2nBoCQAGAAJ8.jsf' />
      <link rel='stylesheet' class='component' type='text/css' href='/richfaces-test-jsp/a4j_3_1_5.GAcss/panel.xcss/DATB/eAGb2nBoCQAGAAJ8.jsf' />
      


      and these stylesheets contains standard CSS.
      Any ideas what's wrong with my application?

      Regards,
      Marius

        • 1. Re: RichFaces skin problem
          Nick Belaevski Master

          Hi Marius,

          Please post your web.xml.

          • 2. Re: RichFaces skin problem
            Marius Semenas Newbie

             

            <?xml version="1.0" encoding="UTF-8"?>
            <web-app xmlns:xsi="http://www.w3.org/2001/XMLSchema-instance"
             xmlns="http://java.sun.com/xml/ns/j2ee"
             xsi:schemaLocation="http://java.sun.com/xml/ns/j2ee http://java.sun.com/xml/ns/j2ee/web-app_2_4.xsd"
             id="WebApp_ID" version="2.4">
            
             <context-param>
             <param-name>javax.faces.STATE_SAVING_METHOD</param-name>
             <param-value>server</param-value>
             </context-param>
             <context-param>
             <param-name>javax.faces.CONFIG_FILES</param-name>
             <param-value>
             /WEB-INF/faces/common.xml,
             /WEB-INF/faces/administravimas.xml
             </param-value>
             </context-param>
            
             <context-param>
             <param-name>org.richfaces.SKIN</param-name>
             <param-value>blueSky</param-value>
             </context-param>
            
             <welcome-file-list>
             <welcome-file>index.jspx</welcome-file>
             </welcome-file-list>
             <servlet>
             <servlet-name>FacesServlet</servlet-name>
             <servlet-class>javax.faces.webapp.FacesServlet</servlet-class>
             <load-on-startup>1</load-on-startup>
             </servlet>
             <servlet-mapping>
             <servlet-name>FacesServlet</servlet-name>
             <url-pattern>/faces/*</url-pattern>
             </servlet-mapping>
            
             <filter>
             <display-name>RichFaces Filter</display-name>
             <filter-name>richfaces</filter-name>
             <filter-class>org.ajax4jsf.Filter</filter-class>
             </filter>
             <filter-mapping>
             <filter-name>richfaces</filter-name>
             <servlet-name>FacesServlet</servlet-name>
             <dispatcher>REQUEST</dispatcher>
             <dispatcher>FORWARD</dispatcher>
             <dispatcher>INCLUDE</dispatcher>
             </filter-mapping>
            
             <filter>
             <filter-name>MyFacesExtensionsFilter</filter-name>
             <filter-class>org.apache.myfaces.webapp.filter.ExtensionsFilter</filter-class>
             <init-param>
             <param-name>uploadMaxFileSize</param-name>
             <param-value>20m</param-value>
             </init-param>
             </filter>
             <filter-mapping>
             <filter-name>MyFacesExtensionsFilter</filter-name>
             <servlet-name>FacesServlet</servlet-name>
             </filter-mapping>
             <filter-mapping>
             <filter-name>MyFacesExtensionsFilter</filter-name>
             <url-pattern>/faces/myFacesExtensionResource/*</url-pattern>
             </filter-mapping>
            
             <error-page>
             <exception-type>java.lang.Throwable</exception-type>
             <location>/klaida.jspx</location>
             </error-page>
             <session-config>
             <session-timeout>5</session-timeout>
             </session-config>
            </web-app>
            


            • 3. Re: RichFaces skin problem
              Nick Belaevski Master

              Thanks, web.xml looks ok. You use prefix mapping (/faces/*), that's why generated URLs differ. As far as I can see, stylesheet can be problem. Please try to rewrite it not omitting name prefix (e.g. using f:verbatim, u:selector, etc.)

              • 4. Re: RichFaces skin problem
                Marius Semenas Newbie

                After some debugging I found that the TemplateCSSRenderer.getTemplate method returns different results for my and rich faces test application. There is some test code:

                HtmlCompiler compiler = new HtmlCompiler();
                ClassLoader loader = Thread.currentThread().getContextClassLoader();
                InputStream resourceAsStream = URLToStreamHelper.urlToStreamSafe(loader.getResource("org/richfaces/renderkit/html/css/panel.xcss"));
                
                Vector<Byte> v = new Vector<Byte>();
                byte[] bytes = new byte[1024];
                try {
                 int n = 1;
                 while (n > 0) {
                 n = resourceAsStream.read(bytes);
                 for (int i = 0; i < n; i++) {
                 v.add(bytes);
                 }
                 }
                 } catch (IOException e) {
                 e.printStackTrace();
                 } finally {
                 try { resourceAsStream.close(); } catch (Exception e) { }
                 }
                
                 System.out.println(v);
                


                It shows that in both applications the same byte sequence is read, but HtmlCompiler returns different PreparedTemplate object. The rich faces test application gets:

                org.ajax4jsf.renderkit.compiler.RootElement [
                 org.ajax4jsf.renderkit.compiler.TextElement [
                ]
                 ;
                 org.ajax4jsf.renderkit.compiler.SelectorElement [
                 org.ajax4jsf.renderkit.compiler.ClassElement [
                ]
                 ;
                ...
                


                My application:
                org.ajax4jsf.renderkit.compiler.RootElement [
                 org.ajax4jsf.renderkit.compiler.PlainElement [
                 org.ajax4jsf.renderkit.compiler.PlainElement [
                ]
                 ;
                 org.ajax4jsf.renderkit.compiler.PlainElement [
                 org.ajax4jsf.renderkit.compiler.PlainElement [
                ]
                 ;
                 org.ajax4jsf.renderkit.compiler.PlainElement [
                ]
                 ;
                ...
                


                Marius

                • 5. Re: RichFaces skin problem
                  Marius Semenas Newbie

                  I found the problem. These applications use different XML parsers. It seems as if Rich Faces CSS template parsing doesn't work with Oracle XML parser V2. When Oracle parser is used Apache Digester gets local names of CSS template elements (namespace info is omitted) and it doesn't match any of rules defined in org.ajax4jsf.renderkit.compiler.HtmlCompiler. That's why CSS template compilation fails.
                  I just looked at the most current HtmlCompiler source version. It seems that nothing has been changed from 3.1.5.GA version.

                  Marius