This is an old revision of the document!


Implementing Custom Code Completion

There is two ways of adding cusomt code completion to HippoEDIT:

  • Implementing/registering own Completion provider. Recommended for most of use cases.
  • Subscribing on Application.onCompletion event, and showing completion list by yourself. Can be used if you want to use different UI for completion.

There are several APIs and scripting object that helps implementing the code completion logic.

code-completion.hejs
function onCompletionCollect(view, selection, set) {
	for (var i = 0; i < 10000; i++)
		set.Add(CompletionItem("Item2" + i, "variable"));
	return true;
}
 
Application.RegisterCompletionProvider("js", Application.CompletionProvider(onCompletionCollect));
code-completion2.hejs
////////////////////////////////////////////////////////////////////////
// Register Code Completion Handler
Application.onCompletion = function(/*IRange*/ selection ) {
	if ( ActiveDocument.Syntax.IsInheritedFrom("js") ) {
		//var aSuggestions = ["Item1", "Item2", "Item3", "Item4", "Item5", "Item6", "Item7", "Item8", "Item9", "Item10"];
		//this.ShowCompletionList(selection, aSuggestions, false);
 
		var item5 = CompletionItem("Item5");
		item5.Pattern = "%CurrentWord%(%|%)";
		item5.onDescription = function () { return this.Text + "() ..."; };
		var item6 = CompletionItem("Item6");
		item6.onExpand = onExpand;
		item6.SubMenu = true;
		var aSuggestions = [CompletionItem("Item1", "js:methods"), CompletionItem("Item2", "variable"), CompletionItem("Item3"), CompletionItem("Item4", null, 11, 1, "Item4 Description", onExpand), item5, item6]; 
 
		var completion_set = CompletionSet(aSuggestions);	
		this.ShowCompletionList(selection, completion_set, true);
		return true; // processed	
	}
 
	return false;	 
};