Problems, need help? Have a tip or advice? Post it here.
24 posts Page 2 of 3
Hi,

You can find a discussion on such 'phantom editables' here - viewtopic.php?f=4&t=120

Please let me know if this helps.
Yup that was relevant to my previous question.

Ok another issue came up. I have this alternate page view full of thumbnails, I would like to show all the thumbs in the particular folder including all in the group. Not sure how to change the code for the thumbs page.

Here's the code for the editables on work.php
Code: Select all
<cms:template title='Work' clonable='1'>
   <cms:editable name='work_content' type='richtext'/>
   
   <cms:editable name='group_gallery' label='Gallery' type='group'/>
   
<cms:repeat count='6' startcount='1' >
   <cms:editable
      name="gallery_img_<cms:show k_count />"
      label="Image <cms:show k_count />"
      width="500"
      height="500"
      show_preview='1'
      preview_height='200'
      group='group_gallery'
      type="image" />

   <cms:editable
      name="thumb_gallery_img_<cms:show k_count />"
      assoc_field="gallery_img_<cms:show k_count />"
      label="Thumbnail <cms:show k_count />"
      desc="Thumbnail of image above"
      width='90'
      height='90'
      group='group_gallery'
      type="thumbnail" />
    <cms:editable
      name="thumb_gallery2_img_<cms:show k_count />"
      assoc_field="gallery_img_<cms:show k_count />"
      label="Thumbnail2 <cms:show k_count />"
      desc="Thumbnail2 of image above"
      width='195'
      height='90'
      group='group_gallery'
      type="thumbnail" />
</cms:repeat>


Here's what you gave me for conditionals on work.php:
Code: Select all
                 <div class="workimg">

                        <cms:repeat count='6' startcount='1' >
                           <cms:set my_img_src="<cms:get "gallery_img_<cms:show k_count />" />" />
                       
                           <cms:if "<cms:not_empty my_img_src />" >
                              <div id="photo_<cms:show k_count />" <cms:if k_count != '1'>style="display:none;"></cms:if> ><img src="<cms:show my_img_src />" /></div>
                           </cms:if>
                        </cms:repeat>
                       
                        <ul class="sqthumbs">
                        <cms:repeat count='6' startcount='1' >   
                           <cms:set my_thumbnail_src="<cms:get "thumb_gallery_img_<cms:show k_count />" />" />
                           
                           <cms:if "<cms:not_empty my_thumbnail_src />" >
                              <li><a href="javascript:void(0)" onClick="switch_product_img('photo_<cms:show k_count />', 3);"><img src="<cms:show my_thumbnail_src />"  width="90" height="90" alt="" /></a></li>
                           </cms:if>
                        </cms:repeat>
                        </ul>
                    </div>   


Here's my existing code in work_thumbs.html:
Code: Select all
                  <div class=contentarea>
                    <cms:if k_is_folder>
                       <div class=header>
                              <img src="images/title_<cms:show k_folder_name/>.png" alt="<cms:show k_folder_title/>" />
                      </div>
                    </cms:if>
                      <div class=thumbgrid>
                        <ul>
                    <cms:pages masterpage='work.php' folder=k_folder_name>
                              <li><a href="<cms:show my_img_src />" rel="lightbox[portfolio]" title="<cms:show k_page_title/>">
                            <img src="<cms:show thumb/>"/></a></li>
                        </cms:pages>
                        </ul>
                      </div>
                    </div>
Hi,

You were almost there :)
Try this -
Code: Select all
<div class=thumbgrid>
  <ul>
  <cms:pages >
    <cms:repeat count='6' startcount='1' >   
      <cms:set my_img_src="<cms:get "gallery_img_<cms:show k_count />" />" />
      <cms:set my_thumbnail_src="<cms:get "thumb_gallery_img_<cms:show k_count />" />" />

      <cms:if "<cms:not_empty my_img_src />" >
        <li>
          <a href="<cms:show my_img_src />" rel="lightbox[portfolio]" title="<cms:show k_page_title/>">
            <img src="<cms:show my_thumbnail_src/>"/>
          </a>
        </li>
      </cms:if>
    </cms:repeat>
  </cms:pages>
  </ul>
</div>
Hey everything is working well so far!

I was wondering how I can check how many images are there so I can hide the thumbnails if there is only one image? (in place of *****)

Code: Select all
 <li  <cms:if **** == '1'>style="display:none; visibility:hidden;"></cms:if> ><a href="javascript:void(0)" onClick="switch_product_img('photo_<cms:show k_count />', 3);"><img src="<cms:show my_thumbnail_src />"  width="90" height="90" alt="" /></a></li>
To count the number of images (or the associated thumbnails) that are not empty, we can use the 'repeat' loop twice. First time to calculate this total and the second time to generate the thumbnails navigation.

Code: Select all
<cms:set my_thumbnail_count='0' />
<cms:repeat count='6' startcount='1' >   
   <cms:set my_thumbnail_src="<cms:get "thumb_gallery_img_<cms:show k_count />" />" />
   
   <cms:if "<cms:not_empty my_thumbnail_src />" >
      <cms:set my_thumbnail_count="<cms:add my_thumbnail_count '1' />" scope='global' />
   </cms:if>
</cms:repeat>

<cms:if my_thumbnail_count gt '1' >
   <ul class="sqthumbs">
   <cms:repeat count='6' startcount='1' >   
      <cms:set my_thumbnail_src="<cms:get "thumb_gallery_img_<cms:show k_count />" />" />
   
      <cms:if "<cms:not_empty my_thumbnail_src />" >
         <li><a href="javascript:void(0)" onclick="switch_product_img('photo_<cms:show k_count />', 3);"><img src="<cms:show my_thumbnail_src />"  width="90" height="90" alt="" /></a></li>
      </cms:if>
   </cms:repeat>
   </ul>
</cms:if>   

Notice how we use a variable named 'my_thumbnail_count' to contain the count of available images and how each time upon finding an image we increase this variable by '1'.
Finally we check if 'my_thumbnail_count' is greater than 0 and if it is, we generate the thumbnail navigation.
It seems to be working fine except for in work_list.html where I copied and pasted the same script as in work.php, the thumbnails are not showing up. It works fine in work.php. Not sure why this is happening.

Also, where its working on work.php, a bracket keeps showing up beside the image when i click on the second or third picture. I checked and did not see extra brackets, not sure why this is so. http://www.fouridine.com/work.php?p=25
Yes, I saw the problem.
Since in the list page, we are iterating through several pages, the first line of our code where we are resetting the count of thumbnails to zero needs to have its 'scope' attribute set to 'global' (don't worry if you don't understand it).
Code: Select all
<cms:set my_thumbnail_count='0' scope='global' />

The rectified code now becomes -
Code: Select all
<cms:set my_thumbnail_count='0' scope='global' />
<cms:repeat count='6' startcount='1' >   
   <cms:set my_thumbnail_src="<cms:get "thumb_gallery_img_<cms:show k_count />" />" />
   
   <cms:if "<cms:not_empty my_thumbnail_src />" >
      <cms:set my_thumbnail_count="<cms:add my_thumbnail_count '1' />" scope='global' />
   </cms:if>
</cms:repeat>

<cms:if my_thumbnail_count gt '1' >
   <ul class="sqthumbs">
   <cms:repeat count='6' startcount='1' >   
      <cms:set my_thumbnail_src="<cms:get "thumb_gallery_img_<cms:show k_count />" />" />
   
      <cms:if "<cms:not_empty my_thumbnail_src />" >
         <li><a href="javascript:void(0)" onclick="switch_product_img('photo_<cms:show k_count />', 3);"><img src="<cms:show my_thumbnail_src />"  width="90" height="90" alt="" /></a></li>
      </cms:if>
   </cms:repeat>
   </ul>
</cms:if>   

I have made the changes for you. Also since the same code is being duplicated in both 'work_list.html' as well as 'work.php', I have taken the liberty of moving it to a snippet named 'list_images.html' and embedded it at both the places to avoid duplication.
Wow cool thanks! It works great now! Only thing is there is a little quirk, the first image doesn't go away when I click on the 2nd thumbnail onwards. The code looks the same from the old one cept u added the scope to global. Did anything else change?
Hi,

I am unable to duplicate the problem in any of the browsers I use.
If you are sure the problem was not there before the addition of 'global', please go ahead and place the original code in single pages.
Faps wrote: Wow cool thanks! It works great now! Only thing is there is a little quirk, the first image doesn't go away when I click on the 2nd thumbnail onwards. The code looks the same from the old one cept u added the scope to global. Did anything else change?


After living with it for a while, I realised that the problem occurs when there are more than 1 post on the page such as on http://www.fouridine.com/work.php. The problem goes away when I click on the post and view it singly on its own http://www.fouridine.com/work.php?p=25. If on the listing page work.php I click next on the list to see the anatomy post and it happens to be the only post on the page, it doesn't have the problem as well. I see the problem across browsers, not at all for you?
24 posts Page 2 of 3