Gostaria de sabe se alguém já passou pela seguinte situação:
Criamos um projeto em jsf 2.0 e na divisão do diretório de pastas do webcontent surgiram algumas situações.
Já haviamos trabalhado com uma estrutura semelhante utilizando jsf 1.2 e tiles-definition e conseguíamos essa divisao de pastas perfeitamente.
Exemplo:
WEBCONTENT
CONTENT
CLIENTES
cadastroCliente.jsp
FORNECEDORES
cadastroFornecedores.jsp
O maior problema agora envolve a utilização de facelets, porque devido a herança das páginas , nosso template busca um caminho relativo de acesso ao css e as imagens do projeto, porém quando fazemos uma herança referente a este template o aplicativo para de enxergar os diretórios anteriores, ou seja, as novas págnas só enxergam de seu diretório corrente para frente .
Exemplo:
WEBCONTENT
CONTENT
RESOURCES
CSS
JS
PAGINAS
TEMPLATE
Template.xhtml
CLIENTE
cadastroCliente.xtml
por exemplo, a página cadastroCliente.xhtml não enxerga nem ao menos o template, pois está um nível acima de hierarquia.
Dessa forma estamos tendo que usar todas as páginas em um mesmo diretório. Até funciona , mas o problema é a organização, gostaríamos de ter essa estrutura de páginas bem definida.
Alguém vê alguma solução para este problema ???
Nosso ambiente:
ECLIPSE Helios + Jsf 2.0 (MOJARRA) + JPA 2.0 e hibernate + Primefaces 2.2.1 +Facelets
Amigo no JSF2 o padrao é para seus arquivos css, imagens, js fiquem dentro de resource e para importar basta fazer isso
<h:outputScript name="Arquivo.js" library="subpasta" />
<h:outputStylesheet library="subpasta" name="Arquivo.css" />
<h:graphicImage value="#{resource['subpasta/Arquivo.gif']}" />
Olá leonardobhbr, primeiramente agradeço a atenção.
Com Relação ao CSS e ao Javascript, conseguimos fazer o link entre a página Template e os arquivos CSS, e JS utilizando
<h:outputScript name=“Arquivo.js” library=“subpasta” />
<h:outputStylesheet library=“subpasta” name=“Arquivo.css” /> como Você sugeriu.
Porém quanto as imagens, ainda não tivemos sucesso.
Estamos utilizando da seguinte maneira: <h:graphicImage value=“resources/images/grid.png”></h:graphicImage>
O problema é que a página inicial reconhece a imagem perfeitamente, mas quando fazemos uma herança para uma tela filha a partir da template as imagens já não estão vindo carregadas, com o css e o javascript conseguimos, agora só precisamos resolvera questão das imagens.
Se não for incômodo você poderia nos mostrar um exemplo por favor ??
Obrigado.
att,
Para imagens utilize
h:graphicImage value="#{resource['images/grid.png']}" />
ao invés de
<h:graphicImage value="resources/images/grid.png">
Olá Amigo, boa tarde!
Conseguimos resolver a situação.
Resolução:
Mudamos a pasta resources para um diretório acima, ficando na raiz do WebContent.
E ai atualizamos os apontamentos para o novo local.
CSS
<h:outputStylesheet library="css" name="casablanca-theme.css"></h:outputStylesheet>
Imagem (Este icon está no Template.xhtml).
icon="/resources/images/grid.png"
Abaixo imagem do nosso diretório.
Obrigado pela ajuda leonardobhbr.
Abraço a todos.
exatamente o que eu precisava. esses arquivos do “resources” não podem ser acessados de forma alguma se estiverem dentro do web-inf?
Qualquer coisa sob WEB-INF está escondida para o browser.
Por exemplo, se você precisa disponibilizar um arquivo CSS ou HTML, ou um applet (.JAR), ele não pode estar sob WEB-INF (obviamente há algumas exceções, mas normalmente você não põe essas coisas sob WEB-INF).
1 curtida
