vb.org Archive

vb.org Archive (https://vborg.vbsupport.ru/index.php)
-   vBulletin 3.6 Add-ons (https://vborg.vbsupport.ru/forumdisplay.php?f=194)
-   -   Show Thread Enhancements - Dynamic Picture Resize for [IMG] tag (https://vborg.vbsupport.ru/showthread.php?t=157228)

TECK 09-07-2007 11:23 AM

Quote:

Originally Posted by kambiz (Post 1334078)
hmmm is it possible to show a message (or alert ) on the top of the picture to indicate the picture has been resized?

Everything is possible. If many other users request it, I will do it... is that fair? :)
I wanted a solution that is very clean and it does not modify the way vBulletin behaves originally.

Quote:

Originally Posted by valdet (Post 1334100)
This feature is similar to this hack..
https://vborg.vbsupport.ru/showthread.php?t=125500

There are many hacks out there that do a similar thing. That does not mean they are written properly.
I want you to tell me what is wrong with the above hack, because there is something wrong with it. :)

NeutralizeR 09-07-2007 11:33 AM

Thank you TECK, installing and testing it now:)

Edit: I'm grateful for all your effors and help! No matter if this hack does whatever i want or not.

If you check my post at that thread you can understand what i need:
https://vborg.vbsupport.ru/showpost....4&postcount=15

Dynamic resizing won't help us much as we have many big images on a single page so the layout will be broken till it completely loads all of the images.

PHP Code:

return '<img class="resize" src="' .  $link '" border="0" alt="" />'

If we can find a way to wrap oversized images with "<a href="$link">...</a>" it'll be done.

The method on vbulletin.org does what i'm asking for but they denied to help me and it's ok :)

Best Regards to Floren Munteanu

TECK 09-07-2007 12:07 PM

Aha, so you basically don't want to open the enlarged picture, when you click on it?
Please be more specific. And you cannot resize an image with JavaScript, before is loaded. It would not know the actual picture dimensions, in order to resize it properly.

In other words, this is the process:
1. Picture is loaded, for the first time. (it will show the full size)
2. Picture size is detected.
3. Picture is formatted to new dimensions.

NeutralizeR 09-07-2007 12:21 PM

Quote:

Originally Posted by TECK (Post 1334199)
Aha, so you basically don't want to open the enlarged picture, when you click on it?
Please be more specific. And you cannot resize an image with JavaScript, before is loaded. It would not know the actual picture dimensions, in order to resize it properly.

In other words, this is the process:
1. Picture is loaded, for the first time. (it will show the full size)
2. Picture size is detected.
3. Picture is formatted to new dimensions.

I want it to be resized before the picture is loaded and have the link to the original picture :) I know javascript can't do it.

I need an advanced version of this hack with the clickable url of the resized picture:
https://vborg.vbsupport.ru/showpost....4&postcount=15

kambiz 09-07-2007 01:00 PM

Quote:

Originally Posted by TECK (Post 1334168)
Everything is possible. If many other users request it, I will do it... is that fair? :)
I wanted a solution that is very clean and it does not modify the way vBulletin behaves originally.


yeah sure.:)

TECK 09-07-2007 01:11 PM

Quote:

Originally Posted by NeutralizeR (Post 1334204)
I want it to be resized before the picture is loaded and have the link to the original picture :) I know javascript can't do it.

You definitely do not want that... because it will ruin your server performance in no time.
There are many hacks on Google that will do this, but from my tests, they will skyrocket the server load, like really really high. And you can do it with JavaScript if you really want to do it like that.

So what you want is to have like a thumbnail displaying a link to the original picture.
That's what it does right now the hack (except the resizing before loading, which I really don't recommend). You cannot see it on your example because the file is very small and it loads instantly. The hack I have listed here is identical to the vBulletin.org one. And I wrapped the [IMG] with a link, like you showed in the example above. If you click on the image, it will show the image... but if you right-click it and open it on a new tab/window with the actual link, not the image.

I recommend you to disable the [IMG] bbcode tag and attach always images. It will do what exactly you need. In the other hand you lose space on your disk. If you go with your desired method, you will kill your server. Is up to you what you want, it is your server. :)

I forgot to mention one important thing. The way this hack is written now, it will work with all browsers. Altering the code to add features will reduce or completely render it unusable.

TECK 09-07-2007 01:27 PM

