tera/Source/SITE/JS/web-edit.html

<script>

    var EditMap={};
    function GetPassword()
    {
        var Password=localStorage["adminMode"];
        return Password;
    }
    function AddNewEditTag(Name,Path)
    {
        EditMap[Name]=Path;
        if(GetPassword())
        {
            //добавление кнопки редактирования
            var elem=ByID(Name);
            elem.className="content_edit";
            elem.ondblclick=function ()
            {
                EditContent(Name);
            };
        }
    }
    function GetToolbarHTML(Name)
    {
        var toolbarSrc = '<div id="T"'+Name+' class="ui-corner-all">' +
            //'<button onclick="EditContent(\''+Name+'\')">Edit</button>'+
            '<button onclick="SaveContent(\''+Name+'\')">Save</button>'+
            '<button onclick="CancelContent(\''+Name+'\')">Cancel</button>'
        '</div>';

        return toolbarSrc;
    }

    var PrevEditContent={};
    function EditContent(Name)
    {
        //запрос исходного содержания файла
        //отображение кнопки записи и отмены (прячем кнопку редактирования)

        if(PrevEditContent[Name])
            return;

        var elem=ByID(Name);
        PrevEditContent[Name]=elem.innerHTML;
        var Path=EditMap[Name];
        if(Path)
        GetData("/GetFileContent",{Path:Path,Password:GetPassword()},function (Data)
        {
            //console.log("result="+JSON.stringify(Data));
            elem.innerText=Data.Body;
            elem.innerHTML=GetToolbarHTML(Name)+"<div id='Edit"+Name+"' class='content_write'>"+elem.innerHTML+"</div>";
            var elem2=ByID("Edit"+Name);
            elem2.contentEditable='true';
        });
    }

    function SaveContent(Name)
    {
        //запись содержимого на сервере

        var elem2=ByID("Edit"+Name);
        var Path=EditMap[Name];
        if(Path)
        GetData("/SaveFileContent",{Path:Path,Password:GetPassword(),Body:elem2.innerText},function (Data)
        {
            if(Data.result)
                //PrevEditContent[Name]=GetToolbarHTML(Name)+Data.Body;
                PrevEditContent[Name]=Data.Body;
            CancelContent(Name);
        });
    }

    function CancelContent(Name)
    {
        //возврат формы в предыдущее состояние
        //возврат кнопки редактирования
        if(!PrevEditContent[Name])
            return;

        var elem=ByID(Name);
        elem.innerHTML=PrevEditContent[Name];
        elem.contentEditable='false';
        PrevEditContent[Name]=undefined;
    }



    function ByID(id)
    {
        return document.getElementById(id);
    }
    function GetData(Method, ObjPost, Func)
    {
        //console.log(Method);
        var serv=new XMLHttpRequest();
        var StrPost=JSON.stringify(ObjPost);
        serv.open("POST", Method, true);

        var STACK=""+new Error().stack;
        serv.setRequestHeader("Content-Type", "application/x-www-form-urlencoded");
        serv.onreadystatechange = function()
        {
            if (serv.readyState == 4)
            {
                if(serv.status == 200)
                {
                    if(Func)
                    {
                        var Data;
                        try{Data=JSON.parse(serv.responseText)}catch (e)
                        {
                            console.log("Error parsing: "+e);
                            console.log(serv.responseText);
                            console.log(STACK);
                        }
                        Func(Data,serv.responseText);
                    }
                }
                else
                {
                    if(Func)
                        Func(undefined,undefined);
                }
            }
        }

        serv.send(StrPost);

    };


</script>


<style>
    .content_edit:hover
    {
        border: 2px solid #ffdb61;
        margin: -2px;
    }
    .content_write
    {
        color: #1a2ec1;
    }

    .ui-corner-all
    {
        z-index:100;
        position:relative;

    }
</style>