title: Load p:graphicImage using ajax on show
body: <p>I want to create gallery for images which uses <code>&lt;p:galleryImage/&gt;</code>. The problem is that when gallery contains a lot of images it download all of them and after that shows them. It is really annoying and it must work in different way. Now gallery looks like this:</p>
  
  <pre><code>&lt;p:lightBox&gt;
      &lt;h:commandButton class="button  button-1-3 graphics-portfolio-plakaty" onclick="plakaty.show();" /&gt;
      &lt;f:facet name="inline"&gt;
          &lt;p:galleria value="#{galleryBean.imageNames}" var="imageName" panelWidth="800" panelHeight="500"&gt;  
              &lt;p:graphicImage value="/gallery?img=#{imageName}" cache="false" /&gt;
          &lt;/p:galleria&gt;
      &lt;/f:facet&gt;
  &lt;/p:lightBox&gt;
  </code></pre>
  
  <p>I want to load images using ajax so it should look like this.    </p>
  
  <pre><code>&lt;p:lightBox&gt;
      &lt;h:commandButton class="button  button-1-3 graphics-portfolio-plakaty" onclick="plakaty.show();" /&gt;
      &lt;f:facet name="inline"&gt;
          &lt;p:galleria value="#{galleryBean.imageNames}" var="imageName" panelWidth="800" panelHeight="500"&gt;  
              &lt;p:graphicImage value="/gallery?img=#{imageName}" cache="false"&gt;
                  &lt;p:ajax event="ready" /&gt;
              &lt;/p:graphicImage&gt;
          &lt;/p:galleria&gt;
      &lt;/f:facet&gt;
  &lt;/p:lightBox&gt;
  </code></pre>
  
  <p>I'm new in JSF so there may be so better way to do this or how can I load image using ajax?</p>