WebsiteBaker Community Forum

WebsiteBaker Support (2.8.x) => Droplets & Snippets => Topic started by: quinto on March 11, 2015, 06:13:04 PM

Title: Text2png Droplet
Post by: quinto on March 11, 2015, 06:13:04 PM
here is my last creation, with this droplet you can create a ptruecolor png with antialiased text on a transparent background (in a very tricky way), the font need you to create a "fonts" folder in your media directory, in this folder you must put a .ttf or .otf file, and you must specify the font by a parameter while calling the droplet.
There is also a short but efficient caching system.

Here is the droplet

Name:
Code: [Select]
Text2png
Code:
Code: [Select]
$cache_dir = WB_PATH.'/temp/';
$fontfile = WB_PATH.'/media/fonts/'.$ttffile;
$fontangle = 0;
if (!isset($fontsize)) $fontsize = "12";
if (!isset($fontcolor)) $fontcolor = "000000";

$cache_file = 'text2png_'.md5($text.$fontfile.$fontsize.$fontcolor).'.png';

if (!file_exists($cache_dir.$cache_file))
{$box = @imagettfbbox($fontsize, $fontangle, $fontfile, $text);
$textwidth = abs($box[4] - $box[0]);
$textheight = abs($box[5] - $box[1]);
$imagewidth = $textwidth+10;
$imageheight = $textheight+10;
$xcord = ($imagewidth/2)-($textwidth/2)-2;
$ycord = ($textheight/2)-2;

$img = imagecreatetruecolor($imagewidth, $imageheight);
imagealphablending($img, false);
imagesavealpha($img, true);
imageantialias($img, true);
$opaque = imagecolorallocatealpha($img, 0, 0, 0, 0);
$transparent = imagecolorallocatealpha($img, 0, 0, 0, 127);

imagefilledrectangle($img, 0,0, $imagewidth, $imageheight, $transparent);

if( eregi( "([0-9a-f]{2})([0-9a-f]{2})([0-9a-f]{2})", $fontcolor, $textrgb ) )
{$textred = hexdec( $textrgb[1] );  $textgreen = hexdec( $textrgb[2] );  $textblue = hexdec( $textrgb[3] );}
$opaque = imagecolorallocate($img, $textred, $textgreen, $textblue);

imagettftext($img, $fontsize, $fontangle, $xcord, $ycord, $opaque , $fontfile, $text);

// invert alpha channel
for($i=0;$i<$xsize;$i++)
{for($j=0;$j<$ysize;$j++)
{$color = imagecolorat($img, $i, $j);
$color = ($color & 0x00FFFFFF) | ((127-($color>>24))<<24);
imagesetpixel($img, $i, $j, $color);
}
}
imagepng($img, $cache_dir.$cache_file);
imagedestroy($img);
}
return '<img src="'.WB_URL.'/temp/'.$cache_file.'" style="border:0px;margin:0px;padding:0px;vertical-align:middle;" alt="'.$text.'"/>';

Comments:
Code: [Select]
Use: [[Text2png?text=(text, Mandatory)&ttffile=(fontfile.ttf, Mandatory)&fontcolor=(fontcolor, Optional)&fontsize=(fontsize, Optional)]]

text = Text to convert into truecolor png with transparent background.
ttffile = True Type Font file (.ttf or .otf), must be in the folder media/fonts/ but you can change this in the code.
fontcolor = Color in 6 digit HEX format, "000000"(black) by default.
fontsize = Size of the font in points (if gd2 is used, otherwise in pixels), 12 by default.

This droplet has a rudimentary but efficient caching system but it never delete any file, if you want you can delete all the png files starting with the name "text2png_" in your temp folder, droplet will recreate the needed files.
Title: Re: Text2png Droplet
Post by: quinto on March 11, 2015, 09:34:42 PM
just a quick example to see how it works:

install my droplet.

go on http://www.dafont.com/fr/stink-on-the-death.font (http://www.dafont.com/fr/stink-on-the-death.font), download the font, unzip and put the file : "Stink on the Death.ttf" in the folder media/fonts of your WB site.

then call the droplet in a wysiwyg page :
[[Text2png?text=it's alive !&ttffile=Stink on the Death.ttf&fontcolor=FF09CF&fontsize=22]]

try it :)
Title: Re: Text2png Droplet
Post by: quinto on March 13, 2015, 10:16:31 PM
oops, the version i posted was buggy, here i the correct code :
Code: [Select]
$cache_dir = WB_PATH.'/temp/';
$fileduration = "1 hour";
$fontfile = WB_PATH.'/media/fonts/'.$ttffile;
$fontangle = 0;
if (!isset($fontsize)) $fontsize = "12";
if (!isset($fontcolor)) $fontcolor = "000000";

$cache_file = 'text2png_'.md5($text.$fontfile.$fontsize.$fontcolor).'.png';

$cdir = opendir($cache_dir) or die ('Could not open '.$cache_dir);
while ($file = readdir($cdir)) {
if ((preg_match('/text2png_/',$file)) && (filemtime($cache_dir.$file)) <  (strtotime('-'.$fileduration))) {
unlink($cache_dir.$file);
}
}

if (!file_exists($cache_dir.$cache_file))
{$box = @imagettfbbox($fontsize, $fontangle, $fontfile, $text);
$textwidth = abs($box[4] - $box[0]);
$textheight = abs($box[5] - $box[1]);
$imagewidth = $textwidth+10;
$imageheight = $textheight+10;
$xcord = ($imagewidth/2)-($textwidth/2)-2;
$ycord = ($imageheight /1.33);

$img = imagecreatetruecolor($imagewidth, $imageheight);
imagealphablending($img, false);
imagesavealpha($img, true);
imageantialias($img, true);
$opaque = imagecolorallocatealpha($img, 0, 0, 0, 0);
$transparent = imagecolorallocatealpha($img, 0, 0, 0, 127);

imagefilledrectangle($img, 0,0, $imagewidth, $imageheight, $transparent);

if( eregi( "([0-9a-f]{2})([0-9a-f]{2})([0-9a-f]{2})", $fontcolor, $textrgb ) )
{$textred = hexdec( $textrgb[1] );  $textgreen = hexdec( $textrgb[2] );  $textblue = hexdec( $textrgb[3] );}
$opaque = imagecolorallocate($img, $textred, $textgreen, $textblue);

imagettftext($img, $fontsize, $fontangle, $xcord, $ycord, $opaque , $fontfile, $text);

// invert alpha channel
for($i=0;$i<$xsize;$i++)
{for($j=0;$j<$ysize;$j++)
{$color = imagecolorat($img, $i, $j);
$color = ($color & 0x00FFFFFF) | ((127-($color>>24))<<24);
imagesetpixel($img, $i, $j, $color);
}
}
imagepng($img, $cache_dir.$cache_file);
imagedestroy($img);
}

return '<img src="'.WB_URL.'/temp/'.$cache_file.'" style="border:0px;margin:0px;padding:0px;vertical-align:middle;" alt="'.$text.'"/>';