#!/usr/bin/perl -w # ttf2eot - Convert TTF files to EOT files. use strict; use warnings; use CGI; use CGI::Carp qw(fatalsToBrowser); use Digest::MD5 qw(md5_hex); use lib "./lib"; # Don't let the process run away. #$SIG{ALRM} = sub { # die "

Operation Timed Out

\n\n" # . "The maximum time limit for this script to run has been reached. This generally " # . "shouldn't happen unless you uploaded something really weird. Contact " # . "Kirsle with details if you feel this was " # . "in error."; #}; #alarm(15); if ($ENV{CONTENT_LENGTH} > 1024*1024) { die "Content length too long"; } # Go through and delete old files. &deleteOldFiles(); # Enforce upload size limits. $CGI::POST_MAX = 1024 * 1024; # 1 MB my $cgi = new CGI (\&upload_hook); my $action = $cgi->param('action') || 'index'; # Set an upload hook just so we can enforce POST_MAX during the upload. sub upload_hook { my ($filename,$buffer,$bytes_read,$data) = @_; if ($bytes_read > $CGI::POST_MAX) { die "File size is too large! Abort!"; } } print "Content-Type: text/html\n\n"; print qq~ ttf2eot on the web! ~; if ($action eq 'upload') { my $filename = $cgi->param ('font'); my @parts = split(/(\/|\\)/, $filename); my $name = pop(@parts); # Filter the file's name, since it's going into the shell. $name =~ s/[^A-Za-z0-9\_\-\.]/_/g; # Determine the file's type. my ($type) = $name =~ /\.([^.]+?)$/; $type = lc($type); if ($type ne "ttf") { &printError("The uploaded file must be a TrueType Font (TTF)!"); } # Download the file. my $handle = $cgi->upload ('font'); my $bin = ''; while (<$handle>) { $bin .= $_; } # Save it to a temporary file. mkdir ("./ttf2eot-temp") unless (-d "./ttf2eot-temp"); my $tmp = md5_hex($ENV{REMOTE_ADDR} . $ENV{HTTP_USER_AGENT} . time()); while (-d "./ttf2eot-temp/$tmp") { $tmp = md5_hex (int(rand(99999))); } mkdir ("./ttf2eot-temp/$tmp"); open (WRITE, ">./ttf2eot-temp/$tmp/$name"); binmode WRITE; print WRITE $bin; close (WRITE); # Make the EOT filename. my $output = $name; $output =~ s/\.ttf$/.eot/ig; $output .= ".eot" unless $output =~ /\.eot$/i; # Run ttf2eot on our file. eval { local $SIG{ALRM} = sub { die; }; alarm(10); my $app = "/home/cuvou/public_html/wizards/bin/ttf2eot"; my $cmd = "$app < ./ttf2eot-temp/$tmp/$name > ./ttf2eot-temp/$tmp/$output"; my $result = `$cmd`; alarm(0); }; # Was there a problem? if ($? != 0 || (-s "./ttf2eot-temp/$tmp/$output" == 0) || $@) { &printError("The conversion has failed! Maybe your uploaded TTF file isn't valid?",$tmp); } &printSuccess($tmp,$name,$output); } else { &printIndex(); } #------------------------------------------------------------------------------# # Index Page # #------------------------------------------------------------------------------# sub printIndex { print qq{

TTF to EOT Font Converter

Use this tool to convert a TrueType (TTF) font file into an OpenType (EOT) font file, for use with Internet Explorer's embedded font support. After using this tool, you will be able to embed fonts on your web pages that can be seen on Internet Explorer 4 and higher, and all current modern web browsers that support embedded fonts via CSS3 (Firefox 3.5 and higher are among such browsers).

Upload a TrueType Font Use this form to upload a TrueType Font file to be converted. Browse and select a ".ttf" file.

Note: on every TTF font file I've personally tested this on, the conversion to EOT takes mere seconds (usually less than 1 or 2 seconds). If what you upload causes the script to run for too long, the conversion will be aborted. If you ever see this error when you upload a legitimate TTF file (e.g. you're not just trying to break the script) there will be an e-mail link so you can tell me about it.

About This Program

The TTF to EOT Converter is a web-based tool for creating OpenType EOT font files from TrueType TTF font files. Once you have a pair of TTF and EOT fonts, you can use both of them to embed the font on your web pages in a way that works with both Internet Explorer and CSS3 web browsers such as Firefox 3.5 and Safari 4.

About Font Embedding

