How to auto save and key embed with CK editor?

Question

How do you auto save content of CK editor in 20 seconds and enable key embed, eg. CTRL + S for save?

Answer 1

The basic way to do auto-save in this case would be to set an interval of 20 seconds (translated to milliseconds) using the DOM setInterval() function, and at each interval call a function that performs any pre-processing logic you want, and then post the contents to the server for saving.

The CTRL-S for saving bit could call autoSave() to just perform the save right then, if the save logic will ultimately be the same.

$(document).ready(function() {
    setInterval("autoSave()", parseInt(someIntervalInMilliseconds));

    // auto-save on CTRL-S
    $(window).keypress(function(event) {
        if (!(event.which == 115 && event.ctrlKey) && !(event.which == 19)) return true;
        autoSave();
        event.preventDefault();
        return false;
    });
});

function autoSave() {
    // get the contents of your CKEditor instance
    var instance = CKEDITOR.instances[editorName]; // see the CKEditor API docs for more on obtaining the instance and its data
    var encodedData = htmlEncode(instance.getData());
    // or any other sort of data massaging etc.

    var timeStamp = new Date().getTime();
    $.ajax({
        type: "POST",
        url: "some.php",
        data: encodedData
    }).done(function( result ) {
        // you could update some sort of timestamp element to have
        // the latest date and time of the auto-save, etc.
        $('#timeStamp').text(timeStamp);
    });
}

See this for CTRL-S info.

Answer 2

There is also now a plugin for Auto Save, it's listed in Plugins section of CKEditor web site:

http://ckeditor.com/addon/autosave