Page 1 of 2

Dynamic buttons

Posted: Tue Aug 26, 2003 1:53 pm
by BassPlayer
Needed a way to make a link look like a form button so I came up a script/function that will make a button on the fly and center the text in it. Would be nice to be able to change the font. Maybe some one can show me how.
BP

The function:

Code: Select all

function print_button($text, $size, $background, $border, $foreground) {

    preg_match("/(.*),(.*)/", $size, $match);
    $width = $matchї'1'];
    $height = $matchї'2'];

    preg_match("/(.*),(.*),(.*)/", $background, $match);
    $background_red = $matchї'1'];
    $background_green = $matchї'2'];
    $background_blue = $matchї'3'];

    preg_match("/(.*),(.*),(.*)/", $border, $match);
    $border_red = $matchї'1'];
    $border_green = $matchї'2'];
    $border_blue = $matchї'3'];

    preg_match("/(.*),(.*),(.*)/", $foreground, $match);
    $foreground_red = $matchї'1'];
    $foreground_green = $matchї'2'];
    $foreground_blue = $matchї'3'];

    $font = "2";
    $width = floor(ImageFontWidth($font) * strlen($text ) + 10);
    $border_x2 = ($width - 2);
    $border_y2 = ($height - 2);
    Header("Content-type: image/jpeg");
    $image = ImageCreate($width, $height);
    $bg = ImageColorAllocate($image ,$background_red, $background_green, $background_blue);
    $fg = ImageColorAllocate($image ,$foreground_red, $foreground_green, $foreground_blue);
    $bc = ImageColorAllocate($image ,$border_red, $border_green, $border_blue);
    ImageFilledRectangle($image ,0 , 0, $width, $height, $bc);
    ImageFilledRectangle($image ,1 , 1, $border_x2, $border_y2, $bg);
    $x = floor((ImageSX($image) / 2) - ((ImageFontWidth($font) * strlen($text)) / 2));
    $y = floor((ImageSY($image) / 2) - (ImageFontHeight($font) / 2));
    ImageString($image,$font ,$x ,$y ,$text, $fg);
    ImageJPEG($image);
    ImageDestroy($image);
}
The script:

Code: Select all

<?php

