Image Resize using Lytebox ( 3.6.x )

[Lost Heaven]

This's simple hack for resize large images using Lytebox (http://www.dolem.com/lytebox/),also integration with vB attachments for vbb 3.6.x.You can find this mod for vbb 3.7.x at HERE (https://vborg.vbsupport.ru/showthread.php?t=171985).I used it on my forum http://Hoiquantinhoc.com (http://hoiquantinhoc.com/) and i didnt see any problem with it.Here you can see online demo (http://hoiquantinhoc.com/forum/test-forum/784-ha-long-bay.html)
Here we go !

/////////////////////////////////////////////////////////////////////////
HISTORY
Ver 1.5
Using lytebox instead lightbox.
Fixed conflict javascripts.Ver 1.0
First release./////////////////////////////////////////////////////////////////////////
INSTALLATION
Upload files from folder upload.
Import Product ImageResize_MK.xml
Edit file includes/class_bbcode.php,find
return '<img src="' . $link . '" border="0" alt="" />';
Replace with
return '<a target="_blank" href="' . $link . '" rel="lytebox"><img src="' . $link . '" border="0" alt="" /></a>';

Default max width available of images is 500px,you can change it in ACP => Image Resize Using Lytebox.

[OnyxChase]

The picture is not resizing in IE6. :(

[OnyxChase]

Okay I fixed it by changing your IMG Css to:

#posts IMG
{
max-width:'.$width.'; width: expression(this.width > \'500\' ? \'500\': true);
}

[Sayrex]

tnx I im Download & test addon

[jscieza]

Looks interesting but in your test forum I can't see any resize (using IE7 and Firefox 2). Please take a look :)

[OnyxChase]

Is it me, or is this really intensive on the browser? I have a page with three pictures and it slows down my computer a lot!!! I can't help but think about my users who have older computers. This might be a big problem for them.

[Lost Heaven]

Looks interesting but in your test forum I can't see any resize (using IE7 and Firefox 2). Please take a look
Thank you,i reactive this mod in my forum,i fogot active it after test another mod.

Is it me, or is this really intensive on the browser? I have a page with three pictures and it slows down my computer a lot!!! I can't help but think about my users who have older computers. This might be a big problem for them.
Really ? I dont notice any problem from my users.I using Firefox2 on 2ghz computer and it slows down my computer a bit.

[AndyA]

Great looking addition !

Lets say that I install this on my forums and make the code edit as instructed, if at a later date I disable Lytebox through admincp (but not uninstall it), will my images still be shown as normal or will there be a problem displaying them ?

Will this display an 'Image Resized' or similar message ?

[jscieza]

Will this display an 'Image Resized' or similar message ?

No, unfortunately it don't show any type of message. I think that it will be a very good idea to print out a message so users will know that the image they are seeing has been scaled and when they clic over it will be showed at full size :)

I have found that it plugin also resize the images of signatures... It's normal?

About the system resources that this plugin eats, in my Core Duo it works fine but ?n my Pentium 4 (1.8GHz) it takes about 80% of the CPU usage when I clic over a scaled image to see it in full size. The effect isn't good because there is a lag in the animation :(

[Lost Heaven]

About the system resources that this plugin eats, in my Core Duo it works fine but ?n my Pentium 4 (1.8GHz) it takes about 80% of the CPU usage when I clic over a scaled image to see it in full size. The effect isn't good because there is a lag in the animation
At ver 1.0,i used lightbox so it take less CPU usage than lytebox,but i like animation of lyte so i choosed lytebox on ver 1.5 .
I have found that it plugin also resize the images of signatures... It's normal?

Yeah,it also resize the images of signatures if these pictures wider than setting.

[Bommando]

Nice job :)

I noticed that this overrides any links on the images themselves. So, if you have a url tag around the image, it will use Lytebox even if the image isn't resized and you won't be able to click on the link.

This in in Safari 3.0.4.

Would be great if there was a way to allow urls to override the Lytebox code. Sigs should also be exempt.

[tunistunis]

thanks amico for this share

you are best

[kencasanova]

Thank you. but it doesn't work with CMPS. can you fixed that?

[Lost Heaven]

Thank you. but it doesn't work with CMPS. can you fixed that?
Yes,i'll release next ver that work with CMPS.Thanks you very much.

[jiggle]

For me it works great. All images will be reduced, but only the images posted with bbcode IMG will be shown in Original size with the lightbox effect. The images uploaded with the attachment function will be also reduced, but can not be opened in original size like the IMG images (here is an example: http://www.jiggle.de/vb/coole-lustige-bilder/38021-funpix-sammelthread-n-krassen-pixel-508.html#post2478913 ). Is this correct ? Is there a chance only to add this to the JPG and GIF Images uploaded as attachment ? Thanks :-)

[jiggle]

I think we have to change the template "postbit_attachmentimage"

<img class="attach" src="attachment.php?$session[sessionurl]attachmentid=$attachment[attachmentid]&amp;stc=1&amp;d=$attachment[dateline]" border="0" alt="" /><br /><br />

I tried it and it opens the window but was not able to find the picture.

Can someone please help ?

[Amenadiel]

I've been using ncode image resizer, it suits me better because it only applies when an image exceeds max width but (there is always a but) since it uses the attribute "onclick:" I cannot just replace it for lightbox effect, which I already have implemented with custom bbcode [imgw]

If you can code this hack to apply only if the image exceeds the max width, I'll switch in no time.

[jiggle]

Success !
You habe to change the postbit_attachmentimage

<a target="_blank" href="attachment.php?$session[sessionurl]attachmentid=$attachment[attachmentid]&amp;stc=1&amp;d=$attachment[dateline]" rel="lytebox">
<img class="attach" src="attachment.php?$session[sessionurl]attachmentid=$attachment[attachmentid]&amp;stc=1&amp;d=$attachment[dateline]" border="0" alt="" /><br /><br /></a>

Works great now for also the images uploaded with the attachment function.

[SSG.D]

Fantastic m8 ! Thanks for the Awesome work.

Cheers:D
MOTM

[cafenetland]

this is amazin...

im so happy to see this hack...

thank u 1000 times.

[RedFoxy]

Using the template mod with:

<a target="_blank" href="attachment.php?$session[sessionurl]attachmentid=$attachment[attachmentid]&amp;stc=1&amp;d=$attachment[dateline]" rel="lytebox">
<img class="attach" src="attachment.php?$session[sessionurl]attachmentid=$attachment[attachmentid]&amp;stc=1&amp;d=$attachment[dateline]" border="0" alt="" />&nbsp;</a>

that mod RULEZ!

Can I have the img in PSD or similar to translate it in italian?

Just a lil suggest, can you add a code to resize image that are linked and are more big then a specified size? to see it in full size just click on it to show it in Lytebox

[RedFoxy]

Ok i do it!

Follow that instructions to enable the autoresieze of images that are linked directly:

follow that instructions ONLY AFTER installed "Image Resize using Lytebox" and edit file includes/class_bbcode.php

Edit file clientscript/lytebox.js and ADD at end of file:
/*

"RedFoxy Resize Image" based on "Resize Avatars Based on Max Width and Height" for phpBB (c) Christian Fecteau 2005

WebSite: http://www.redfoxy.it
http://www.forum.redfoxy.it
http://www.softairmania.it

Original Credits must be given with my full name (Christian Fecteau)
and a link to my portfolio: http://portfolio.christianfecteau.com/

Removal or alteration of this notice is strongly prohibited.

*/

function rfrs_im(rfrs_obj, rfrs_max_width, rfrs_max_height)
{
if (!document.getElementsByTagName || !document.createElement)
{
return;
}
var rfrs_real_width = rfrs_real_height = rfrs_offset_width = rfrs_offset_height = false;
if (rfrs_obj.width && rfrs_obj.height)
{
rfrs_real_width = rfrs_obj.width;
rfrs_real_height = rfrs_obj.height;
}
if (!rfrs_real_width || isNaN(rfrs_real_width) || (rfrs_real_width <= 0) || !rfrs_real_height || isNaN(rfrs_real_height) || (rfrs_real_height <= 0))
{
var rfrs_rand1 = String(rfrs_count++);
eval("rfrs_retry" + rfrs_rand1 + " = rfrs_obj;");
eval("rfrs_x" + rfrs_rand1 + " = rfrs_max_width;");
eval("rfrs_y" + rfrs_rand1 + " = rfrs_max_height;");
eval("window.setTimeout('rfrs_img_loaded(rfrs_retry" + rfrs_rand1 + ",rfrs_x" + rfrs_rand1 + ",rfrs_y" + rfrs_rand1 + ")',1000);");
return;
}
if (rfrs_real_width > rfrs_max_width) { rfrs_offset_width = rfrs_real_width - rfrs_max_width; }
if (rfrs_real_height > rfrs_max_height) { rfrs_offset_height = rfrs_real_height - rfrs_max_height; }
if (!rfrs_offset_width && !rfrs_offset_height) { return; }

if (rfrs_offset_width > rfrs_offset_height)
{
rfrs_obj.style.width = String(rfrs_max_width) + 'px';
document.all ? rfrs_obj.style.cursor = 'hand' : rfrs_obj.style.cursor = 'pointer';
}
else
{
rfrs_obj.style.height = String(rfrs_max_height) + 'px';
document.all ? rfrs_obj.style.cursor = 'hand' : rfrs_obj.style.cursor = 'pointer';
}
}


Edit file includes/class_bbcode.php and find:
return '<a target="_blank" href="' . $link . '" rel="lytebox"><img src="' . $link . '" border="0" alt="" /></a>';

Replace with:
return '<a target="_blank" href="' . $link . '" rel="lytebox"><img onload="rfrs(this, 200, 200)" src="' . $link . '" border="0" alt="" /></a>';

Save all

Note: to change max width and max height for resize, just change the value in includes/class_bbcode.php at rfrs(this, 200, 200)

[RedFoxy]

sorry... i do an useless work...

BTW i see that if i've an image with a link, the link doesn't goes anymore

Like i've:
[ url=http://www.domain.com/my/home/page.html]http://www.domain.com/img.jpg[/url]

with that plugin that link is replaced with the Lytebox link

[Michael Biddle]

I have a problem with this modification on a clients website. If I have it on, it alters a gif that I manually placed into his postbit template for an ad after the first post. Any ideas on a way around this?

[jiggle]

I noticed, that this isn't working for me with IE6 ? Only in Firefox, Opera and IE7. Also my users have the same problem with the IE6. Can someone confirm that this is not running with IE6 ? Someone knows a solution for this ??

[Walter Ronny]

works great, maybe little slow but works! and looks good!

[scatro]

thanks is this very beatiful hacks :)

[jiggle]

No one has Problems with IE6 ? For me it does not resize the images, but adds the link on the image and I also can click on it and it shows again the image in original size.

[ovnnet]

@Lost Heaven: Demo gì mà die vậy trời? Chơi vbseo bản quyền ko vậy? hehe

This mod quite good.

[ericmaslowski]

very nice mod. Is there a way to show the fullsize image (not resized by this mod) if the user uses the [ATTACH] tags? Otherwise, this mod is perfect.

[tintin74]

Hello, I've a problem with this mod.

I've use ncode image resizer linking the clickable image with rel="lytebox" attribute.

Everything works very well and it is very nice to see. Congratulations.

But, I 've to solve an issue. Every time an admin or mod try to check the blank box of every postbit in showthread page , the posts counter button in the inline moderation table, give us wrong values.

Example: I check 3 post to move to another thread but the counter on the button has "24" posts .

Removing the line
<script type="text/javascript" language="javascript" src="clientscript/lytebox.js"></script>

from the headinclude, everything turn back to works well.

I think there is a conflict through the lytebox.js and some other things that I don't Know...

Sorry for my english, I hope you 've understand.

[Trickster303]

Looks like its working just fine for me.
Installed on 3.7.0

[RaceJunkies]

This mod is not working with vBA CMPS...

[chrisbeau]

No one has Problems with IE6 ? For me it does not resize the images, but adds the link on the image and I also can click on it and it shows again the image in original size.

I have this problem now, did you get it fixed?

[juanpablo]

Thank you very much!!!!

Im too waiting for the ver that work with CMPS!!!

[mahakala]

hi,

by the way: if you use vbseo you need to disable the rel="nofollow" options or this addon doesn't work.

regards,
thomas

[mahakala]

has anyone the same problem: when using this mod the ajax-edit function of the posts doesn't safe anymore by ajax. well, it saves but doesn't display the edited post.

[celikforum]

Super you are working on my forum