function _(id) {
    return document.getElementById(id);
}
function __(tagName) {
    return document.createElement(tagName.toUpperCase());
}

function VirtualList(items, itemsCount) {
    
    this.itemsName = items;
    this.items = _(items);
    this.itemsCount = itemsCount;
    this.lastIndex = this.itemsCount - 1;
    this.addNewCallback = function(index) {};
    this.moveCallback = function(before, after) {};
    
    this.addNew = function() {
        this.itemsCount++;
        var el = _(this.itemsName + '[0]');
        var newel = __('div');
        newel.className="padtopbottom";
        newel.id = this.itemsName + "["+(this.itemsCount-1)+"]";
        newel.innerHTML = el.innerHTML.replace(/\[0\]/gim, "["+(this.itemsCount-1)+"]");
        this.items.appendChild(newel);
        
        // call callback
        this.addNewCallback((this.itemsCount-1));
        
        return false;
    }
    
    this.remove = function(indices) {
        
        indices = eval(indices);
        if(this.itemsCount == 1)
            return false;

        var el = _(this.itemsName + '['+indices[0]+']');
        el.parentNode.removeChild(el);
        
        for(var i=indices[0]+1; i<this.itemsCount; i++) {
            var el = _(this.itemsName + '['+i+']');
            el.id = this.itemsName + "["+(i - 1)+"]";
            
            this.moveCallback(i, i-1);
            
            var up1 = _(this.itemsName + '_up['+(i)+']');
            var down1 = _(this.itemsName + '_down['+(i)+']');
            var remove1 = _(this.itemsName + '_remove['+(i)+']');

            up1.id = this.itemsName + '_up['+(i-1)+']';
            up1.setAttribute('index', '['+(i-1)+']');
            
            down1.id = this.itemsName + '_down['+(i-1)+']';
            down1.setAttribute('index', '['+(i-1)+']');

            remove1.id = this.itemsName + '_remove['+(i-1)+']';
            remove1.setAttribute('index', '['+(i-1)+']');

        }
        this.itemsCount--;
        return false;
        
    }
    
    this.moveUp = function(indices) {
        indices = eval(indices);
        if(indices[0] == 0)
            return false;
        if(this.itemsCount == 1)
            return false;
            
        
        var el = _(this.itemsName + '['+indices[0]+']');
        var prevel = _(this.itemsName + '['+(indices[0]-1)+']');
        
        this.items.insertBefore(el, prevel);

        el.id = this.itemsName + "["+(indices[0] - 1)+"]";
        prevel.id = this.itemsName + "["+(indices[0])+"]";
        
        var up1 = _(this.itemsName + '_up['+(indices[0] - 1)+']');
        var down1 = _(this.itemsName + '_down['+(indices[0] - 1)+']');
        var remove1 = _(this.itemsName + '_remove['+(indices[0] - 1)+']');

        var up2 = _(this.itemsName + '_up['+(indices[0])+']');
        var down2 = _(this.itemsName + '_down['+(indices[0])+']');
        var remove2 = _(this.itemsName + '_remove['+(indices[0])+']');
        
        up1.id = this.itemsName + '_up['+(indices[0])+']';
        up1.setAttribute('index', '['+(indices[0])+']');
        
        down1.id = this.itemsName + '_down['+(indices[0])+']';
        down1.setAttribute('index', '['+(indices[0])+']');

        remove1.id = this.itemsName + '_remove['+(indices[0])+']';
        remove1.setAttribute('index', '['+(indices[0])+']');
        
        up2.id = this.itemsName + '_up['+(indices[0] - 1)+']';
        up2.setAttribute('index', '['+(indices[0] - 1)+']');
        
        down2.id = this.itemsName + '_down['+(indices[0] - 1)+']';
        down2.setAttribute('index', '['+(indices[0] - 1)+']');

        remove2.id = this.itemsName + '_remove['+(indices[0] - 1)+']';
        remove2.setAttribute('index', '['+(indices[0] - 1)+']');
        
        this.moveCallback(indices[0], indices[0] - 1);
        
        return false;
    }
    
    this.moveDown = function(indices) {
        indices = eval(indices);
        
        if(indices[0] == this.itemsCount - 1)
            return false;
        if(this.itemsCount == 1)
            return false;
            
        
        var el = _(this.itemsName + '['+indices[0]+']');
        var prevel = _(this.itemsName + '['+(indices[0]+1)+']');
        
        this.items.insertBefore(prevel, el);

        prevel.id = this.itemsName + "["+(indices[0])+"]";
        el.id = this.itemsName + "["+(indices[0] + 1)+"]";
        
        this.moveCallback(indices[0], indices[0] + 1);
        
        var up1 = _(this.itemsName + '_up['+(indices[0])+']');
        var down1 = _(this.itemsName + '_down['+(indices[0])+']');
        var remove1 = _(this.itemsName + '_remove['+(indices[0])+']');

        var up2 = _(this.itemsName + '_up['+(indices[0] + 1)+']');
        var down2 = _(this.itemsName + '_down['+(indices[0] + 1)+']');
        var remove2 = _(this.itemsName + '_remove['+(indices[0] + 1)+']');
        
        up1.id = this.itemsName + '_up['+(indices[0] + 1)+']';
        up1.setAttribute('index', '['+(indices[0] + 1)+']');
        
        down1.id = this.itemsName + '_down['+(indices[0] + 1)+']';
        down1.setAttribute('index', '['+(indices[0] + 1)+']');

        remove1.id = this.itemsName + '_remove['+(indices[0] + 1)+']';
        remove1.setAttribute('index', '['+(indices[0] + 1)+']');
        
        up2.id = this.itemsName + '_up['+(indices[0])+']';
        up2.setAttribute('index', '['+(indices[0])+']');
        
        down2.id = this.itemsName + '_down['+(indices[0])+']';
        down2.setAttribute('index', '['+(indices[0])+']');

        remove2.id = this.itemsName + '_remove['+(indices[0])+']';
        remove2.setAttribute('index', '['+(indices[0])+']');        
        
        return false;
    }
    
}
