• Registered: 2007-01-23
  • Posts: 152

Topic: Bordercolour of images

I'am using the advance image hack and all is working fine.
Now I need to give the border of an image that I inserted a colour.

For example, when I insert an image and give it a border from 2px than de
standard colour of the border is black. Is there any way to change this into
an other colour? I need all the image borders into green.

grt, Wim

  • Registered: 2005-08-16
  • Posts: 1,861

Re: Bordercolour of images

Change the CSS on your news page

img {
border: 2px solid green;
}

  • Registered: 2007-01-23
  • Posts: 152

Re: Bordercolour of images

Change the CSS on your news page

img {
border: 2px solid green;
}


Thanks for your answer and solution but it is nog what I want. In this way all borders
of all images are green. When using the Advance Image Hack I can choose if I want
a border around an image or not. I do not need all the images with a border.

grt, wim

  • Registered: 2005-08-16
  • Posts: 1,861

Re: Bordercolour of images

Do you mean the colour of the shadow border?
If so change the RGB values in images.mdu

find: 

$background = array("r" => 255, "g" => 255, "b" => 255);

Change to the colour you want.
So for Emerald Green use 

$background = array("r" => 80, "g" => 200, "b" => 120);

For Sea Green use the RGB values
46 139 87
For Viridian use
64 130 109

  • Registered: 2005-08-16
  • Posts: 1,861

Re: Bordercolour of images

For example, when I insert an image and give it a border from 2px than de
standard colour of the border is black. Is there any way to change this into
an other colour? I need all the image borders into green.

grt, Wim

I have added a routine into FI-DD's advanced images hack
for adding a coloured border to an image as you upload it.

Open inc.images.mdu
find: 

//////////////
//Upload Form
//////////////
?>

Add above: 

//Border
if($border){
    
    $file_ending = strtolower(end(explode('.', $image_name)));
    if ($file_ending == "jpg" or $file_ending == "jpeg" ){        
            $img = ImageCreateFromJPEG($config_path_image_upload."/".$image_name);
            $color = imagecolorallocate($img, $red, $green, $blue);
            drawBorder($img, $color, $thickness);    
            imagejpeg($img, $config_path_image_upload."/".$image_name);
            
            $img = ImageCreateFromJPEG($config_path_image_upload."/thumbs/".$image_name);
            $color = imagecolorallocate($img, $red, $green, $blue);
            drawBorder($img, $color, $thickness);    
            imagejpeg($img, $config_path_image_upload."/thumbs/".$image_name);
        }
        else if ($file_ending == "gif" ){
            $img = ImageCreateFromGIF($config_path_image_upload."/".$image_name);
            $color = imagecolorallocate($img, $red, $green, $blue);
            drawBorder($img, $color, $thickness);    
            imagegif($img, $config_path_image_upload."/".$image_name);
            
            $img = ImageCreateFromGIF($config_path_image_upload."/thumbs/".$image_name);
            $color = imagecolorallocate($img, $red, $green, $blue);
            drawBorder($img, $color, $thickness);    
            imagegif($img, $config_path_image_upload."/thumbs/".$image_name);
        }
        else if ($file_ending == "png" ){
            $img = ImageCreateFromPNG($config_path_image_upload."/".$image_name);
            $color = imagecolorallocate($img, $red, $green, $blue);
            drawBorder($img, $color, $thickness);    
            imagepng($img, $config_path_image_upload."/".$image_name);
            
            $img = ImageCreateFromPNG($config_path_image_upload."/thumbs/".$image_name);
            $color = imagecolorallocate($img, $red, $green, $blue);
            drawBorder($img, $color, $thickness);    
            imagepng($img, $config_path_image_upload."/thumbs/".$image_name);
        }
}

Find: 

 <label for="corners"><input style="border:0px; background-color:#F7F6F4;" type="checkbox" name="corners" id="corners" onclick="java script:ShowOrHide('make_corners')"<?=(!

extension_loaded('gd') ? ' disabled' : ''); ?>>Create rounded corners</label>

   <span id="make_corners" style="display: none;">
   <table width="250" align="right">
   <tr><td><input type="checkbox" name="corners_image" checked="checked" />Image</td><td>
   <input type="text" name="corners_image_radius" size="5" value="25" /> Radius

   <input type="text" name="corners_image_background" size="5" value="ffffff" /> Background</td></tr>
   <tr><td><input type="checkbox" name="corners_thumb" checked="checked" />Thumbnail</td><td>
   <input type="text" name="corners_thumb_radius" size="5" value="15" /> Radius

   <input type="text" name="corners_thumb_background" size="5" value="ffffff" /> Background</td></tr>
   </table>
   
</span>
   </td></tr>


Add below: 

 <tr><td>
   <label for="border"><input style="border:0px; background-color:#F7F6F4;" type="checkbox" name="border" id="border" onclick="java script:ShowOrHide('make_border')"<?=(!

extension_loaded('gd') ? ' disabled' : ''); ?>>Add border (jpeg gif png)</label>

   <span id="make_border" style="display: none;">
   <table width="250" align="right">
   <input type="text" name="thickness" size="5" value="2" /> border thickness

   <input type="text" name="red" size="5" value="255" /> red

   <input type="text" name="green" size="5" value="255" /> green

   <input type="text" name="blue" size="5" value="255" /> blue</tr></td>
   </table>
   
</span>
   </td></tr>


Add at the bottom of the file above the closing ?> 

function drawBorder(&$img, &$color, &$thickness = 1)
{
    $x1 = 0;
    $y1 = 0;
    $x2 = ImageSX($img) - 1;
    $y2 = ImageSY($img) - 1;

    for($i = 0; $i < $thickness; $i++)
    {
        ImageRectangle($img, $x1++, $y1++, $x2--, $y2--, $color);
        
    }
}

There is probably a more elegant way of coding it but it works.

You can change the default thickness and red green blue parameters if you want.

  • Registered: 2007-01-23
  • Posts: 152

Re: Bordercolour of images

Hello Damoor,

thanks for that nice piece of code.
It is doing exactly what I want it to do.

grt, Wim