forum.coppermine-gallery.net

No Support => Modifications/Add-Ons/Hacks => Mods: Visuals => Topic started by: Sylvaticus on April 11, 2006, 01:50:10 pm

Title: Lightbox JS and Lightbox Plus in Coppermine
Post by: Sylvaticus on April 11, 2006, 01:50:10 pm
Is it possible to do something like this in Coppermine? Would it be hard to do?

http://www.cssplay.co.uk/menu/lightbox.html (http://www.cssplay.co.uk/menu/lightbox.html)
http://serennz.cool.ne.jp/sb/sp/lightbox/ (http://serennz.cool.ne.jp/sb/sp/lightbox/)
http://www.huddletogether.com/projects/lightbox/ (http://www.huddletogether.com/projects/lightbox/)
Title: Re: Lightbox JS and Lightbox Plus in Coppermine
Post by: Joachim Müller on April 12, 2006, 07:20:28 am
nice alternative for displaying full-size pics. Currently not an option. May be considered for the future. Should be possible to apply as a hack as well. The script you refer to is being released under Creative Commons Attribution 2.5 License, so I'm not sure it could be added to the core easily, as Coppermine is being released under GNU GPL.
Title: Re: Lightbox JS and Lightbox Plus in Coppermine
Post by: radianation on August 24, 2006, 03:03:43 am
I'm working on a hack for this. Stay tuned.
Title: Re: Lightbox JS and Lightbox Plus in Coppermine
Post by: thedan on September 08, 2006, 05:11:48 am
I performed this hack (using Lightbox Plus (http://serennz.cool.ne.jp/sb/sp/lightbox/)) on one of my galleries (http://www.sandybayharriers.org.au/gallery/) some time ago and generally prefer it over the default image loader.

It is unfortunate that the licenses are incompatible and it cannot be included in the core. I absolutely love coppermine, but the full-sized image loader happens to be one of my pet peeves, and this hack allowed me to get around it nicely.

Read the attachment for the details. It has been a while since I first did it, but I just tested it on another gallery of mine which was recently patched to cpg1.4.9 - so it should work fine.

Edit: I have also been meaning to use a modified Hoverbox (http://host.sonspring.com/hoverbox/) for the thumbnails, but haven't got around to that as yet.
Title: Re: Lightbox JS and Lightbox Plus in Coppermine
Post by: Joachim Müller on September 08, 2006, 07:21:58 am
Pasting your instructions into this posting:
Quote
=== Lightbox Plus CPG 1.4.9 hack ===
by Daniel Carter (dan at ids dot org dot au)

[OPEN include/themes.inc.php]

[FIND]
Code: [Select]
$pic_html = "<a href=\"javascript:;\" onclick=\"MM_openBrWindow('displayimage.php?pid=$pid&amp;fullsize=1','" . uniqid(rand()) . "','scrollbars=yes,toolbar=no,status=no,resizable=yes,width=$winsizeX,height=$winsizeY')\">";
[REPLACE WITH]
Code: [Select]
// MOD by dan: use lightbox to display full-sized images
            #$pic_html = "<a href=\"javascript:;\" onclick=\"MM_openBrWindow('displayimage.php?pid=$pid&amp;fullsize=1','" . uniqid(rand()) . "','scrollbars=yes,toolbar=no,status=no,resizable=yes,width=$winsizeX,height=$winsizeY')\">";
            $pic_fullsize_url = get_pic_url($CURRENT_PIC_DATA, 'fullsize');
// NOTE: you may like to customise the title attribute in the anchor tag, below.
            $pic_html = "<a href=\"" . $pic_fullsize_url . "\" rel=\"lightbox\" title=\"Photography\">";
// end MOD

[OPEN themes/classic/template.html]

[FIND]
Code: [Select]
<link rel="stylesheet" href="themes/classic/style.css" type="text/css" />
[AFTER, ADD]
Code: [Select]
<link rel="stylesheet" href="scripts/lightbox/lightbox.css" type="text/css" />
<script type="text/javascript" src="scripts/lightbox/lightbox_plus.js"></script>

[VISIT http://serennz.cool.ne.jp/sb/sp/lightbox/#download]

1. Download all files into scripts/lightbox/ in your coppermine installation directory. You can put them elsewhere, but make sure you adjust the modifications to themes.inc.php as appropriate, above.

2. Edit lightbox_plus.js, then under the "=== main ===" heading, adjust all the paths as appropriate.

For example, if you have coppermine installed in http://domain.name/photos/ and you installed lightbox as suggested, all the paths would begin with '/photos/scripts/lightbox/'

3. Done. Now test your new configuration :-)
Not sure though about
Quote
You can put them elsewhere, but make sure you adjust the modifications to themes.inc.php as appropriate, above.
- that file should not be edited imo.

Moving this thread from "Feature requests" to mods. Thanks for your contribution.
Title: Re: Lightbox JS and Lightbox Plus in Coppermine
Post by: Stramm on September 08, 2006, 08:03:04 am
There's already a mod that adds the Lightbox feature. Here's the link http://forum.coppermine-gallery.net/index.php?topic=35539.0
Title: Re: Lightbox JS and Lightbox Plus in Coppermine
Post by: thedan on September 09, 2006, 07:09:04 am
Not sure though about - that file should not be edited imo.

I did say it was a hack :)

Gizmo's slightly longer method (http://forum.coppermine-gallery.net/index.php?topic=35539.msg166942#msg166942) for Lightbox JS (which I have not used myself) is probably better in that it only involves modifications to theme.php.
Title: Re: Lightbox JS and Lightbox Plus in Coppermine
Post by: Garibaldi on December 27, 2006, 06:11:17 am
Pasting your instructions into this posting:Not sure though about - that file should not be edited imo.

Moving this thread from "Feature requests" to mods. Thanks for your contribution.
I would like to point out that you also must have this in your template.html header:
Code: [Select]
<script type="text/javascript" src="scripts/lightbox/spica.js"></script>
That is a dependant script that the lightbox author uses
Title: Re: Lightbox JS and Lightbox Plus in Coppermine
Post by: thedan on January 01, 2007, 03:26:40 pm
Garibaldi, can you clarify whether you are using Lightbox, Lightbox JS or Lightbox Plus?
Title: Re: Lightbox JS and Lightbox Plus in Coppermine
Post by: Garibaldi on January 02, 2007, 04:47:14 am
I am using Lightbox Plus, which you can download here:
http://serennz.sakura.ne.jp/toybox/lightbox/?en#download

I was referring to GauGau's post here (http://forum.coppermine-gallery.net/index.php?topic=30291.msg169049#msg169049)
Title: Re: Lightbox JS and Lightbox Plus in Coppermine
Post by: testomat on May 23, 2007, 12:03:14 am
Hello,
i got a question. theDan wrote that he implemented a hoverbox at his site http://www.sandybayharriers.org.au/gallery/
Does anybody knows how i get this feature implemented to my cpg 1.4 ?
Or has anybody an idea, where i can get this mod ?
Title: Re: Lightbox JS and Lightbox Plus in Coppermine
Post by: Joachim Müller on May 23, 2007, 09:03:59 am
Told you so already on the similar thread on the German support board (http://forum.coppermine-gallery.net/index.php?topic=40921.msg209085#msg209085): you find this mod within this very thread.
Title: Re: Lightbox JS and Lightbox Plus in Coppermine
Post by: testomat on June 03, 2007, 11:29:02 pm
In the Lightbox hack there is an animation, that slows a little bit. Is it possible to remove it, so that only the background gets dark and the picture shows up, without any animation ?
Which part of code, i have to remove ?
Title: Re: Lightbox JS and Lightbox Plus in Coppermine
Post by: efekt on September 09, 2008, 11:41:29 pm
Told you so already on the similar thread on the German support board (http://forum.coppermine-gallery.net/index.php?topic=40921.msg209085#msg209085): you find this mod within this very thread.

as far as I know German there is no solution in that topic, so here goes my post...

My gallery: http://hmr6dobl2ii0.az.pl/shop/
Theme: chaoticsoul (modified a bit)

I have tried to add Hoverbox (from here http://sonspring.com/journal/hoverbox-image-gallery) to my gallery like this:

ADD in style.css
Code: [Select]
/* =Hoverbox Code
----------------------------------------------------------------------*/

.hoverbox
{
cursor: default;
list-style: none;
}

.hoverbox a
{
cursor: default;
}

.hoverbox a .preview
{
display: none;
}

.hoverbox a:hover .preview
{
display: block;
position: absolute;
top: -33px;
left: -45px;
z-index: 1;
}

.hoverbox img
{
background: #fff;
border-color: #aaa #ccc #ddd #bbb;
border-style: solid;
border-width: 1px;
color: inherit;
padding: 2px;
vertical-align: top;
width: 100px;
height: 75px;
}

.hoverbox li
{
background: #eee;
border-color: #ddd #bbb #aaa #ccc;
border-style: solid;
border-width: 1px;
color: inherit;
display: inline;
float: left;
margin: 3px;
padding: 5px;
position: relative;
}

.hoverbox .preview
{
border-color: #000;
width: 200px;
height: 150px;
}

CHANGE in theme.php
Code: [Select]
<!-- BEGIN thumb_cell -->
                <td valign="top" align="center"><ul class="hoverbox">
<li>
                                        <a href="{LINK_TGT}#my_anchor">{THUMB}</a>
</li>
</ul>
                                        {CAPTION}
                                        {ADMIN_MENU}

                </td>

CHANGE in function.inc.php (2times)
Code: [Select]
$thumb_list[$i]['image'] = "<img src=\"" . $pic_url . "\" class=\"image\" {$image_size['geom']} border=\"0\" alt=\"{$row['filename']}\" title=\"$pic_title\"/><img src=\"" . $pic_url . "\" class=\"preview\" {$image_size['geom']} border=\"0\" alt=\"{$row['filename']}\" title=\"$pic_title\"/>";

It should work, however it doesn't... anybody sees any mistake there?? or could give me some advice?? any help, ideas much appreciated...
Title: Re: Lightbox JS and Lightbox Plus in Coppermine
Post by: efekt on September 12, 2008, 07:34:18 am
*bump*