function replaceAccessrightsEditable(id, callback, annex, annex2,annex3,annex4,isnew){
    var accessRightDiv = $("accessrightsEditable-id-" + id);
    var textElement =    $("accessrightsEditable_text_" + id);
    var editImgElement = $("accessrightsEditable_img_edit_" +id);
    var delImgElement = $("accessrightsEditable_img_del_" +id);

    var selectElement = new Element('select',{
        'id':'accessrightsEditable_select_' + id,
        'style':'padding:5px;'
    });

    for (i=0;i<3;i++){
        var o = new Element('option',{
            'value' : i
        });
        if (i==0){
            o.innerHTML=LnoRights;
        }else if (i == 1){
            o.innerHTML=LReadable;    
        }else{
            o.innerHTML=LWriteable;    
        }
        
        if (annex4 == i){
            o.selected = true;
        }
        selectElement.appendChild(o);
    }


    var inputElement = new Element('input', {
        'id':'accessrightsEditable_input_' + id,
        'type': 'text',
        'value': annex3
    });
    var okImgElement = new Element ('img', {
        'id' : 'accessrightsEditable_okimg_' +id,
        'src':'style/icons/dialog/dialog-ok.png',
        'alt': LSave,
        'style': 'cursor:pointer; padding-left: 4px; vertical-align: middle;',
        'onclick': 'revertAccessRightsEditable( \'' + id + '\', \'' + callback + '\', \'' + annex + '\', \'' + annex2 + '\', \'' + annex3 + '\', \'' + annex4 + '\',' + isnew  + ',true);'
    });
    var choosePathElement = new Element ('img', {
        'id' : 'accessrightsEditable_choosePathimg_' +id,
        'src':'style/icons/folder-new.png',
        'alt': LChooseFolder,
        'style': 'cursor:pointer; padding-left: 4px;padding-right: 5px; vertical-align: middle;',
        'onclick': 'showFolderSelectionDialog(' + id + ');'
    });

    var  cancelImgElement;
    if (isnew){
        cancelImgElement= new Element ('img', {
            'id' : 'accessrightsEditable_cancelImg_' +id,
            'src':'style/icons/dialog/dialog-cancel.png',
            'alt': Lcancel,
            'style': 'cursor:pointer; padding-left: 4px;padding-right: 5px; vertical-align: middle;',
            'onclick': 'cancelAccessRightsEditable(' + id + ');'
        });

    }else{
        cancelImgElement = new Element ('img', {
            'id' : 'accessrightsEditable_cancelImg_' +id,
            'src':'style/icons/dialog/dialog-cancel.png',
            'alt': Lcancel,
            'style': 'cursor:pointer; padding-left: 4px;padding-right: 5px; vertical-align: middle;',
            'onclick': 'revertAccessRightsEditable( \'' + id + '\', \'' + callback + '\', \'' + annex + '\', \'' + annex2 + '\', \'' + annex3 + '\', \'' + annex4 + '\',' + isnew  + ',false);'
        });
    }
    
    accessRightDiv.replaceChild(inputElement,textElement);
    accessRightDiv.replaceChild(selectElement,editImgElement);
    accessRightDiv.insertBefore(choosePathElement, selectElement);
    //accessRightDiv.removeChild(delImgElement);
    Element.hide(delImgElement);
    accessRightDiv.appendChild(okImgElement);

    accessRightDiv.insertBefore(cancelImgElement, okImgElement);
}

function cancelAccessRightsEditable(id){
    Element.remove('accessRightEditable-new-div' +id);
}

