function refreshWorkSpace() {
    //ajax this value
    if(ajaxed && xhr != null) {
        //stop now
        xhr.abort();
        ajaxed = false;
    }
    if(workerThread != null) {
        clearTimeout(workerThread);
        workerThread = null;
    }
    workerThread = setTimeout(function() {
                ajaxed = true;
                for(i=0; i<drags.length; i++) {
                    drags[i].draggable("destroy");
                }
                $("#coolspace").html();
                xhr = $.post('load_works.php',
                               { 'set' : selectedSet, 'showType' : showType },
                               function (data) {
                                  $('#coolspace').html(data);
                                  var objs = $('#coolspace').children('.workpic');
                                  drags = new Array();
                                  for( i=0; i< objs.length; i++){
                                      var obj = objs[i];
                                      var drag = $(obj).draggable();
                                      drags.push(drag);
                                  }
                                  resizeWorkSpace(true);
                                  ajaxed = false;
                               }
                )}, 100);
}

function loadWorkSpace() {
    resizeWorkSpace(true);
    $(window).bind('resize', function() {
        resizeWorkSpace(false);
    });
}

function resizeWorkSpace(init)  {
    var el = $("#coolspace");
    //var workSpaceHeight = el.height();
    var workSpaceHeight = $(window).height();
    workSpaceHeight =   workSpaceHeight - $("#coolnav").height() - $("#header").height() - 180;
    var workSpaceWidth = el.width();
    if( workSpaceHeight < 300)
        workSpaceHeight  = 300;

    el.css("height", workSpaceHeight + "px");
    if(!init) {
        var objs = $('#coolspace').children('.workpic');

        var kx = lastWorkSpaceWidth/workSpaceWidth;
        var ky = lastWorkSpaceHeight/workSpaceHeight;
        for(i=0; i<objs.length; i++){
            var obj = $(objs[i]);
            elWidth = obj.width();
            sw = el.width() - elWidth;
            if(sw < 0)
                sw = 0;
            sh = workSpaceHeight - elWidth;

            if(obj.css("left") == 'auto') {
                return;
            }
            obj.css("left", parseInt(parseInt(obj.css("left"))/kx)+"px");
            obj.css("top", parseInt(parseInt(obj.css("top"))/ky)+"px");
        }
    } else {
        if(orderParam == 'sorted') {
            composeOrdered();
        } else {
            composeXaos();
        }
    }
    lastWorkSpaceWidth = workSpaceWidth;
    lastWorkSpaceHeight = workSpaceHeight;
}

var xhr = null;
var workerThread = null;
var ajaxed = false;
var lastWorkSpaceWidth = 0;
var lastWorkSpaceHeight = 0;