Sencha folks have been working on an awesome new tool. It's called fiddle.sencha.com:
If you're familiar with jsfiddle.net, it's essentially the same concept, but targeted at ExtJS and Sencha Touch, with some tasty features thrown in, i.e. performance analysis:
Even though it's in beta, I've been using it for sometime now without much issue. Fiddle away!
I've enjoyed the 4.2 ExtJS release since it came out; especially the new theme and grids. I recently wanted to "puff in" a Panel for some eyecandy, but I quickly realized it's a bit trickier than you might think.
Components don't have slideOut or fadeIn methods like Elements do.
It's not a problem in case of "hiding" actions (i.e. slideOut or puff), which you can accomplish by something like component.getEl().slideOut().
However, in the case where you want to "show" a hidden panel (i.e. slideIn), in a case of deferred rendering (i.e. when creating and showing a new panel on the fly), the getEl() doesn't have a DOM element to show yet, until the panel has been rendered.
The fadeIn method is achieved by showing a panel with CSS opacity 0% and then animating it back to 100%.
I ended up solving this via means of a plugin. Can you think of a more elegant solution?
I tried it for myself - it's a pretty standard Eclipse plugin install:
There's an Eclipse tutorial for how to setup a project; it took me about 5 minutes. I got stuck in a few spots, but figured it out. I plugged in a basic Fieldset extension and look at the depth of auto-complete - it recognizes ExtJS object hierarchy in great depth:
There's also Eclipse help covering the great range of features. Overall, I was very impressed.
I use Notepad++, but this just might sway me to use Eclipse. Although, the $995 for the cheapest bundle option, is rather stingy. I really wish Sencha would offer this as a stand-alone product.
In my previous post I presented an example of a basic ASP.NET MVC3 controller connecting to an ExtJS4 data store and passing some data in XML format via store's load method.
So far I've run into just one issue with this setup - clean error handling. By default, ASP.NET MVC will spit out any exceptions in clear text (with <html> tags and everything), which is not very useful when building a quality web application. Here's what I want on my errors:
Here's an easy way to break zoom in and out capability in IE7+ in your ExtJS4 application:
There's a <meta> tag (the ones that go into <head>) that was recommended to me for the sake of reducing IE testing efforts:
<meta http-equiv="X-UA-Compatible" content="IE=8"/>
The idea here is it forces many IEs to act all in IE8 mode, so you can basically do quick tests in just IE8 and still get a good test coverage. However, it took me some effort to figure out that this breaks re-sizing capability of a Viewport on zoom in IE.