jQLightbox

[slinouille]

Link to Mod

jQLightbox v0.5.1
By Slinouille

Introduction
The mod adds a real lightbox feature to all images in your forum.
jQLightbox mod uses:
- jQuery javascript library : http://jquery.com/ - v1.2.6
- jQuery prettyPhoto pluggin from http://www.no-margin-for-errors.com/projects/prettyPhoto/. - 2.2.7

Features
o Activation in admin control panel
o Nice lightbox effect
o Multiple images are displayed as a gallery
o Automatic image resize to fit the user's screen
o No conflict with other javascript libraries you could use
o Admin can parameter autoresize, padding on each side of picture, opacity, animation speed and a theme.

Installation
Simply install the package to install this modification on the SMF Default Core theme.
Manual edits will be required for other themes.

Note: If you want to use also AttachmentInMessage mod, please install "jQLightbox pluggin for AIM" mod after

This mod is compatible with SMF 2.0 Beta 4 Public and above only.

Support
Please use the modification thread for support with this modification.

Translations are welcome :-)

Changelog
0.5.1 - 22th March 2009
o Source code correction (IE uncompliance)

0.5.0 - 22th March 2009
o Compatibility with other javascripts library tested (needed if using other SMF mods such as nneonneo's AJAX ShoutBox)

0.4.0 - 16th February 2009
o Correction of resizing functionality
o Some minor code optimization

0.3.0 - 16th February 2009
o 3 themes are available for lightbox
o Correcting undefined index errors in "Errors log"

0.2.0 - 29th January 2009
o Add some possible customizations of lightbox through admin panel

0.1.0 - 24th January 2009
o Initial release

[Minare]

Nice mod bro , thanks



Turkish language trans :

Code Select Expand



<file name="$languagedir/Modifications.turkish.php">
<operation>
<search position="end" />
<add><![CDATA[
//Begin mod jQLightbox
$txt['enable_jqlightbox_mod']='[jQLightbox]  jQLightbox'u Etkinleştir.';
//End mod Glossary
]]></add>
</operation>
</file>
<file name="$languagedir/Help.turkish.php">
<operation>
<search position="end" />
<add><![CDATA[
// The start of the language strings
$helptxt['enable_jqlightbox_mod'] = 'jQLightbox modunu açabilir ya da kapatabilirsiniz.';
]]></add>
</operation>
</file>



[mrtrc266]

Very nice 

[Apllicmz]

Nice Work
good mod
translate Portuguese

Code Select Expand

<file name="$languagedir/Modifications.portuguese_pt.php" error="skip">
        <operation>
            <search position="end" />
            <add><![CDATA[
//Begin mod jQLightbox translate candidosa2
$txt['enable_jqlightbox_mod']='[jQLightbox] Activar jQLightbox no seu fórum.';
//End mod Glossary
            ]]></add>
        </operation>
    </file>

Code Select Expand

<file name="$languagedir/Help.portuguese_pt.php" error="skip">
        <operation>
            <search position="end" />
            <add><![CDATA[
// The start of the language strings Suporte smfpt.net
$helptxt['enable_jqlightbox_mod'] = 'Aqui você pode activar e desativar o mod jQLightbox.';
]]></add>
        </operation>
    </file>   

[exxocet]

 I ported this mod to SMF 1.1.7 and everything work smooth. Just one question:
- is there any chance to make the mod to follow URL of the linked images? Links like [.URL=http://www.example.com][.IMG]http://www.image.jpg[./IMG][./URL] are not followed, but teh mod keeps loading, trying to open the URL like an image.
If this is not possible, a good feature it will be as the localhost images to be excepted from this mod, and just remotely host images (imageshack and all the others) to be lightboxed normally. This way you can use localhost pictures for linked images to follow the URL. IS there any chance, any code modification I can do?

Thank you very much.

[slinouille]

Thank you for your comments 

I've just uploaded v0.2 that permits to customize some aspects of the lightbox.

@joomlamz  and Minare : I'll need a little more translations ... is it possible for you? 

@exxocet : hum perhaps have I not understand but this mod should only "lightbox" images put in attachment of the message. So that no url should be possible on those attachments ... Am I wrong?
Can you transmit the SMF1.X version so that I can integrate it to the mod if you want (with you name of contributor of course  )

SliN

[Minare]

@joomlamz  and Minare : I'll need a little more translations ... is it possible for you? 

SliN

No dude, this one tired me enough, it was too long 

[Marcus Forsberg]

Swedish translation:

Code Select Expand


//Begin mod jQLightbox
$txt['enable_jqlightbox_mod']='[jQLightbox] Aktivera jQLightbox i ditt forum.';
$txt['jqlightbox_animationSpeed']='[jQLightbox] Definiera animationens fart.';
$txt['jqlightbox_padding']='[jQLightbox] Definiera padding i pixlar (mellan 0 och 99).';
$txt['jqlightbox_opacity']='[jQLightbox] Definiera genomskinlighet i %.';
$txt['jqlightbox_allowresize']='[jQLightbox] Förminska bilder för att anpassa dem för användarens skärmstorlek.';
$txt['jqlightbox_slow'] = 'sakta';
$txt['jqlightbox_normal'] = 'normal';
$txt['jqlightbox_fast'] = 'snabb';
//End mod Glossary


[Sudhakar Arjunan]

A Good mod slinouille.

Will this work only with attachments only on that topic.

Could we access the pics taken from vbgamer45's SMF Gallery mod.

[slinouille]

@Nas: thank you for that translation 

@A.SK: what do you mean by ?

Could we access the pics taken from vbgamer45's SMF Gallery mod.

Is it that you put in your message pics coming from your SMF Gallery mod using [.img] tag ?

[w0lfman]

Installing on defaul theme and get the following message...

The package you are trying to download or install is either corrupt or not compatible with this version of SMF.

[slinouille]

Installing on defaul theme and get the following message...

The package you are trying to download or install is either corrupt or not compatible with this version of SMF.

You have tried to install this mod on a version of SMF that is not supported

[exxocet]

Ported to SMF 1.1.x. Install/uninstall via admin panel:

[aishaweb]

So, does this only work with attached images?

What about hotlinked images from photobucket, xs.to, imageshack etc?

[mashby]

I installed this on a test forum (SMF 2.0 RC1) and it worked like a charm. I checked the Error Log and found this repeated for each page I've been to:

Code Select Expand

8: Undefined index: jqlightbox_allowresize
File: ***/Sources/Load.php
Line: 1491

Line 1491 is:

Code Select Expand

if ( $modSettings['jqlightbox_allowresize'] == 0) $jqlightbox_allowresize = 'true';

While not a serious error, it is generating an error (that I realize isn't a big deal but will flood the error log). Anyone else having/seeing this?

Only other mod I have installed is Global Headers/Footers.

[mashby]

OK...I took a look at the smf_settings table and didn't see an entry for jqlightbox_allowresize. So, i went back to the Settings page and changed Yes to No and clicked Save...then changed No to Yes and clicked Save again. No more errors! I'm guessing it's a minor thing with the Yes/No option or something.

I've been tinkering with jquery for a few months now. Very cool package and nice to see a mod using it.

[slinouille]

@mashby: thank you for this ... i didn't saw this error (I only recently dicovered the error log) ... so I'll do an update correctig this undefined option when unused.

[aishaweb]

So, does this only work with attached images?

What about hotlinked images from photobucket, xs.to, imageshack etc?

[slinouille]

So, does this only work with attached images?

What about hotlinked images from photobucket, xs.to, imageshack etc?

Sorry aishaweb, I didn't saw you post. Actually it only works with [.img] bbcode but perhaps could I see if it is feasable with hotlinked images ...

[aishaweb]

Thanks.

[Pentaxian]

Introduction
The mod adds a real lightbox feature to all images in your forum.

Does this mod really add a lightbox to ALL images? I installed this mod on a testcopy in SMF 2.0 RC1 of my forum on my own Mac . The forum is filled with pictures, linked ([img]http:\\ etc[\img]) from photobucket, picasaweb, tinypic etc and the mod doesn't do anything at all.
Is that right or should this mod work on those images?

The error log produces messages like:
8: Undefined index: jqlightbox_allowresize
Bestand: /Users/RvB/Sites/Sources/Load.php
Regel: 1491
Error type not defined

[slinouille]

Hum ... have you read previous posts ?

Nevertheless, NO this mod can't make "lightboxable" images host-linked. Indeed those images are "links" ... so that the core of the lightbox can't "work" on the image file on the server. You need actually to have the images on the server where smf is.

As I said before, I'll try (if it's possible) to improve the mod to make that possible but actually I've got doubts on such a possibility.

By the way, release 0.3 is available ... correcting undefined index error in the log and adding 4 themes to the lightbox 

SliN

[aishaweb]

I THINK this mod woks with hotlinked images: 

INTEGRATE LIGHTBOX v1.6
By Quake101
http://custom.simplemachines.org/mods/index.php?mod=1158

[Chandy]

Great work slinouille thx  .

Any chance of this works in 1.1.8 version ?

Thx in advanced.

[slinouille]

@aishaweb: yes it works with slimbox library but it can't resize big images. My choice was to use a library that could resize big images. My mod will soon be able to load host linked image ... just be patient

@Chandy: Thank you ... but sorry no chance on my side at least ... but if someone wants to do it SMF1x, he/she is welcome

[w0lfman]

Installing on defaul theme and get the following message...

The package you are trying to download or install is either corrupt or not compatible with this version of SMF.

You have tried to install this mod on a version of SMF that is not supported

slinouille, i'm installing it on 1.1.7 default forum.  I'm confused?

[Pentaxian]

....My choice was to use a library that could resize big images. My mod will soon be able to load host linked image ... just be patient
....

If it's any help to you, on the website www.pentaxforums.com (not my site) they use an 'application' called Thickbox in vBulletin that works perfect on hotlinked images.
Keep up the good work!

[AlenNS]

Could you add something for watermark our images with this mod?

[slinouille]

@wolfman: no you should only install that mod on SMF2

@Pentaxian: thank you for your tip ... I'm only using Thickbox3 for forms ... but why not for images also

@AlenNS: it's actually one thing I'm thinking about ... I'm doing some test on that but currently I didn't succeed.

Thank you for your inputs

[AlenNS]

Thanks for the answer slinouille.
I have one problem.
When the picture is higher then my browser is then top and the bottom of that picture couldn't be seen and when I try to scroll down or up, browser takes me back on the middle of the picture.
And I have tried to set in mod settings both option ( fit to user screen and don't fit ).

[oistarbwoy]

this mod doesnt work for me i am using the latest smf.

theres no error no gliche no nothing... all i know is despite it being enabled and all the settings done... i have no lightbox.

am i missing something really ovbvious?

[dystemper]

loved your plugin, but i recently discovered there is a conflict with another very popular mod -- nneonneo's AJAX shoutbox (version 1.22), both advanced and simple (mod link: http://custom.simplemachines.org/mods/index.php?mod=585).

while your plugin works fine, it disrupts nneonneo's shoutbox functionality. i've alerted nneonneo to this also. since you both have done excellent work, hopefully this can be resolved in the future, so i can use both eventually.

cheers.

[AlenNS]

Could you add something for watermark our images with this mod?

[slinouille]

@AlenNS : concerning the watermark, I don't think I'll be able to do that ... I've not found any jquery scripts for watermark images ... but as soon I found one, I'll do that option.
Concerning the "fit to screen" option, yes you're right ... some images are not "fited" ... very strange, I'll do an upgrade as soon as I found a correction.

@dystemper : thank you for comment. Strange that it corrupts NAS ... it should not ... I've tried when developing my mod but it was not the version 1.22 of NAS but an older one, perhaps some new coding inside ... I'll check

@oistarbwoy : strange, perhaps a problem with another mod, or an option that is not enabled ?

SliN

[AlenNS]

Thanks for answer.

[slinouille]

New version 0.5 is available.
It corrects the "fit to screen" feature and compatibility with nneonneo's AJAX shoutbox is okay

Enjoy!

SliN

[Pentaxian]

I installed version 0.5.1 on my testsite and it reports installation OK but nothing happens with the pictures. This still doesn't work with hotlinked images?

[slinouille]

I installed version 0.5.1 on my testsite and it reports installation OK but nothing happens with the pictures. This still doesn't work with hotlinked images?

No it's not working with hostlinked images ... one day

[Pentaxian]

I will be waiting. Thanks for the quick reply!

[slinouille]

I was thinking about it and ... one important thing is that jQLightbox is working with the thumbnails that are attached to posts.
So if no attached image, then no lightbox is possible.

Humm ... we'll see how to manage that

[General_Naga]

How would I go about removing the quick edit option? - It messes up Lightbox for me.

[slinouille]

How would I go about removing the quick edit option? - It messes up Lightbox for me.

I think it is in your Profil, in "Look and Layout" ... there should be an option for enabling it or not.
You say that it generates errors on jqlightbox ... I'll check that

SliN

[General_Naga]

Its not a major problem - just after editing a post using quick edit you have to refresh the page to get lightbox to work again.

[General_Naga]

I'm getting a major problem with some Internet Explorer users when using this mod. Is there a fix?

[baijianpeng]

No it's not working with hostlinked images ... one day

Today I tested v0.5.1 of this Mod on my SMF2 v2.0 RC1.2 and it still can't work with hotlinked images.

Will you improve this Mod and add this feature?

Thanks.

[alblove]

Without hotlinked images feature, the mod is useless because all users posts images hosted on external sites.

[Pentaxian]

Slinouille hasn't been active since June 25, 2009! Don't hold your breath.

[Bika]

I don't know if many people are still using this mod or not but i've managed to make a small modification to it whilst making it compatible with 1.1.x as well as its 2.0.

Simply added the ability to the mod to Lightbox all images on your forum without them having to be attachments while keeping the attachment working with the Lightbox.

The same translations as before are included.
English/French/Portuguese/Swedish.

Install/Uninstall Via Admin Panel.
Attached both versions.

Note: I didn't personally test the SMF 2 version but it should work.

Right now i am working on editing the CSS of it to make it look a bit better( i liked the mootools lightbox more ).

[Sakae]

Well.

Doesn't works with hotlinked images?

[art.4]

I've manged to do some test and i have a working lightbox with images hotlinked from the same domain. It request a url code to work eg.

Code Select Expand

[url=http://domain.com/img1][img]http://domain.com/img1[/img][/url]

will work, but

Code Select Expand

[img]http://domain.com/img1[/img]

won't

There's a problem with url's that go to pages, but working on it.


modification:

Find

Code Select Expand


array(
'tag' => 'url',
'type' => 'unparsed_equals',
'before' => '<a href="$1" class="bbc_link new_win" target="_blank" >',
'after' => '</a>',
'validate' => create_function('&$tag, &$data, $disabled', '
if (strpos($data, \'http://\') !== 0 && strpos($data, \'https://\') !== 0)
$data = \'http://\' . $data;

replace with

Code Select Expand


array(
'tag' => 'url',
'type' => 'unparsed_equals',
'before' => '<a href="$1" class="bbc_link new_win" target="_blank" rel="lightbox[gallery]" alt="" >',
'after' => '</a>',
'validate' => create_function('&$tag, &$data, $disabled', '
if (strpos($data, \'http://\') !== 0 && strpos($data, \'https://\') !== 0)
$data = \'http://\' . $data;

[Bugo]

Changing of the errors in the latest version of this modification.

package-info.xml, find:

Code Select Expand

<remove-dir name="prettyPhoto" destination="$imagesdir" />
Replace with:

Code Select Expand

<remove-dir name="$imagesdir/prettyPhoto" />

install.xml,find:

Code Select Expand

if ( isset($modSettings['jqlightbox_theme']) && !empty($modSettings['jqlightbox_theme']) ){
if ( $modSettings['jqlightbox_theme'] == 0 ) $jqlightbox_theme = 'light_rounded';
else if ( $modSettings['jqlightbox_theme'] == 1 ) $jqlightbox_theme = 'dark_rounded';
else if ( $modSettings['jqlightbox_theme'] == 2 ) $jqlightbox_theme = 'dark_square';
} else $jqlightbox_theme = 'light_rounded';
Replace with:

Code Select Expand

if ( isset($modSettings['jqlightbox_theme']) && !empty($modSettings['jqlightbox_theme']) ){
if ( $modSettings['jqlightbox_theme'] == 0 ) $jqlightbox_theme = 'light_rounded';
else if ( $modSettings['jqlightbox_theme'] == 1 ) $jqlightbox_theme = 'dark_rounded';
else if ( $modSettings['jqlightbox_theme'] == 2 ) $jqlightbox_theme = 'dark_square';
else $jqlightbox_theme = 'light_square';
} else $jqlightbox_theme = 'light_rounded';

Find:

Code Select Expand

array($txt['jqlightbox_light_rounded'],$txt['jqlightbox_dark_rounded'],$txt['jqlightbox_dark_square'])
Replace with:

Code Select Expand

array($txt['jqlightbox_light_rounded'],$txt['jqlightbox_dark_rounded'],$txt['jqlightbox_dark_square'],$txt['jqlightbox_light_square'])

[parvaz]

I've tried this pretty mod on my forum months ago. But since it didn't work with the externally hosted images i abandoned it.
Today i saw an update of the mod on the mod site.
Does the new release of the mod ( jQLightbox.0.6.zip ) now support that feature?

[madvex]

I'm running SMF 2.0.5 and wanted this puppy.

Unfortunately, it required manual update to the theme Display template, which is easy enough and detailed in the mod page itself.  But, be aware, you may need to update Display.template.php manually for your theme.  As I said, I'm running SMF 2.0.5 and Blu 2.0 (based on Curve) theme.

The next issue I found was with the jquery prettyphoto image libraries, which the package installer did not install properly.  Deleting the folders the installer created and uploading them manually via FTP fixed that. The main folder is "/Themes/default/images/prettyPhoto/  - just replace this folder and its contents via FTP and you should be good.

Once this was in place, I found the prettyphoto CSS was buggy and the gallery display in the lighbox was a mess, not picking up thumbnails correctly and basically not usable.  I tracked that issue down to a few lines in the CSS and commented them out. I actually re-wrote the entire CSS file because it was just horribly formatted and unreadable - let alone editable.  This file is located in "/Themes/default/css" - simply replace it with the one I have attached.

Since this mod is a really nice addition to any board where attachments are in play and it does not seem to be updated any longer, I thought I'd give back to the community by providing this post and the updated CSS file I created (attached).

Enjoy.