Category Archives: programming

Common sense and frustration

Do you know what common sense is?

Common sense is:

  • NOT setting fixed height for elements whose actual height can change anytime, and especially not setting this particular height to three elements next to each other, to keep them with the same height (common sense solution is to wrap it all in another element)
  • NOT calling your database tables j_aidx_1, j_aidx_2 … j_aidx_n and calling the columns m_1, m_2, m_3, etc; which leads to people writing queries like SELECT a.m_85, a.m_167, b.m_17, b.m_56 FROM j_aidx_5 AS a LEFT JOIN j_aidx_8 AS b ON a.m_103 = b.m_42 WHERE b.m_58 = ‘1’ AND a.12 = ‘0’
  • invoking the live server settings as default instead of using testing environment settings as default, because when something goes wrong in the decision process, you don’t want the live server to get fucked up
  • NOT having the very same function copied to several different “modules” of the application so as to make it extremely inconvenient to change
  • NOT calling your backups “new”, “!new”, “_new”, “____new”, “!!!!!new” etc, especially when each person uses a different flavour of this method
  • using a version control system, and if you are unable to do so, calling your backups by date (preferrably in YYYY-MM-DD format, since it sorts itself naturally)
  • using either tabs or any amount of spaces for indentation, but keeping it consistent (or at least, for fuck’s sake, keeping it consistent within one file)
  • NOT internally calling files for inclusion 1.html, 2.html, 3.html etc., especially when you already went through the hassle of creating nice looking URL’s
  • NOT totally breaking your URL’s and titles by adding a lot of random keywords just to game search engines, when that makes your site either unusable or extremely confusing for humans
  • using one language (human language, like English or Czech) in your application, or at least avoiding mixing up several languages inside one particular variable or function name (findAllNovinky is just lame function name)

… do you know what frustration is?

Object-oriented or procedural?

As I mentioned in the previous post, I needed a CAPTCHA algorithm. As I couldn’t find anything simple and usable that would do what I want (ie follow the basic principles of captcha creation (readibility for humans, and hopefully unreadibility for machines)), I decided to write my own. The purpose of this was just to generate the image, I left generating the text, passing it in a secure way and all the other boring stuff for others. And as an exercise, I’ve done both procedural and object-oriented versions.

I’m not an expert on object oriented programming, so my little class could have probably been written in a better (read: longer and even more confusing) way. Anyway, here it is:

[code lang=”php”]/**
* @name TasuCaptcha
* @author Vit ‘tasuki’ Brunner
* @license GNU GPL
* @version 0.001
*
* remarks:
* you need php (duh)
* you need gd
* you need the font file, in the same directory as this
* (get it at http://www.sil.org/~gaultney/gentium/ )
*
* if you want to use antialiased line, you need function drawQSLine()
* get it from http://php.net/manual/function.imageline.php
* code_couturier at graffiti dot net
* # antialiased draw_line function 1.1 (faster)
*/

class TasuCaptcha {
private $bg;
private $fg;

// picture
public $width; // width of the picture
public $height; // height of the picture

// letters
public $font; // font for the letters
public $fontHeight; // height of the letters
public $maxAngle; // maximum angle for the letters
public $top; // where the letters should start – y
public $left; // where the letters should start – x
public $letterWidth; // approximate width of each letter

// line
public $step; // the length of line between turns
public $stepDiff; // the max height difference for step
public $lineBorder; // borders for the middle line
public $thickness; // thickness of the line
public $antialiased; // if true, makes the line antialiased

function __construct($text) {
// picture
$this->width = 170;
$this->height = 50;
$bgColor = ‘113355’;
$fgColor = ‘CCCCCC’;

// letters
$this->text = $text;
$this->font = ‘./gentium.ttf’;
$this->fontHeight = 25;
$this->maxAngle = 15;
$this->top = 35;
$this->left = 10;
$this->letterWidth = 30;

// center line
$this->step = 5;
$this->stepDiff = 5;
$this->lineBorder = 15;
$this->thickness = 2;
$this->antialiased = false;

$this->setBgColor($bgColor);
$this->setFgColor($fgColor);
}

function setBgColor($color) {
if (strlen($color) != ‘6’) die(‘setBgColor needs 6 letter hex color’);
$this->bg[‘r’] = hexdec(substr($color, 0, 2));
$this->bg[‘g’] = hexdec(substr($color, 2, 2));
$this->bg[‘b’] = hexdec(substr($color, 4, 2));
}
function setFgColor($color) {
if (strlen($color) != ‘6’) die(‘setFgColor needs 6 letter hex color’);
$this->fg[‘r’] = hexdec(substr($color, 0, 2));
$this->fg[‘g’] = hexdec(substr($color, 2, 2));
$this->fg[‘b’] = hexdec(substr($color, 4, 2));
}

function drawImage() {
// create image and set colors
$im = imagecreatetruecolor($this->width, $this->height);
$background = imagecolorallocate($im,
$this->bg[‘r’], $this->bg[‘g’], $this->bg[‘b’]);
imagefill($im, 0, 0, $background);
$textcolor = imagecolorallocate($im,
$this->fg[‘r’], $this->fg[‘g’], $this->fg[‘b’]);

// draw letters
for ($i = 0; $i < strlen($this->text); $i++) {
$this->angle = rand(- $this->maxAngle, $this->maxAngle);
imagettftext($im, $this->fontHeight, $this->angle,
$this->left + $this->letterWidth * $i, $this->top,
$textcolor, $this->font, $this->text{$i});
}

// draw the line
$curheight = $this->height / 2;
for ($i = 0; $i < ($this->width / $this->step); $i++) {
$lastheight = $curheight;
$curheight = $curheight + rand(-$this->stepDiff, $this->stepDiff);
if ($curheight > $this->height – $this->lineBorder)
$curheight -= $this->stepDiff;
if ($curheight < $this->lineBorder)
$curheight += $this->stepDiff;

// this could be done better…
for ($j = 0; $j < $this->thickness; $j++) {
if ($this->antialiased) // draw antialiased line
drawQSLine($im, $this->step * $i, $lastheight – $j,
$this->step * $i + $this->step, $curheight – $j,
$this->fg[‘r’], $this->fg[‘g’], $this->fg[‘b’]);
else // draw aliased line
imageline($im, $this->step * $i, $lastheight – $j,
$this->step * $i + $this->step, $curheight – $j,
$textcolor);
}
}

// output the image
header(‘Content-type: image/png’);
imagepng($im);
imagedestroy($im);

// maybe someone could find this useful
return $this->text;
}
}

