ExtJs 5: на смену четвёрке

ExtJs пятой версии прошла стадию бета-тестирования и теперь доступна всем для скачивания в качестве готового продукта:

http://www.sencha.com/products/extjs/

Бесплатная версия доступна здесь:

http://www.sencha.com/products/extjs/details

Почему контроллеры нужно указывать все и сразу

 Натолкнулся на форуме javascript.ru на вопрос о том, не лучше ли подгружать контроллеры постепенно. Раньше я пробовал создавать несколько экземпляров контроллеров и подгружать их по мере необходимости. Тогда у меня сложилось такое представление.

Сначала приложение выполняет все методы init() во всех контроллерах, чтобы составить список соответствий селектор-обработчик. Затем приложение рисует панели в DOM, попутно навешивая на создаваемые элементы имеющиеся обработчики событий.

Демо 1

В примере, приведённом по ссылке выше, на каждом этапе запуска приложения появляется информационное окно. Становится очевидной последовательность шагов загрузки приложения:
1. Запускаются методы init() в контроллерах
2. Отрисовывается главный контейнер Viewport с прочими виджетами внутри него

Версии ExtJs 4.0.7 при попытке создать и иницализировать контроллер вне  этой схемы появляется сообщение об ошибке.

В версии ExtJs 4.2.0 такого ограничения уже не наблюдается.

Демо 2

ExtJs 5: документация

Появилась первая официальная информация о пятой версии ExtJs на сайте компании-разработчика.

Документация
Запись в блоге со ссылкой на код бета-версии

Где правильнее размещать стили

Стили CSS правильнее всего размещать в отдельных файлах. Внутри тех компонентов вашего приложения, которые нужно оформить при помощи CSS, укажите имя класса через свойство cls. Запустите в терминале из директории вашего приложения sencha app watch. Теперь при создании и изменении файлов SCSS, будет на лету меняться внешний вид вашего приложения (с задержкой в 1-2 секунды). Куда помещать файлы, чтобы они подтягивались автоматически, показано на скриншоте:

ExtJs 5: люди делятся на две категории

Рад сообщить, что следующая версия всеми нами любимого фрейнворка должна появится уже совсм скоро. В интернете уже началось обсуждение нововведений. В частности, для каждого экземпляра view можно создавать отдельный экземпляр controller. Многим этой возможности нехватало. По идее, это позволяет хранить в свойствах контроллера состояние виджета.

Больше нет необходимости писать в контроллеры рефы, а затем повторять те же строчки внутри метода init, чтобы назначить обработчики событий. Имя метода-обработчика можно указывать приямо во view. Для привяки контроллера, view получило дополнительное свойство - controller.

Ext 5 View Controller Event Listening
Мда, у кого-то уже есть, а у кого-то ещё нет...

Виртуалка для занятий

Создавал в Oracle Virtual Box 3.2 (программа бесплатная). В последней версии 4.3 тоже открывается без проблем.
 

КОНФИГУРАЦИЯ

Linux Ubuntu 12.04 LTC 32bit

JRE 1.7.0_51
Apache 2.2.22
MySQL 5.5.35
PHP 5.3.10
PhpMyAdmin 3.4.10

FireFox 27.0.1
FireBug 1.12.7

Ruby 2.0.0
SenchaCmd 4.0.2
ExtJs 4.2.1

NetBeans 7.4

Демо-проект School.


скачать снэпшот
скачать с Яндекса

После установки Oracle Virtual Box в папке VirtualBox VMs, предназначенной для хранения снапшотов, создать подпапку extjs_clone. Поместить в неё оба скачанных файла extjs_clone.vbox и extjs_clone.vdi. Два раза щёлкнуть по extjs_clone.vbox (в Windows), чтобы виртуалка появилась в списке VirtualBox.

extjs_clone

     extjs_clone.vbox

     extjs_clone.vdi

Пользователь: u
Пароль: u

localhost

localhost/phpmyadmin
Username: root
Password: u

Видео-словарь

Сделал в праздники такой онлайн-словарик. Можно ввести русское или английское слово и посмотреть контексты его применения. Интересный момент - оптимизация одностраничного веб-приложения под поисковики. Оказалось, есть такой механизм. Он поддерживается как Google, так и Яндексом. Увидел на привычную документацию Экста в новом свете. Через призму параметра _escaped_fragment_, так сказать. Поглядим теперь, какие боты нас посетят...

Ссылками на клипы или слова можно делиться. Вот, например:

http://vangraph.info/client/#!280f6bbefec560f1b224c10fd59f9c83