Editor: Integrate tern-threejs in script editor

[zz85]

• relates to Editor: Implement tern-threejs in script editor. #6585

Some notes:

• uses tern-threejs module js
• uses auto-complete as you type behaviour
• does not automatically autocomplete single matches
• uses insensitive autocomplete matching in tern (Related PR)
• since acorn loose parser is being used, esprima parser could be removed to reduce number of libs..
• not including tern definitions for browser dom and ecma5 to reduce suggestions for now

ping @mrdoob @tylerwbell

[mrdoob]

Epic! Many thanks! 😊

[mrdoob]

Is there a way to auto-complete this?

[zz85]

@mrdoob what would this refer to here? If there're properties that ternjs pick up within the scope, then it should auto-complete. If this refers to some javascript or dom functions then the ecma5 or browser ternjs definitions could be added to auto complete them. (for example, if you use this. at the global scope vs inside Vector function gives different auto-complete results http://zz85.github.io/campjs-livecode/)

[zz85]

hmm... it seems like this refers to the object that script is used on. I think it's possible to tell ternjs what scope this is in, but I need to play around with it's api a little first...

http://ternjs.net/doc/manual.html

[angelozerr]

@zz85 @mrdoob I think you should create your issue at https://github.com/tylerwbell/tern-threejs

In my case, I follow this project and I could help you if I know how to fix teh issue and if I find time.

[zz85]

@angelozerr thanks for suggesting but I do not think it's an issue with tern-threejs project, because auto-completing this in the script editor has a different use case, since it's code is being evaluated at run time and bind to the object (in app.js)

var functions = ( new Function( 'player, scene, keydown, keyup, mousedown, mouseup, mousemove, touchstart, touchend, touchmove, update', script.source + '\nreturn { keydown: keydown, keyup: keyup, mousedown: mousedown, mouseup: mouseup, mousemove: mousemove, touchstart: touchstart, touchend: touchend, touchmove: touchmove, update: update };' ).bind( object ) )( this, scene );

so I would say it's rather specific here to how three.js script can request ternjs to analyze with a different scope..

[zz85]

I don't have enough brain cycles to be able to wrap my mind around all of ternjs internals right now, but I'm guessing it might be possible to invoke a 'speculative this' in ternjs inference (related issue)

I would be tempted to just use an easier implementation (like using get-hint and javascript-hint to add simple tokens for autocomplete) but if ternjs can be integrated it would give more contextual and accurate autocoplete.

[zz85]

one quick workaround would be to prepend update.prototype = new THREE.Mesh;. then add some hacks to codemirror-ternjs plugin to adjust for line offsets if we are injecting the link invisibly into the editor...

[mrdoob]

I guess prepending this = new THREE.Mesh() doesn't work? 😶

[angelozerr]

IMHO, I think the best mean to manage this case is to do like node.js tern plugin by creating a scope for each script. See https://github.com/marijnh/tern/blob/master/plugin/node.js#L31

When scope is created you could register this and update function by injecting the well event instance. So you will benefit with event compeltion too.

@zz85 perhaps you could integrate tern-lint to validate with semantic mean (and not syntax) the script. See https://github.com/angelozerr/tern-lint

[zz85]

@angelozerr that's a cool project! I should try it out sometime.

@mrdoob nope. that would be pretty invalid javascript. if you would really want this to happen, I think I can ask about this in https://groups.google.com/forum/?fromgroups#!forum/tern-dev

[mrdoob]

Is there any way to automate this tern-threejs stuff? I suspect is pretty outdated at the moment, and we keep fixing it by hand...