Anyone working on a Lightbox2 plugin for Omeka 1.0?

43 views
Skip to first unread message

Jeanne

unread,
Oct 1, 2009, 11:47:03 AM10/1/09
to Omeka Dev
Just wondering if anyone is working on a Lightbox plugin for version
1.0. I know there is a plugin out there for an earlier version of
Omeka (http://matienzo.org/project/omeka-lightbox2) , but I haven't
had any luck in figuring out what needs to be done to get it to work
with 1.0.

Pointers of what would need to be done would also be welcome. I would
love to get this working for my current project.

Thanks!
Jeanne

http://www.CaseyFeldmanMemories.org
http://www.Spellboundblog.com

Dhanushka Samarakoon

unread,
Oct 1, 2009, 11:59:01 AM10/1/09
to omek...@googlegroups.com
I integrated lightbox in to the theme, since I wanted to get the job done quickly and seems like creating a plugin would take more time. If you are interested in my approach I can give more info.

Dhanushka.

Jeanne

unread,
Oct 4, 2009, 1:05:58 AM10/4/09
to Omeka Dev
Yes please! If there is a way to incorporate the changes needed to get
lightbox2 to work into my theme, that would be great.

What I don't want to do is change any of the core code such that
upgrades would wipe out the functionality.

Thanks!
Jeanne

On Oct 1, 11:59 am, Dhanushka Samarakoon <dhan...@gmail.com> wrote:
> I integrated lightbox in to the theme, since I wanted to get the job done
> quickly and seems like creating a plugin would take more time. If you are
> interested in my approach I can give more info.
>
> Dhanushka.
>

Dhanushka Samarakoon

unread,
Oct 5, 2009, 11:03:50 AM10/5/09
to omek...@googlegroups.com
Take a look at the two attached themes. Specially in Items/Show file.
You should be able to figure it out, but if you run in to trouble drop me a msg.

Dhanushka.
theme_sagara.zip
theme_wildcat.zip

Jeanne

unread,
Oct 7, 2009, 10:39:28 AM10/7/09
to Omeka Dev
Thank you. This helped a great deal. I have things working fairly
well. I updated your code a tiny bit to use the lightbox[gallery]
function so you can move from one image to the next easily.

Take a look at this page for how it is working: http://caseyfeldmanmemories.org/items/show/26

The only part I can't seem to sort out is where to put the
closelabel.gif and loading.gif images (and how to reference them) so
that they show up properly.

For now I have put the two gifs here:
http://www.caseyfeldmanmemories.org/images/closelabel.gif
http://www.caseyfeldmanmemories.org/images/loading.gif
And refer to them via thier full URL as can be seen here:
http://www.caseyfeldmanmemories.org/themes/thanksroy/common/lightbox/lightbox.js

But I don't see the loading or close images when I test it on the
site.

Thoughts?
Jeanne

And I refer to their full URLs in lightbox.js, but

On Oct 5, 11:03 am, Dhanushka Samarakoon <dhan...@gmail.com> wrote:
> Take a look at the two attached themes. Specially in Items/Show file.
> You should be able to figure it out, but if you run in to trouble drop me a
> msg.
>
> Dhanushka.
>
> On Sun, Oct 4, 2009 at 12:05 AM, Jeanne <jkramersm...@gmail.com> wrote:
>
> > Yes please! If there is a way to incorporate the changes needed to get
> > lightbox2 to work into my theme, that would be great.
>
> > What I don't want to do is change any of the core code such that
> > upgrades would wipe out the functionality.
>
> > Thanks!
> > Jeanne
>
> > On Oct 1, 11:59 am, Dhanushka Samarakoon <dhan...@gmail.com> wrote:
> > > I integrated lightbox in to the theme, since I wanted to get the job done
> > > quickly and seems like creating a plugin would take more time. If you are
> > > interested in my approach I can give more info.
>
> > > Dhanushka.
>
> > > On Thu, Oct 1, 2009 at 10:47 AM, Jeanne <jkramersm...@gmail.com> wrote:
>
> > > > Just wondering if anyone is working on a Lightbox plugin for version
> > > > 1.0. I know there is a plugin out there for an earlier version of
> > > > Omeka (http://matienzo.org/project/omeka-lightbox2) , but I haven't
> > > > had any luck in figuring out what needs to be done to get it to work
> > > > with 1.0.
>
> > > > Pointers of what would need to be done would also be welcome. I would
> > > > love to get this working for my current project.
>
> > > > Thanks!
> > > > Jeanne
>
> > > >http://www.CaseyFeldmanMemories.org
> > > >http://www.Spellboundblog.com
>
>
>
>  theme_sagara.zip
> 262KViewDownload
>
>  theme_wildcat.zip
> 255KViewDownload

Jeanne

unread,
Oct 10, 2009, 2:56:25 PM10/10/09
to Omeka Dev
Never mind - I figured it out. I had two copies of lightbox.js (one in
the root lightbox directory and one in the js directory). I was
updating the wrong one!

Thanks!
Jeanne

On Oct 7, 10:39 am, Jeanne <jkramersm...@gmail.com> wrote:
> Thank you. This helped a great deal. I have things working fairly
> well. I updated your code a tiny bit to use the lightbox[gallery]
> function so you can move from one image to the next easily.
>
> Take a look at this page for how it is working:http://caseyfeldmanmemories.org/items/show/26
>
> The only part I can't seem to sort out is where to put the
> closelabel.gif and loading.gif images (and how to reference them) so
> that they show up properly.
>
> For now I have put the two gifs here:
>    http://www.caseyfeldmanmemories.org/images/closelabel.gif
>    http://www.caseyfeldmanmemories.org/images/loading.gif
> And refer to them via thier full URL as can be seen here:
>    http://www.caseyfeldmanmemories.org/themes/thanksroy/common/lightbox/...

Erin Bell

unread,
Oct 22, 2009, 4:03:39 PM10/22/09
to Omeka Dev
Hi all,

I tested out Dhanushka's themes and they work very well, but when I
try to modify my own theme to incorporate the same Lightbox effects, I
get nothing. Obviously, I'm missing a step here. Here's what I've
done.

1. Copied the /common/lightbox directory and tooltip.php into my
theme's /common folder
2. Updated my header.php file to reflect the Lightbox includes and
Tooltip script/css
3. Copied the images into my theme's /images folder
4. Updated my items/show.php file with rel="lightbox", etc.

This seems right to me, but it does not work... unless I point the
Lightbox includes to Dhanushka's WILDCAT theme (instead of mine) as
such:

<!-- Start Lightbox includes -->
<link rel="stylesheet" media="screen" href="<?php echo WEB_ROOT;?>/
themes/wildcat/common/lightbox/css/lightbox.css" />
<script type="text/javascript" src="<?php echo WEB_ROOT;?>/themes/
wildcat/common/lightbox/js/prototype.js"></script>
<script type="text/javascript" src="<?php echo WEB_ROOT;?>/themes/
wildcat/common/lightbox/js/scriptaculous.js?load=effects,builder"></
script>
<script type="text/javascript" src="<?php echo WEB_ROOT;?>/themes/
wildcat/common/lightbox/js/lightbox.js"></script>
<!-- End Lightbox includes -->

If I replace "wildcat" with "MyThemeName" the script doesn't work.
For the life of me, I cannot figure out why.

Any help would be greatly appreciated.

Thanks -- Erin

Dhanushka Samarakoon

unread,
Oct 22, 2009, 4:09:48 PM10/22/09
to omek...@googlegroups.com
Hi Erin,

I had to modify the following file.
(Technically it should hv worked without modifying that file, but maybe due to some reason with my server environment I had to modify it)
common/lightbox/js/lightbox.js

in lines 50 and 51 I had to change path info
fileLoadingImage:        '/omeka/themes/wildcat/common/lightbox/images/loading.gif',    
fileBottomNavCloseImage: '/omeka/themes/wildcat/common/lightbox/images/closelabel.gif',

Download a fresh copy of lightbox from their site and see if it works. If not try doing the above modifications. let me know how it goes :-)

Dhanushka.

Erin Bell

unread,
Oct 23, 2009, 9:35:42 AM10/23/09
to Omeka Dev
I am officially an idiot. After a total of maybe 2-3 hours trying to
figure this out, I realized that I was just spelling my theme's
directory wrong in the header. It works. Thanks so much Dhanushka
for sharing this with everyone.

On Oct 22, 4:09 pm, Dhanushka Samarakoon <dhan...@gmail.com> wrote:
> Hi Erin,
>
> I had to modify the following file.
> (Technically it should hv worked without modifying that file, but maybe due
> to some reason with my server environment I had to modify it)
> *common/lightbox/js/lightbox.js*
>
> in lines 50 and 51 I had to change path info
> fileLoadingImage:
> '/omeka/themes/wildcat/common/lightbox/images/loading.gif',
> fileBottomNavCloseImage:
> '/omeka/themes/wildcat/common/lightbox/images/closelabel.gif',
>
> Download a fresh copy of lightbox from their site and see if it works. If
> not try doing the above modifications. let me know how it goes :-)
>
> Dhanushka.
>

