Does anyone know how to bind "shown", "select", and "close" event to the completion object of show hint addon of codemirror? The reason I want to bind those event because I want to auto position the completion list. somehow, the list is off the window when the cursor is at really bottom of the page. but when I looked at the completion demo on the codemirror site. it does not have this issue and it is auto positioned. please help, thanks
Here is the document from codemirror site. it is not really clear that how it works. and there is no example or demo like jQuery doc.
The following events will be fired on the completions object during completion:
"shown" ()
Fired when the pop-up is shown.
"select" (completion, Element)
Fired when a completion is selected. Passed the completion value (string or object) and the DOM node that represents it in the menu.
"close" ()
Fired when the completion is finished.
This addon depends styles from addon/hint/show-hint.css. Check out the demo for an example.
ok, I have solved the problem myself by reading, comparing and debuging CodeMirror Source. and I think it is a mistake of CodeMirror. Basically, there is a line in the show-hint.js of download version which is different in the demo linked file.
You need to move the code below the line 169 and above the "var box" initialization. so that the "var box" can get the correct number after calling getBoundingClientRect(). Hopefully they can fix this problem soon than later.
(options.container || document.body).appendChild(hints);