Ext JS Spotlight: CodeSmith Tools

January 05, 2011 | Jay Robinson

What is CodeSmith Insight?

CodeSmith Insight is help desk software with advanced application integration. This means that CodeSmith Insight can handle your email and user feedback, as well as your application’s error and crash reports, all from a single convenient location. CodeSmith Insight is useful to anyone and everyone who builds software. It connects end users and applications directly to support technicians and developers alike. CodeSmith Insight can:

Manage your email with end users
Organize and prioritize all of your cases
Report your application errors to a central server
Stack duplicate exception reports

Inbox view showing new emails includes preview on bottom and auto similarity search on right.

“After researching all the available JavaScript frameworks, we quickly came to the conclusion that Ext JS was one of the most mature and definitely most feature complete frameworks.”
— CodeSmith

Why did you choose Ext JS? (Basic)

After researching all the available JavaScript frameworks, we quickly came to the conclusion that Ext JS was one of the most mature and definitely most feature complete frameworks. Its object orientation, complete UI model, and consistent use of best practices, all put it light years ahead of the competition. By using Ext JS, which adhered to a consistent and object oriented architecture, we were able to quickly and easily adapt our .NET developers to a new dynamic language environment with JavaScript. Our developers greatly appreciated the ability to use object inheritance, polymorphism, and a robust system of event handlers. Basically, Ext JS allowed us to use all of the best practices and patterns that our strongly typed .NET environment includes and JavaScript environments usually don’t. The ability to traverse the .NET-to-JavaScript learning curve so fast was invaluable and greatly decreased our development costs. While it is impossible to produce exact numbers, we can say with certainty that Ext JS reduced our UI development costs not by weeks or months, but by complete orders of magnitude.

Why did you choose Ext JS? (Advanced)

The administrator panels in CodeSmith Insight are a great example of how Ext JS helped us achieve our goals. With most web applications we had worked on before, JavaScript was used to merely enhance the existing HTML on the page, and this was mostly accomplished by authoring small method calls and other minor pieces of JavaScript here and there. When making a full web 2.0 application, this is not the case. We used the Ext JS framework to create nearly every element on the page, and this is achieved by using a well-structured project, consisting of classes with individual files, object inheritance, and complex design patterns. For example, when creating our administrator panels, we very quickly came to the conclusion that most of those panels were going to essentially be doing CRUD (create, read, update, delete) operations, and that the necessary grids and windows could share much of the same functionality. Using Ext JS allowed us to create base classes for our entity editors, which for the most part consisted of a grid and a window. Once those abstract classes had been created, we could then add additional entity editors to our admin panels by merely implementing a pair of new classes that extended (inherited) those base classes. In many cases, this required as few as two new methods for each new editor.

An example of our administrator panels using abstract classes and polymorphism.

Additionally, we were then able to register our administrator panels with a static AdminPanelManager by type. That manager then used polymorphism to treat each new admin panel as the same base type, and then construct and display them accordingly. This means that when we want to add or remove an admin panel, the code changes are encapsulated solely by that panel’s code file. These are all examples of goals that we could not have accomplished as easily with an alternative framework, such as jQuery.

The tree panel on the left is dynamically generated from the registration of admin panel types prior to rendering.

What makes CodeSmith Insight unique?

CodeSmith Insight has many features that make it unique such as duplicate error stacking, the ability to treat errors like emails, offline application support for both logging and feedback, but one of our best features is our advanced UI that offers a rich email client. We used the Ext JS component model to create complex windows and forms for sending email. Our email window allows the user to hide and show fields (such as cc, bcc, and attachments) dynamically. We were also able to integrate TinyMCE, a third party rich text editor, into our component model very easily.

Insight Email Window with rich text editor.

Another unique feature of CodeSmith Insight is our use of Ext JS History to control tabs. Because all tabs have a unique history, users can share what they are viewing with other users simply by sending them a URL. This also allows users to navigate through their tabs using the browser back and forward buttons.

Insight uses Ext JS History to control its tabbed navigation.

Final Thoughts

We know that email, user feedback, and crash reports are just various forms of communication, and that they all belong together. CodeSmith Insight is here to aggregate all communication; it is a brand new cutting edge service that allows you to focus your efforts directly on what your users are experiencing, regardless of how they are saying it. Best of all, it’s free to get started.

There are 6 responses. Add yours.

Jonathan

2 years ago

Great looking GUI!

AwesomeBob

Sweet. I knew it was a matter of time before I saw a well built support tool built with ExtJS 3.x

Jeremy

Is this open source? Just checked the source and it’s compressed & obfuscated.

Source would be good - especially the email client bit.

Tom

I’m glad so many people like the UI. We worked hard on it, but ExtJS allowed us to do things that I couldn’t imaging trying with other frameworks.

Jeremy,

CodeSmith Insight is not an open source product, it is a cloud service. However I should point out that it offers a (feature complete) free plan…so the next best thing.
If you are referring to the client side JavaScript email client we’d be more than happy to talk to you about it and possibly even open source some select components. Just head on over to our forums and start a discussion!

Alex

This is a wonderful looking product. I’m going to recommend we sign up and give it a spin. Great work!

Ralph

Great inspiration here, along with a nicely organized foundation. I like seeing others build vast applications like this, it certainly does “wow” the community. Great Job!

Comments are Gravatar enabled. Your email address will not be shown.

Commenting is not available in this channel entry.

Blog