From quite a year I’m mainly working with Ember. Recently, due to recent changes on ember data about embedded records i thought it could fit my needs.

But after a bit of digging, i’ve easily found that embedded records do still want an id key to be present to work. As of my API, i have repeated data structure in different API calls, so i wanted to share the capability of a model in many context. Embedded models were great but unfortunately the problem to have an id made me unable to use them… as they are.

Digging i’ve found that modifying indeed ember-data to do what i wanted was really easy: a mixin that properly configured can make ember-data models get the id automatically client side.

Here is the code I’ve ended up with. I started from embedded record mixin and modified its behavior to support noKey option in attrs structure.

This is an example in how to use it. With this post and maybe some merge request on github i’ll try to make ember-data people aware of the problem and maybe evaluate this solution.

Looks like I’m not alone in this problem. Here is a list of documents i’ve read/tried before writing my own mixin. Of course none of them worked in my case  but led me the way to the code i wrote.

Ember data serializer that normalizes embedded records without ids

Jsfiddle demo

Serializing Embedded Relationships with Ember Data 1.0.0 beta

How to make embedded hasMany relationship work with ember-data

Sweet, isn’t it. If you are not impressed notice that all those windows, charts, menu are in a browser. Extjs makes you able to replicate a full desktop experience in a browser container.

The drawback of this is that you code all in javascript, you don’t see any html line at all. If you are comfortable with, you can use Extjs thanks to its dual license: GNU GPL v3 for opensource project and a commercial license if you want to use Extjs in your closed source application. Also the license is per developer seat which means that you can code as much as you want with a single license if you are a freelancer.

I’ve learned to code using Extjs as I always do, trial and error, by examples. Extjs has a huge amount of examples but not all of them have the same code styles and this may lead in having your project  not very well organized. To overcome this, you may want to have a look at Mastering Extjs. I’ve contributed in reviewing this book and I have to admit that the way it teaches how to use Extjs by organic examples and increased difficulty optimizes the time you have to spend to truly understand how a complex framework like Extjs works.  Even if I worked with Extjs from few years I’ve found some techniques and code examples having a better approach instead of the solution I would code without ever reading the book.

The book assumes that you have a basic understanding of the Extjs framework. This basic understanding is very low tho. I can estimate that it takes 1/2 days reading some Extjs examples to have that knowledge. It will focus on having a good code style, multilingual support and a clear unerstanding of the MVC pattern in Extjs. At the end the book will propose ways to optimize the source code and reduce the size of the code that the browser has to download in order to speed up page load and in general app responsiveness/speed.

These two extensions are for python and web developers.

First one is web-mode that is defined as an emacs major mode for editing web templates aka HTML files embedding client parts (CSS/JavaScript) and server blocks. The cool thing about this mode is that in a single mode it recognize different languages and gives you a comprehensive support, in term of shortcuts to edit those source codes. I think the auto closing of the tags is the killing feature of this plugin, at least for me.

The second one is a tool for code autocompletion in python. It is well known that analysis of dynamic languages is a big problem: It’s hard to determine what instance a variable is if not at runtime. Jedi tries to solve this problem. So far it was the beste autocompletion for python on Emacs with the ability to go to definition of functions even in the standar library and to easily look for documentation.

I highly suggest using these two extensions, if you have better/complementary ones, please speak up! I would love to give them a try.

If you don’t have time or you simply dislike Emacs, I would suggest you to have a look at Geany. I’ve talked about it in previous posts for setting a dark theme. If you want to dig into Geany and be productive I really suggest to have a look at the book released by Packt called instant geany. It’s a powerful handbook that in less than a day will introduce to the core functionalities of Geany and will make, hopefully, productive in a short amount of time.

In 4 fast and easy chapters the book will explain how to install and use geany, use its very good source code navigation and go to function definitions that makes geany one of the best opensource IDE.

If you, like me, are used to the beauty of git and create a branch for any single feature you would like to add to the master branch you are upset if you end up in a company that only uses svn as revision control system and they are not willing to make a switch anytime soon.

Some people, even dev managers, sometimes can’t understand how much more productive a good tool make employees. If you are used to merge the code or rebase with git you will find the merging tools of svn kinda obsolete. The fact that if somebody is doing a merge nobody else can commit to svn or everything may break is simply an insane idea for me.

If you are stuck in this kind of environment, you have a savior: it’s called git svn. I’ve been using it from more than one year now and I feel it great. The main concept is simple: git svn imports svn repositories into git ones. After this you can use them as normal git repositories. You can, for example, commit, rebase, rebase interactively, merge and then commit back to svn in the right branch. Git will figure out which is the right branch, but you can change it of course. To start with git svn just clone a svn repository with:

