Using Spket IDE for ExtJS development

[Eric Suen]

Spket IDE is powerful toolkit for JavaScript and XML development, version 1.5.11 add ExtJS support.

The flash demo show you how to setup Spket IDE for ExtJS development:
http://www.spket.com/demos/extjs.html

Currently it support Ext 1.1 Stand-alone(Ext Base + Everything target defined in ext.jsb)

Please visit http://www.spket.com/ for more information...

[mystix]

ooh.. nice one.

[jack.slocum]

I installed this into Aptana and the code completion is amazing. It even shows inherited properties and functions and where they came from. The comment folding is also a nice addition. Very nice work!

Can I make a couple of requests for a future version?
a) An option to "auto collapse" comments when a file is opened would be huge. Some of the Ext files have 1000 lines of comments and 100 lines of code. Intellij does this and it's one of the reasons I use it currently.

b) The only other missing feature I "need" is an Outline view that parses object literals. Most Ext files (like Component.js) have tons of functions defined with Ext.extend and scrolling to find them is impossible. Intellij is the only IDE I have found that parses object literals (and variables) as functions when defined in reverse (e.g. var foo = function(){... or in an object literal), although it isn't perfect (it doesn't understand Ext.extend).

Those things aside, this is really spectacular. Can someone who knows Wiki please add it into the Learn section?

[rarerules]

Very nice!!! Could be a big help.

One question: does this also work with Ext 1.0?

[efege]

Those things aside, this is really spectacular. Can someone who knows Wiki please add it into the Learn section?

Done. I added a new sub-section to the Resources section of the Manual:

http://extjs.com/learn/Manual:Resources#IDEs

Please, those interested and with knowledge of IDEs (not my case), make the list grow and also write some useful introduction and descriptions

[jack.slocum]

It's pretty easy to try it out and see. It worked fine with 2.0!

[aconran]

Very cool! Great work

[Eric Suen]

Very nice!!! Could be a big help.

One question: does this also work with Ext 1.0?

It require ext.jsb has two target "Ext Base" + "Everything", seems "Ext Base" was added since Ext 1.1, but you can do some hack, just create a "Ext Base" target, and add files to that target, should works...

[Eric Suen]

a) An option to "auto collapse" comments when a file is opened would be huge. Some of the Ext files have 1000 lines of comments and 100 lines of code. Intellij does this and it's one of the reasons I use it currently.

This one is very easy, we will add this feature in next version.

b) The only other missing feature I "need" is an Outline view that parses object literals. Most Ext files (like Component.js) have tons of functions defined with Ext.extend and scrolling to find them is impossible. Intellij is the only IDE I have found that parses object literals (and variables) as functions when defined in reverse (e.g. var foo = function(){... or in an object literal), although it isn't perfect (it doesn't understand Ext.extend).

Seems this works for me, maybe we are not talking the same thing, see the attachment

[jack.slocum]

Seems this works for me, maybe we are not talking the same thing, see the attachment

A good example file would be Component.js in Ext. There are two types of definitions in this file. The "singleton style":

Ext.ComponentMgr = function(){
    ...
    return {
        register : function(c){
            all.add(c);
        },
        ... (more functions)...

The other is the standard Ext style class declaration:

Ext.Component = function(config){
    ...
};

Ext.extend(Ext.Component, Ext.util.Observable, {
    ...(functions here)...
});

I understand that parsing these out and associating them to the correct class would be pretty difficult. For me (and maybe others), it doesn't matter if they are associated with the correct class, just that they appear in the outline somewhere.

Here's some screenshots that I think will better explain what I mean:

Spket:



Aptana: (empty too)



IntelliJ: (picks up the functions but can't figure out the class name)



Even though IntelliJ doesn't give the classes proper names, in large files having the function name in the outline is better than nothing.

Thanks for taking the time to listen to feedback. I look forward to the collapsing comments.