Textpattern CMS

#1 2011-12-01 05:32:44

husainhk

Member

From: Dubai, UAE

Registered: 2007-08-12

Posts: 105

Website

Generate Array of Values for PrettyPhoto

Hi,

I am using prettyPhoto’s API to build an array of values, for a gallery to view video and images in articles. Can someone please help me in figuring out, how to generate the following snippet?

<script>
api_images = [
‘http://www.youtube.com/watch?v=nlPKwR6aYJA’,
‘/images/01.jpg’,
/images/02.jpg'];
</script>

Appreciate any help!

Cheers,
Husain

#2 2011-12-01 07:27:24

jakob

Admin

From: Germany

Registered: 2005-01-20

Posts: 5,001

Website GitHub

Re: Generate Array of Values for PrettyPhoto

assuming your video link is in a custom field of your article and your images are in the article image field as comma-separated image ID numbers, you could do:

<script>
  api_images = [
    '<txp:custom_field name="video_link" />',<txp:rah_repeat value='<txp:custom_field name="article_image" />' break=",">
    '<txp:image_url id='<txp:rah_repeat_value />' />'</txp:rah_repeat>
  ];
</script>

or something along those lines. You’ll need rah_repeat for the above to break apart your comma-separated list of IDs and create an individual link out of each, or alternatively use smd_each in its place. If you don’t want the whole image path, you’ll need to build it manually using '/images/<txp:rah_repeat_value />.<txp:image_info id='<txp:rah_repeat_value />' type="ext" />'.

---

TXP Builders – finely-crafted code, design and txp

#3 2011-12-03 15:58:50

husainhk

Member

From: Dubai, UAE

Registered: 2007-08-12

Posts: 105

Website

Re: Generate Array of Values for PrettyPhoto

Thanks a ton for the direction, Jakob … with your help, I was able to get things working in no time!

Just in case you or others may be interested, here’s my setup:

<txp:if_custom_field name="Gallery Image IDs" value="">
	<!-- If only video URL is supplied and no image IDs -->
	<txp:if_custom_field name="Gallery Video URL">
		<p><a href="#" rel="prettyPhoto" onclick="$.prettyPhoto.open(api_images);"><strong>Watch Event Video</strong></a></p>
		<script>api_images = ['<txp:custom_field name="Gallery Video URL" />'];</script>
	</txp:if_custom_field>
<txp:else />
	<!-- Display prettyPhoto with images and video -->
	<p><a href="#" rel="prettyPhoto" onclick="$.prettyPhoto.open(api_images);"><strong>View Gallery</strong></a></p>
	<script>api_images = [<txp:if_custom_field name="Gallery Video URL">'<txp:custom_field name="Gallery Video URL" />',</txp:if_custom_field><txp:rah_repeat value='<txp:custom_field name="Gallery Image IDs" />' break=",">'images/<txp:rah_repeat_value />.jpg'</txp:rah_repeat>];</script>
</txp:if_custom_field>