Idea Machine

For those of you who have found my posts even remotely useful, I want to let you know that my blog has moved [to blogger](http://www.brankovukelic.com/). Tumblr wasn't too happy about my custom domain, and I really wanted to keep presence at my own domain, so I'm continuing my blogging over there.

It's that time of the year. Common cold, flu, strep, and many other assailants violate our health. Mainstream medication may or may not help. It so happens that in my case, over-the-counter drugs just don't help, so I use herbal teas to help my immune system repell the intruders. Various herbal teas can be quite effective in combatting common ailments and psychological imbalance we face every now and then, and this is the list of three herbal teas I consider essential part of my arsenal. ### Chamomille [Chamomille](http://en.wikipedia.org/wiki/Chamomile) is a flower that looks very much like daisies, quite common around the world. It is considered to be quite effective in treating infections (e.g., throat infection such as strep type A), as well as sleep problems and anxiety. ### Nettle [Nettle](http://en.wikipedia.org/wiki/Nettle) is a plant commonly found in most parts of the world in temperate climates. It has stings on leafs and stem, and is also a topic of many folk tales and superstitions. It can be very effective for problems with the digestive tract, common cold, and many other symptoms. ### Mint [Mint](http://en.wikipedia.org/wiki/Mentha) or Mentha is another genus of plants quite common around the world. It has a distinct and pleasant aroma (like mild pepermint). It's aroma helps with breathing, and mint tea is also considered a good remedy for common cold.

Under Linux, aliases are your best friends when you are in the command line. It's such a handy feature it'd be a crime not to use it. Here I'll give you a short overview of how you can use them, and also share a tip that will make managing them easier. ### Alias basics First off, here's how to create an alias: $ alias ls='ls --color=auto' Now, when you type `ls`, it would be treated the same as if you typed `ls --color=auto`. Aliases cannot be used as command arguments, although some tools seem to support it. But you can still use backtick-quoting to execute an alias as part of command argument. $ echo `ls` To see the command that created some alias, you can do this: $ alias ls alias ls='ls --color=auto' If you call the `alias` command without arguments, it will show you the defined aliases: $ alias alias ls='ls --color=auto' It's important to note that the output of the above command is a list of alias commands used to set up our aliases. We will use this fact to make managing them easier (later). To remove an alias, use the `unalias` command. $ unalias ls $ alias ls bash: alias: ls: not found You can also use aliases as part of alias definition. For example: $ alias ls='ls --color=auto' $ alias la='ls -a' When you type `la`, it will be treated as `ls --color=auto -a` and not just `ls -a`, because `ls` in the `la` alias is properly expanded to `ls --color=auto`. Aliases can contain all kinds of characters, including a dot, underscore, and dash. For example: $ alias ..a='source ../bin/activate' You can use this fact to make aliases easier to remember. You cannot use characters like `$` or `\` because they have special meanings. ### Managing aliases As you grow fond of aliases (as I'm sure you will), you will no doubt want to make them persistent. Once defined, an alias lasts only as long as your shell session. As soon as you log out of your shell, the alias is gone. Usually, people place all their aliases in `~/.bashrc` so that they are loaded as your shell is initialized. There are a few drawbacks using this method. First, you have to actually edit `~/.bashrc` when you need to define an alias. Second, alias definitions are not ordered alphabetically. Finally, when you have multiple terminals open, you would have to source `~/.bashrc`, which not only defines all new aliases, but also runs anything else that you have there. A better way to do it is to separate aliases into a different file. First create two management aliases: $ alias sa='alias > ~/.alias' $ alias la='source ~/.alias' The first alias, `sa`, saves all alias commands to a file named `~/.alias`. Second one, `la`, loads the saved aliases into the current session. Loading is useful when you have multiple terminals open at once, define an alias in one of them, and want to have another terminal load the new alias. Finally, load the saved aliases in `.bashrc`: $ echo "source ~/.alias" >> ~/.bashrc Now instead of editing `~/.bashrc` every time you need to save an alias, you can simply call `sa`: $ alias ll='ls -l' $ sa

A child playing with one of the newly installed water fountains in New Belgrade.

