vb.org Archive

vb.org Archive (https://vborg.vbsupport.ru/index.php)
-   vBulletin 3.0 Full Releases (https://vborg.vbsupport.ru/forumdisplay.php?f=33)
-   -   vB Integration of "Normal display of PNG Alpha Transparency with MSIE" PHP script (https://vborg.vbsupport.ru/showthread.php?t=67413)

Natch 07-19-2004 10:00 PM

vB Integration of "Normal display of PNG Alpha Transparency with MSIE" PHP script
 
File Edits: 2 (in one file)
New Files: 1 (forumroot/images/spacer.png)

This script, for those that don't know it, is a server-side solution to the faulty display of 24-bit alpha transparencies in MSIE...

For more info please read up on the site created by the d00d that wrote the script - all the props go to him!

Created in response to my need to bloody well get it right after so many months, as well as https://vborg.vbsupport.ru/showthread.php?t=61091 and https://vborg.vbsupport.ru/showthread.php?t=66846...

OK - now to get this integrated to your vB so that any PNG24 images with transparency will display without that ugly grey backdrop in MSIE, please do the following:

In includes/functions.php:

Find:
PHP Code:

    // parse PHP include ##################
    
if (!is_demo_mode())
    {
        eval(
fetch_template('phpinclude_end', -10));
    } 

Add After:
PHP Code:

    $output replacePngTags($output); 

Find:
PHP Code:

// ###################### Start build datastore #######################
function build_datastore($title ''$data '')
{
    global 
$DB_site;

    if (
$title != '')
    {
        
$DB_site->query("
            REPLACE INTO " 
TABLE_PREFIX "datastore
                (title, data)
            VALUES
                ('" 
addslashes(trim($title)) . "', '" addslashes(trim($data)) . "')
        "
);
    }


Add After:
PHP Code:

// PNG-24 Alpha Transparency with MSIE
/* ***
* replacePngTags - Justin Koivisto [W.A. Fisher Interactive] 7/1/2003 10:45AM
* function to IE display of PNG transparencies - integrated to vB3 by Natch@mobileforces.org
* *** */
function replacePngTags($x,$img_path='/forums/images/',$sizeMeth='scale')
{
    
$arr2=array();
    
// make sure that we are only replacing for the Windows versions of Internet
    // Explorer 5+
    
$msie='/msie\s(5\.[5-9]|[6-9]\.[0-9]*).*(win)/i';
    if( !isset(
$_SERVER['HTTP_USER_AGENT']) ||
        !
preg_match($msie,$_SERVER['HTTP_USER_AGENT']) ||
        
preg_match('/opera/i',$_SERVER['HTTP_USER_AGENT']))
        return 
$x;

    
// find all the png images in backgrounds
    
preg_match_all('/background-image:\s*url\(\'(.*\.png)\'\);/Uis',$x,$background);
    for(
$i=0;$i<count($background[0]);$i++){
        
// simply replace:
        //  "background-image: url('image.png');"
        // with:
        //  "filter:progid:DXImageTransform.Microsoft.AlphaImageLoader(
        //      enabled=true, sizingMethod=scale src='image.png');"
        // I don't think that the background-repeat styles will work with this...
        
$x=str_replace($background[0][$i],'filter:progid:DXImageTransform.'.
                
'Microsoft.AlphaImageLoader(enabled=true, sizingMethod='.$sizeMeth.
                
' src=\''.$background[1][$i].'\');',$x);
    }

    
// find all the IMG tags with ".png" in them
    
$pattern='/<(input|img)[^>]*src=(\\\'|\\")([^>]*\.png)\2[^>]*>/i';
    
preg_match_all($pattern,$x,$images);
    for(
$num_images=0;$num_images<count($images[0]);$num_images++){
        
// for each found image pattern
        
$original=$images[0][$num_images];
        
$quote=$images[2][$num_images];
        
$atts=''$width=0$height=0$modified=$original;

        
// We do this so that we can put our spacer.png image in the same
        // directory as the image - if a path wasn't passed to the function
        
if(empty($img_path)){
            
$tmp=split('[\\/]',$images[3][$i]);
            
$this_img=array_pop($tmp);
            
$img_path=join('/',$tmp);
            if(empty(
$img_path)){
                
// this was a relative URI, image should be in this directory
                
$img_path=str_replace($_SERVER['DOCUMENT_ROOT'],'',dirname($_SERVER['PHP_SELF'])).'/';
            }else{
                
$img_path.='/';
            }
        }

        
// If the size is defined by styles, find them
        
preg_match_all(
            
'/style=(\\\'|\\").*(\s?width:\s?([0-9]+(px|%));).*'.
            
'(\s?height:\s?([0-9]+(px|%));).*\\1/Ui',
            
$images[0][$num_images],$arr2);
        if(
is_array($arr2) && count($arr2[0])){
            
// size was defined by styles, get values
            
$width=$arr2[3][0];
            
$height=$arr2[6][0];

            
// remove the width and height from the style
            
$stripper=str_replace(' ','\s','/('.$arr2[2][0].'|'.$arr2[5][0].')/');
            
// Also remove any empty style tags
            
$modified=preg_replace(
                
'`style='.$arr2[1][0].$arr2[1][0].'`i',
                
'',
                
preg_replace($stripper,'',$modified));
        }else{
            
// size was not defined by styles, get values from attributes
            
preg_match_all('/width=(\\\'|\\")?([0-9%]+)\\1/i',$images[0][$num_images],$arr2);
            if(
is_array($arr2) && count($arr2[0])){
                
$width=$arr2[2][0];
                if(
is_numeric($width))
                    
$width.='px';
    
                
// remove width from the tag
                
$modified=str_replace($arr2[0][0],'',$modified);
            }
            
preg_match_all('/height=(\\\'|\\")?([0-9%]+)\\1?/i',$images[0][$num_images],$arr2);
            if(
is_array($arr2) && count($arr2[0])){
                
$height=$arr2[2][0];
                if(
is_numeric($height))
                    
$height.='px';
    
                
// remove height from the tag
                
$modified=str_replace($arr2[0][0],'',$modified);
            }
        }
        
        if(
$width==|| $height==0){
            
// width and height not defined in HTML attributes or css style
            
if(file_exists($_SERVER['DOCUMENT_ROOT'].$img_path.$images[3][$i])){
                
// image is on this filesystem, get width & height
                
$size=getimagesize($_SERVER['DOCUMENT_ROOT'].$img_path.$images[3][$i]);
                
$width=$size[0].'px';
                
$height=$size[1].'px';
            }
        }
        
        
// end quote is already supplied by originial src attribute
        
$replace_src_with=$img_path.'spacer.png'.$quote.' style="width: '.$width.
            
'; height: '.$height.'; filter: progid:DXImageTransform.'.
            
'Microsoft.AlphaImageLoader(src=\''.$images[3][$i].'\', sizingMethod='.
            
$sizeMeth.');"';

        
// now create the new tag from the old
        
$new_tag=str_replace($images[3][$i].$quote,$replace_src_with,
            
str_replace('  ',' ',$modified));
        
// now place the new tag into the content
        
$x=str_replace($original,$new_tag,$x);
        
$i++;
    }
    return 
$x;
}
// /PNG-24 Alpha Transparency with MSIE 

In this last bit of code, please edit the line
PHP Code:

function replacePngTags($x,$img_path='[color=red]/forums/images/[/color]',$sizeMeth='scale'

so that the $img_path variable points to your forumroot directory from your ['DOCUMENT_ROOT']. This is relying on your having uploaded the attached spacer.png to your forumroot/images/ folder.

OK - now the only reason this will not work (except if you neglect to upload this excellent functions.php file) is if your calls to the PNG file of your choice does not have a full definition ... When I say work - your forum will still work no probs, it's just the script will pass over each PNG tag like the Angel of Death over a blood-stained door if you don't fit the bill :D

Will work:

<img src="$vboptions[bburl]/images/misc/someimage.png" width="10" height="10" />

Will not work:

<img src="$vboptions[bburl]/images/misc/someimage.png" />

Will work:

<img src="clear.gif" style="background-image:url($vboptions[bburl]/images/misc/someimage.png);height:10px;width:10px" />

Will not work:

<img src="clear.gif" style="background-image:url($vboptions[bburl]/images/misc/someimage.png)" />

Will work:

<body style="background-image:url($vboptions[bburl]/images/misc/someimage.png)">

Read over his page if you want more info as I said :) Enjoy y'all :) ( and please remember to test this in IE - it will only make a difference if you use IE ;) )

I've also attached for your own testing, the same image used in the test on the original author's site...

Have fun kiddies :) May the PNG24 be with you ;)

LOL - well that attachment of the spacer.png doesn't work ;D you need to be able to see the 1x1 attachment to click on it hehe... feel free to grab it from http://www.mobileforces.org/forums/images/spacer.png

EDIT 26-08-2004: This links to a HOW-TO on using this with Avatars - it requires a small one-file, one-tempalte hack.

EDIT: 07-01-2005
The function this is based on was updated a while back to NOT require the width and height to be explicitly defined, and so this has now been updated to include the latest version of this function.

TO UPGRADE:

Just replace:
PHP Code:

// PNG-24 Alpha Transparency with MSIE
/* ***
* replacePngTags - Justin Koivisto [W.A. Fisher Interactive] 7/1/2003 10:45AM
* function to IE display of PNG transparencies - integrated to vB3 by Natch@mobileforces.org
* *** */
function replacePngTags($x,$img_path='/forums/images/',$sizeMeth='scale')
{
    
$arr2=array();
    
// make sure that we are only replacing for the Windows versions of Internet
    // Explorer 5+
    
$msie='/msie\s(5\.[5-9]|[6-9]\.[0-9]*).*(win)/i';
    if( !isset(
$_SERVER['HTTP_USER_AGENT']) ||
        !
preg_match($msie,$_SERVER['HTTP_USER_AGENT']) ||
        
preg_match('/opera/i',$_SERVER['HTTP_USER_AGENT']))
        return 
$x;

    
// find all the png images in backgrounds
    
preg_match_all('/background-image:\s*url\(\'(.*\.png)\'\);/Uis',$x,$background);
    for(
$i=0;$i<count($background[0]);$i++){
        
// simply replace:
        //  "background-image: url('image.png');"
        // with:
        //  "filter:progid:DXImageTransform.Microsoft.AlphaImageLoader(
        //      enabled=true, sizingMethod=scale src='image.png');"
        // I don't think that the background-repeat styles will work with this...
        
$x=str_replace($background[0][$i],'filter:progid:DXImageTransform.'.
                
'Microsoft.AlphaImageLoader(enabled=true, sizingMethod='.$sizeMeth.
                
' src=\''.$background[1][$i].'\');',$x);
    }

    
// find all the IMG tags with ".png" in them
    
$pattern='/<(input|img)[^>]*src=(\\\'|\\")([^>]*\.png)\2[^>]*>/i';
    
preg_match_all($pattern,$x,$images);
    for(
$num_images=0;$num_images<count($images[0]);$num_images++){
        
// for each found image pattern
        
$original=$images[0][$num_images];
        
$quote=$images[2][$num_images];
        
$atts=''$width=0$height=0$modified=$original;

        
// We do this so that we can put our spacer.png image in the same
        // directory as the image - if a path wasn't passed to the function
        
if(empty($img_path)){
            
$tmp=split('[\\/]',$images[3][$i]);
            
$this_img=array_pop($tmp);
            
$img_path=join('/',$tmp);
            if(empty(
$img_path)){
                
// this was a relative URI, image should be in this directory
                
$img_path=str_replace($_SERVER['DOCUMENT_ROOT'],'',dirname($_SERVER['PHP_SELF'])).'/';
            }else{
                
$img_path.='/';
            }
        }

        
// If the size is defined by styles, find them
        
preg_match_all(
            
'/style=(\\\'|\\").*(\s?width:\s?([0-9]+(px|%));).*'.
            
'(\s?height:\s?([0-9]+(px|%));).*\\1/Ui',
            
$images[0][$num_images],$arr2);
        if(
is_array($arr2) && count($arr2[0])){
            
// size was defined by styles, get values
            
$width=$arr2[3][0];
            
$height=$arr2[6][0];

            
// remove the width and height from the style
            
$stripper=str_replace(' ','\s','/('.$arr2[2][0].'|'.$arr2[5][0].')/');
            
// Also remove any empty style tags
            
$modified=preg_replace(
                
'`style='.$arr2[1][0].$arr2[1][0].'`i',
                
'',
                
preg_replace($stripper,'',$modified));
        }else{
            
// size was not defined by styles, get values from attributes
            
preg_match_all('/width=(\\\'|\\")?([0-9%]+)\\1/i',$images[0][$num_images],$arr2);
            if(
is_array($arr2) && count($arr2[0])){
                
$width=$arr2[2][0];
                if(
is_numeric($width))
                    
$width.='px';
    
                
// remove width from the tag
                
$modified=str_replace($arr2[0][0],'',$modified);
            }
            
preg_match_all('/height=(\\\'|\\")?([0-9%]+)\\1?/i',$images[0][$num_images],$arr2);
            if(
is_array($arr2) && count($arr2[0])){
                
$height=$arr2[2][0];
                if(
is_numeric($height))
                    
$height.='px';
    
                
// remove height from the tag
                
$modified=str_replace($arr2[0][0],'',$modified);
            }
        }
        
        if(
$width==|| $height==0){
            
// width and height not defined in HTML attributes or css style
            
if(file_exists($_SERVER['DOCUMENT_ROOT'].$img_path.$images[3][$i])){
                
// image is on this filesystem, get width & height
                
$size=getimagesize($_SERVER['DOCUMENT_ROOT'].$img_path.$images[3][$i]);
                
$width=$size[0].'px';
                
$height=$size[1].'px';
            }
        }
        
        
// end quote is already supplied by originial src attribute
        
$replace_src_with=$img_path.'spacer.png'.$quote.' style="width: '.$width.
            
'; height: '.$height.'; filter: progid:DXImageTransform.'.
            
'Microsoft.AlphaImageLoader(src=\''.$images[3][$i].'\', sizingMethod='.
            
$sizeMeth.');"';

        
// now create the new tag from the old
        
$new_tag=str_replace($images[3][$i].$quote,$replace_src_with,
            
str_replace('  ',' ',$modified));
        
// now place the new tag into the content
        
$x=str_replace($original,$new_tag,$x);
        
$i++;
    }
    return 
$x;
}
// /PNG-24 Alpha Transparency with MSIE 

With this
PHP Code:

// PNG-24 Alpha Transparency with MSIE
/* ***
* replacePngTags - Justin Koivisto [W.A. Fisher Interactive] 7/1/2003 10:45AM
* function to IE display of PNG transparencies - integrated to vB3 by Natch@mobileforces.org
* *** */
function replacePngTags($x,$img_path='/forums/images/',$sizeMeth='scale')
{
    
$arr2=array();
    
// make sure that we are only replacing for the Windows versions of Internet
    // Explorer 5+
    
$msie='/msie\s(5\.[5-9]|[6-9]\.[0-9]*).*(win)/i';
    if( !isset(
$_SERVER['HTTP_USER_AGENT']) ||
        !
preg_match($msie,$_SERVER['HTTP_USER_AGENT']) ||
        
preg_match('/opera/i',$_SERVER['HTTP_USER_AGENT']))
        return 
$x;

    
// find all the png images in backgrounds
    
preg_match_all('/background-image:\s*url\(\'(.*\.png)\'\);/Uis',$x,$background);
    for(
$i=0;$i<count($background[0]);$i++){
        
// simply replace:
        //  "background-image: url('image.png');"
        // with:
        //  "filter:progid:DXImageTransform.Microsoft.AlphaImageLoader(
        //      enabled=true, sizingMethod=scale src='image.png');"
        // I don't think that the background-repeat styles will work with this...
        
$x=str_replace($background[0][$i],'filter:progid:DXImageTransform.'.
                
'Microsoft.AlphaImageLoader(enabled=true, sizingMethod='.$sizeMeth.
                
' src=\''.$background[1][$i].'\');',$x);
    }

    
// find all the IMG tags with ".png" in them
    
$pattern='/<(input|img)[^>]*src=(\\\'|\\")([^>]*\.png)\2[^>]*>/i';
    
preg_match_all($pattern,$x,$images);
    for(
$num_images=0;$num_images<count($images[0]);$num_images++){
        
// for each found image pattern
        
$original=$images[0][$num_images];
        
$quote=$images[2][$num_images];
        
$atts=''$width=0$height=0$modified=$original;

        
// We do this so that we can put our spacer.png image in the same
        // directory as the image - if a path wasn't passed to the function
        
if(empty($img_path)){
            
$tmp=split('[\\/]',$images[3][$i]);
            
$this_img=array_pop($tmp);
            
$img_path=join('/',$tmp);
            if(empty(
$img_path)){
                
// this was a relative URI, image should be in this directory
                
$img_path=str_replace($_SERVER['DOCUMENT_ROOT'],'',dirname($_SERVER['PHP_SELF'])).'/';
            }else{
                
$img_path.='/';
            }
        }

        
// If the size is defined by styles, find them
        
preg_match_all(
            
'/style=(\\\'|\\").*(\s?width:\s?([0-9]+(px|%));).*'.
            
'(\s?height:\s?([0-9]+(px|%));).*\\1/Ui',
            
$images[0][$num_images],$arr2);
        if(
is_array($arr2) && count($arr2[0])){
            
// size was defined by styles, get values
            
$width=$arr2[3][0];
            
$height=$arr2[6][0];

            
// remove the width and height from the style
            
$stripper=str_replace(' ','\s','/('.$arr2[2][0].'|'.$arr2[5][0].')/');
            
// Also remove any empty style tags
            
$modified=preg_replace(
                
'`style='.$arr2[1][0].$arr2[1][0].'`i',
                
'',
                
preg_replace($stripper,'',$modified));
        }else{
            
// size was not defined by styles, get values from attributes
            
preg_match_all('/width=(\\\'|\\")?([0-9%]+)\\1/i',$images[0][$num_images],$arr2);
            if(
is_array($arr2) && count($arr2[0])){
                
$width=$arr2[2][0];
                if(
is_numeric($width))
                    
$width.='px';
    
                
// remove width from the tag
                
$modified=str_replace($arr2[0][0],'',$modified);
            }
            
preg_match_all('/height=(\\\'|\\")?([0-9%]+)\\1?/i',$images[0][$num_images],$arr2);
            if(
is_array($arr2) && count($arr2[0])){
                
$height=$arr2[2][0];
                if(
is_numeric($height))
                    
$height.='px';
    
                
// remove height from the tag
                
$modified=str_replace($arr2[0][0],'',$modified);
            }
        }
        
        if(
$width==|| $height==0){
            
// width and height not defined in HTML attributes or css style
            
if(file_exists($_SERVER['DOCUMENT_ROOT'].$img_path.$images[3][$i])){
                
// image is on this filesystem, get width & height
                
$size=getimagesize($_SERVER['DOCUMENT_ROOT'].$img_path.$images[3][$i]);
                
$width=$size[0].'px';
                
$height=$size[1].'px';
            }
        }
        
        
// end quote is already supplied by originial src attribute
        
$replace_src_with=$img_path.'spacer.png'.$quote.' style="width: '.$width.
            
'; height: '.$height.'; filter: progid:DXImageTransform.'.
            
'Microsoft.AlphaImageLoader(src=\''.$images[3][$i].'\', sizingMethod='.
            
$sizeMeth.');"';

        
// now create the new tag from the old
        
$new_tag=str_replace($images[3][$i].$quote,$replace_src_with,
            
str_replace('  ',' ',$modified));
        
// now place the new tag into the content
        
$x=str_replace($original,$new_tag,$x);
        
$i++;
    }
    return 
$x;
}
// /PNG-24 Alpha Transparency with MSIE 

Happy New Year all... and God Bless all those affected by the Earthquake/Tsunami

Highlander 07-30-2004 06:45 AM

natch i did not understand what it does, my english is not very bad, but its not enogh to understand that ..

can you explain in in 1 sentende for me please?

Natch 07-30-2004 07:01 AM

Look at this page using IE - then look at the same page using Mozilla or another pbrwser - you will see that the Image that is repeated on the page has a grey border where it should be transparent until the "fix" is applied...

This hack provides a way to apply that fix to your forum without having to hack each location where the PNG-24bit transparent images appear.

If you want to know more about how mouch work it is, there is a style released on vBt that has this fix applied throuhgout it manually - the coder who wrote it would be able to explain how much more work it is.

The reason to do this is because GIF transpararency is good, but the quality of a GIF is terrible unless the filesize if huge - PNG24 files can be tiny filesizes while being large images with HQ transparency and no loss in the compression.

More than one sentence, but there you go.

Highlander 08-01-2004 06:56 AM

ahh okai i understand .. and are png images supported by vb3.0 to make thumbnails within the posting images in a thread?

Natch 08-01-2004 11:58 PM

This script will not pick them up even if this was the case - it's not magic, just detects .png file extensions in <img src tags or style="background: url() definitions

apokphp 08-21-2004 08:14 AM

Natch, I got this to work, but not as I need.

It works: See this thread: http://www.onlinedebate.net/forums/s...1368#post41368

The problem I'm having, is that I need this to work with avatars. I add the width/height after the: [/b]<img src="$avatarurl"[/b], but it doesn't work.

The complete line of code for the avatar is:
PHP Code:

<a href="member.php?$session[sessionurl]u=$post[userid]"><img src="$avatarurlwidth="100" height="100" alt="<phrase 1="$post[username]">$vbphrase[xs_avatar]</phrase>" border="0" /></a

Any ideas? Do I need to have the width/height in one of the files, not the postbit template?

Natch 08-22-2004 01:55 PM

it should work when the info is in the template - can you check for me that you have made the alteration to the avatar in all postbit templates and in all avatar locations ?

You will definitely need to add either style="width:Npx;height:Mpx" or width="N" height="M" to all instances of the avatar: check that you have edited the postbit_legacy tempalte as well as postbit....

apokphp 08-22-2004 04:38 PM

I only use the postbit_legacy template (I don't use the other...is it still required to code it even if that template is "disabled"?).

The width/height attributes are there as you can see in the code above.

Are you saying that in all places where the avatar is coded, it must have these attributes even if those places are not active?

Natch 08-23-2004 03:40 AM

try using style="width:Npx;height:Mpx" instead - let me knwo how you go...

apokphp 08-24-2004 08:29 AM

This is what I tried:
PHP Code:

<a href="member.php?$session[sessionurl]u=$post[userid]"><img src="$avatarurlstyle="width:100px;height:100px" alt="<phrase 1="$post[username]">$vbphrase[xs_avatar]</phrase>" border="0"  /></style></a

That didn't work. Also, even if it did, it would force all avatars to stretch or decrease in size to a set w/h. Not sure if that would be a good idea on my forum...but I'm curious to see if this can work somehow nonetheless.

Do I have to have the closing style tag in there?

Natch 08-25-2004 03:20 AM

Nope - it's not a tag thing when you have inline styles ...

One option (and I don't know if this will work) is to have some additional code added to the part of showthread that grabs the avatar that will give you the width and height statement ...

I'll look into it man...

Natch 08-26-2004 03:51 AM

OK - a solution to this is a separate hack:

In includes/functions_showthread.php:

Find:
PHP Code:

        if (empty($avatarurl) OR ($bbuserinfo['userid'] > AND !($bbuserinfo['showavatars'])))
        {
            
$show['avatar'] = false;
        }
        else
        {
            
$show['avatar'] = true;
        } 

Add below:
PHP Code:

        if($avatarurl)
        {
            
$avatarbits getimagesize($avatarurl);
            
$avatarimgsrc $avatarbits[3];
        } 

In postbit / postbit_legacy:

Find:
Code:

<img src="$avatarurl"
Add after:
Code:

<if condition="$avatarimgsrc">$avatarimgsrc </if>
HTH mate - this puts the width and height properly formatted for the <img src tag - if you want to format it using style, then you would use $avatarbits[0] and $avatarbits[1] for width and ehight respectively and then format your $avatarimgsrc statement accordingly
Code:

$avatarimgsrc = "style="width:$avatarbits[0]px;height:$avatarbits[1]px"

apokphp 09-01-2004 08:37 AM

the includes/functions_showthread.php edit resulted in:

Quote:


Warning: getimagesize(image.php?u=1&dateline=1093078656): failed to open stream: No such file or directory in /home/online/public_html/forums/includes/functions_showthread.php on line 370
on the top of every page...then when trying to open a thread, the standard error displayed:
Quote:

Unable to add cookies, header already sent.
File: /home/online/public_html/forums/includes/functions_showthread.php
Line: 370
In other words...w/ that edit...I couldn't view any threads.

Natch 09-01-2004 08:51 AM

Undo that edit, then point me to your site: I'll take a lok at what your site generates as $avatarurl and then get more info for you.

NOTE: this last bit of this hack is not something that is a part of the original a new hack as I said - so I'm not sure how far I can support PNG avatars... unless you switch your Avatars to store them in the filesystem, as opposed to the database - that might make a difference.

apokphp 09-01-2004 04:34 PM

I undid it. My site: www.onlinedebate.net/forums

Now, perhaps something of interest. I have vbadvanced CMPS. The avatar displayed w/ a transparent background with CMPS (block in the upper right hand corner). It was when I went to the forums, that all hell broke loose.

Natch 09-06-2004 11:55 PM

Question: do you store your avatars in the database or the filesystem?

Bad Bunny 09-07-2004 06:09 AM

This will work within templates, right?

Bad Bunny 09-07-2004 07:23 AM

Quote:

Originally Posted by Bad Bunny
This will work within templates, right?

Well, I got it to work as a header image, but when I try to use it as a background in css I can't get it to work at all.

Natch 09-08-2004 12:58 AM

Can you paste in here the code you have used ?

Remember you need to specify a height and width for the image.

Zach 09-10-2004 06:49 PM

he has a new version of his script up that does not require dimensions

apokphp 09-13-2004 04:33 AM

Nach, they are currently stored in the database. Should I change that?

Natch 09-13-2004 05:21 AM

I'll be re-releasing this to include the new script which works without needing the height and widht... been too busy the last little while to do anything about it - you could try putting them into the filesystem - see how you go.

kall 09-13-2004 07:31 AM

Quote:

Originally Posted by Natch
I'll be re-releasing this to include the new script which works without needing the height and widht... been too busy the last little while to do anything about it - you could try putting them into the filesystem - see how you go.

I tried just sticking his new code where you had us place his old code...worked like a charm.

...well, except for wiping my logo out on vBaCMPS. :)

Natch 09-13-2004 12:52 PM

Well the only thing you would need to do is make sure you place the path back in to the spacer.png

kall 09-13-2004 09:10 PM

Quote:

Originally Posted by Natch
Well the only thing you would need to do is make sure you place the path back in to the spacer.png

Except for the fact that the vBaCMPS page is outside the main forums directory, and so I will need twox spacer.png?

kall 09-14-2004 02:48 AM

Quote:

Originally Posted by kall
Except for the fact that the vBaCMPS page is outside the main forums directory, and so I will need twox spacer.png?

Dang. I have no idea why it's disappeared on my index page... my other forum (new one) works fine.

:(

Natch 09-14-2004 03:11 AM

The path - you should use a full path, or use the $_SERVER['DOCUMENT_ROOT'] superglobal to prefix your path to your spacer.png...

kall 09-14-2004 03:20 AM

I am using exactly the same block of text (the function) in both includes/functions.php .. on one site (the totally new one) it works marvellously.

On the other (my existing site), on the index.php, there is nothing visible above the navbar.

On checking the source, I get almost exactly the same thing on both, except on the one with no logo on index.php, the logo section looks like this:
PHP Code:

<!-- logo -->
<
a name="top"></a>    
<
table border="0" width="98%" cellpadding="0" cellspacing="0" align="center">
<
tr ><td align="left"><a href="index.php?"><img src="/forums/spacer.png" style="width: 0; height: 0; filter: progid:DXImageTransform.Microsoft.AlphaImageLoader(src='http://forums.nzboards.com/images/professional/misc/newlogo1.png', sizingMethod=scale);" border="0" alt="NZBoards 2.0" /></a></td>
<
td align="right">&nbsp;</td></tr></table>
<!-- /
logo --> 

ie: it's not pulling the dimensions for some reason.

Natch 09-14-2004 03:28 AM

well it looks like you are using forums. format in the same situation as /forums/ - you need some consistency here ;)

Suggest you change the path to / from /forums/...

kall 09-14-2004 03:35 AM

Yeah, it's on a subdomain really, the new one hasn't had that set up yet...maybe that is it.

Andaas 09-23-2004 02:58 AM

Looking forward to adding this to my site, though a friend pointed me at another solution that I thought I would share. Not sure how easy/hard this would be to use with vBulletin is all.

Check out http://www.mongus.net/pngInfo/

Natch 01-07-2005 03:10 AM

This has been updated today to include the latest version of this function: now no longer requires the width / height to be explicitly defined for it to pck up on the PNG images and make modifications if required.

cclaerhout 01-07-2005 05:24 AM

Let me be the first to thank you for the update. I'll try to see where i was wrong.

Thank you ;)

cclaerhout 01-08-2005 10:25 AM

Well, i've tested this new version, and it doesn't work for me... And it slows down my website on IE... So it've put your "old" hack.

Oblivion Knight 01-30-2005 01:53 PM

Neither version works for me, using 3.0.6.. :(

KuRi 02-07-2005 09:17 PM

I followed this exactly... but when a page is viwed with my png quotes on it i get
Warning: getimagesize(): Read error! in /includes/functions.php on line 4013

Warning: getimagesize(): Read error! in /includes/functions.php on line 4013

Warning: getimagesize(): Read error! in /includes/functions.php on line 4013
at the top of the page and none of the png's show.... any clues???

cclaerhout 02-08-2005 02:30 PM

I understand ! Natch has updated his first version of his hack.

Here is the old one :

Code:

// PNG-24 Alpha Transparency with MSIE
/* ***
* replacePngTags - Justin Koivisto [W.A. Fisher Interactive] 7/1/2003 10:45AM
* function to IE display of PNG transparencies - integrated to vB3 by Natch@mobileforces.org
* *** */
function replacePngTags($x,$img_path='/forum/images/')
{
        $arr2=array();
        // make sure that we are only replacing for the Windows versions of Internet
        // Explorer 5+
        $msie='/msie\s([5-9])\.?[0-9]*.*(win)/i';
        if(!isset($_SERVER['HTTP_USER_AGENT']) ||
                !preg_match($msie,$_SERVER['HTTP_USER_AGENT']) ||
                preg_match('/opera/i',$_SERVER['HTTP_USER_AGENT']))
                return $x;

        // find all the png images in backgrounds
        preg_match_all('/background-image:\s*url\(\'(.*\.png)\'\);/Uis',$x,$background);
        for($i=0;$i<count($background[0]);$i++){
                // simply replace:
                //  "background-image: url('image.png');"
                // with:
                //  "filter:progid:DXImageTransform.Microsoft.AlphaImageLoader(
                //      enabled=true, sizingMethod=scale src='image.png');"
                // haven't tested to see if background-repeat styles work...
                $x=str_replace($background[0][$i],'filter:progid:DXImageTransform.'.
                        'Microsoft.AlphaImageLoader(enabled=true, sizingMethod=scale'.
                        ' src=\''.$background[1][$i].'\');',$x);
        }

        // OK, time to find all the IMG tags with ".png" in them
        $pattern='/<(input|img)[^>]*src=(\\\'|\\")([^>]*\.png)\2[^>]*>/i';
        preg_match_all($pattern,$x,$images);
        for($num_images=0;$num_images<count($images[0]);$num_images++){
                $original=$images[0][$num_images];
                $quote=$images[2][$num_images];
                $atts=''; $width=0; $height=0; $modified=$original;

                // If the size is defined by styles, find them
                preg_match_all(
                        '/style=(\\\'|\\").*(\s?width:\s?([0-9]+(px|%));).*'.
                        '(\s?height:\s?([0-9]+(px|%));).*\\1/Ui',
                        $images[0][$num_images],$arr2);
                if(is_array($arr2) && count($arr2[0])){
                        // size was defined by styles, get values
                        $width=$arr2[3][0];
                        $height=$arr2[6][0];

                        // remove the width and height from the style
                        $stripper=str_replace(' ','\s','/('.$arr2[2][0].'|'.$arr2[5][0].')/');
                        // Also remove any empty style tags
                        $modified=preg_replace(
                                '`style='.$arr2[1][0].$arr2[1][0].'`i',
                                '',
                                preg_replace($stripper,'',$modified));
                }

                // size was not defined by styles, get values from attributes
                preg_match_all('/width=(\\\'|\\")?([0-9%]+)\\1/i',$images[0][$num_images],$arr2);
                if(is_array($arr2) && count($arr2[0])){
                        $width=$arr2[2][0];
                        if(is_numeric($width))
                                $width.='px';

                        // remove this from the tag
                        $modified=str_replace($arr2[0][0],'',$modified);
                }
                preg_match_all('/height=(\\\'|\\")?([0-9%]+)\\1?/i',$images[0][$num_images],$arr2);
                if(is_array($arr2) && count($arr2[0])){
                        $height=$arr2[2][0];
                        if(is_numeric($height))
                                $height.='px';

                        // remove this from the tag
                        $modified=str_replace($arr2[0][0],'',$modified);
                }

                // if either height or width were left out, son't replace this image this allows
                // the image to show up (not fixed) instead of not displaying the image at all
                if($width==0 || $height==0)
                        continue;

                preg_match_all('/src=(\\\'|\\")([^\"]+\.png)\\1/i',$images[0][$num_images],$arr2);
                if(isset($arr2[2][0]) && !empty($arr2[1][0]))
                        $image=$arr2[2][0];
                else
                        $image=NULL;

                if(!empty($img_path)){
                        // We do this so that we can put our spacer.png image in the same
                        // directory as the image
                        $tmp=split('[\\/]',$image);
                        array_pop($tmp);
                        $img_path=join('/',$tmp);
                        if(strlen($img_path)) $img_path.='/';
                }

                // end quote is already supplied by originial src attribute
                $replace_src_with=$img_path.'spacer.png'.$quote.' style="width: '.$width.
                        '; height: '.$height.'; filter: progid:DXImageTransform.'.
                        'Microsoft.AlphaImageLoader(src=\''.$image.'\', sizingMethod='.
                        '\'scale\');"';

                // now create the new tag from the old
                $new_tag=str_replace($image.$quote,$replace_src_with,
                        str_replace('  ',' ',$modified));
                // now place the new tag into the content
                $x=str_replace($original,$new_tag,$x);
                $i++;
        }
        return $x;
}
// /PNG-24 Alpha Transparency with MSIE


KuRi 02-08-2005 08:54 PM

Thanx that worked a treat!!!!

Only i have png images in the postbit under the username and the grey area still shows on those??

Bad Bunny 02-15-2005 03:22 PM

Well. I could not get pngs with transparent alpha layers to show properly as a background image. The hack worked great for regular images. So...I finally upgraded to the new version. And you know what? Still doesn't work with background images...and now if a png image doesn't have height and width it just doesn't display in IE for windows. It's odd...cause before, it would just show the grey background, but now the image disapears altogether.

cclaerhout 03-03-2005 01:00 PM

Justin Koivisto released the 25 february 2005 the 2.06 version of his script and guess what... It works :-) Except that the width and height still must be precised otherwise no image appears.

The new code is joined in the attache text file.


All times are GMT. The time now is 04:44 PM.

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.01833 seconds
  • Memory Usage 2,156KB
  • 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
  • (4)bbcode_code_printable
  • (12)bbcode_php_printable
  • (6)bbcode_quote_printable
  • (1)footer
  • (1)gobutton
  • (1)header
  • (1)headinclude
  • (6)option
  • (1)pagenav
  • (1)pagenav_curpage
  • (1)pagenav_pagelink
  • (1)post_thanks_navbar_search
  • (1)printthread
  • (40)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