git svn clone -s svn://my_cool_server.com/my_cool_project

The -s will tell git to expect a standard format of svn, the one with a directory for trunk, branches and tags. If you are so unlucky to work with a not standard repo, you can use the -T -t and -b to specify the layout for trunk, tags and branches. This command will start fetching from revision #1 and will apply all the subsequent revisions. If you have a big repository (i’ve one with 50000 commits) you clearly don’t want to do that unless you don’t want your pc to spend days in fetching all reviews. You can tell git to only fetch the latest N revisions with :

git svn clone -s -rN:HEAD svn://my_cool_server/my_cool_project/

where N is a number.

After cloning, your new repo you can access your svn branches over remotes/BRANCH. This means that you can easily create a local branch that will track a svn branch with:

git checkout -t remotes/BRANCH

You can now do all commits, merges, rebase, interactive rebase you want, and even look at the svn patches and log with git log.

And finally, when you want to commit on the remoted tracked branch you simply do:

git svn dcommit

Sweet, isn’t it ?

One very good resources to find regexp or base for your regexp is for sure RegexLib in which a huge collection of regexps is exposed. 90% of the time I’ve to write a regexp I start browsing that site for ideas or pattern to use in my regexp. From this base i tend then to build my own regexp like in this case:

portsList = /^$|^(6[0-5]?[0-9]{0,2}[0-5]?|6[0-4]?[0-9]{0,3}|[1-5][0-9]{0,4}|[1-9][0-9]{0,3})(-(6[0-5]?[0-9]{0,2}[0-5]?|6[0-4]?[0-9]{0,3}|[1-5][0-9]{0,4}|[1-9][0-9]{0,3}))?((\s*,\s*)(6[0-5]?[0-9]{0,2}[0-5]?|6[0-4]?[0-9]{0,3}|[1-5][0-9]{0,4}|[1-9][0-9]{0,3})(-(6[0-5]?[0-9]{0,2}[0-5]?|6[0-4]?[0-9]{0,3}|[1-5][0-9]{0,4}|[1-9][0-9]{0,3}))?)*$/;

This *huge and hard to maintain* regexp recognizes a valid TCP/UDP port or port range which is a number between 0 and 65535 for port and a port-port for port range (there is an error in that regexp, have fun in finding it ). Never to say, that code is unmainteable, that’s why I usually try to describe regexps in a EBNF way. In EBNF you split your regexp in smaller regexp in variables such that you can reuse them.  For example we can define:

• port = […….]
• portList = port || port-port

This is usually easy in programming languages (like in python with its re module) but I found a little bit more tricky in javascript. So here are my rules:

1. Always use the RegExp object
2. Always compose regexp from strings
3. Always isolate regexp string between parenthesis.

In javascript you can create regexp using the RegExp object or using the / / operator. The advantage of the former is that you can compose the regexp using  strings. Look at this example:

var my_regexp = new RegExp("^hello world$");

var my_regexp = /^hello world$/;

The two statements are equivalent. The only difference is that the former is constructed with a string and we can thus put the string into a variable and compose those variables to a valid regexp string.

Isolation of the regexp between parenthesis may look verbose but makes the regexp less error prone and easy to debug. Applying all the rules you would be able to do something like:

var port = "(6553[0-5]|655[0-2]\\d|65[0-4]\\d\\d|6[0-4]\\d{3}|[1-5]\\d{4}|[1-9]\\d{0,3}|0)";

var port_or_port_range = "("+port+"(-"+port+")?)";

var my_regexp = new RegExp("^("+port_or_port_range+")((\\s*,\\s*)("+port_or_port_range+"))*$");

With these three lines we accomplished the same job of the first long regexp I posted. Much easier to maintain and use. Note the leading ( and trailing ) to the port regexp string and the my_regexp that uses the regexp object.

About ten days ago XBian 1.0 beta 1.1 has been released. It included a significant update i was looking for, the SuperRepo integration. Just if you don’t know, SuperRepo is a community maintained repository of more 1300 add-ons for your XBian mediacenter. Why do you need it? Because the default repository that comes with xbmc follows xbmc updates and thus some add-ons take a really long time to be updated if they get broken.

This was true few months ago for the youtube add-on that makes you able to play youtube video in your tv. The add-on was broken and you had to install SuperRepo in order to get the updated version that fixed the issue.