include 'libroster.php'; <- where the function lives
if (empty($_GET&#1111;'size']))&#123;
    $size = $roster_config&#1111;'html_default_button_size'];
&#125; else &#123;
    $size = $_GET&#1111;'size'];
&#125;
if (empty($_GET&#1111;'background']))&#123;
    $background = $roster_config&#1111;'html_default_button_background'];
&#125; else &#123;
    $background = $_GET&#1111;'background'];
&#125;
if (empty($_GET&#1111;'border']))&#123;
    $border = $roster_config&#1111;'html_default_button_border'];
&#125; else &#123;
    $border = $_GET&#1111;'border'];
&#125;
if (empty($_GET&#1111;'foreground']))&#123;
    $foreground = $roster_config&#1111;'html_default_button_foreground'];
&#125; else &#123;
    $foreground = $_GET&#1111;'foreground'];
&#125;

print_button($_GET&#1111;'text'], $size, $background, $border, $foreground);

?>
Usage:

Code: Select all

echo "<a href="#" onclick="window.close()"><img src="$roster_config&#1111;relative_path]/button.php?text=Close"></a>
";

Posted: Tue Aug 26, 2003 1:58 pm
by NoReason
One word... css

You can create a new css class that can set the font type/size etc..

Posted: Tue Aug 26, 2003 2:01 pm
by BassPlayer
But isn't the text graphical also? How does CSS come into play with a graphic.

Posted: Tue Aug 26, 2003 2:08 pm
by Judas
not

Posted: Tue Aug 26, 2003 2:10 pm
by Unipus
You could create the background for the button as an image (although if it's at all geometric, there's hardly reason to do even that) and then use CSS to create the label as a separate layer. It might take some finessing, but you would get a high level of control (if you don't mind some aliasing on your text)

Posted: Tue Aug 26, 2003 2:11 pm
by Judas
Ok here is my script.

Code: Select all

function maakKnop($font_file,$fontsize,$imageheight,$achtergrond_kleur,$font_kleur,$tekst,$file)&#123;



$thetextbox = ImageTTFBBox ($fontsize, 0,"system/gdfunctions/ttf/$font_file", "$tekst");


$imagewidth = $thetextbox&#1111;2]+6;



$myimg=ImageCreate($imagewidth, $imageheight);

if ($achtergrond_kleur=='zwart')&#123;$col1=ImageColorAllocate($myimg, 0, 0, 0);&#125;
elseif($achtergrond_kleur=='rood')&#123;$col1=ImageColorAllocate($myimg, 255, 0, 0);&#125;
elseif($achtergrond_kleur=='wit')&#123;$col1=ImageColorAllocate($myimg, 255, 255, 255);&#125;


if ($font_kleur=='zwart')&#123;$col2=ImageColorAllocate($myimg, 0, 0, 0);&#125;
elseif($font_kleur=='rood')&#123;$col2=ImageColorAllocate($myimg, 255, 0, 0);&#125;
elseif($font_kleur=='wit')&#123;$col2=ImageColorAllocate($myimg, 255, 255, 255);&#125;




$xpos = 2;
$ypos = $fontsize+2;
ImageTTFText ($myimg, $fontsize, 0, $xpos, $ypos, $col2, "system/gdfunctions/ttf/$font_file", "$tekst");
ImageJpeg($myimg, "$file");
ImageDestroy($myimg);
&#125;
:!: note the 'system/gdfunctions/ttf/$font_file'
its pointing to a treu type font .ttf

Posted: Tue Aug 26, 2003 2:31 pm
by BassPlayer
use CSS to create the label as a separate layer.
umm. excuse my noobness but how would you do that.

Looks like I can incorporate the TTF stuff into my script.

Posted: Tue Aug 26, 2003 2:34 pm
by NoReason
aa..sorry.. guess i should read it more carefully .

Posted: Tue Aug 26, 2003 2:50 pm
by Unipus
CSS allows absolute and relative positioning of layers (DIVs) on top of other layers. So, if you have a DIV that consists of a rectangle, and some way of knowing where that rectangle is on the screen (which you do through javascript if nothing else), then it's easy to make a second DIV consisting of text only and position it on top. The crucial property here is z-index.

Posted: Tue Aug 26, 2003 3:08 pm
by Judas
I love 2 talk DOM.
The only thing = this = a PHP forum

Posted: Tue Aug 26, 2003 3:12 pm
by Unipus
Well, that's fine, and I'm new here, so maybe I'm violating some rule, but I don't see anything wrong with throwing out alternative and possibly superior solutions. PHP is just a means to an end, and it's the end that really matters.

Posted: Tue Aug 26, 2003 3:16 pm
by BassPlayer
DIV in a DIV but regardless if I use php to create the text using the image functions then CSS is out....right?

BP

Posted: Tue Aug 26, 2003 3:24 pm
by Unipus
Yes, that's true. CSS can't do anything to manipulate text that's rendered as part of an image. So if you wanted to go that route (and I can't really say whether it would be better for you - it depends on the type of buttons you're making, the size of the site, the audience, etc) you'd need to back up a bit.

Posted: Tue Aug 26, 2003 3:42 pm
by Judas
BTW there should be an note on the client download time wasn’t it that there is a way to "gz" the data and send it compacted to the client's browser witch may have the possibility to unpack and display the image's lots faster then i have ever seen.

grts.

Posted: Wed Aug 27, 2003 9:32 am
by m3rajk
no rules being violated. although i thought from your post you wanted to use the gd that pp has to dynamically create it in php then place it on the page. but they think they have a better way and have more experience than me