[plugin] [ORPHAN] bas_lightbox (Thumbnail galery with unobtrusive javascript)

tameboy · 2006-07-05 13:38:53

Hi

I created a hack for this plugin. I wanted to be able to link directly to certain image thumbnails within large galleries. I was thinking it would be nice if there as an anchor by each thumbnail image so I could do this. As there isn’t, I edited part of the code.

In the function <code>bas_lightbox($atts, $thing)</code> a quick modification can make the anchors labelled “image<em>id</em>” where <em>id</em> is the textpattern image ID like so: <code><a id=“imageid” href=“etc… /></code>

I found this very useful and wondered if others might. I didn’t want to post the modification here without Bastian’s permission. If Bastian agrees I will post the hack, otherwise you could email me for instructions.

It would probably require some clever JavaScript and an onload event, but it would be even cooler if you could link direct to the Lightbox enlarged version of the image.

Thanks for the great plugin Bastian.

Tameboy

Last edited by tameboy (2006-07-05 14:01:31)

Bastian · 2006-07-05 15:04:11

tameboy, even when i don’t understand what the hack does: Post whatever you want.

TXP-Plugins are GPL and you don’t need my permission. But nice that you asked :)

tameboy · 2006-07-05 20:14:50

Sorry, I might not have made myself clear enough. The hack I applied means that the links/anchors on a bas_lightbox generated gallery have an id associated with them eg:

This allows me to link to a particular image in the gallery from another article. If I want to refer the reader to a particular part of the large gallery I now use a link along the lines of <code><a href=“index.php?id=21#image76”>Link text</a></code>. This is not much use if you only have a few images in a gallery, but if like me you have large galleries this link will take the browser to the correct part of the gallery.

I wonder if it might be worth adding to the next update as it is only a simple modification:

in the function <code>bas_lightbox($atts, $thing)</code> replace:

foreach($getImgs as $getImg){ $thumb = thumbnail(Array(‘id’ => $getImg)); $big = safe_row(‘id, ext,’.$caption,‘txp_image’,‘id =”’.$getImg.’”’); $out[] = ‘<code><a href=”’.hu.$img_dir.’/’.$big[‘id’].$big[‘ext’].’” rel=“lightbox[‘.$prefs[‘bas_lightbox_roadtrip’].’]” title=”’.$big[$caption].’”>’.$thumb.’</a></code>’; }

with

foreach($getImgs as $getImg){ $thumb = thumbnail(Array(‘id’ => $getImg)); $big = safe_row(‘id, ext,’.$caption,‘txp_image’,‘id =”’.$getImg.’”’); $out[] = ‘<code><a href=”’.hu.$img_dir.’/’.$big[‘id’].$big[‘ext’].’” rel=“lightbox[‘.$prefs[‘bas_lightbox_roadtrip’].’]” id=“image’.$big[‘id’].’” title=”’.$big[$caption].’”>’.$thumb.’</a></code>’; }

roelof · 2006-07-08 16:46:00

hello bastiaan,

Can you look into my problem on page 5

Roelof

TNT · 2006-07-09 10:25:39

Roelof,

Did you put <code><txp:bas_lightbox_head /></code> in the head of your page(s)?

roelof · 2006-07-09 10:32:19

Yep,

Here is the page that i use to test this plugin

<code>
<!DOCTYPE html PUBLIC “-//W3C//DTD XHTML 1.0 Strict//EN”

“http://www.w3.org/TR/xhtml1/DTD/xhtml1-strict.dtd”>
<html xmlns=“http://www.w3.org/1999/xhtml” lang=“en”>
<head> <meta http-equiv=“content-type” content=“text/html; charset=utf-8” /> <meta http-equiv=“imagetoolbar” content=“no” /> <title><txp:page_title /></title> <link rel=“stylesheet” href=”<txp:css />” type=“text/css” media=“screen” /> <txp:bas_lightbox_head />
</head>
<body>
<div id=“container”>
<div id=“head”>
 
</div>
<div id=“wrapper”>
<div id=“sidebar-1”>
<h2>Algemeen</h2><br />
<a href=”/gastenboek”>gastenboek</a>
<a href=”/contact”>contact</a><br />
<txp:rss_suparchive section=“article” dateformat=“F Y” showsubdate=“1” form=“datum” /><br />
<a href=”/jaar1”>1e levensjaar</a><br /><br />
<a href=”/bevalling”>bevalling</a><br /><br />
<a href=”/zwangerschap”>zwangerschap</a><br /><br />
</div>
<div id=“content”>
<txp:if_section name=“test”>
<txp:bas_lightbox cat=‘fotoboek’ caption=“name” />
</txp:if_section>
</div>
</div>
<div id=“foot”>
Design by <a href=“http://www.ryanarrowsmith.com/”>Ryan Arrowsmith</a> but feel free to share / Proudly
powered by <a href=“http://www.textpattern.com/”>Textpattern</a>.
</div>
</div>
</body>
</html>
</code>

roelof · 2006-07-10 21:45:46

Nobody ??

that’s disappointed.

Roelof

maniqui · 2006-07-10 23:19:49

hello bastiaan,
Can you look into my problem on page 5
Roelof

