Automatic thread/picture re-sizing

Rb

Hi CuLT,

Saw this on another forum and thought it'd be a handy feature for here. Basically, it seems to wrap text/pictures to a certain size to maintain a certain thread width.

For example

This pulls the width of the thread way out and the size of the picture is massive.

However, if you have a look at this you'll see it compresses the picture size into link that when clicked opens a separate window displaying just the image, and the text is wrapped to fit into the determined thread width.

They recently upgraded and are on the same version of VBulletin that we are, so it could just be a case of switching something on?

Rb

AlmightyCushion

That would be a very handy feature actually. Might just be a plugin or a hack or something. Hopefully it's easy to add as I would love to see it.

Hobbes

Its javascript code that does it. Could hack something up on Greasemonkey. Just don't have the time at the mo. If someone wants to do it.

1. look for all elements of post_message_*.
2. Look for IMG tags within those.
3. Add Width/height sizes. Maybe a mouseover code to restore size.

Earthhorse

They have this on thumped.com. The admin Pete, has an account here and I think knows some of the admins?

Maybe he'd throw you the code?

Sherifu

It'd be a nice feature to have. Threads can look messy and difficult to read with huge pics thrown in.

Hobbes

Meh its late and I give up. This is a greasemonkey script that will shrink images which aren't normally part of the page. The toggle bit doesn't work and I can't be bothered at this time to fix.

So if someone one else wants to have a bash.

FILENAME: boardsie_imgthumb.user.js

// boards.ie 
// This will turn images into thumbnails and have them resize on mouse click.
//
// ==UserScript==
// @name          Boards.ie Convert images to thumbnails.
// @namespace     BOARDS.IE
// @description   Converts images to thumbnails.
// @include       http://www.boards.ie/vbulletin/showthread.php*
// @include       http://boards.ie/vbulletin/showthread.php*
// @exclude       
// ==/UserScript==


// This is size divided by ... 1.25 = 1/4 1.5 = 1/2 (I think :)
var thumbnail = {
		"width"		:	1.75,
		"height"	: 1.75
};

var ignore = new Array();
		ignore[0] = /\/static\.boards\.ie\//;
		ignore[1] = /customavatars\//;
		ignore[2] = /images\/ranks\//;
		ignore[3] = /images\/smilies\/pacman.gif/;
		ignore[4] = /images\/arrow_down.gif/;
		ignore[5] = /fogra\.boards\.ie/;

var img = document.images // array notation

for (var i = 0; i < img.length; i++) { 
		var found = false;

		// Check to see if it is an image I should ignore. 
		for (var j = 0; j < ignore.length ; j++ ) { 
			var src = img[i].src;

			if (src.match(ignore[j])) {
				found = true;
				break;					
			}
		}
		
		if (!found) { 
				
			img[i].setAttribute("oldwidth", img[i].width);
			img[i].setAttribute("oldheight", img[i].height);
			img[i].width = img[i].width / thumbnail.width;
			img[i].height = img[i].height / thumbnail.height;	
			
			setEvent(img[i]);
		}
}

function setEvent(obj) { 
	if (obj.addEventListener) {
		obj.addEventListener ("click",toggle,false);
	} 
	else if (obj.attachEvent) {
		obj.attachEvent ("click",toggle);
		
	} 
	else {
		obj.onclick = toggle;
	}
}

function toggle() { 
	GM_log(this.width);
	GM_log(this.oldwidth);
	var swap; 
	swap 			= width;
	width 		= oldwidth;
	oldwidth 	= swap;
	
	swap			= height;
	height		= oldheight;
	oldheight	= swap;
}

In case people are wondering, you install greasemonkey extension for firefox then make a file called as above and put that text into it (filename above is important). After that just drag and drop the file onto firefox to install.

You can use this thread for testing.
http://www.boards.ie/vbulletin/showthread.php?t=2055326230

I'd also recommend if someone wants to get fancy check out this.
http://www.agilepartners.com/blog/2005/12/07/iphoto-image-resizing-using-javascript/

Rb

Cheers Hobbes, wouldn't know where to start with it though.


Fwiw, this is how it appears on the other forum, it's under "Options" in the UserCP. It appears as though it's just a matter of switching something on? I hadn't seen this part before posting the thread but it looks like it's just part of vB?

Sparky

Rb wrote: »

Cheers Hobbes, wouldn't know where to start with it though.


Fwiw, this is how it appears on the other forum, it's under "Options" in the UserCP. It appears as though it's just a matter of switching something on? I hadn't seen this part before posting the thread but it looks like it's just part of vB?

That would be an installed 3rd party plugin that alters templates to add those options to the end user.

http://www.vbulletin.org/forum/showthread.php?t=176531&highlight=resizing

kaimera

Would this break slydice?

Rb

kaimera wrote: »

Would this break slydice?

If anything it'd probably make slydice easier to browse given the size of some of the images.

Spankeh wrote:

That would be an installed 3rd party plugin that alters templates to add those options to the end user.

http://www.vbulletin.org/forum/showt...light=resizing

Ah cool so it's a package that's ready to go.

Adam

Yeah it would be nice to see this implemented indeed. And kaimera, it wouldn't really break it, the hi res thread would be far easier to browse though, and at least you can just click to see the images you want to see in high res

Poor Hobbes, all that work :pac:

Larianne

Any chance of giving this a go again? For simpletons like me that has no idea how to resize image before posting and I want everyone to see my lovely new earrings I purchased today on the Latest Purchases thread in F&A.

Thanks.