Typescript to the rescue!

October 3rd, 2012

Ok all the programmer sphere is making a lot of fuzz about this right now, so I guess I have to take a stand too.

Just a few days ago Microsoft announced a new programming language called Typescript1. According to their homepage “Typescript is a language for application-scale JavaScript” and after a couple of hours playing around with it I get the feeling they are right.

Since I am programming nodejs2 for the server backend of a web based multiplayer game right now I am struggling with javascript for months now. And all I ever whished for was just a tiny bit of compile time type safety that I am used to from my day job as a C++ coder (I know – but I guess I really like C++ after all).

They released the 0.8 version of Typescript to the public in a rather mature state. Considering that: I could already use all the syntactic sugar and completion of it in a Visual Studio 2012 plugin that they released simultaneously3.

Anders Hejlsberg presented Typescript in a channel 9 video4. He is famous for C#, .NET and the original Turbo Pascal IDE and I can really just suggest to watch this video!

Considering that Typescript promises exactly what I was hoping for in JS: strict type safety,classes,inheritance I gave it a try and started to convert some code in my nodejs codebase. For me the most important factor to do that was to be able to slowly migrate code to it. So you copy paste one module to a Typescript file and without changing anything the compiler spits out an rather unchanged JS file. So you can just migrate whatever you like or use your old code and start using the real features of TS for what you are programming from that point on.

All in all I am really impressed so far and constantly convert stuff over to it :)
And guess what, Microsoft open sourced it, too!

I keep you posted…

  1. http://typescript.codeplex.com/ []
  2. http://nodejs.org/ []
  3. http://www.microsoft.com/en-us/download/details.aspx?id=34790 []
  4. https://channel9.msdn.com/posts/Anders-Hejlsberg-Introducing-TypeScript []

WhatsApp webclient (or “security oddities of a multi million user company”)

September 25th, 2012

I use WhatsApp1 on my Blackberry for quite some time now and it is actually making life easier for me. But a few weeks ago I came across various blog posts about their security mechanisms (if you may call them so).  Some guys reverse engineered2 the WhatsApp protocol and discovered severe security issues!

There is actually a WhatsApp Sniffer Tool3 that can read every conversation going on in a wireless network!!

As if that is not enough the fruits of reverse engineering their protocol is a php library4 over at github, that you can use to chat without your mobile phone. But worse, when having some trivial information (mac address for iphone, IMEI5 for android) you can use their whatsapp account too.

The only reason I did not use that code, to write my own WhatsApp webclient, was that I am somewhat lucky to use a Blackberry and so my WhatsApp connection is secured through RIMs data encryption by default anyway. I cannot login using that php code. Lucky me 😉

But now a german fellow beat me to it anyway and published a website for all other (iphone/android) WhatsApp users who would like to whatsapp using a webclient6. He, Sascha Gehlich7, did not even just use the php sourcecode but translated it to javascript to be able to use it in nodejs. According to his twitter “[…]it’s not open source, yet” :)

If you are discouraged by the fact that the php code is not on github anymore, since they were forced by WhatsApp laywers to put it down8, don’t be and just grab one of the various forks of it 😀

The morale of the story however is, get a blackberry device and stop trusting what you get on whatsapp by others, it could be anyone writing it. I sense a spam tsunami approaching… since the company behind WhatsApp knows about these issues for some time now and do not do anything about it besides going against those discovering it… sad story

  1. http://www.whatsapp.com/ []
  2. WhatsApp security protocoll []
  3. WhatsApp Sniffer []
  4. https://github.com/venomous0x/WhatsAPI []
  5. http://en.wikipedia.org/wiki/International_Mobile_Equipment_Identity []
  6. http://whatsapp.filshmedia.net/ []
  7. https://fr.twitter.com/rattazong []
  8. http://www.golem.de/news/sicherheitsluecke-webseite-erlaubt-whatsapp-nachrichten-im-namen-anderer-1209-94741.html []

Selfmade Timelapse Video using VirtualDub

September 13th, 2012

This is gonna be a rather short post. But since I burned a fair amount of time researching this I guess it is worth sharing.

A few friends (Kai and Timo) and I did a little rapid prototyping session (48h) for a game project a few weekends ago. We decided to take pictures of it – 1 every 15 seconds – to be specific.

Now with a couple of thousands of high-res pictures I was confronted with the task of finding a software to easily create a video of them now.