The ability to embed fonts on web pages was originally implemented by Microsoft in Internet Explorer 4.0 - the catch was that these font files needed to be in a custom form of OpenType format, with an EOT file extension. The other catch is that embedding EOT files only works in Internet Explorer. Therefore, it didn't really catch on.

More recently, the new CSS 3 added a specification for embedding fonts on web pages in a more open, standardized way. Browsers that support the full CSS 3 specification can render web pages which embed a TrueType font file.

New browsers such as Firefox 3.5 therefore support TrueType Fonts to be embedded on pages, whereas Internet Explorer supports OpenType Fonts. Firefox 3.5 won't render OpenType, and Internet Explorer won't render TrueType. To get around this problem, both types of fonts may be embedded on a page at the same time. This is a demonstration page that embeds my Rive font, for your reference.

Instructions:

  1. Upload a valid TrueType Font file and click the button. If all goes well, you'll be able to download the EOT font file on the next page.

Author

Casey Kirsle © 2009
[Kirsle.net]

This web tool is a front-end to the ttf2eot converter program, written by taviso. Casey Kirsle merely wrote this front-end. }; exit(0); } #------------------------------------------------------------------------------# # Error Page # #------------------------------------------------------------------------------# sub printError { my $str = shift; my $pj = shift || ''; # Delete this project? if (length $pj) { &deleteProject ($pj); } print qq~

Processing Error

Your request could not proceed due to the following error:

$str ~; exit(0); } #------------------------------------------------------------------------------# # Success Page # #------------------------------------------------------------------------------# sub printSuccess { my ($tmp,$file,$eot) = @_; print qq{

Success

Your TrueType font, $file, has been successfully converted into an EOT font. Use the download link below to save your EOT font file.

Demonstration

If you are running a modern CSS 3 compliant web browser, or Internet Explorer, you should see your custom font embedded in the paragraph below:

ABCDEFGHIJKLMNOPQRSTUVWXYZ
abcdefghijklmnopqrstuvwxyz
123456789.:,;(:*!?'")
The quick brown fox jumps over the lazy dog.

Download Your Font

To download your EOT font file, right-click the link below and choose "Save Link As..." or "Save Target As..." -- or whatever vocabulary your web browser uses.

Download $eot

Instructions

To embed this font on your web page, you will need to place the following CSS code in the <head> section of your page, or in an external CSS file:

<style type="text/css">
\@font-face {
 font-family: MyCustomFont;
 src: url("$eot") /* EOT file for IE */
}
\@font-face {
 font-family: MyCustomFont;
 src: url("$file") /* TTF file for CSS3 browsers */
}
</style>
Note that in the code above, "MyCustomFont" can be any name you want. You will probably want to set this to be the real name of your font. This script was not able to determine the name of your font - sorry!

To use your embedded font, you can simply refer to it by name like you do with any other font. Some examples:

body {
 font-family: MyCustomFont, Verdana, Arial, sans-serif;
 font-size: medium;
 color: black
}
span.header {
 font-family: MyCustomFont, Impact, "Arial Black", sans-serif;
 font-weight: bold;
 color: red
}
Note: your generated EOT file will be deleted from this web server after 24 hours. }; exit(0); } #------------------------------------------------------------------------------# # Subroutines # #------------------------------------------------------------------------------# sub deleteOldFiles { # Expiration date. my $life = 60*60*24; # 24 Hours. # Projects to be deleted. my @flagged = (); # Dig through our temporary directory. if (-d "./ttf2eot-temp") { opendir (DIR, "./ttf2eot-temp"); foreach my $project (readdir(DIR)) { next if $project =~ /^\./; next unless -d "./ttf2eot-temp/$project"; # Descend into the project directory. opendir (PJ, "./ttf2eot-temp/$project"); foreach my $file (readdir(PJ)) { next if $file eq '.'; next if $file eq '..'; # Check the time stamp on these files. my ($mtime) = (stat("./ttf2eot-temp/$project/$file"))[9]; # Has it expired? if (time() - $mtime >= $life) { # Flag this project for deletion. push (@flagged,$project); last; } } closedir (PJ); } closedir (DIR); # Process the flagged directories. if (scalar(@flagged)) { foreach my $project (@flagged) { &deleteProject ($project); } } } } sub deleteProject { my $project = shift; opendir (DIR, "./ttf2eot-temp/$project"); foreach my $file (readdir(DIR)) { next if $file eq '.'; next if $file eq '..'; # Delete this file. unlink ("./ttf2eot-temp/$project/$file"); } closedir (DIR); # Remove the directory. rmdir ("./ttf2eot-temp/$project"); }