binfalse

Although I have too much to do it’s in the nick of time to try some stuff with HTML5.

You should all have heard about HTML5, next generation of web ;) I still saw a lot of new features, some are still not supported in many browsers but all in all I’m looking forward.

Here I played a little bit with the canvas stuff and created a binary clock:

Wasn’t that difficult, just created an HTML element of type canvas with enough space in it to draw the clock:

<canvas id="clock" width="250" height="100"></canvas>

and via JavaScript I draw the clock in it:

/* JS binary clock by Martin Scharm <http://binfalse.de> */
function init()
{
	clock();
	setInterval(clock,1000);
}
function draw (ctx, x, y, stroke)
{
	ctx.beginPath(); 
	ctx.arc(x, y, 9, 0, Math.PI*2,true);
	if (stroke) ctx.stroke();
	else ctx.fill ();
}
function clock ()
{
	var canvas = document.getElementById("clock");  
	if (canvas.getContext)
	{  
		var offset = 60;
		var ctx = canvas.getContext("2d");
		ctx.save();
		ctx.clearRect(0,0,300,300); 
		var now = new Date();
		var sec = now.getSeconds();  
		var min = now.getMinutes(); 
		var hr  = now.getHours(); 
		for (var i = 0; i < 3; i++)
			for (var x = 0; x < 2; x++)
				for (var y = 0; y < 3; y++)
				{
					draw (ctx, i*offset + x*20 + 20, y*20 + 20, true);
				}
				for (var x = 1; x < 3; x++)
					for (var y = 2; y < 4; y++)
					{
						ctx.beginPath();
						ctx.arc(x * offset, y * 20, 4, 0, Math.PI*2,true);
						ctx.fill ();
					}
					for (var x = 0; x < 2; x++)
						for (var y = 0; y < 3; y++)
						{
							if (sec & Math.pow (2, (1 - x) * 3 + 2 - y)) draw (ctx, 2*offset + x*20 + 20, y*20 + 20, false);
							if (min & Math.pow (2, (1 - x) * 3 + 2 - y)) draw (ctx, 1*offset + x*20 + 20, y*20 + 20, false);
							if (hr & Math.pow (2, (1 - x) * 3 + 2 - y)) draw (ctx, x*20 + 20, y*20 + 20, false);
						}
						ctx.fillText(hr + ":" + min + ":" + sec, 70, 80);
					ctx.restore();
	}
}

After wards just called init (); , that calls clock(); once a second to draw the clock. Please tell me whether it works in your browser ;)

If anybody is interested, here is the code: html5_clock. If you also want to deal with it, Mozilla has a good tutorial.

I hope this new age of web will delete all the flash trash out there!

Micha is just sitting next to me, writing a new blog post. He’s writing in German with an English keyboard, so he has to encode umlauts like ä with an ä . I can not watch any longer, here is the trick.

Still blogged about it, you can create such additional keys with Xmodmap. So choose a key, get its key code for example with xbindkeys -k and create a file $HOME/.Xmodmap with the following syntax:

keycode XXX = YYY

XXX ist the code of your key and YYY is that what should happen. For example:

keycode  137 = adiaeresis Adiaeresis
keycode  139 = udiaeresis Udiaeresis
keycode  141 = odiaeresis Odiaeresis 
keycode  143 = ssharp ssharp

That gives you an ä/Ä on the key with code 137 and so on. To let the file take effect just run xmodmap $HOME/.Xmodmap . Btw xmodmap -pke will give you the actual running keymap. So Micha, no need to type to much ;)

Some of you may have recognized that twitter has disabled the so called Basic Authentication. So my previous twitter-tools don’t work anymore. But don’t bury your head in the sand, here are the newer versions.

Basic Authentication means you send your account information (username/password) unencrypted with your query (status update/timeline request/…) to twitter. Of course this method isn’t a nice way, so twitter disabled this method of authentication.

But the new methods of API calls are more complicated (called “OAuthcalypse”) and I really don’t like them. But whoever listens to me?

If you now want to interact with the twitter API, you have to register your tool as new twitter tool. Don’t ask me why, but you have to choose an unique name (all over the twitter world) for your application and get some random strings. For example for a Perl script you need the ones called Consumer key and Consumer secret.

If you want to interact with twitter, you have to do the following:

<li>send the combination of <em>Consumer key</em> and <em>Consumer secret</em> to the server
<li>receive an URL from the server where the user itself can find a pin code (when (s)he is logged into twitter)
<li>send this code to the server again and the user is verified
<li>receive some more authentication information from the server, store it for the next time, so the user don't have to authenticate again

Very annoying method, but there is no alternative method and at least your account is more save against hijacker.

By the way I found a Perl module called Net::Twitter that helps a lot.

Here is my snippet to solve this authentication stuff:

use Net::Twitter;

my $CRED_FILE = "somefile";