Dhanushka Samarakoon

unread,
Oct 23, 2009, 9:37:05 AM10/23/09
to omek...@googlegroups.com
cool... glad u got that working :-)

Erin Bell

unread,
Dec 9, 2009, 2:22:31 PM12/9/09
to Omeka Dev
Hi all, I updated the Omeka wiki with a LightBox tutorial based on
Dhanushka's 'WildCat' theme. See: http://omeka.org/codex/Adding_LightBox_to_Omeka

The only remaining issue (for me, at least) is that the code for
calling up the image thumbs returns a thumbnail for each item file,
and each of the thumbnails are identical and based on the first
image. (For a clear illustration, see here:
http://www.ohiocivilwar150.org/omeka/items/show/1754).

I think ideally, since LightBox has a built in method for browsing
multiple files as a gallery, we would only want to display the first
thumbnail. Can anyone help me out with this?

Here's the existing code:

<!-- The following returns all of the files associated with an item. --
>
<div id="itemfiles" class="element">
<h3>Files</h3>
<div class="element-text">
< ?php
if (item_has_thumbnail())
{
$item = get_current_item();
$files = $item->getFiles();
foreach($files as $file)
{
echo '<a href="' . file_download_uri($file) . '"rel="lightbox
[group]" class="download-file">';
echo item_square_thumbnail();
echo '</a>';
}
}
else
{
echo display_files_for_item();
}
?>

</div>

</div>


Thanks - Erin


On Oct 23, 8:37 am, Dhanushka Samarakoon <dhan...@gmail.com> wrote:
> cool... glad u got that working :-)
>

Dhanushka Samarakoon

unread,
Dec 9, 2009, 3:46:04 PM12/9/09
to omek...@googlegroups.com
Just a wild guess. But it would be possible to include all the thumbnails starting from 2'nd to be included in a div and hiding it using javascript.

--

You received this message because you are subscribed to the Google Groups "Omeka Dev" group.
To post to this group, send email to omek...@googlegroups.com.
To unsubscribe from this group, send email to omeka-dev+...@googlegroups.com.
For more options, visit this group at http://groups.google.com/group/omeka-dev?hl=en.



Jeremy Boggs

unread,
Dec 9, 2009, 4:00:07 PM12/9/09
to omek...@googlegroups.com
With the markup you're using to look through the files, you can't use
item_square_thumbnail to display the file. That helper just gets the
first file by default. If you replace it with display_file($file) it
should work I think. Be sure to pass $file as an argument.

I think this function defaults to use the square_thumbnail for image
files when using this helper. If you wanna change, that, you can pass
something to the second argument like so:

display_file($file, array('imageSize' => 'thumbnail'));

Jeremy

Erin Bell

unread,
Dec 11, 2009, 9:46:07 AM12/11/09
to Omeka Dev
Thanks for the replies. I actually found a partial answer over on the
omeka.org forums and updated the code according to Kris' suggestion
(here:http://omeka.org/forums/topic/what-handle-to-access-mediaphp-for-
a-new-plugin). I didn't think the function had been updated yet, but
figured I would give it a try and whaddyaknow, it worked.

<!-- The following returns all of the files associated with an item.
-->
<div id="itemfiles" class="element">
<h3>Files</h3>
<div class="element-text">
<?php
if (item_has_thumbnail())
{
echo '<p><em>Click the Image for Full Size</em></p>';
echo display_files_for_item(array('linkAttributes'=>array
('rel'=>'lightbox[gallery]')));
}
else
{
echo display_files_for_item();
}
?>

</div>

</div>

I'll update the Lightbox tutorial on the wiki. Next step is to hide
the 2nd (+) items and just use the LightBox gallery to browse. Or
maybe just adjust my CSS to let them all display a bit more nicely.
Reply all
Reply to author
Forward
0 new messages