With XBian 1.0 beta 1.1 you no longer need to install SuperRepo and your are sure that your packages are up to date with the largest repo for xbmc mediacenters. This means that if an add-on is broken as soon as it is fixed and uploaded to SuperRepo you can easily update to the new version of the add-on.

The other thing I liked the most was the auto-overclocking of the raspberry pi that boosted from 700Mhz to 800Mhz without any issue and made me play 1080p video without a breeze.

The new logo is well designed and slick, much better than the previous one. The system is, like before, a full debian with mediacenter capabilities, which is exactly what a geek wants: a fast, low cost, raspberry pi based mediacenter which does let you extend and personalize with programs that do not break the overall system.

Up and running the system consumes 11% of ram (was 17% in Xbian 1.0 alpha 5) leaving a lot of resources for the decoding of complex 1080p videos. fps jumped to an average of 46fps on 1920×1080@60Hz (were 39fps on Xbian 1.0 alpha 5). Boot time also has been shortened by 6 seconds from 56 to 50 secs.

Given the very good performances I then decided to update my production mediacenter (the one I share with all my flatmates) to the new version. Unfortunately xbian-config under the Updates submenu tells me that my system is up to date. After a little bit of googlin I’ve found the XBian forum post that describes the update procedure.

If you were looking for one of the best mediacenter distribution for your raspberry pi, you can stop looking for one since you just found it…

ExtJs has that feature: the very well designed Ext.Loader can load arbitrary javascript files just looking on the configured paths of the different resources. On the other side of the most common libraries, Jquery has the $.getScript() function that does exactly the same thing, in a more dummy way. It just loads the javascript in the path passed as argument.

None of them are able to handle css, tho. So I wrote a small, library independent function to load a javascript or css dynamically. Here is the code:

var loadfile = (function(){
    //our hash table to keep record of already loaded files
    var loadedfiles = {};
    //TODO add callback
    return function(filenames, callback){

        if(!(filenames instanceof Array)){
            if(typeof(filenames) == 'string'){
                filenames = [filenames];
            }else{
                throw 'filenames is not an Array or a string';
            }
        }

        var map = {
            js: function(filename){
                var tag=document.createElement('script');
                tag.setAttribute("type","text/javascript");
                tag.setAttribute("src", filename);
                return tag;
            },
            css: function(filename){
                var tag=document.createElement("link");
                tag.setAttribute("rel", "stylesheet");
                tag.setAttribute("type", "text/css");
                tag.setAttribute("href", filename);
                return tag;
            }
        },i,length,type,tag,filename, ext;

        length = filenames.length;
        if(length>0){
            for(i=0; i<length; i++){
                filename = filenames[i];

                if(loadedfiles[filename])
                    //continue if we have already loaded this file
                    continue;

                type = filename.lastIndexOf('.');

                if(type === -1)
                    throw filename+' is not a valid filename with extension';

                ext = filename.slice(type+1);

                //create correct tag
                tag = map[ext](filename);

                //append to head
                document.getElementsByTagName("head")[0].appendChild(tag);

                //update hash table for files we've already loaded
                loadedfiles[filename] = true;

                //call callback
                if(callback && typeof(callback) === 'function')
                    callback(filename);
            }
        }
    };
})();

The loadfile function uses closure to store an hashmap of the loaded file and accepts an single string or an array of strings representing the paths to load. It also accepts an optional callback function that will be called if and when the script has been loaded into the page.

Feel free to use it as you wish. And if you like, give me some credit!

In order to make the usb drives be mounted with writing permissions to all the user of the system I’ve modified the /etc/udisk-glue.conf as following (in bold are the part that I’ve added:

filter disks {
 optical = false
 partition_table = false
 usage = filesystem
}

match disks {
 automount = true
 automount_options = { sync, noatime, <strong>"dmask=0", "fmask=0"</strong>}
 post_insertion_command = "udisks --set-spindown %device_file --spindown-timeout 1800 --mount %device_file --mount-options sync,noatime,<strong>dmask=0,fmask=0</strong>"
}

And I had to let udisk-glue run as root as following:

# udisks-glue
#

description "udisks-glue for udisks"

start on started dbus
stop on (runlevel [06] or stopped dbus)

expect fork
respawn

#exec su - pi -c "udisks-glue"
exec udisks-glue

(I’ve changed udisk-glue such that It’s run by root)

Since there are a lot of folks out there that are using this distro I think it’s is worth sharing this knowledge. If some dev is reading this, please consider to propagate this changes (or do equivalent ones) to the distro in order to increase flexibility.