nl_tokens: Create divs for completion hints and output
pl_tokens: function ( ) { var input = this . element ; this . element . spellcheck = false ; this . output = this . doc . getElementById ( 'cockpitOutput' ) ; this . popupOutput = ( this . output == null ) ; if ( ! this . <mask> ) { this . output = this . doc . createElement ( 'div' ) ; this . output . id = 'cockpitOutput' ; this . output . className = 'cptOutput' ; input . parentNode . insertBefore ( this . output , input . nextSibling ) ; var setMaxOutputHeight = function ( ) { this . output . style . maxHeight = this . outputHeight . get ( ) + 'px' ; } . bind ( this ) ; this . outputHeight . addEventListener ( 'change' , setMaxOutputHeight ) ; setMaxOutputHeight ( ) ; } this . completer = this . doc . createElement ( 'div' ) ; this . completer . className = 'cptCompletion VALID' ; this . completer . style . color = dom . computedStyle ( input , "color" ) ; this . completer . style . fontSize = dom . computedStyle ( input , "fontSize" ) ; this . completer . style . fontFamily = dom . computedStyle ( input , "fontFamily" ) ; this . completer . style . fontWeight = dom . computedStyle ( input , "fontWeight" ) ; this . completer . style . fontStyle = dom . computedStyle ( input , "fontStyle" ) ; input . parentNode . insertBefore ( this . completer , input . nextSibling ) ; // Transfer background styling to the completer. this . completer . style . backgroundColor = input . style . backgroundColor ; input . style . backgroundColor = 'transparent' ; this . hinter = this . doc . createElement ( 'div' ) ; this . hinter . className = 'cptHints' ; input . parentNode . insertBefore ( this . hinter , input . nextSibling ) ; var resizer = this . resizer . bind ( this ) ; event . addListener ( this . win , 'resize' , resizer ) ; this . hintDirection . addEventListener ( 'change' , resizer ) ; this . outputDirection . addEventListener ( 'change' , resizer ) ; resizer ( ) ; canon . addEventListener ( 'output' , function ( ev ) { new RequestView ( ev . request , this ) ; } . bind ( this ) ) ; event . addCommandKeyListener ( input , this . onCommandKey . bind ( this ) ) ; event . addListener ( input , 'keyup' , this . onKeyUp . bind ( this ) ) ; // cursor position affects hint severity. TODO: shortcuts for speed event . addListener ( input , 'mouseup' , function ( ev ) { this . isUpdating = true ; this . update ( ) ; this . isUpdating = false ; } . bind ( this ) ) ; this . cli . addEventListener ( 'argumentChange' , this . onArgChange . bind ( this ) ) ; event . addListener ( input , "focus" , function ( ) { dom . addCssClass ( this . output , "cptFocusPopup" ) ; dom . addCssClass ( this . hinter , "cptFocusPopup" ) ; } . bind ( this ) ) ; function hideOutput ( ) { dom . removeCssClass ( this . output , "cptFocusPopup" ) ; dom . removeCssClass ( this . hinter , "cptFocusPopup" ) ; } ; event . addListener ( input , "blur" , hideOutput . bind ( this ) ) ; hideOutput . call ( this ) ; }