function revertAccessRightsEditable (id, callback, annex, annex2,annex3,annex4,isnew,save){
    
    var accessRightDiv       = $("accessrightsEditable-id-" + id);
    var inputElement         = $('accessrightsEditable_input_' + id);
    var okImgElement         = $('accessrightsEditable_okimg_' + id);
    var choosePathElement    = $('accessrightsEditable_choosePathimg_' + id);
    var selectElement        = $('accessrightsEditable_select_' + id);
    var cancelImgElement         = $('accessrightsEditable_cancelImg_' + id);
         var delImgElement = $("accessrightsEditable_img_del_" +id);
    annex3 = inputElement.value;
    annex4 = selectElement.value;
    var ok=false;//,tmpcolor;

    if(save){
        eval(ok = callback + "('" + annex + "', '" + annex2 + "', '" + annex3 + "', '" + annex4 +"')");
    }
    
    
    var editImgElement       = new Element('img', {
        'id': 'accessrightsEditable_img_edit_' + id,
        'src': 'style/icons/edit.png',
        'style': 'cursor:pointer; padding-left: 4px; vertical-align: bottom;',
        'onclick': 'replaceAccessrightsEditable(\'' + id + '\', \'' + callback + '\', \'' + annex + '\', \'' + annex2 + '\', \'' + annex3 + '\', \'' + annex4 + '\',false);'
    });
    var textElement          = new Element('span', { 
        'id': 'accessrightsEditable_text_' + id,
        'style': 'cursor:pointer; padding-left: 4px;',
        'onclick': 'replaceAccessrightsEditable(\'' + id + '\', \'' + callback + '\', \'' + annex + '\', \'' + annex2 + '\', \'' + annex3 + '\', \'' + annex4 + '\',false);'
    }).update(getPathAndRights(id));
    var saved                = new Element ('img',{
        'src':'style/icons/save.gif',
        'style': 'padding-right:10px; padding-left:5px;vertical-align: bottom;'
    });
    var deleteImgElement                = new Element ('img',{
        'id': 'accessrightsEditable_img_del_' + id,
        'src':'style/icons/remove.png',
        'style':'padding-left: 4px; cursor: pointer;',
        'onclick': 'deleteGroupRight(\''  + annex2 + '\', \'' + annex + '\');'
    });
    
    
    if (ok && save){
        accessRightDiv.replaceChild(textElement, inputElement);
        accessRightDiv.removeChild(choosePathElement);
        accessRightDiv.removeChild(selectElement);
        accessRightDiv.removeChild(okImgElement );
        accessRightDiv.removeChild(cancelImgElement );
         accessRightDiv.insertBefore(editImgElement,delImgElement);
        accessRightDiv.appendChild(saved)
        Element.show(delImgElement);
        // accessRightDiv.removeChild(choosePathElement);
       
        // accessRightDiv.removeChild(selectElement);
        //accessRightDiv.removeChild(cancelImgElement);
        Element.addClassName(accessRightDiv, "mark");
        window.setTimeout(function () { 
            accessRightDiv.removeChild( saved);
           
            Element.removeClassName(accessRightDiv, "mark");
        }
        , 700);
    }else{
        Element.show(delImgElement);
         accessRightDiv.replaceChild(textElement, inputElement);
         accessRightDiv.replaceChild(editImgElement, choosePathElement);
         accessRightDiv.removeChild(okImgElement);
        accessRightDiv.removeChild(selectElement);
        accessRightDiv.removeChild(cancelImgElement);
    }
    if (isnew){
        showGroupRights(annex);  
    }
}


function getPathAndRights(id){
    var selectElement        = $('accessrightsEditable_select_' + id);
    var pfad         = $('accessrightsEditable_input_' + id).value;

    var rechte;
    if (selectElement.value == 2){
        rechte = LWriteable;
    }else if (selectElement.value == 1){
        rechte = LReadable;
    }else{
        rechte = LnoRights;
    }
    return ("<span style=\"border: 1px dotted gray; padding: 0 2px;\">" + pfad + "</span> <i style=\"color: black;\">" + rechte + "</i>").toString();
}
function getValuesForSelectable(v){
            var pairs = v.split(",")
            var values = new Array(pairs.length);
            for (i=0; i < pairs.length; i++){
                values[i] = pairs[i].split(";");
            }
            return values;
}

function replaceSelectable(id, callback, annex, annex2){
    var textElement = $("selectable_text_" + id);
    var editImgElement = $("selectable_img_" + id);
    var text =  textElement.innerHTML;


    var selectElement = new Element ('select', {
       'id': 'selectable_select_' + id,
       'name': 'datatype'
    });
    var optionElement;
    for (i = 0; i < annex2.length;i++){
        optionElement = new Element('option',{
            'value' : annex2[i][0]
        });
        if (annex2[i][1]==text){
          optionElement.selected=true;
        }
        
         optionElement.innerHTML = annex2[i][1];
         selectElement.appendChild(optionElement);
    }

    var okImgElement = new Element('img', {
        'id': 'selectable_okimg_' + id,
        'src': 'style/icons/dialog/dialog-ok.png',
        'style': 'cursor:pointer; padding-left: 4px; vertical-align: top;',
        'onclick': 'revertSelectable(\'' + id + '\', \'' + callback + '\', \'' + annex + '\', \'' + annex2 + '\', false, \'' + text + '\');'
    });
    var cancelImgElement = new Element('img', {
        'id': 'selectable_cimg_' + id,
        'src': 'style/icons/dialog/dialog-cancel.png',
        'style': 'cursor:pointer; padding-left: 4px; vertical-align: top;',
        'onclick': 'revertSelectable(\'' + id + '\', \'' + callback + '\', \'' + annex + '\', \'' + annex2 + '\', true, \'' + text + '\');'
    });


    var parent = editImgElement.parentNode;
    Element.hide(textElement);
     Element.hide(editImgElement);
    //parent.replaceChild(selectElement, textElement);
   // parent.replaceChild(okImgElement, editImgElement);
    parent.appendChild(selectElement);
     parent.appendChild(okImgElement);
    parent.appendChild(cancelImgElement);
    
}