sub restore_cred {#read creds from $CRED_FILE}
sub save_cred {#write creds to $CRED_FILE}

my $nt = Net::Twitter->new(traits => ['API::REST', 'OAuth'], consumer_key => "KEY", consumer_secret => "SECRET",);
my ($access_token, $access_token_secret) = restore_cred();
if ($access_token && $access_token_secret)
{
	$nt->access_token($access_token);
	$nt->access_token_secret($access_token_secret);
}

unless ( $nt->authorized )
{
	print "Authorize this app at ", $nt->get_authorization_url, " and enter the PIN: ";
	chomp (my $pin = <stdin>);
	my($access_token, $access_token_secret, $user_id, $screen_name) = $nt->request_access_token(verifier => $pin);
	if (save_cred($access_token, $access_token_secret))
	{ print "successfull enabled this app! credentials are stored in: " . $CRED_FILE . "\\n" }
	else
	{ die "failed\\n"; }
}
if ($nt->update({ status => $status }))

Ok, you see it’s not impossible to solve this problem. And there is another advantage, with these two scripts I don’t have to provide my username/passwort any more.

Here is the script to tweet from command line and this script dumps the actual news to the console.

To use my tools just download them to your machine, rename them as you want and then just run it:

• To tweet something call tweet-v2.pl with your status message as argument.
• To get latest informations from the people you are following just call twitstat-v2.pl with an optional argument defining the maximal number of messages you want to see.

For the first time you’ll see a link where you’ll get your pin (open the link with your browser), after wards the tools will store your credentials in [toolname].credentials . Just try it, won’t (hopefully) break anything :P

Til today I scripted the user interactions in Perl by my own, but now I’ve learned there is an easier way to interact with the user.

The old way was something like this:

my $input = "";
while ($input ne "yes")
{
    print "say yes: ";
    chomp ($input = <>); 
}
print "thanks\\n";

That does what I want it to do, but if you want more complex operations it’s somewhat difficult to hack it. If you want the user to choose something from a menu or to give you an integer, you have to write lots of code and you have to verify the input by your own. There is a Perl module called IO::Prompt to simplify this ( aptitude install libio-prompt-perl ). For example to get an integer from the user you can use this part of code:

use IO::Prompt;
my $integer = prompt ("give me your integer: ", -integer);

The function prompt will print the string and waits for an input. When the user gives an input it will chomp it and verifies the input by your condition (here it tests whether the input is an integer). If the test fails it prints an error and gives the user a new chance to type a correct value until the conditions are complied. So you can be sure that the returned value is definitely an integer! Of course you can tell prompt to check for more difficult conditions, something like a regular expression. For example to get a hexadecimal value you can use this:

use IO::Prompt;
my $hex = prompt ("give me a hex: ",
			 -req => {"Need a *hexadecimal* value!: " => qr/^[0-9A-F]+$/i}
			 );
print "decimal value: " . hex($hex) . "\\n";

With -req this function expects a hash, it’s entries must match to the input or it will print the corresponding key as error message. As values you can pass functions that should return true if the input is correct, or a regular expression that must pattern match or something like this (see IO::Prompt). Here I’m using a regular expression that matches to hexadecimal input and if the user enters a correct input it’s converted to base 10. An example run might look like this:

/tmp % ./prompt-test.pl
give me a hex: NOHEX
Need a *hexadecimal* value!: w00t
Need a *hexadecimal* value!: A6
decimal value: 166

Even menus are simple to realize. For example:

use IO::Prompt;
my $day = prompt ('Whats your favorite day?',
				-menu =>
				[
					'Monday',
					'Tuesday',
					'Wednesday',
					'Thursday',
					'Friday',
					'Saturday',
					'Sunday'
				]);
print "your choice was: " . $day . "\\n";

If you run this program your menu may look like:

/tmp % ./prompt-test.pl
Whats your favorite day?
     a. Monday
     b. Tuesday
     c. Wednesday
     d. Thursday
     e. Friday
     f. Saturday
     g. Sunday

> f
your choice was: Saturday

The freaks among you will try more complex menus. You are allowed to use hashes in hashes in arrays for your menu and prompt will lead the user through your options. You should know where to find further information about this :P

I was annoyed that WordPress by default just shows 45 most used tags on the Add New Post page and found a solution to display all Tags.

After I create a new post in this blog I usually tag it. WordPress provides a very helpful widget that displays the most used tags, but I want to see all tags that I’ve created in the past. Some research through the net doesn’t bring solutions, so I had to walk through the code on my own. Wasn’t very difficult, it was clear that the tags come with Ajax to the site, and I found the code in wordpress/wp-admin/admin-ajax.php on line 616 (WordPress 3.0.1) or wordpress/wp-admin/includes/ajax-actions.php on line 666 (WordPress 3.6, see comments):

$tags = get_terms( $taxonomy, array( 'number' => 45, 'orderby' => 'count', 'order' => 'DESC' ) );

That is what you’ll carry by JavaScript. To get more tags just change this line to something like this:

$tags = get_terms( $taxonomy, array( 'number' => 999, 'orderby' => 'count', 'order' => 'DESC' ) );

You can also edit wordpress/wp-admin/includes/meta-boxes.php , original is:

<p class="hide-if-no-js"><a href="#titlediv" class="tagcloud-link" id="link-<?php echo $tax_name; ?>">< ?php echo $taxonomy->labels->choose_from_most_used; ?></a></p>

If you change it to:

<p class="hide-if-no-js"><a href="#titlediv" class="tagcloud-link" id="link-<?php echo $tax_name; ?>">< ?php echo $taxonomy->labels->all_items; ?></a></p>

the link to get the tags will be called All Tags, not Choose from the most used tags.

I hope this could help some of you. With the next WordPress update these changes will be lost, but you should be able to do it again and maybe I’ll blog about it ;)

Update for WordPress 3.6

You need to edit:

• wordpress/wp-admin/includes/ajax-actions.php line 666
• wordpress/wp-admin/includes/meta-boxes.php

(thanks to Gustavo Barreto)

Update for WordPress 3.8.1

You need to edit:

• wordpress/wp-admin/includes/ajax-actions.php line 691
• wordpress/wp-admin/includes/meta-boxes.php line 381

(thanks to August for reminder)

Update for WordPress 3.9.1

You need to edit:

• wordpress/wp-admin/includes/ajax-actions.php line 702
• wordpress/wp-admin/includes/meta-boxes.php line 410

Update for WordPress 4.1

You need to edit:

• wordpress/wp-admin/includes/ajax-actions.php line 836
• wordpress/wp-admin/includes/meta-boxes.php line 431