Autocompletion for Ace Editor

Question

OK, so here's the deal:

• I'm using Ace Editor
• The app the editor is integrated in, is written Objective-C/Cocoa
• I need AutoCompletion (for a given set of keywords)

Now, here's the catch :

• I know AutoCompletion is not yet natively supported
• I know of some attempts by others (e.g. Codiad IDE, Gherkin, Alloy-UI), some making use of Jquery UI Autocomplete - but I still cannot figure out how this could be adapted to an existing Ace setup
• I'm still not sure if I should go for a JS-oriented solution or just use Objective-C/Cocoa for that

Any help would be more than appreciated.

Answer 1

AutoCompletion can be achieved in ace editor..

Code :

    var editor = ace.edit('editor');
    editor.setTheme("ace/theme/eclipse");
    editor.getSession().setMode("ace/mode/java");
    editor.setShowInvisibles(true);
    editor.setDisplayIndentGuides(true);
    editor.getSession().setUseWrapMode(true);    
    var jsonUrl = "JSON/Components/proce.json";
    //the url where the json file with the suggestions is present
    var langTools = ace.require("ace/ext/language_tools");
    editor.setOptions({enableBasicAutocompletion: true});
    var rhymeCompleter = {
        getCompletions: function(editor, session, pos, prefix, callback) {
            if (prefix.length === 0) { callback(null, []); return }
            $.getJSON(jsonUrl, function(wordList) {
                callback(null, wordList.map(function(ea)  {           
                    return {name: ea.word, value: ea.word, meta: "optional text"}
                }));
            })
        }
    }

    langTools.addCompleter(rhymeCompleter);

Json file format :

   [ {"word":"hello"}, 
   {"word":"good morning"},
   {"word":"suggestions"},
   {"word":"auto suggest"},
   {"word":"try this"}]

Reference/Demo :

http://plnkr.co/edit/6MVntVmXYUbjR0DI82Cr?p=preview

Answer 2

To add Live Auto Completion in Ace nowadays: In your HTML include the ace/ext-language_tools.js. The . call does not work well yet, so you may have to enter ctrl-space or alt-space for that, but standard syntax stuff such as writting function, will now show. Then:

var editor = ace.edit("editor");

ace.require("ace/ext/language_tools");
editor.setOptions({
    enableBasicAutocompletion: true,
    enableSnippets: true,
    enableLiveAutocompletion: true
});