Go to main content

Textpattern CMS support forum

You are not logged in. Register | Login | Help

#13 2007-06-25 11:35:54

joel
Member
Registered: 2004-11-26
Posts: 162

Re: How to implement greybox

Thanks again!!! :)

Unfortunately I get an error in the source-code

<script type=“text/javascript”>
var image_set = [<br />
<b>Parse error</b>: parse error, unexpected T_VARIABLE, expecting ‘,’ or ‘;’ in <b>/home/kunder/7035/domain.com/textpattern/publish/taghandlers.php(2681) : eval()’d code</b> on line <b>3</b><br />
];
</script><h3>Headline</h3>
<p>Lorem ipsum text</p>

<ul class=“portfoliolink”>
<li class=“web”><a href=”//www.joelsundkvist.com” title=“Joel Sundkvists webbplats” rel=“gb_page_center[980, 680]”>www.joelsundkvist.com</a></li>
<li><a href=”#” onclick=“return GB_showImageSet(image_set, 1)”>Show the images from the customfield portfolioimages one by one</a></li>
</ul>

Last edited by joel (2007-06-25 11:36:26)

Offline

#14 2007-06-25 12:20:09

Pat64
Plugin Author
From: France
Registered: 2005-12-12
Posts: 1,634
GitHub Twitter

Re: How to implement greybox

Yes!
Forget missing “;” sign on line 3 when i’ve copy/paste the code!!!
I’ve corrected the source above.


Patrick.

Github | CodePen | Codier | Simplr theme | Wait Me: a maintenance theme | [\a mi.ni.ma]: a “Low Tech” simple Blog theme.

Offline

#15 2007-06-25 13:31:35

joel
Member
Registered: 2004-11-26
Posts: 162

Re: How to implement greybox

Thanks! The error is now gone.

I cant get it to work though… Here is the website

Click on the second nav-bar “2. Våra kunder”

The url on the other hand is working just fine…

Since I’m displaying the articles in an article list, all the links will look like <a href=”#” onclick=“return GB_showImageSet(image_set, 1)”>Show the images from the customfield portfolioimages one by one</a>

Is this going to be a problem since they are all pointing towards (image_set, 1) that is?

Offline

#16 2007-06-25 14:35:32

Pat64
Plugin Author
From: France
Registered: 2005-12-12
Posts: 1,634
GitHub Twitter

Re: How to implement greybox

Ok. My code is good. You need only to adapt greybox javascript for your need!

Here my solution :

change the line :

<script type="text/javascript">
var image_set = [<txp:php>

by this code :

<script type="text/javascript">
var image_set<txp:article_id /> = [<txp:php>

Fine. We can individual all var for the script!

Now in the line :

<li><a href="#" onclick="return GB_showImageSet(image_set, 1)">Show the images from the customfield portfolioimages one by one</a></li>

Make this change :

<li><a href="#" onclick="return GB_showImageSet(image_set<txp:article_id />, 1)">Show the images from the customfield portfolioimages one by one</a></li>

And now… You’re done!

Cheers,


Patrick.

Github | CodePen | Codier | Simplr theme | Wait Me: a maintenance theme | [\a mi.ni.ma]: a “Low Tech” simple Blog theme.

Offline

#17 2007-06-25 15:02:46

joel
Member
Registered: 2004-11-26
Posts: 162

Re: How to implement greybox

I have now made the article id changes. The problem persists. It looks like a css-problem. The buttons for forward and backward gets stretched out all over the screen with the overlay. The actual image is below everything. I’ve checked it in Safari, FF and MSIE – same result.

Offline

#18 2007-06-25 15:10:38

Pat64
Plugin Author
From: France
Registered: 2005-12-12
Posts: 1,634
GitHub Twitter

Re: How to implement greybox

Absolutly Joel,

It seems you’ve got a (css or javascript or integration?) problem.

I have put the code exactly like I’d post here : all works fine on FF : I’ve write several articles and I’ve got each website in a greybox window. I’ve got the different images within a gallery window according each article and images IDs.

Verify all your site.
Good luck.

Here is my page template named “gallery” associated to a section named “gallery” :

<txp:output_form form="doctype" />
<script type="text/javascript">
    var GB_ROOT_DIR = "http://mysite.com/greybox/";
</script>
<script type="text/javascript" src="<txp:site_url />greybox/AJS.js"></script>
<script type="text/javascript" src="<txp:site_url />greybox/AJS_fx.js"></script>
<script type="text/javascript" src="<txp:site_url />greybox/gb_scripts.js"></script>
<link href="<txp:site_url />greybox/gb_styles.css" rel="stylesheet" type="text/css" />
</head>
<body id="mysite.com" class="<txp:section />"> <!-- E. Meyer's signature technic -->
<div id="container">
	<txp:output_form form="headerl" />
	<txp:output_form form="accessibility" />
	<div id="content">
	<txp:article limit="5" listform="greybox" />
<txp:if_individual_article><p><txp:link_to_prev><txp:prev_title /></txp:link_to_prev>
<txp:link_to_next><txp:next_title /></txp:link_to_next>&nbsp;</p>
<txp:else /><p><txp:older><txp:text item="preview" /></txp:older>
<txp:newer><txp:text item="next" /></txp:newer>&nbsp;</p></txp:if_individual_article>
	</div> <!-- /content -->
			<div id="gutter"></div>
</div> <!-- / container -->
	<txp:output_form form="footer" />
<txp:output_form form="html_end_page_stuff" />

Last edited by Pat64 (2007-06-25 15:16:22)


Patrick.

Github | CodePen | Codier | Simplr theme | Wait Me: a maintenance theme | [\a mi.ni.ma]: a “Low Tech” simple Blog theme.

Offline

#19 2007-06-25 19:17:48

joel
Member
Registered: 2004-11-26
Posts: 162

Re: How to implement greybox

I got it working now!!! Thanks a lot for your efforts Patrick! :)

It seems like my css classes .left and .right were colliding with the greybox. I just renamed them and everything worked just fine.

As for the global variable thing I’ve found a link that might be of interest

Last edited by joel (2007-06-25 19:24:45)

Offline

#20 2007-06-25 19:44:30

Pat64
Plugin Author
From: France
Registered: 2005-12-12
Posts: 1,634
GitHub Twitter

Re: How to implement greybox

Fine.

Thanks Core Developers for their effort, not me :)