It is rather ironic, or rather telling, that the image of burgeoise gathering is representing what is supposedly an _awards ceremony for the best ideas in development of civil societies_ at ISC (Institute for Sustainable Communities). I would have thought some camouflage would have been employed by 21st century, but obviously, in some regions, that is not deemed necessary. (image taken from [news page on ICS Serbia website](http://www.iscserbia.org/serbian/news/news/article/nagrade_za_najbolje_gradjanske_ideje.php), hopefully covered by Fair Use doctrine or similar)

One of the typical vacation house rafts on Sava river in New Belgrade, similar to the many found on most Serbian rivers.

Small child walking atop one of the decorative concrete walls along the Sava river bank in New Belgrade. This concrete art adorns the river banks in Belgrade since the Communist era.

During the last decade or so, Chinese language graffiti started showing up in the residential area of New Belgrade known as "The Blocks" ("Blokovi" in Serbian).

Small shopping mall in 45th Block, New Belgrade. It's quiet on Tuesday afternoon, when most people are still at work. Woman in shiny boots strolls around the mall looking for some quiet shopping time.

Somewhat spooky shot of a woman doing yoga-ish exercises. Used slow shutter speed and post processing in Gimp. Although F performance of the 18-55 kit lens isn't very good, it's still great for blur photography. (Taken with Nikon D3100.)

If you hate CoffeeScript but don't know why, this article is for you. If you haven't looked at CoffeeScript, and you don't know why, this article is also for you. If you are wondering what CoffeeScript is all about... and don't know why, this article is definitely for you. CoffeeScript (CS for short), is a language (yes, it _is_ a language) that many love, many absolutely hate, and leaves not too many people indifferent. And rightly so. Whenever words like "beauty" and "elegance" are involved, you're bound to make some enemies. In this article, though, I won't argue about relative beauty of CS. That is totally besides the point. Many people _hate_ the C-like aesthetics of JavaScript itself, and that hasn't stopped them from learning it and using it effectively, since they _had_ to. Instead, we'll take a look at the technical merits of using CS. Let me get something else out of the way before we go on. You have to be proficient in JavaScript _before_ you can use CS. Seriously. If you are not absolutely sure of your JS-fu, don't even think about CS. CS doesn't mask JS so you don't have to look at JS ever again. In fact, you _will_ be looking at JS a lot when you are first learning (like split the editor buffer and watch code side-by-side to actually see what CS does when it's compiled). Having said that, if you do know JavaScript well, you can learn CoffeeScript syntax in about half a day without even trying (well, ok, you obviously have to try). So, back to our regular program, if I had to describe CS in one short statement, it would be something like: "Two parts Ruby, one part Python, bunch of shims, completely original." Yes, it does remotely resemble Ruby, and it does remotely resemble Python, but it's original. It doesn't actually work like either Ruby or Python (yes, I know and like both). About the shims. If you've used [Underscore.js](http://underscorejs.org/), and thought it was cool, and it should be part of the language, yes, CS actually has most of it built-in. It also has bits and pieces that allow you to not even think about most of the [JavaScript the bad parts](http://oreilly.com/javascript/excerpts/javascript-good-parts/bad-parts.html). I must admit I wasn't even aware of some of the tricks involved until I've taken a look at compiled JavaScript. You might have noticed already that CS compiles to JavaScript. No, there are _no_ browser-based solutions that would allow you to run CS without compiling. There are tools that would compile CS on the fly in the browsers, but you can imagine the overhead of that process, and how impractical that would be. There is also no dedicated VM or engine that would run it on server-side either. So you have to compile it down to JavaScript, and run the JavaScript instead. As you can imagine, any runtime exceptions are thrown in JavaScript, so you have to first look at where those exceptions occurred inside the compiled JavaScript, and trace them back to original CS source. While it may sound like a daunting task, it actually isn't. As long as you know what individual CS idioms look like when compiled, you will be fine. Back to shims, which are, at least for me, the best part of CS, it does have tons of them. You can, obviously, use methods like `Array.prototype.forEach`, `Array.prototype.map`, or `Object.prototype.keys`, but CS has its own syntax for doing those things, and that guarantees your code will run on different browsers without any shims. For example, if you want to do `forEach` on an array, you can do it like so: for item in myArray do (item) -> # your code here The `(args...) ->` is a function signature, followed by an indented block of code which represents the function body. Blocks that are marked by their indentation level is a Python idiom, and it works as expected in CS. If you have defined your callback function elsewhere, there is an even more succinct way of doing the `forEach`: myFunc(item) for item in myArray Moreover, it is possible to add conditions to loops: myFunc(item) for item in myArray when item.count > 0 Let's see what the above translates to: var item, _i, _len; for (_i = 0, _len = myArray.length; _i < _len; _i++) { item = myArray[_i]; if (item.count > 0) { myFunc(item); } } Conditional assignment to object properties has never been _safer_: myObject?.property = 'foo' The above translates to this: if (typeof myObject !== "undefined" && myObject !== null) { myObject.property = 'foo'; } You can also test for properties: myObject.property ?= 'foo' translating to: var _ref; if ((_ref = myObject.property) == null) { myObject.property = 'foo'; } If you want to first test if object exists, and then assign a property only if it doesn't exist already, you can just combine the above two: myObject?.property ?= 'foo' Which means this in JavaScript: var _ref; if (typeof myObject !== "undefined" && myObject !== null) { if ((_ref = myObject.property) == null) { myObject.property = 'foo'; } } Before I go on with more examples, you may still believe that using question marks is ugly, or whatever you want. However, you have to admit, that, once you learn what the question mark does, it does save a _lot_ of typing, especially if you do something like: myObject?.property ?= 'foo' for myObject in arrayOfObjects which becomes this mouthful in JavaScript: var myObject, _i, _len, _ref; for (_i = 0, _len = arrayOfObjects.length; _i < _len; _i++) { myObject = arrayOfObjects[_i]; if (myObject != null) { if ((_ref = myObject.property) == null) { myObject.property = 'foo'; } } } Still not convinced? How about this bit of code: [a, b...] = [1, 2, 3, 4, 5, 6] Can you guess what this does? This is actually a pattern that exists in functional languages like Erlang. What the above does is, assigns the first item to `a`, and the rest to `b` (because of the so-called splat after `b`). This code translates to: var a, b, _ref, __slice = [].slice; _ref = [1, 2, 3, 4, 5, 6], a = _ref[0], b = 2 <= _ref.length ? __slice.call(_ref, 1) : []; This becomes extremely useful when used as a function argument (yes, it's possible to do so, which is amazing): myFunc = ([head, tail...], newArr=[]) -> return newArr if not tail.length newArr.push head + 1 myFunc tail newArr Above is a recursive function which increments all items in an array. Obviously, it's a oversimplified example, but it demonstrates two things. First, the `newArr` argument is optional, and we've specified the default value right in the function signature (defaults to empty array). Second is array expansion which also happens right in the function signature. Use of `not` in place of a bang (`!`) is arguably nicer, but you can also stick to the bang if you prefer it (same applies to using `or` instead of `||`, or `and` instead of `&&`). Another thing to note is that you cannot use named functions in CS. This is not a problem, however, because functions can be assigned to variables and called recursively using the reference. I have not yet encountered a situation where I absolutely needed named functions. The above example translates to this: var myFunc, __slice = [].slice; myFunc = function(_arg, newArr) { var head, tail; head = _arg[0], tail = 2 <= _arg.length ? __slice.call(_arg, 1) : []; if (newArr == null) { newArr = []; } if (!tail.length) { return newArr; } newArr.push(head + 1); return myFunc(tail(newArr)); }; Speaking of Array expansion, or "destructuring", as it is properly called, you can also perform comprehensions on objects using both keys _and_ values. For example, here's what I usually do in JavaScript: for (key in obj) { var val = obj[key] // do something with key and val } In CS, this looks like this: for key, val of obj do (key, val) -> # do something with key and val A concrete example: var obj = {foo: 5} var defaults = {foo: 1, bar: 2} for (key in defaults) { var val = deaults[key]; if (typeof obj[key] === 'undefined') { obj[key] = val; } } Written in CS, it looks like this: obj = foo: 5 defaults = foo: 1 bar: 2 obj.key ?= val for key, val of defaults Speaking of objects, you will notice that object literal syntax has a YAML-like format in CS. If you don't like that, you can also use the normal JavaScript syntax with curly braces and comma. Last but not least, let's not forget string interpolation, which is not doable in JavaScript at all: "#{foo} is an interpolated variable" translates to: "" + foo + " is an interpolated variable" Initial `"" +` coerces foo into string which is handy if you need to string two variables together one after the other. For example: var a = 1; var b = 2; a + b + " is 12" // becomes "3 is 12" "" + a + b + " is 12" // becomes "12 is 12" "" + (a + b) + " is 12" // becomes "3 is 12" EDIT: One more example I absolutely have to include (with delay). Remember how you can use arbitrary arrays as function arguments using the `.apply()` method? function myFunc() { console.log(arguments); } myFunc.apply(null, [1,2,3, 4]); The above outputs something like this: { '0': 1, '1': 2, '2': 3, '3': 4 } Let's rewrite that in CS: myFunc = -> console.log arguments myFunc [1,2,3,4]... Notice the splat (`...`) behind the array. That's how you do `.apply()` in CS. :) Ok, enough examples. If you liked CS so far, and are interested to learn more about it, check out [CoffeeScript.org](http://coffeescript.org/). There are also two free books you can read online. One is called [The Little Book of CoffeeScript](http://arcturo.github.com/library/coffeescript/). Another one is an interactive book called [Smooth CoffeeScript](http://autotelicum.github.com/Smooth-CoffeeScript/interactive/interactive-coffeescript.html). Finally, there is a [whole cookbook](http://coffeescriptcookbook.com/) online packed with examples, and I suggest you look there when you get stuck (although you probably won't get stuck anyway).

Serbian landscapes can be beautiful, especially this time of the year. This photo was taken during my trip back from Belgrade.

Executing an arbitrary number of asynchronous JavaScript functions one by one as they are stored in an array is what we'll be looking at in this post. The method I use is not too simple, but it certainly not difficult to follow either, and comes from work I've done on [FragRouter](https://github.com/foxbunny/FragRouter/). So, the problem with asynchronous functions is that you can't just execute them one by one and hope they'll all _finish_ in order. They basically fork off to a separate thread (mind you, JavaScript _is_ single threaded, but asynchronous functions still behave as if they were in a separate thread). Here's an example: // rnd() - generate random integer between 0 and 3000 function rnd() { return Math.round(Math.random() * 3000); } function async1() { setTimeout(function() { console.log('done 1'); }, rnd()); } function async2() { setTimeout(function() { console.log('done 2'); }, rnd()); } function async3() { setTimeout(function() { console.log('done 3'); }, rnd()); } Obviously, if we were to run the asyncX functions one after the other, nobody can tell which order they will finish in. If you run the [demo on jsFiddle](http://jsfiddle.net/foxbunny/7fEQn/) a couple of times, you'll see what I mean. So, how can we ensure that those run sequentially? Before we can answer this question, we must know that the only thing that actually tells us the functions are done is the callback. In our case, callbacks are the functions passed to `setTimeout()`. They are the ones that know when it's all done. Here is the idea, then. To run the three asynchronous functions sequentially, we need to make sure the next function is run after the callback is called. Let's assume that our asyncX functions are passed a callback called `next`. This callback, when called from within asyncX's callback, will cause the next async function to run. function async1(next) { setTimeout(function() { console.log('done 1'); next(); }, rnd()); } function async2(next) { setTimeout(function() { console.log('done 2'); next(); }, rnd()); } function async3(next) { setTimeout(function() { console.log('done 3'); next(); }, rnd()); } Now all three functions are rewritten to use the `next` callback. But that doesn't get us anywhere just yet. To tie these three together, we need another function that would take care of the workflow: function inOrder(funcArray, final) { if (!funcArray.length) { return final(); } funcArray[0](function() { inOrder(funcArray.slice(1), final); }); } Let's break it down. The `inOrder` function takes two arguments. One is `funcArray`, and another is `final`. The latter is a callback function that gets executed once every function in `funcArray` has run its course. The `funcArray` is, as its name implies, an array of functions. First thing that happens in the `inOrder` function is that we check if there are any more functions to run. If not, we just call the `final` callback. Otherwise, we call the first item in the array, and pass it a function which calls `inOrder` again (this is called [recursion](http://en.wikipedia.org/wiki/Recursion_(computer_science))), passing it the rest of the array, and the final callback. Let's see this in action: inOrder([async1, async2, async3], function() { console.log('Done'); }); We can clearly see that 'Done' is only logged after the three asynchronous functions are finished. And not only that. No matter how many time we run this code, the three asynchronous functions will finish in order they were put in the array. You can see the result of the implementation in a [jsFiddle demo](http://jsfiddle.net/foxbunny/FuPVE/). As an added bonus, within the asynchronous function, we are free to call `next` whenever we want, so, we can actually allow some code to run separately out of order if our application needs it. The above code is used (in a slightly modified form) in FragRouter to run multiple possibly asynchronous middleware in order. To demonstrate the power of calling `next` early, here is a simple middleware that would ping the server each time user visits a new hash: function pingMiddleware(next) { next(); $.get('/ping'); } What we did above is, we called `next` immediately so that the middleware stack does not have to wait for the AJAX request to finish. And then we went on to make the AJAX request, which can take some time depending on our server's performance. This has the effect of increasing responsiveness of the application. On the other hand, if we wanted to wait for our server to reply, we would simply do this instead: function pingMiddleware(next) { $.get('/ping', function() { next(); }); } As you can see, this pattern can be quite flexible and powerful.

MDF and aluminium drop-leaf with two leafs and a side drawer. Side drawer goes the full width of the table, and can be opened from either side. It has two supporting legs and two gate-legs that rotate from the middle. I've designed this piece as a replacement for a worn-out all-wood table we currently use. WxHxL: 90x73x155cm (30cm when collapsed) or approximately 35"x29"x61" (12" when collapsed)

The source code of this project can be downloaded from its GitHub repository. Feel free to use it as you see fit, without any restrictions. You can also use it as a template for your future projects. I use this template in production at Monwara LLC, so it should work.

While the former Otpor leaders, now working as CANVAS, are selling their ideology to countries around the globe that are only too eager to jump on the revolutionary bandwagon, people have to be aware of the consequences of such revolutions. The art of war is not the same as the art of post-war. What remains after a non-violent revolution is not much better than what remains after a war: a sea of spiritually wrecked people that are even weaker and even more susceptible to manipulation than before. Or perhaps, financiers of CANVAS actually look forward to sailing on those seas?

Apple laptop parody featuring Plum D series, an imaginary Serbian-made laptop with pretty cool specs.