window.room = 1;

    var socket = new io.Socket();
    socket.connect();
    socket.on('connect', function() {
        socket.subscribe('room-' + window.room);
    });

    function datasend(info) {
        socket.send({room: window.room, info: info});
    }

    socket.on('message', function(data) {
        console.log(data);
    });

    function realtime( action, units, value ){

        if (REALTIME_EDITING != 'True') {
            return;
        }
        var unit_id = [];
        var info = {
            unit_id_counter: UNIT_ID_COUNTER,
            action: action,
            common: {
                project: $('#id_project').attr('value'),
                description: $('#id_description').text(),
                title: $('#id_title').attr('value')
                }
            };

        switch(action)
        {
        case 'canvas':
            info.width = units;
            info.height = value;
            break;
        
        case 'text':
            info.unit_id = $(units).attr('unit_id');
            info.text = value;
            break;

        case 'link':
            info.unit_id = $(units).attr('unit_id');
            info.link = value;
            break;

        case 'dropup':
            info.unit_id = $(units).attr('unit_id');
            info.z_index = $(units).css('z-index');
            break;

        case 'delete':
            $.each(units, function(i, unit){
                unit_id.push($(unit).attr('unit_id') );
            });
            info.units  = unit_id;
            break;

        case 'move':
            $.each(units, function(i, unit){
                unit_id.push({unit_id:$(unit).attr('unit_id'),
                           top: $(unit).css('top'),
                           left: $(unit).css('left')} );
            });
            info.units  = unit_id;
            break;

        case 'size':
            $.each(units, function(i, unit){
                unit_id.push({unit_id:$(unit).attr('unit_id'),
                           width: $(unit).css('width'),
                           height: $(unit).css('height')} );
            });
            info.units  = unit_id;
            break;

        case 'new':
            $.each(units, function(i, unit){
                unit_id.push({unit_id: $(unit).attr('unit_id'),
                              unit_style: $(unit).attr('style')
                             });
            });
            info.units  = unit_id;
        }
        datasend(info);
    }