>From: "Richard Eggert" <[EMAIL PROTECTED]>
>
> I've run into a very basic problem using Clay that I'm not sure how to solve.
>
> Here's the setup:
>
> I have a JSP file (we'll call it page.jsp) that contains a single tag
> that points to an HTML template in a subdirectory (we'll call it
> /templates/blah/foo.html). The HTML template references an image file in a
> completely different directory (/images/bar.jpg).
>
> How do I get the image to display properly both when rendered by Clay and
> when
> just loaded as a mockup?
>
> When loaded through the JSP using Clay, the image file's relative path is
> images/bar.jpg. However, when the HTML is loaded directly with a browser
> either
> online or offline, the image file's relative path is instead
> ../../images/bar.jpg.
>
> Using the absolute path (/appName/images/bar.jpg) works for both forms of
> online
> viewing (via JSP and as mockup), but it doesn't work for offline viewing
> (since
> the absolute path then becomes
> /full/filesystem/path/to/appName/images/bar.jpg),
> and I'd also rather not hard-code my application's context root into my HTML.
>
> I thought of using a tag with jsfid="void", but that doesn't work, since
> only accepts full URL's and not relative paths.
>
> Does anyone know of a way around this?
>
You might try something like this:
<component jsfid="imageBar" extends="h:graphicImage">
<attributes>
<set name="url" value="/images/bar.jpg"/>
</attributes>
</component>
<img jsfid="imageBar" src="/appName/images/bar.jpg"/>
> Incidentally, the same issue arises with links to stylesheets.
>
You would be better off looking for a component, but something like this might
work too:
<component jsfid="mycssLink" extends="clay:clayOut">
<attributes>
<set name="excapeXml" value="false"/>
<set name="value" value="<link jsfid="mycssLink"
type="text/css" rel="stylesheet" id="csslink"
href="/mycss.css" />"/>
</attributes>
</component>
<link jsfid="mycssLink" type="text/css" rel="stylesheet" id="csslink"
href="/appName/images/mycss.css" />
Another option would be to use the comment blocks to remove the CSS used for
developement.
<!-- ### clay:remove ### -->
<link type="text/css" rel="stylesheet" id="csslink"
href="/appName/images/mycss.css" />
<!-- ### /clay:remove ### -->
<link type="text/css" rel="stylesheet" id="csslink" href="/mycss.css" />
>
> Rich Eggert
> Member of Technical Staff
> Proteus Technologies, LLC
> http://www.proteus-technologies.com
>
>
Gary