function revertSelectable (id,callback,annex, annex2,cancel,oldtext){
     
    var editImgElement = $("selectable_img_" + id);
    var text = $('selectable_select_' + id).value;
    var textElement = $("selectable_text_" +id)
    var parent = editImgElement.parentNode;
    var inputElement = $("selectable_select_" + id);
    var okImgElement = $("selectable_okimg_" + id);
    var cancelImgElement = $("selectable_cimg_" + id);
   
   if(!cancel) {
       ok=  eval(callback + "('" + text + "', '" + annex + "', '" + annex2 + "')");
    } else {
        text = oldtext;

    }
    textElement.update(text);
    
    parent.removeChild(inputElement);
    parent.removeChild(okImgElement);
    parent.removeChild(cancelImgElement);
    Element.show(textElement);
    Element.show(editImgElement);

}

function replaceEditable(id, callback, annex, annex2, showIcon)
{
    var textElement = $("editable_text_" + id);
    var editImgElement  = $('editable_img_' + id);

    var text =  $('editable_text_' + id).innerHTML;

    var inputElement = new Element('input', {
        'id': 'editable_input_' + id,
        'type': 'text',
        'value': text,
        'onkeydown': 'checkForEnterEditable(event, \'' + id + '\', \'' + callback + '\', \'' + annex + '\', \'' + annex2 + '\', \'' + showIcon + '\');'
    });
    var okImgElement = new Element('img', {
        'id': 'editable_img_' + id,
        'src': 'style/icons/dialog/dialog-ok.png',
        'style': 'cursor:pointer; padding-left: 4px; vertical-align: top;',
        'onclick': 'revertEditable(\'' + id + '\', \'' + callback + '\', \'' + annex + '\', \'' + annex2 + '\', false, \'' + text + '\', \'' + showIcon + '\');'
    });
    var cancelImgElement = new Element('img', {
        'id': 'editable_cimg_' + id,
        'src': 'style/icons/dialog/dialog-cancel.png',
        'style': 'cursor:pointer; padding-left: 4px; vertical-align: top;',
        'onclick': 'revertEditable(\'' + id + '\', \'' + callback + '\', \'' + annex + '\', \'' + annex2 + '\', true, \'' + text + '\', \'' + showIcon + '\');'
    });

    var parent = editImgElement.parentNode;

    parent.replaceChild(inputElement, textElement);
    parent.replaceChild(okImgElement, editImgElement);
    parent.appendChild(cancelImgElement);
}

function checkForEnterEditable(e, id, callback, annex, annex2, showIcon)
{
    var keynum = 0;
    if(window.event) // IE
    {
        keynum = e.keyCode;
    }
    else if(e.which) // WebKIT / Gecko / Opera
    {
        keynum = e.which;
    }
    if(keynum == 13)
        revertEditable(id, callback, annex, annex2, false, '', showIcon);
}

function revertEditable(id, callback, annex, annex2, cancel, oldText, showIcon)
{

    var text = $F('editable_input_' + id);
    

    if(!cancel) {
        eval(callback + "('" + $F('editable_input_' + id) + "', '" + annex + "', '" + annex2 + "', '" + showIcon + "')");
    } else {
        text = oldText;
    
    }

   
    var inputElement = $("editable_input_" + id);
    var okImgElement = $("editable_img_" + id);
    var cancelImgElement = $("editable_cimg_" + id);
	
    var textElement = new Element('span', {
        'id': 'editable_text_' + id,
        'style': 'cursor:pointer; padding-left: 4px;',
        'onclick': 'replaceEditable(\'' + id + '\', \'' + callback + '\', \'' + annex + '\', \'' + annex2 + '\', \'' + showIcon + '\');'
    }).update(text);
    var editImgElement;
    if(showIcon == "true"){
        editImgElement = new Element('img', {
        'id': 'editable_img_' + id,
        'src': 'style/icons/edit.png',
        'style': 'cursor:pointer; padding-left: 4px;',
        'onclick': 'replaceEditable(\'' + id + '\', \'' + callback + '\', \'' + annex + '\', \'' + annex2 + '\', \'' + showIcon + '\');'
    });
    } else{
        editImgElement = new Element('img', {
        'id': 'editable_img_' + id});
    }
    var saved = new Element ('img',{
        'src':'style/icons/save.png',
        'class': 'saved'
    });
    var parent = okImgElement.parentNode;

    if (!cancel){
           
       
        parent.removeChild(cancelImgElement);
        parent.replaceChild(textElement, inputElement);
        parent.replaceChild(saved, okImgElement);
        Element.addClassName(parent, "mark");
        window.setTimeout(function () {
            
            parent.replaceChild(editImgElement, saved);
            Element.removeClassName(parent, "mark");
        }
        , 700);
    }else{
        parent.replaceChild(textElement, inputElement);
        parent.replaceChild(editImgElement, okImgElement);
        parent.removeChild(cancelImgElement);
    }
}