// now we can try to use it:
$captcha = new TasuCaptcha($cnum);
$captcha->antialiased = true;
$captcha->drawImage();[/code]

Well, that was long, wasn’t it? And most of the time we were just moving values around… $this->shit = $shit;

Now the procedural version:

[code lang=”php”]/**
* @name tasucaptcha
* @author Vit ‘tasuki’ Brunner
* @license GNU GPL
* @version 0.001
*
* remarks:
* you need php (duh)
* you need gd
* you need the font file, in the same directory as this
* (get it at http://www.sil.org/~gaultney/gentium/ )
*
* if you want to use antialiased line, you need function drawQSLine()
* get it from http://php.net/manual/function.imageline.php
* code_couturier at graffiti dot net
* # antialiased draw_line function 1.1 (faster)
*/

function tasucaptcha($text) {
// picture
$width = 170; // width of the picture
$height = 50; // height of the picture
$bgcolor = ‘113355’; // please keep this 6 letters long
$fgcolor = ‘CCCCCC’; // please keep this 6 letters long

// letters
$font = ‘./gentium.ttf’; // font for the letters
$fontHeight = 25; // height of the letters
$maxAngle = 15; // maximum angle for the letters
$top = 35; // where the letters should start – y
$left = 10; // where the letters should start – x
$letterWidth = 30; // approximate width of each letter

// center line
$step = 5; // the length of line between turns
$stepdiff = 5; // the max height difference for step
$lineBorder = 15; // borders for the middle line
$thickness = 2; // thickness of the line
$antialiased = false; // if true, makes the line antialiased

// END OF SETTINGS

// get colors
$bg[‘r’] = hexdec(substr($bgcolor, 0, 2));
$bg[‘g’] = hexdec(substr($bgcolor, 2, 2));
$bg[‘b’] = hexdec(substr($bgcolor, 4, 2));
$color[‘r’] = hexdec(substr($fgcolor, 0, 2));
$color[‘g’] = hexdec(substr($fgcolor, 2, 2));
$color[‘b’] = hexdec(substr($fgcolor, 4, 2));

// set up the image
$im = imagecreatetruecolor($width, $height);
$background = imagecolorallocate($im, $bg[‘r’], $bg[‘g’], $bg[‘b’]);
imagefill($im, 0, 0, $background);
$textcolor = imagecolorallocate($im, $color[‘r’], $color[‘g’], $color[‘b’]);

// draw letters
for ($i = 0; $i < strlen($text); $i++) { $angle = rand(-$maxAngle, $maxAngle); imagettftext($im, $fontHeight, $angle, $left + $letterWidth*$i, $top, $textcolor, $font, $text{$i}); } // draw the line $curheight = $height/2; for ($i = 0; $i < ($width / $step); $i++) { $lastheight = $curheight; $curheight = $curheight + rand(-$stepdiff, $stepdiff); if ($curheight > $height – $lineBorder) $curheight -= $stepdiff;
if ($curheight < $lineBorder) $curheight += $stepdiff; // for ($j = 0; $j < $thickness; $j++) { if ($antialiased) // create antialiased line drawQSLine($im, $step * $i, $lastheight - $j, $step * $i + $step, $curheight - $j, $color['r'], $color['g'], $color['b']); else // draw aliased line imageline($im, $step * $i, $lastheight - $j, $step * $i + $step, $curheight - $j, $textcolor); } } // draw the image header('Content-type: image/png'); imagepng($im); imagedestroy($im); return $text; } tasucaptcha($cnum);[/code] Unless one is paid by lines of code, one must conclude that the second version is much better. It's half as long and twice as readable. As for the captcha itself -- I can't guarantee that the results are machine-unreadable, but at least they are human readable. :-)

Few WordPress-related improvements

In wordpress database, column comment_status is of type enum(‘open’, ‘closed’, ‘registered_only’). But for some reason, ‘registered_only’ is never used anywhere…

I use disable comments plugin, which is excellent because it is very simple. Here is the relevant part:
[code lang=”php”]$wpdb->query(‘UPDATE wp_posts
SET comment_status = “closed”, ping_status = “closed”
WHERE DATEDIFF(NOW(), post_date) > ‘ . $days);[/code]

And if you want it to set the comments to registered_only, you only need to change it to:
[code lang=”php”]$wpdb->query(‘UPDATE wp_posts
SET comment_status = “registered_only”, ping_status = “closed”
WHERE DATEDIFF(NOW(), post_date) > ‘ . $days);[/code]

Well… now if only ‘registered only’ did what it was supposed to, you’d be done with it. But as it doesn’t, we need to change some things. They are dependent on the theme you’re using, I’ll use the default theme to illustrate what needs to be changed. First, look into comments.php file for something this:
[code lang=”php”]if (‘open’ == $post->comment_status)[/code]
and change it to:
[code lang=”php”]if (‘open’ == $post->comment_status
|| ‘registered_only’ == $post->comment_status)[/code]
In the default theme, this needed to be changed at two places.

Then there’s one more thing:
[code lang=”php”]if (get_option(‘comment_registration’) && !$user_ID)[/code]
should be changed to:
[code lang=”php”]if ((get_option(‘comment_registration’)
|| (‘registered_only’ == $post->comment_status)) && !$user_ID)[/code]

After that, it pretty much works. You need to have user registration enabled in wordpress, though. Also, while I was at it, I decided to prevent against bots registering. So I installed Sabre. Sabre is nice, but its CAPTCHA rather sucks… well, anyway — more on that in the next post. 8-)

