New BB tag to do image thumbnails...

This hack adds a new tag to your forums that will allow you to post images
in the form of a thumbnail.

The tag allows you to post pictures in the form of a thumbnail. Large images
can throw off the page, and the tag will scale the picture down to an 80x60
thumbnail preserving its original length and width ratio and turn it into a
hyperlink that you can click on and see the full image in a new browser window.
If the image being thumbnailed is smaller than 80x60, it will show up as is.

This tag is identical to the IMG tag. The new tag is THUMB

Tables affected: none
Templates affected: none
Files affected: admin/functions.php

Check out this link for a demo: http://www.ls1.com/forums/showthread...hreadid=276879

Note: This tag does not resize the actual picture. It just displays them at a smaller
scale. It will not help with bandwidth preservation.

[Zzed]

That is the line number in an unmodified functions.php for version 2.2.9.

It is the last few lines of bbcodeparse2() function.

Or if you search for the following line:

// ###################### Start phphighlite #######################

and scroll up about 6-7 lines you will get there.

[Pikok]

03-27-03 at 10:09 PM colicab-d said this in Post #9
how would i saw replace the image code with this? or even better add a THUMB button beside the IMG one?

To add a button you would need to edit 3 things.. The "vbcode_buttons" template, and the two JavaScripts "vbcode.js" and "vbcode_language.js".


In the "vbcode_buttons" template add this where you want the button to appear:

<input type="button" class="bginput" value="THUMB" title="Insert Thumbnail" onclick="vbcode(this.form,'THUMB','http://')" onmouseover="stat('thumb')">

In the "vbcode.js" you would need to add this just after the code for the IMG tag:

// *******************************************************

function vbcode(theform,vbcode,prompttext) {
// insert [x]yyy[/x] style markup
	if ((normalmode(theform)) || (vbcode=="THUMB")) {
		inserttext = prompt(tag_prompt+"\n["+vbcode+"]xxx[/"+vbcode+"]",prompttext);
		if ((inserttext != null) && (inserttext != ""))
			theform.message.value += "["+vbcode+"]"+inserttext+"[/"+vbcode+"] ";
		}
	else {
		donotinsert = false;
		for (i = 0; i < tags.length; i++) {
			if (tags[i] == vbcode)
				donotinsert = true;
			}
		if (donotinsert)
			stat("already_open");
		else {
			theform.message.value += "["+vbcode+"]";
			arraypush(tags,vbcode);
			}
		}
	theform.message.focus();
}

In the "vbcode_language.js" you would need to add this just after the code for the "img_text":

thumb_text = "Insert a thumbnail into your message";

[Larry@IOG]

How would I go about just getting my IMG tag to auto thumb every image?

I have my attachments like that already

Thanks

Larry

[ivanmcp]

Hi, this is cool hack.

I presume that I can change size of a thumbnail to my own prefference. So, for example, I might want to set image width to 600 max (so not to loose table formating), and any image larger that that would be scaled down to 600 pixels width, with the option to display original image size when clicked on appropriate link.

If so, I will implement this hack immediately .

Oh yes, I got to use this smiley :banana: .


Ivan

[Rose]

Great hack. I'm using it very nicely in a gallery-type format.

Is there a way to cache the images after initial loading, by chance?

Anyway, great hack and very useful.

[NuclioN]

Great Pikok. What is the code to place a thumb button by the quick reply in showtread template?

[Classy]

Thank you ... works in 2.3.0 also. Clicked install

[Classy]

is there a way to make it so when your posting people have the option to click the bbcode? Just like they do for [img] or [code]?
Hope this makes sense. Thanks.

[Blindchild02]

yea, i also want that... like in the newthread, so your able to click a button, like the IMG button and HTML button

also.. a problem i have, is that not all the images work with [thumb] ... why is that? o_O

[Classy]

I'm thinkin it has to do with the code in functions.php .... not sure though