Quantcast

Location of assets

classic Classic list List threaded Threaded
2 messages Options
Reply | Threaded
Open this post in threaded view
|  
Report Content as Inappropriate

Location of assets

Jaroslav Ciml
Hi,

I am trying to figure out what is the correct location of assets with Tapestry 5.4 and Maven directory structure.

I will explain how do I understand it. Correct what is wrong please.

From logical point of view, I can think of two types of assets - global and comopnent specific.

A global asset is e.g. a PNG image that is used as a background in various places in the application, i.e. it is referenced in many Tapestry components. Such global assets are called "context assets" in Tapestry.

A component specific asset is say a CSS file that defines style just for the HTML markup generated by one specific Tapestry component. Such component specific assets are called "class path assets" in Tapestry.

Suppose that I have some Tapestry component with CSS file and a global PNG image.

The tml and java files for the component are located in:
src/main/java/com/somecompany/myapp/view/components/MyComponent.java
src/main/resources/com/somecompany/myapp/view/components/MyComponent.tml

And this is the appropriate configuration in web.xml:
<context-param>
  <param-name>tapestry.app-package</param-name>
  <param-value>com.somecompany.myapp.view</param-value>
</context-param>

The global PNG file is located in:
src/main/webapp/images/myimage.png

The CSS file that is related just to MyComponent is located in:
src/main/resources/META-INF/assets/MyComponent.css

and the CSS is imported in MyComponent.java:
@Import(stylesheet = "MyComponent.css")

Do these locations make sense please?

If so, is it possible to reference the global PNG from the component specific CSS?
ul.my-component-menu {
  background-image: url('what_should_be_here/myimage.png');
}

Thanks.
Jarda
---------------------------------------------------------------------
To unsubscribe, e-mail: [hidden email]
For additional commands, e-mail: [hidden email]

Reply | Threaded
Open this post in threaded view
|  
Report Content as Inappropriate

Re: Location of assets

Marvin Monroe
Hi Jarda,

you just use the path relative to your servlet context.

> background-image: url('/images/myimage.png');


this could work. If your app is not deployed under the root context but under /foo-bar/ then I guess this should work:

background-image: url('/foo-bar/images/myimage.png‘);

If both, your images and your css files are stored in src/main/webapp you can also use relative paths:

background-image: url('../images/myimage.png‘);

That being said, I prefer to have all assets in META-INF/images and META-INF/css for example. Relative paths have the advantage that Tapestry will give you an error if any image isn’t where it should be if you reference it via relative paths. That check does not apply for absolute paths (starting with a slash).

Cheers,
Christian



> Am 24.02.2017 um 12:59 schrieb Jaroslav Ciml <[hidden email]>:
>
> Hi,
>
> I am trying to figure out what is the correct location of assets with Tapestry 5.4 and Maven directory structure.
>
> I will explain how do I understand it. Correct what is wrong please.
>
> From logical point of view, I can think of two types of assets - global and comopnent specific.
>
> A global asset is e.g. a PNG image that is used as a background in various places in the application, i.e. it is referenced in many Tapestry components. Such global assets are called "context assets" in Tapestry.
>
> A component specific asset is say a CSS file that defines style just for the HTML markup generated by one specific Tapestry component. Such component specific assets are called "class path assets" in Tapestry.
>
> Suppose that I have some Tapestry component with CSS file and a global PNG image.
>
> The tml and java files for the component are located in:
> src/main/java/com/somecompany/myapp/view/components/MyComponent.java
> src/main/resources/com/somecompany/myapp/view/components/MyComponent.tml
>
> And this is the appropriate configuration in web.xml:
> <context-param>
>  <param-name>tapestry.app-package</param-name>
>  <param-value>com.somecompany.myapp.view</param-value>
> </context-param>
>
> The global PNG file is located in:
> src/main/webapp/images/myimage.png
>
> The CSS file that is related just to MyComponent is located in:
> src/main/resources/META-INF/assets/MyComponent.css
>
> and the CSS is imported in MyComponent.java:
> @Import(stylesheet = "MyComponent.css")
>
> Do these locations make sense please?
>
> If so, is it possible to reference the global PNG from the component specific CSS?
> ul.my-component-menu {
>  background-image: url('what_should_be_here/myimage.png');
> }
>
> Thanks.
> Jarda
> ---------------------------------------------------------------------
> To unsubscribe, e-mail: [hidden email]
> For additional commands, e-mail: [hidden email]
>


---------------------------------------------------------------------
To unsubscribe, e-mail: [hidden email]
For additional commands, e-mail: [hidden email]

Loading...