jgiam.com

Some months back, I was on the lookout for a cheap NAS (network attached storage). The idea was that it would be cheaper than buying a second system, and if I used a NAS instead of just adding a hard disk to my PC, I should be able to switch off my PC sometimes, and not worry about shared files being inaccessible. Plus, I just wanted to play with a new gadget.

I had two choices at that time: Planex NAS-01G or Kuro-Box (a.k.a. Kurobox, KuroBox, Kuro Box…). The Kuro-Box was about SGD40 more expensive, but it was essentially a Linux box, and highly “hackable”. The Planex NAS-01G is also a Linux box, but it is meant to work out-of-the-box, and has limited “hack-ability”.
 

Read the rest of this entry »

My Nintendo Wii is connected to my TV tuner on my PC. This means I get to play my Wii in my room, on my 19″ LCD monitor. The TV tuner isn’t a HDTV one, so it only has composite (RCA) and S-Video inputs. Nintendo only bundles composite video cables, and initially, only sold component (HDTV) cables. Over the past months, third-party S-Video cables appeared.

I got hold of an S-Video cable today, and am pleased to report that there is quite an improvement in image quality over the composite cable. Of course, it won’t be HDTV-quality (which, by the way, is only 480p on the Wii), but it’s an improvement nonetheless. And, at SGD20 (~USD13), is much cheaper than buying a HDTV tuner or HDTV.

Click here to compare the image quality of composite versus S-Video cable on the Wii.

I designed a website for a friend, who wanted to use SimpleViewer for his portfolio. I wanted a dynamic gallery, rather than a static one requiring him to use, for example, Picasa to manage the gallery and then upload it. Thus I searched and came upon SimpleViewerAdmin.

He requested a hidden album feature such that the album can only be accessed directly through its URL.

Read the rest of this entry »

I found out that using ‘<’ and ‘>’ within <pre> tags was illegal. So I started looking for a way to convert program code into HTML.

Later on, for my tutorial for my programming module, it involved putting code into a Microsoft Word file. Doing so was tedious. If I copied and pasted from my editor into Word, the text would be pasted as normal text, and Word would format it in, for example, Times New Roman. Plus, the syntax highlighting that was in the editor was gone.

So now, I wanted something that could syntax highlight my code as well.

I came across GeSHi – Generic Syntax Highlighter. It was exactly what I wanted.

I hacked up a simple interface so I could paste code and convert it easily, and so, created Simple Syntax Highlight. You can choose the language (I only added the more common ones), whether to display line numbers, use CSS, and display HTML source. This solved both my problems, since now I could paste my code in valid HTML in my webpages, and I could also paste my code into Word with a fixed-width font, and syntax highlighting.

I called this “Simple Syntax Highlight” because I intend to create a database-driven site in future, to store converted codes, maybe a comments-system as well. But that won’t be anytime soon, as I have my Uni work to cope with.

I welcome any feedback. If you spot a bug, do let me know as well.

Simple Syntax Highlight – http://jgiam.com/geshi/

This is the first entry in the “Techie Corner” category.

While doing my church’s website, I was given a list of people’s names, mobile phone numbers and e-mail addresses to put up on a page. Using Unicode to obfuscate e-mail addresses has generally worked. But to use that in this situation would make the code messy and harder to maintain.

Several websites use images to display e-mail addresses. That is pretty much foolproof, unless those “harvesters” start using OCR technology, which is, I think, more unlikely than updating their software to recognise Unicode.

So the next step was to look for something that allows me to generate text to images on-the-fly. Unfortunately (and maybe I was searching using the wrong terms), I failed to find anything.

So I then proceeded to write my own script.

First off, you need a webserver with PHP and ImageMagick.

To test if you can access ImageMagick, use the following code:

<?php system("convert -version 2>&1"); ?>

You should see an ImageMagick version number. If you get something else, or some error, then you cannot use the following code.

The main code is as follows. Save it anywhere, but remember the path.

<?php
function text2img($text) {

$imgdir = "/path/to/imagedir/";
$fontdir = "/path/to/fonts/";

$texthash = md5($text);

if (!file_exists($imgdir.$texthash.".png")) {
$imagemagickcmd = "convert -fill '#333' -font ".
$fontdir."trebuc.ttf -pointsize 13 label:'".
$text."' ".$imgdir.$texthash.".png 2>&1";
system($imagemagickcmd);
}

echo '<img src="/images/text2img/'.$texthash.'.png" />';
}
?>

This is very simple, rudimentary code. It assumes your site will only need to generate images with a standard colour, font size and font type. Which would likely be the case for most websites. If you need to generate images with different properties, you can always include additional parameters.

$imgdir = "/path/to/imagedir/";

Set this to the path where you want to save the generated images. Preferably in a directory of its own. (e.g., if your website’s images are in “/my/webpath/images/”, you may want to create a new directory within “images” called, say, “text2img”.

$fontdir = "/path/to/fonts/";

If you know the path to the server’s fonts directory, then set it here. However, that’s not necessary (and in fact, if you are on shared hosting, you probably won’t be able to access it). You can create a directory (outside your web directory would be better), e.g. “/my/fonts/”. Then, upload a TTF font to that directory, but remember the file name (if necessary, rename the filename to keep it short). If you want a fancy font in Windows, go to “Control Panel”, “Fonts”. Select the font you want, and “Copy”, then “Paste” to a normal Windows folder. Then upload that file.

$imagemagickcmd = "convert -fill '#333' -font ".
$fontdir."trebuc.ttf -pointsize 13 label:".
$text." ".$imgdir.$texthash.".png 2>&1";

The “#333″ sets the colour. It accepts any value in standard RGB hexadecimal format (e.g. #3cf, #33ccff).
“trebuc.ttf” is specifying the font. Change this to whatever font you uploaded.
“-pointsize 13″ sets the font size. Change this as desired.

echo '<img src="/images/text2img/'.$texthash.'.png" />';

Change the “src” path to the absolute web path to your images directory. For example, if your images are in “/my/webpath/images/text2img/”, and your web root is “/my/webpath/”, then for the “src” tag, you would use “/images/text2img/”. If you want to ensure HTML compliance, you may wish to add “alt” parameter, but obviously don’t put the “$text” variable since the whole point is to hide the text.

To use the code, in the file that you want the e-mail address or any text generated, insert the following line anywhere, as long as it is before where you want to generate the text.

<?php include "/path/to/text2img.php"; ?>

At the position where you want to generate the text, just put the following instead of the normal text:

<?php text2img("test@e.mail"); ?>

I hope this was useful, and I welcome any comments.