VirtualDub (find here) turned out to be the most fitting for the job. It is not the most intuitiv option “Open Video” for that and then to choose “Image Sequence” from the Filetype-Dropdown. Then you you just select the first image in the folder you want to import and that’s it. Then you can simply render a uncompressed AVI File.

Now with a 50GB AVI I compressed it using the VLC Player (link).

Here is the final result (Thanks to Kai for the Title renderings):

 

Reading

July 21st, 2012

I’ve been reading two books lately. The first one is “Rework” and the second is called “Schlaue Zellen“. I can recommend reading both of them. They were a pleausure to read and even enlightening at parts.

I won’t go into too much detail about “Schlaue Zellen” (German for “smart matter”) which is a german book about the recent state of neuroscience in a form that normal people can understand. You can even get some useful information of how to become more effective in learning and understanding your own thoughts. Perhaps I gonna cover that book in another post more in depth.

“Rework” is like a little, very easy to read compilation of good practices and novel ideas about how to think of a business and even on how to lead and build one. I will list my top ten of ideas here because I like to share them using my own words and to raise the probability that I wont forget them too soon 😉

  1.  “Planning is guessing” (p. 19)
    You cannot plan success. You cannot predict markets. And every plan you make – especially long term ones – comes hauting you later. We will stick to those plans, cause that’s what our brain wants us to, we need orders and plans and we are not easily convinced to change them without being defaced, even though at some point those plans need to be adjusted, if not thrown away.
  2. “Scratch your own itch” (p. 34)
    This is simple but effective. Provide what you need for yourself. Build what you looked for but did not find. Again and again we find ourselfs blindly trying to predict what our players want and often enough we are wrong. Nobody knows the product better than we do.
  3. “Build half a product, not a half-assed product” (p. 70)
    This esssentially boils down to KISS. Even though we know better, often enough we are tending to spread out for fighting multiple fronts to satisfy yet another customer. We should better be concentrating on optimizing what we got, than adding more weight.
  4. “Be a curator” (p. 80)
    A curator picks the paintings shown in a museum and thats what you should do too. The quality of the museum is not to have EVERY painting stuffed in its halls but to carefully select what might fit together. Thats the same for software. Less is more.
  5. “Launch now” (p. 93)
    What you launch in a year from now will get you feedback not earlier than in a year from now. It is as simple as that. Never before in our industry we were able to launch earlier than today. The customer is used to get his hands on alpha/beta version software. They like it. They feel to be a part of the creation process. And for us it is like a free testing environment for finding bugs and design flaws.
  6. Interruptions (p.104)
    This is the real root of all evil these days. The human is not designed to switch tasks efficiently and every meeting and every call stops the thinking process you are in. You have to carefully get back in it. That takes time and even leads to frustration. Get alone time as much as you can.
  7. “Go behind the scenes” (p.179)
    Customers/Players and People in general love to peak behind the curton. We watch DVD Making Offs and are generally curious. Once you see behind the scenes, you tell your friends and you become the perfect ad. This is what you want from your customers. That way they bond with you and not only your product. So give them insight and they will love you.
  8. “Own bad news” (p. 231)
    Shit happens. You will mess up eventually. The question is, will you do so the RIM way, when their blackberry network failed for days ? They digged their own grave back then, when they decided not to bother talking to the customers and be honest with what happened and what was going to happen. If you mess up, be the first to tell and you will see, that you can even make a win in credibility with a crappy situation like this.
  9. “Sound like you” (p.262)
    This is simple but rarely practiced. Use your own words. Don’t bullshit-bingo, but communicate. Be honest, be real and people will respect you more.
  10. “ASAP is poisen” (p. 268)
    Often enough I encounter people who attach an “ASAP” to every each of their mail and request. When was the last time you wanted something not to be done as soon as it was possible? It is implicite. Inflational use of “ASAP” corrupts its purpose in a real emergency situation. So cut the crap.

Wooga HTML5 game open sourced and ‘less’ ;)

June 23rd, 2012

So this week Wooga open sourced their first HTML5 game Poket Island. Since I am working on a HTML5 game too these days I bothered a look.

The code lies on github and even the grapics are released under creative common license. I like the move by Wooga. They want to show where the problems were and where the direction for HTML5 should go. I wish more companies would take this kind of direction.

