title: Unitegallery not working with repeat control
body: <p>I would like to use Unitegallery carrousel with some pictures who's urls are in a view. I tried the following :</p>
  
  <pre><code>&lt;xp:this.resources&gt;  
  &lt;xp:script src="/JQueryXSnippet.js" clientSide="true"&gt;&lt;/xp:script&gt;
  &lt;/xp:this.resources&gt;
  
  &lt;script type='text/javascript' src='unitegallery/js/unitegallery.min.js'&gt;&lt;/script&gt;  
  &lt;link rel='stylesheet' href='unitegallery/css/unite-gallery.css' type='text/css' /&gt;
  &lt;script type='text/javascript' src='unitegallery/themes/carousel/ug-theme-carousel.js'&gt;&lt;/script&gt;
  
  &lt;xp:this.data&gt;
      &lt;xp:dominoView var="view4" databaseName="pictures.nsf"
          viewName="pictures3" keys="demo"&gt;
      &lt;/xp:dominoView&gt;
  &lt;/xp:this.data&gt;
  
  &lt;xp:scriptBlock id="scriptBlock2"&gt;
  &lt;xp:this.value&gt;&lt;![CDATA[
  $(document).ready(
  function() {
  x$("#{id:gallery}").unitegallery({
  gallery_theme: "carousel",
  tile_width: 60,                     //tile width
  tile_height: 60,                    //tile height
  
  });
  }
  );
  ]]&gt;&lt;/xp:this.value&gt;
  &lt;/xp:scriptBlock&gt;
  
  &lt;xp:panel&gt;
  &lt;div id="gallery" style="display:none;"&gt;
  &lt;xp:repeat id="repeat6" rows="30" var="pictureData" value="#{view4}"&gt;
                      &lt;xp:text escape="false" id="computedField11"&gt;
                          &lt;xp:this.value&gt;&lt;![CDATA[#{javascript:var thisPicture= pictureData.getColumnValue("bigPicture");
  dezeAfbeeldingen ="&lt;img src='"+thisPicture+"'data-image='"+thisPicture+"'style='height: 60px;width: 60px;'&gt;&lt;/img&gt;";
  return dezeAfbeeldingen;}]]&gt;&lt;/xp:this.value&gt;
                      &lt;/xp:text&gt;
  &lt;/xp:repeat&gt;
    &lt;/div&gt;
    &lt;/xp:panel&gt;
  </code></pre>
  
  <p>The result : nothing is displayed.
  In Google chrome console I get an error : "Uncaught Error: The item should not be image type " and at the right side         unitegallery.min.js:4"</p>
  
  <p>The repeat is run , the pictures are found , but don't display and give this error.</p>
  
  <p>When I replace the repeat with "hardcoded " image references everything seems to work....</p>
  
  <p><strong>EDIT</strong></p>
  
  <p>thisPicture is in fact the complete url of the picture so for example : 
  server/product/picture.nsf/O/unid/$File/picturename.jpg</p>
  
  <p>HTML output : </p>
  
  <pre><code>&lt;!DOCTYPE html&gt;
  &lt;html lang="nl"&gt;
  &lt;head&gt;
  &lt;title&gt;&lt;/title&gt;
  &lt;meta name="viewport" content="width=device-width, initial-scale=1"&gt;
  &lt;meta name="viewport" content="width=device-width, initial-scale=1"&gt;
  &lt;link rel="stylesheet" type="text/css" href="/xsp/.ibmxspres/.mini/css/2Eabootstrap/xsptheme/xsp.css&amp;amp;2Eabootstrap/bootstrap311/css/bootstrap.min.css&amp;amp;@Da&amp;amp;2Eabootstrap/xpages300.css.css"&gt;
  &lt;script type="text/javascript"&gt;var dojoConfig = {locale: 'nl-nl'};&lt;/script&gt;
  &lt;script type="text/javascript" src="/xsp/.ibmxspres/dojoroot-1.9.4/dojo/dojo.js"&gt;&lt;/script&gt;
  &lt;script type="text/javascript" src="/xsp/.ibmxspres/.mini/dojo/.nl-nl/@Iq.js"&gt;&lt;/script&gt;
  &lt;script type="text/javascript"&gt;dojo.require("ibm.xsp.widget.layout.xspClientDojo")&lt;/script&gt;
  &lt;script type="text/javascript" src="/xsp/.ibmxspres/.extlib/bootstrap/jquery/jquery-1.11.0.min.js"&gt;&lt;/script&gt;
  &lt;script type="text/javascript" src="/xsp/.ibmxspres/.extlib/bootstrap/bootstrap311/js/bootstrap.min.js"&gt;&lt;/script&gt;
  &lt;script type="text/javascript" src="/xsp/.ibmxspres/.extlib/bootstrap/xpages300.js"&gt;&lt;/script&gt;
  &lt;link rel="stylesheet" type="text/css" href="/web/web.nsf/bootstrap.min.css"&gt;
  &lt;script type="text/javascript" src="/web/web.nsf/JQueryXSnippet"&gt;&lt;/script&gt;
  &lt;/head&gt;
  &lt;body class="xsp tundra"&gt;
  &lt;form id="view:_id1" method="post" action="/web/web.nsf/test_unite_gallery2.xsp" enctype="multipart/form-data"&gt;
  &lt;script src="unitegallery/js/unitegallery.min.js" type="text/javascript"&gt;&lt;/script&gt;&lt;link href="unitegallery/css/unite-gallery.css" rel="stylesheet" type="text/css"&gt;&lt;script src="unitegallery/themes/carousel/ug-theme-carousel.js" type="text/javascript"&gt;&lt;/script&gt;&lt;script type="text/javascript"&gt;
  $(document).ready(
  function() {
  x$("gallery").unitegallery({
  gallery_theme: "carousel",
  tile_width: 60,                     //tile width
  tile_height: 60,                    //tile height
  
  });
  }
  );
  &lt;/script&gt;
  &lt;div id="gallery" style="display:none;"&gt;&lt;div id="view:_id1:repeat6"&gt;
  &lt;span id="view:_id1:repeat6:0:computedField11"&gt;&lt;img src='server/product/picture.nsf/O/unid/$File/picturename1.jpg'data-image='server/product/picture.nsf/O/unid/$File/picturename1.jpg'style='height: 60px;width: 60px;'&gt;&lt;/img&gt;
  &lt;/span&gt;
  &lt;span id="view:_id1:repeat6:1:computedField11"&gt;&lt;img src='server/product/picture.nsf/O/unid/$File/picturename2.jpg'data-image='server/product/picture.nsf/O/unid/$File/picturename2.jpg'style='height: 60px;width: 60px;'&gt;&lt;/img&gt;
  &lt;/span&gt;
  </code></pre>
  
  <p>etc for other pictures</p>
  
  <pre><code>&lt;/div&gt;
  &lt;input type="hidden" name="$$viewid" id="view:_id1__VUID" value="!e4h2ba0vbj!"&gt;
  &lt;input type="hidden" name="$$xspsubmitid"&gt;
  &lt;input type="hidden" name="$$xspexecid"&gt;
  &lt;input type="hidden" name="$$xspsubmitvalue"&gt;
  &lt;input type="hidden" name="$$xspsubmitscroll"&gt;
  &lt;input type="hidden" name="view:_id1" value="view:_id1"&gt;&lt;/form&gt;
  &lt;/body&gt;
  &lt;/html&gt;
  </code></pre>
  
  <p><strong>EDIT2</strong></p>
  
  <p>More details about the error I get in chrome console :
  "Uncaught Error: The item should not be image type " and at the right side         unitegallery.min.js:4"</p>
  
  <p>when I click on the arrow I get more details :</p>
  
  <pre><code>fillItemsArray @ unitegallery.min.js:4
  runGallery @ unitegallery.min.js:4
  UniteGalleryMain.run @ unitegallery.min.js:4
  jQuery.fn.unitegallery @ unitegallery.min.js:9
  (anonymous function) @ test_unite_gallery2.xsp:23
  n.Callbacks.j @ jquery-1.11.0.min.js:2
  n.Callbacks.k.fireWith @ jquery-1.11.0.min.js:2
  n.extend.ready @ jquery-1.11.0.min.js:2
  K @ jquery-1.11.0.min.js:2
  </code></pre>
  
  <p>Under resources there's a red 1 behind unitegallery.min.js , and gives the same error message for it (The item should not be image type).</p>
  
  <p><strong>EDIT3</strong></p>
  
  <p>When I have a look at the difference of the html generated by the repeat or the hard coded picture references I see that there's a double " (good) and a ' (bad) for the img and src tags. How can I change that ?</p>