function showSuggest(id, callback){
    var span = $('gui_suggest_' + id);
    span.appendChild(newChild);
    //span.
    //alert("gui_suggest_" + id);
}

var dialog = new Dialog();

function Dialog() {

    this.show = function(title, okActionString) {
        var lockDiv = $('lock');
        lockDiv.style.display = "block";
        lockDiv.setAttribute("onclick", "");

        var dialogDiv = document.createElement("div");
        //dialogDiv.setAttribute("style", "position: relative; width: 80%; height: 80%; top: 10%; left: 10%; border: 1px solid black; background-color: #fffebf; padding: 10px;");
        dialogDiv.setAttribute("id", "dialog_dev");
        dialogDiv.setAttribute("onclick", "");
        var dialogTitle = document.createElement("h1");
        dialogTitle.appendChild(document.createTextNode(title));
        dialogDiv.appendChild(dialogTitle);
        lockDiv.appendChild(dialogDiv);

        var contentDiv = document.createElement("div");
        height = dialogDiv.getHeight() - 110;
        contentDiv.setAttribute("id", "dialog_content");
        contentDiv.setAttribute("style", "height: " + height + "px; overflow: auto;");
        dialogDiv.appendChild(contentDiv);

        var OKButton = this.createButton(Lok, okActionString + "; d = new Dialog(); d.hide();", "dialog/dialog-ok");
        style = OKButton.getAttribute("style");
        OKButton.setAttribute("style", style + " position: absolute; bottom: 15px; right: 120px;");
        dialogDiv.appendChild(OKButton);

        var CancelButton = this.createButton(Lcancel, "d = new Dialog(); d.hide();", "dialog/dialog-cancel");
        style = CancelButton.getAttribute("style");
        CancelButton.setAttribute("style", style + " position: absolute; bottom: 15px; right: 15px;");
        dialogDiv.appendChild(CancelButton);
    }

    this.hide = function() {
        var lockDiv = $('lock');
        lockDiv.style.display = "none";
        lockDiv.removeChild($('dialog_dev'));
        lockDiv.setAttribute("onclick", "barList.Blink();");
    }

    this.createButton = function(text, action, icon) {
        var a = document.createElement("a");
        a.setAttribute("class", "actionlink");
        a.setAttribute("style", "background-image: url('style/icons/" + icon + ".png');");
        a.setAttribute("onclick", action);
        a.appendChild(document.createTextNode(text));
        return a;
    }

    this.blink = function()
    {
        element = $('dialog_dev');
        element.style.backgroundColor = "red";
        var counter = 0;
        blinkInterval = window.setInterval(function()
        {
            switch(counter)
            {
                case 0:
                    element.style.backgroundColor = "#fffebf";
                    break;
                case 1:
                    element.style.backgroundColor = "red";
                    break;
                case 2:
                    element.style.backgroundColor = "#fffebf";
                    window.clearInterval(blinkInterval);
            }
            counter++;
        }, 200);
    }
}


function showFolderSelectionDialog(id) {
    
    dialog.show(LChooseFolder, "folderSelectionCallback(" + id +");");
    $('dialog_content').innerHTML = "<div id='fileView'> </div>";
    browseDirectories("/");
}

function folderSelectionCallback(id) {
    $('accessrightsEditable_input_' + id).value = '/'+ removeSlash(getSelectedFile().toString());
}

function collapsePanel(id) {
    $('img'+id).src = "style/icons/expand.png";
    $('img'+id).setAttribute("onclick", "expandPanel('" + id + "');");

    $$('#'+id +' span').each(function(e){
        e.setAttribute("style", "display: none;");
    });

}

function expandPanel(id) {
    $('img'+id).src = "style/icons/collapse.png";
    $('img'+id).setAttribute("onclick", "collapsePanel('" + id + "');");
    
    $$('#'+id +' span').each(function(e){
        e.setAttribute("style", "display: inline;");
    });

}