Now to the code. I had a look to get some ideas for my own project. So since I am very new to the whole javascript and html stuff I got a lot out of it.

Less (css)

The most valuable hint for me was that they use Less a framework that lets you create your css stylesheets dynamically using javascript. It supports all kinds of conveniences that css lacks.
Three features are most important for me: Variables,Mixins and Nesting.

I can assign variables and use them in multiple places. So now if I want to change a base color that my style uses I just have to change this one variable that I assigned the color to once instead of all occurances thoughout the css otherwise.

There are many other features  that css lacks and that lesscss supports. Mixins that enable me to create templates that Insert as a whole into any other style class that I write.

The third is nesting which allows me to do what I excpected of css from the beginning. I create a style class for element X and want to assign specific attributes for a element Y if it is nested in X. In css i have to write that comletely separated. In less I can now nest Y exactly inside my style for X.

Conclusion

All in all less is a big win for me. My style sheets are radically reduced in size and complexity now. They are easier to maintain too.
And who fears the overhead of dynamically generating those stylesheets via javascript: dont be. You can do the less compiling also on serverside. In my case (and the most convenient too) you simply compile / cache it in your nodejs server.

The other ideas I got from their code is using jslint to analyze my codebase and lossless compress my png using pngcrunch.

Thank you Wooga.

Streaming (media) in NodeJs

June 19th, 2012

Like the title suggests I tried to write a simple http server that is able to stream1 content to the browser. Main reason for this is that chrome is annoyingly bitchy when it comes to playing sounds using HTML5. You can load and play a sound once no problem, but the problem is the “once”. As you can read here2 HTML5 and audio is already a complicated thing but in my opinion chrome goes one step further and is dependand on a webserver that is able to stream the audio files.

At first I tried it using this google group discussion here3 but failed miserably (at least under chrome). I tried to get my head around all those crazy http header flags4 but I did not get it right..

Then I finally got the right clue from a blog post5 describing streaming using the node express framework. But since I have written the rest of the webserver (a simple one that is) without express and because I am notoriously curious I did not want to throw everything out of the window and start over using express.

So last but not least I got it working and here is some code to grind:

var app = require('http').createServer(function(request, response){
	//...yada yada yada...
	// get file name
	//...yada yada yada...
	fs.readFile(filename, "binary", function(err, file) {
 
		var header = {};
		// add content type to header
 
		//TODO: any more clean solution ?
		if(typeof request.headers.range !== 'undefined')
		{
			// browser wants chunged transmission
 
			var range = request.headers.range; 
			var parts = range.replace(/bytes=/, "").split("-"); 
			var partialstart = parts[0]; 
			var partialend = parts[1]; 
 
			var total = file.length; 
 
			var start = parseInt(partialstart, 10); 
			var end = partialend ? parseInt(partialend, 10) : total-1;
 
			header["Content-Range"] = "bytes " + start + "-" + end + "/" + (total);
			header["Accept-Ranges"] = "bytes";
			header["Content-Length"]= (end-start)+1;
			header['Transfer-Encoding'] = 'chunked';
			header["Connection"] = "close";
 
			response.writeHead(206, header); 
			// yeah I dont know why i have to append the '0'
			// but chrome wont work unless i do
			response.write(file.slice(start, end)+'0', "binary");
		}
		else
		{
			// reply to normal un-chunked request
			response.writeHead(200, header );
			response.write(file, "binary");
		}
 
		response.end();
	});
 
});
app.listen(80);

Important to note are just a couple of things that took so long to find out:

  1. set ‘Transfer-Encoding’ to ‘chunked’
  2. set ‘Connection’ to ‘close’
  3. send one more trailing byte  … I have no idea why 😀

That’s it. I hope this will save other people some time 😉

  1. http://en.wikipedia.org/wiki/Chunked_transfer_encoding []
  2. http://www.wappworks.com/2012/06/15/the-html5-audio-troubleshooting-guide/ []
  3. https://groups.google.com/forum/?fromgroups#!topic/nodejs/gzng3IJcBX8 []
  4. http://www.w3.org/Protocols/rfc2616/rfc2616-sec14.html []
  5. http://delog.wordpress.com/2011/04/25/stream-webm-file-to-chrome-using-node-js/ []

Neuronal Warzone

June 15th, 2012

Long ago when I was still programming in Delphi I spent some time researching AI (artificial intelligence) with ANN (artificial neural network) and GA (genetic algorithms).

