Sunday, 26 October 2014

J/Box2D first steps

I came across to use JBox2D and I didnt know anything about how a physical engine works, so I am writing some helpful tips here.

Scale and dimensions

Firstable you have to keep on your mind that Box2D works with meters, so forget pixel or dpi, you will need to use some functions to convert these measurements to something that the engine can understand.
In general people use a scale, because the engine works in a world of 100x100 meters, so its better to have it as small as possible. The common scale is 30.

Here a simple way to convert pixel to Box2D dimensions:

Create a simple ball

Let's start with the second step, you have to define all properties of the object, if its a ball, it has to have  round shape and be elastic.

So you have to define the body definition, if the object will be static or dynamic  and set the position in the world:

The position might be tricky to understand, but here is a simple solution:
When you want to draw something in a canvas, you draw something from position (X,Y), so if you want to draw something at the top left corner, you will choose (0,0).
So in this thinking you would put new Vec2(0,0) in this case, but this will be WRONG because in Box2D everything works in another way, you have to tell the position of the centre of the object.

If you object is  10x10 and you want to position to the top left corner, you position will be (5,5).

To continue the body creation, you have to tell the world that this object exists in the engine, so you have to call the method "createBody"

Then tell at the body, what kind of shape your object will be:

In this case we create a CircleShape, because its a ball. In other case you have to use PolygonShape to create a special shape or a simple square.

Another tricky to understand how to create a PolygonShape for a square is the follow:

You have to use "setAsBox", and the dimension that you put inside must to be half of the width and half of the height, because the BodyDefinition has the position of the centre of the object.

Last thing to complete the creation of the ball in the world is the Fixture Definition:

You can change the density, that is the weight of the object, the friction between objects and the restitution that is the elasticity. Play with some values and you will find out what better works with your project.


Joints are parts that connects two body parts, there are different ones.
There is a joint to simulate a rope connection, an elastic connection, a rotation connection, etc...
You can find more information around in the web, it is very simple to use them but tricky to find the right values or anchor points.

Friday, 4 October 2013

Concatenate a String with a Float

I came up with a very simple and difficult problem with my little Arduino, I couldn't concat a string and a float number, after a few hours on Google I found out the solution:

elpful link:

Lightwave RF Arduino

I had some spare time ( and money ) and I decided to make my little flat a beginning of automate house.
I did some research how to control my lights from an Arduino, even knowing that I could replace the normal switch with a relay. This wasnt enough because I wanted to keep the manual system and to be controlled from an Arduino, so after few hours I came up with LightWaveRF system that has been "hacked" and it is possible to be controlled from an Arduino.

Their products are working with a simple RF protocol at 434 mhz, and they give you the possibility to control it from your smartphone, remote controller and a webpage.
Some people understood how the protocol works and they just write a simple library to interact with Arduino.
There are various adapter: Light switch, Power socket, Light, Sensor PIR, etc.. and if you get a remote controller and a RF receiver, you can reproduce the same signal from your code.

I was using this library to find out what ID and what kind of signals the remote controller was sending to the light switch. After a few minutes on the result and few website, I understood how to reproduce the same behaviour with a single click.
I suggest to use the Decode example to get your ID and to understand what kind of signal your are sending. If you have a multi channels remote, you have to be careful on which command and which channel.

Here an example to turn on my light:

Here a little description what message it sends:

When you got the ID, Channel and which command to send, you re ready to send your first message to your device.
Use the SEND example as based and create your custom message, replace it on the turnOn function and then compile. When the terminal is ready, you should be able to send "1" and whatever you decided to do, it will do it.
Be careful! If something is not working, just try with simple command like ON and OFF, after that move on dimming and mood ones.

Wednesday, 13 February 2013

[Python] Monitor directory in linux

I was looking for  something that could tell me when a file has been modified into a specific directory, I found that with Python and Linux, you can use the system call FCNTL.

The system call FCNTL helps you to monitor a directory and call a personalized function when it is happening.
Below you can find an example that I found on Stack Overflow.

Tuesday, 12 February 2013

[JS] Prevent selection when drag

I had a case where I was dragging an object in my canvas and when the mouse was going outside of it, the whole website was selected by my cursor.

I found this fix that resolve my problem:

Friday, 11 January 2013

[JS] Webcam in HTML5

Webcam in HTML5

HTML5 has introduced a few months ago this opportunity to access your personal webcam from a webpage, in that way you can avoid to use any flash plugin to grab a snapshot.
You might asking about compatibility with browsers and this is a bad point for this technology because IE still a step behind from other browsers, you can check to this website.

HTML part
You need to add two tags on your page that are the follow:

JS part
The follow part of code is made that will work cross-broswer:

The next part is to get a snapshot when you press on the video object, that is the follow part:

Now your are ready to try to grab your first snapshot from your webcam, just put everything together and you should see yourself.

Monday, 3 December 2012

[Supervisor] How to Monitor your program

Supervisor is a great program that takes care about the healthy of your application.
The main feature is to monitor your application and then if something happens e.g. crash, it will restart the program.
There is a web interface where you can check the healthy of your programs and check uptime and logs, also you can stop/restart the process.


The follow command is to install supervisor on your Ubuntu/Debian machine:

sudo apt-get install supervisor

The configuration file is located on your etc folder, I found it into /etc/supervisor/supervisor.conf on my Ubuntu.

You can easier add your applications to the file, just following the guide at this link, but I can give you some advice to configure it.
Each application that you want to monitor have to start with this header:

Add your path where the application is:

and the process name


after that you are ready to restart your supervisor and it should start the process, just check it with "ps aux".
If everything is fine, continue to add more features, otherwise go back and check what is wrong.

These are helpful settings that you should have on your process that makes it alive even if it crashes

Also add some settings to save all logs from your application:

After that, restart your supervisor and everything should be fine.

Enable Web Interface
Usually the web interface is not enabled by default but you can do it , just adding these 3 lines on your configuration file

port =
username = user
password = 123