Resources Demo

This demo explains how Resources from the dialog resources folder, the webContent folder or the CMS can be used.

For using resources use the following code:

<h:outputStylesheet name="folder/style.css"/>Adds the stylesheet style.css to the HTML page.
<h:outputScript name="folder/script.js"/>Adds the script script.js to the HTML page.
<h:graphicImage name="folder/image.png"/>Adds the image image.png to the HTML page.
#{resource['folder/file.txt']}Adds the url of the file.txt to the HTML page.

Examples:

coderesultdescription
<h:graphicImage name="images/dialog.png"/>DialogIf no library is defined then a resource is first searched within the dialog resources folder. If not found there then it is searched within the webcontent folder.

Folder structure:

/ch.ivyteam.htmldialog.demo.ResourceDemo
  /resources
    /images
      dialog.png
      image.png
/webcontent
  /images
    webcontent.png
    image.png
<h:graphicImage name="images/webcontent.png"/>Webcontent
<h:graphicImage name="images/image.png"/>Dialog
<h:graphicImage library="ivy-dialog" name="images/image.png"/>DialogWith library ivy-dialog the resource is always loaded from the Html Dialog resources folder.
<h:graphicImage library="ivy-webcontent" name="images/image.png"/>WebcontentWith library ivy-webcontent the resource is always loaded form the webcontent folder.
<h:graphicImage library="ivy-cms" name="images/image"/>CmsWith library ivy-cms the resource is always loaded form the CMS.
<h:outputLink value="#{resource['ivy-cms:images/image']}"> Link to Image </h:outputLink> Link to ImageThe expression can be used to get the URL of a resource (can also be used in resources like css files e.g. to reference images).
<p:graphicImage value="#{logic.streamedImage}"/>The expression #{logic.streamedImage} must evaluate to an org.primefaces.model.StreamedContent. See also GraphicImage in the Primefaces showcase.