Regards,


Patrick.

Github | CodePen | Codier | Simplr theme | Wait Me: a maintenance theme | [\a mi.ni.ma]: a “Low Tech” simple Blog theme.

Offline

#21 2007-06-25 20:59:40

ruud
Developer Emeritus
From: a galaxy far far away
Registered: 2006-06-04
Posts: 5,068
Website

Re: How to implement greybox

To get the caption working, change

foreach($pic as $clé => $valeur)
{ echo "{'caption': '".$caption."', 'url': '".$site."/images/".$valeur.".jpg'},";
};

into

foreach($pic as $id)
{
  $caption = safe_field('caption', 'txp_image', 'id='.$id);
  echo "{'caption': '".addslashes(htmlspecialchars($caption))."', 'url': '".$site."/images/".$id.".jpg'},";
}

Last edited by ruud (2007-06-25 21:15:35)

Offline

#22 2007-06-25 21:14:28

ruud
Developer Emeritus
From: a galaxy far far away
Registered: 2006-06-04
Posts: 5,068
Website

Re: How to implement greybox

Now let’s see if we can optimize that a bit (hopefully without error):

<script type="text/javascript">
var image_set<txp:article_id /> = [<txp:php>
  global $img_dir;
  $list = custom_field(array('name'=>'portfolio_images'));
  if (!empty($list))
  {
    // create an array based on list of IDs from portfolio_images custom_field
    // we create javascript lines needed for Greybox 
    foreach(preg_split('/[^\d]+/', $list) as $id)
    {
      extract(safe_row('*', 'txp_image', 'id='.$id));
      echo "{'caption': '".addslashes(htmlspecialchars($caption))."', 'url': '".hu.$img_dir."/".$id.$ext."'},";
    }
  }
</txp:php>];
</script>

Last edited by ruud (2007-06-25 21:15:15)

Offline

#23 2007-06-26 08:20:28

Pat64
Plugin Author
From: France
Registered: 2005-12-12
Posts: 1,634
GitHub Twitter

Re: How to implement greybox

WoW! Tks lot Ruud!!!

Do you know you are the best (with Mary, Wet and Sencer, of course)? ;)

As always : simple, efficient, brillant! World belongs to coders!

Tks again mate.

Have a good day.

Last edited by Pat64 (2007-06-26 08:22:54)


Patrick.

Github | CodePen | Codier | Simplr theme | Wait Me: a maintenance theme | [\a mi.ni.ma]: a “Low Tech” simple Blog theme.

Offline

#24 2007-06-26 10:52:28

joel
Member
Registered: 2004-11-26
Posts: 162

Re: How to implement greybox

Yes thanks a lot!!! :)

You’re the man!

Offline

Board footer

Powered by FluxBB