screeny

The result was a little simulator I called “neuronal warzone”. Just recently when I was talking to a coworker I remembered it and decided to open source it on bitbucket. So here we go: www.bitbucket.org/Extrawurst/neuronalwarzone

The little agents in the population of 20 are trying to kill each other. Survival of the fittest at its core. So the main heuristic is how success you are in killing the other. The ANN is pretty simple since otherwise it is possible that you have to wait a couple of thousand years until some form of intel evolves. Anyway the ANN decides where to turn to and how fast to travel. The rest is done automatically. After a certain amount of time a generation is stopped and recombines its elite and apply some mutation to form the successors and the game of life begins again.

It is amazing to see how fast some simple forms of intelligence evolve. I whish I had more time to research more here. I put it on my TODO-list for “later” 😉
Let’s see when this will be…

Ancient Beachwars

June 1st, 2012

Last weekend I finally had the time to make a video of my first video game I ever developed. Beachwars was a simple jump and run game for two players on a single machine. I did the coding and a friend painted the graphics. It was a huge load of fun and taught me a lot. It was programmed in Delphi and the drawing happened in simple Win32 GDI.

A few months ago we had a school reunion and when I was talking to some guys from my class the topic of Beachwars came up and a totally random guy a few years under me started listening and approached me. It made me really proud when he told me that he and his friends used to play Beachwars which I installed on the school computers. They had competitions in it when they had a class in the computer lab.

So I am not famous or anything but it kinda must be a similar feeling. Especially seeing that your work gave people a good time.

Since I do not think the code is still compiling I decided to capture a few games and edit a nice little trailer of Beachwars. So here you go. Tell me what you think 😉

Social Coding

May 14th, 2011

Everyone of us knows the feeling when you are glad to find a project on sourceforge that seems to be exactly what you were looking for just to find it abandoned, outdated, unfinished or simple plain broken. That is frustrating. And in almost all cases before I’d just close the browser tab at such a point.
But now my coding went social :)

I started my social coding journey on bitbucket.org. Already using some code from there it was just a matter of time until I felt the need to submit a patch anyway. So I thought “let’s try this fancy stuff everyone is talking about”.
A fork and a few patches and pull requests later I must say I like it. It feels more user friendly from the source control point of view (I guess Mercurial as a distributed version control system helps here). But it feels also much more alive thanks to this social aspects. I got a list of projects and people I can follow and I can comment patches and even specific code lines of others.
And now there is ohloh.org. They even take it one more step forward. This site is not so much about the code in terms of developing but in terms of analyzing it and socializing it. I can add projects here and they try to analyze how many people are/were working on it. They apply metrics to say something about the code quality it has and how alive it is. They even got those crazy calculations how much a project is worth in respect to the work hours it took. They estimate Firefox worth $88m. But one of the most interesting aspects of ohloh is that you can even find out who else is working on similar projects near you. This is especially funny since you find a lot of familiar faces there and more often than I’d imagined they were not as old and not even as far away as I thought.
All in all I think the times are great to collaborate. I wish I had more time for this 😉

I published a little open source tool that i wrote to help me messing with OpenCL source files: clcompile

Visit me on bitbucket at www.bitbucket.org/Extrawurst
Visit me on ohloh at www.ohloh.net/accounts/Extrawurst

CLInfo goes portable 2

April 28th, 2011

It was a long and painful way until i managed to do my tool using gtkD1. Well just after I had finished my port to gtkD I was told that I should give DWT2 another try.

I must confess I wasn’t expecting much after my last experiences with a SWT port. But DWT really is mature. I got it to build very fast and the snippets helped me a lot learning the usage. The lib design comes more natural to me than gtkD and I had the same results in a fraction of the time it took me to tame gtkD. Now my CLInfo Tool3 is DWT based.

DWT in short

Pro:

  • Much more intuitive design – I didn’t even miss the gui designer
  • Better documentation with a lot of example snippets
  • No need to ship a bunch of dependencies with the binary

Con:

  • Not absolutely everything of the SWT is ported yet
  • No gui designer
  • Build script uses rake4 – one more dependency for users of the lib

All in all my conclusion for now is going with DWT for GUI applications in D. At least if it stands the test under linux. But that is still to come..

  1. post about gtkD []
  2. DWT project page []
  3. CLInfo Tool Page []
  4. rake project page []