Roelof,
are you disappointed?
I’m disappointed that you never say “please” or “thanks” in many of your posts I have read across the forum. But maybe that’s your style when asking for help in a forum.

I have take a look at your code here and the lightbox scripts files are not being loaded because the src isn’t correct.

Now, you have to find out why those files are not being loaded.

Another option is to load them manually:
<code>
<script type=‘text/javascript’ src=’/files/bas_lb04_prototype.js’></script>
<script type=‘text/javascript’ src=’/files/bas_lb04_scriptaculous.js?load=effects’></script>
<script type=‘text/javascript’ src=’/files/bas_lb04_lightbox.js’></script></code>

Replace bas_lighbox_head by those lines above.

Bastian · 2006-07-11 00:35:04

Sorry folks, but i have little time the next three weeks!
Some examinations have to be done before my term ends. And i will spend a week in spain at the IUSY

So my order is: Examinations, Spain, TXP.

Most of the time i’m offline: no net, no temptation ;)

roelof · 2006-07-11 07:54:26

maniqui,

I apolize for my behaviour. Your right what i have done is not polite.

I have manually load the scripts but nothing changed.

I have a map www with the following maps.
stats.
logs
www.

The map www is my website.
In the map www there are the following maps.

files
images
textpattern

Can you think with me why nothing seems to happen.
I already think you for your help.

Roelof

TNT · 2006-07-11 12:58:13

Roelof,

You’re on the same host as I am and this is what I’ve done. Inside the map textpattern I’ve created a map called scripts. In there I’ve put the .js files and put the following in the head of my html-page:

Example:
<code>
<script type=“text/javascript” src=”/scripts/prototype.lite.js”></script>
</code>
etc.

Now that I read again, this is the way doing it manually also suggested by maniqui.

roelof · 2006-07-11 17:26:46

Everyone thank you for the help but it’s still not working.

You can see it at: http://www.tamarawobben.nl/test

Roelof

maniqui · 2006-07-11 17:45:52

hi roelof,

I have pointed my browser to:
http://www.tamarawobben.nl/scripts/bas_lb04_prototype.js
but the file doesn’t exist.

Then, I pointed it to:
http://www.tamarawobben.nl/*files*/bas_lb04_prototype.js
and the file is there.

So, in your head, change all the references to /scripts/ to /files/.
Or… create a /scripts/ folder in your server and put all the needed files there.

roelof · 2006-07-11 19:11:30

Thanks everyone,

It works.

Roelof

rloaderro · 2006-07-11 21:37:55

I don’t know if this has been mentioned before (too many posts to read) but I didn’t want to upload the Lightbox images through the TXP images tab – I figure it’s best to keep CSS-stuff away from the client. I uploaded the images then (via ftp) directly to the /images folder of textpattern – in the plugin config instead of an ID for each image I just gave the image name (without the dot-extension) and the plugin was able to find the images and everything works peachy. Cheers-

Textpattern CMS

Textpattern CMS support forum

#136 2006-07-05 13:38:53

Re: [plugin] [ORPHAN] bas_lightbox (Thumbnail galery with unobtrusive javascript)

#137 2006-07-05 15:04:11

Re: [plugin] [ORPHAN] bas_lightbox (Thumbnail galery with unobtrusive javascript)

#138 2006-07-05 20:14:50

Re: [plugin] [ORPHAN] bas_lightbox (Thumbnail galery with unobtrusive javascript)

#139 2006-07-08 16:46:00

Re: [plugin] [ORPHAN] bas_lightbox (Thumbnail galery with unobtrusive javascript)

#140 2006-07-09 10:25:39

Re: [plugin] [ORPHAN] bas_lightbox (Thumbnail galery with unobtrusive javascript)

#141 2006-07-09 10:32:19

Re: [plugin] [ORPHAN] bas_lightbox (Thumbnail galery with unobtrusive javascript)

#142 2006-07-10 21:45:46

Re: [plugin] [ORPHAN] bas_lightbox (Thumbnail galery with unobtrusive javascript)

#143 2006-07-10 23:19:49

Re: [plugin] [ORPHAN] bas_lightbox (Thumbnail galery with unobtrusive javascript)

#144 2006-07-11 00:35:04

Re: [plugin] [ORPHAN] bas_lightbox (Thumbnail galery with unobtrusive javascript)

#145 2006-07-11 07:54:26

Re: [plugin] [ORPHAN] bas_lightbox (Thumbnail galery with unobtrusive javascript)

#146 2006-07-11 12:58:13

Re: [plugin] [ORPHAN] bas_lightbox (Thumbnail galery with unobtrusive javascript)

#147 2006-07-11 17:26:46

Re: [plugin] [ORPHAN] bas_lightbox (Thumbnail galery with unobtrusive javascript)

#148 2006-07-11 17:45:52

Re: [plugin] [ORPHAN] bas_lightbox (Thumbnail galery with unobtrusive javascript)

#149 2006-07-11 19:11:30

Re: [plugin] [ORPHAN] bas_lightbox (Thumbnail galery with unobtrusive javascript)

#150 2006-07-11 21:37:55

Re: [plugin] [ORPHAN] bas_lightbox (Thumbnail galery with unobtrusive javascript)

Board footer