Tutorial - Sencha Touch & ExtJS Code Completion for Aptana & Eclipse

Prerequisites:
Aptana or Eclipse installed
Sencha Touch SDK downloaded and extracted


Quick Installation Guide:

1. Install Spket IDE Plugin
1. Start Aptana/Eclipse
2. Go to Help => Install New Software...
3. Add new Software Site
• Name: Spket IDE
• Location: http://www.agpad.com/update/
4. Install all Packages from the new Software Site
2. Configure Spket IDE Plugin 
1. Open Aptana/Eclipse Preferences
2. Go to Spket => JavaScript Profiles
1. Click "New..."
• Name: SenchaTouch
2. Select new Profile (SenchaTouch)
1. Click "Default"
2. Click Add Library
• Library: ExtJS
3. Select "ExtJS" => Click "Add File"
• Find the "touch.jsb3" File in the root Directory of the Sencha Touch SDK and click ok
4. Expand the newly added jsb3 file
• Select all available options: e.g: Classes, DOM, Manifest
3. Restart Aptana/Eclipse
3. Test the Code Completion
1. Open a javascript file => type "Ext.a" and press "ctrl+space"

Detailed Installation Guide:

• Install the Spket IDE Eclipse Plugin

1. Start Aptana/Eclipse
2. Go to Help
3. Select Install New Software...
4. Click Add...
5. Insert the following data in the popup window
• Name: Spket IDE
• Location: http://www.agpad.com/update/
6. 
7. Click Ok 
8. Select all the packages under Spket IDE
9. Click Next => Next =>
10. Accept the License Agreement 
11. Click Finish
12. After the installation has finished => Click Restart Now

• Configure the Spket IDE Plugin

1. Open the Preferences (Mac OSX: Aptana Studio 3 => Preferences)
2. Go to Spket => JavaScript Profiles
3. Click New...
• Name: SenchaTouch
4. 
5. Select new newly created Profile: SenchaTouch
6. Click Default (to make it the default profile for all projects)
7. Click Add Library
• Library: ExtJS
• 
8. Select the newly create Library: ExtJS
9. Click AddFile
• Go to your Sencha Touch SDK Folder and select the "touch.jsb3" file in the root directory (of the sdk)
10. Expand the newly added jsb3 file
11. Select all available options
12. Click Ok
13. Restart Aptana

• Test the Code Completion

1. Open a javascript file
2. Press "ctrl + space" for code completion
• Example:

Note: The Code Completion only works for the "Spket JavaScript Editor", which should be the default javascript editor after the installation of the Spket Plugin.

You can check/edit the default javascript editor at:

Preferences => General => Editors => File Associations => and search for "*.js"

"Spket JavaScript Editor" should be marked as default: