Where can I find an editor/IDE with the ability to display a JavaScript code explorer? There are many editors which display that for PHP files, some of them for JS as well, but so far I haven't found one which displays the class structure of the JS file. I tried parsing the "prototype" framework with PSPad, but unfortunately it doesn't display it correctly. It handles all the functions, but I want them to be shown structured in classes, like they are.
The tree should look something like this for example (code of prototype):
- Prototype
* Version
- Browser
* IE
* Opera
* WebKit
* Gecko
* MobileSafari
+ BrowserFeatures (and it's children)
+ .. etc etc
For the following code:
var Prototype = {
Version: '1.6.0.3',
Browser: {
IE: !!(window.attachEvent &&
navigator.userAgent.indexOf('Opera') === -1),
Opera: navigator.userAgent.indexOf('Opera') > -1,
WebKit: navigator.userAgent.indexOf('AppleWebKit/') > -1,
Gecko: navigator.userAgent.indexOf('Gecko') > -1 &&
navigator.userAgent.indexOf('KHTML') === -1,
MobileSafari: !!navigator.userAgent.match(/Apple.*Mobile.*Safari/)
},
BrowserFeatures: {
XPath: !!document.evaluate,
SelectorsAPI: !!document.querySelector,
ElementExtensions: !!window.HTMLElement,
SpecificElementExtensions:
document.createElement('div')['__proto__'] &&
document.createElement('div')['__proto__'] !==
document.createElement('form')['__proto__']
},
ScriptFragment: '<script[^>]*>([\\S\\s]*?)<\/script>',
JSONFilter: /^\/\*-secure-([\s\S]*)\*\/\s*$/,
emptyFunction: function() { },
K: function(x) { return x }
};