Hmm, after reading again your post, I noticed that you have many large images on a single page. So you definitely need a resizing option, or somehow to hide the image, before is loaded. The problem with this is that it will render the hack unusable in IE6 and below.

I will think of a clean way to do it, I get the clear picture now related to what you need exactly.
However, I want you post here an example where you have many large images on the same page. I would like to see the effect it does.

Also, the link wrapping... you want that to be done automatically?
If yes, it will mess your signature pictures. Let me know.

Lizard King 09-07-2007 02:50 PM

I was using ncode image resizer however that wasnot working with vB Blog. This one works perfectly. Demo for vb blog http://www.ayyas.com/blog.php?b=787
Thanks Floren :)

NeutralizeR 09-07-2007 04:54 PM

The method i've been using for a while has nothing to do with the server loads as it resize the images with CSS (instead of javascript) and it resize them before the page completely loads.

Only missing thing is the automatic linking to the original image dimensions. Check this page for example:
http://www.msxlabs.org/forum/fantazi...tml#post682559

The picture in the first post is resized (actually shrunk) to 728px width. It's actual width is 1024px.

NeutralizeR 09-07-2007 05:22 PM

I did it thanks to TECK.

vbulletin_global.js:
Code:

/**
* Function to resize an image used with the [IMG] bbcode tag
*
* @param    string    Image object
* @param    string    Image link
* @param    integer    Image max width
*/
function resize_image(obj, link, maxwidth)
{
    if (obj.width > maxwidth)
    {
        obj.style.cursor = 'pointer';
        obj.style.width = maxwidth + 'px';
        obj.style.height = parseInt(obj.height * maxwidth / obj.width) + 'px';
        obj.onclick = function()
        {
            window.location.href = link;
            return false;
        };
    }
}

/**
* Function to emulate document.getElementById

CSS:
HTML Code:

.resize {
max-width: 728px; width: expression(this.width > 728 ? 728: true);
}

class_bbcode.php:
PHP Code:

return '<img class="resize" src="' .  $link '" border="0" alt="" onload="resize_image(this, \'' .  $link '\', 727);" />'

But unfortunately automatic linking to the original dimensions only work for IE and Opera. I at least need it for Firefox, too.

Test page:
http://www.msxlabs.org/forum/fantazi...r-2-a-202.html


All times are GMT. The time now is 08:34 AM.

Powered by vBulletin® Version 3.8.12 by vBS
Copyright ©2000 - 2025, vBulletin Solutions Inc.

X vBulletin 3.8.12 by vBS Debug Information
  • Page Generation 0.01298 seconds
  • Memory Usage 1,757KB
  • Queries Executed 10 (?)
More Information
Template Usage:
  • (1)ad_footer_end
  • (1)ad_footer_start
  • (1)ad_header_end
  • (1)ad_header_logo
  • (1)ad_navbar_below
  • (1)bbcode_code_printable
  • (1)bbcode_html_printable
  • (2)bbcode_php_printable
  • (5)bbcode_quote_printable
  • (1)footer
  • (1)gobutton
  • (1)header
  • (1)headinclude
  • (6)option
  • (1)pagenav
  • (1)pagenav_curpage
  • (3)pagenav_pagelink
  • (1)pagenav_pagelinkrel
  • (1)post_thanks_navbar_search
  • (1)printthread
  • (10)printthreadbit
  • (1)spacer_close
  • (1)spacer_open 

Phrase Groups Available:
  • global
  • postbit
  • showthread
Included Files:
  • ./printthread.php
  • ./global.php
  • ./includes/init.php
  • ./includes/class_core.php
  • ./includes/config.php
  • ./includes/functions.php
  • ./includes/class_hook.php
  • ./includes/modsystem_functions.php
  • ./includes/class_bbcode_alt.php
  • ./includes/class_bbcode.php
  • ./includes/functions_bigthree.php 

Hooks Called:
  • init_startup
  • init_startup_session_setup_start
  • init_startup_session_setup_complete
  • cache_permissions
  • fetch_threadinfo_query
  • fetch_threadinfo
  • fetch_foruminfo
  • style_fetch
  • cache_templates
  • global_start
  • parse_templates
  • global_setup_complete
  • printthread_start
  • pagenav_page
  • pagenav_complete
  • bbcode_fetch_tags
  • bbcode_create
  • bbcode_parse_start
  • bbcode_parse_complete_precache
  • bbcode_parse_complete
  • printthread_post
  • printthread_complete