Fuytayblees

It all started about a year ago, at a go tournament in Blansko, where I played a game called “fujtajblíci”. I enjoyed it a lot, so I thought I could create online version. But as you might know, it is quite a huge leap from thinking about doing something to actually doing it.

Anyway, now I really couldn’t resist anymore… And I thought “fujtajblíci” might be a bit difficult for a lot of people to pronounce or remember, so I rewrote the name as “fuytayblees” (insert fanfares here).

There’s much more info (including the rules, for real) at the fuytayblees site itself, so just visit it, register and start playing. ;-)

JavaScript insanity

Seriously, what would you think about a language that is weakly typed and uses the same operator for concatenation and addition?

I think it’s insane.

Well, so much for my first encounter with JavaScript. And although I encountered way more problems (most of which were caused by my own stupidity, as usual), the fact that the plus sign (aka +) either adds or concatenates (based possibly on the current mood of the interpreter) struck me as the ultimate wtf.

Luckily, parseInt() comes to save the day. But still, why not rather use some other operator? I don’t really care which… just anything else, mmkay?

border: 1px solid red;

When you are creating a design in css, you will often run into various problems. The problem is that you often don’t really know where the problem is. That’s where the problem is.

I was using “border: 1px solid red;” to determine where certain element was. This has several drawbacks… first, it adds 1px on each side of the element, which can cause problems, then it is not too easy to work with (you have to manually add it to every element that you want to highlight).

I have found a much better way to debug css. First, they use outline instead of border (duh), then they make very smart use of wildcard characters, so that out-commenting one thing gets all the css boxes highlighted. Priceless.

Tsumego collections

Is it even possible that I forgot to advertize my new project on my own blog?

So… here it goes: I created tsumego collections.

Some people obviously like it, as I can see some traffic from sources like something.mail.yahoo.com (someone sending emails with a link to my page?). I wonder if I should write an ad into rgg or godiscussions.

Well, repeating informations that you can find there seems useless, suddenly I don’t really know what to write… hmpfh…

Anyway, big thanks to toxygen for transferring the go fonts from metafont to type1 (in pdf, metafont fonts get included as bitmaps, which sucks big time, and type1 fonts get included as vectors, which rocks).