Пример создания универсального popup виджета (тултипа) на примере раскрытия текста в dojox.grid.

Оригинал – ignar.name Dojo text slicer – тултип виджет на dojo

Test Driven программирование, общие вопросы и технология.
Инструменты и примеры на php, python, perl, java, ruby, javascript, C/C++

Оригинал: ignar.name – Test Driven Development Tutorial – Presentation Transcri

Презентация с 8мой Международной конференции эффективных разработок на PHP.

Создание динамических интерфейсов и AJAX- приложений промышленного класса с помощью Dojo Toolkit и Zend Framework Автор: Георгий Туревич, Wizartech

Оригинал: ignar.name – Rich UI on Dojo Toolkit and Zend Framework

Добрый день

Хочу привести пример переопределения dojox.grid, с целью создания своего, готового к использованию класса.

А так же показать механизм создания виджетов внутри дата-таблицы.

Начиная с версии Dojo Toolkit 1.4 виджет dojox.grid достаточно сильно изменен, он больше не совместим с предыдущими версиями.

Теперь есть возможность создавать вложенные гриды и мультисортировку.

Ниже следует небольшой пример, который хорошо раскрывает новые возможности.

Оригинал – Dojo Toolkit – dojox.grid

С самого начала, несколько слов о Dojo Toolkit. Предисловие. Dojo для начинающих или сомневающихся.

Это современный, хорошо поддерживаемый JavaScript фреймворк, который имеет в своем арсенале, помимо базовых возможностей управление содержимым страницы и XHR (ajax) запросов, качественный User Interface с тремя темами и хорошим набором плагинов и расширений.

UI в dojo гораздо богаче, чем в jQuery, но при этом и тяжелее, в нем есть поддержка интернационализации и локализации, чего в jQuery нет.

Оригинал – Dojo Toolkit. Шаг 1. Старт.

Спешу сообщить, что мой адрес поменялся.

Если Вы нашли какую то мою запись интересной, проверьте может к ней есть продолжение или исправления.

Живой блог лучше чем мертвый.

Новая rss волна – ignar’s log

Мой твиттер остался неизменным – ignart

Мои контакты

Вот, собственно и вышел уже второй бета релиз любимого мною, и думаю не только мной, JavaScript фремворка Dojo Toolkit 1.4

В ядро, dojo, добавлены новые события io, возможность подписываться на базовые xhr события . Подробней сюда IO Pipeline Topics.

Обновлена базовая анимация - Dojo Base FX.

dojo.cache – добавлена новая, довольно интересная, возможность хешировать контент ассоциируемый с определенными модулями полученными из XMLHttp запроса.

dojo.contentHandlers - нововведение, предоставляющее возможность предопределять хендлеры для XMLHttp запросов. Раньше этот метод был закрытым «dojo._contentHandlers», а сейчас можно выгодно его использовать. Подробней сюда.

dojo.coord – метод запрещенный с версии 1.4, поскольку вносил путаницу из-за разных бордер моделей браузеров, вместо него следует использовать dojo.position.

Добавлены новые методы к dojo.NodeList-traverse и dojo.NodeList-manipulate

Обновлены топовые виджеты и layout’ы в dijit.

Изменена структура и lifecycle dijit._Templated добавлены удобства в dijit.WidgetSet и dijit.registry.

Так же, не глобальные изменения в dojox. Dojox вообще в этом релизе расширился и думаю, стал еще стабильней и богаче на функционал.

Перед обновлением, думаю стоит почитать релизноты, что бы в последствии не использовать запрещенные или измененные методы, хотя таких и не много.

Порадовал список багфиксов.

На меня релиз составил хорошее впечатления, на этой неделе планирую проверить проект на работоспособность под новой версией.

Презентация автора JavaScript библиотеки Raphaël – Дмитрия Барановски.

«HTML5 Canvas»

С развитием интернет технологий сложность фреймворков возрастает и компании ищут, не просто программиста, а специалиста узкого профиля владеющего инструментом разработки, а не низкоуровневыми функциями языка. Для хорошего специалиста уже не достаточно знать язык, он должны владеть инструментом.

Живой блог лучше чем мертвый.

Новая rss волна – ignar’s log

Мой твиттер остался неизменным – ignart

Мои контакты

Не будем затрагивать Flash, Flex, Silverlight и GWT, только фреймвоки на чистом JavaScript.

• Почему JavaScript?
• Почему jQuery?
• Почему Dojo Toolkit?
• Почему ExtJS?
• Ссылки на полезные ресурсы
  

Flash, Flex, Silverlight – хороши, но имеют ряд ограничений, которые порождают риски их использования:

• Приложения весят больше чем на JavaScript
  
• Они накладывают первоначальные ограничения запуска (должен быть установлен Adobe Flash Player или Microsoft Silverlight)
  
• Silverlight еще менее универсален, он не работает на Linux
  

Я не утверждаю, что они плохие, наоборот, разрабатывать на них легко, и если они запускаются, то работают в любом браузере одинаково. Это очень большое преимущество.

Мне импонирует .NET платформа, она дает наибольшую универсальность разработчику.

JavaScript

Не универсален, работает по-разному, сильно зависит от браузера, сам язык накладывает большие ограничения, но все, же хорош. Почему?

Давайте разбираться.

- Почему приложения на JS могут не работать?
- Если выключен js в браузере.

- Насколько часто можно столкнуться с выключенным js?
- Думаю, гораздо чаще может возникнуть ситуация с не установленным Silverlight или Adobe Player

- Не секрет, что каждый браузер считает своим долгом интерпретировать код по своему (особенно IE<7 версии)
- Я вижу только один выход – использовать фреймворки, которые дают необходимую универсальность и стабильность разработки

JavaScript Frameworks

Сейчас писать на чистом js будет только начинающий программист, которому надо разобраться. Маньяк, у которого фикс-идея или гений который, поработав с чужим, сделает свое.

На мой взгляд, наиболее удачным выбором готовых решений будут:

• jQuery
  
• Dojo Toolkit
  
• ExtJS
  

Я их привел в порядке увеличения возможностей.

Какие достойные фреймвоки я упустил?

• YUI – в чем то хорош, но не настолько гибок, что б составить конкуренцию Dojo. Компания Yahoo! однозначно привнесла большой вклад в развитие интернета, но это не самое лучшее, что они сделали.
  
• MooTools – на мой взгляд, единственное, что в нем хорошего это поддержка ООП, но ведь без этого можно и обойтись?
  
• Prototype – думаю, он умер, и о нем помнят только те, кто поддерживает на нем проект.
• qooxdoo – экзотичная штучка, последняя версия 0.8.3 на данный момент. Тут, наверно, лучше самому все увидеть
• Cappuccino Web Framework – очень редкий, но несомненно стоющий внимания. Фреймворк написан на новом языке Objective-J, по подобию Objective-C, на JavaScript. Направлен только на web приложения, в роли плюшки к сайту он не пойдет. Поддерживает все современные браузеры.

Вы не знаете с чего начать и шерстите форумы в поисках совета?

Вам нужен jQuery. Это достойная замена чистому js. С ним Вы получите результат с минимальными телодвижениями.

В подарок Вам будет большое комъюнити и гарантия в виде немереного количества плагинов.

Начинать советовал бы именно с него, самый простой для целей не связанных с порабощением мира. Поддерживает все современные браузеры. Идеален для состряпывания спецэфектов, валидации, сообщений и небольших приятностей на сайте, можно сказать все с коробочки.

Стоит также упомянуть, что у разработчиков jQuery существуют договоренности с Microsoft.

jQuery для Вас не новость, но хочется больше?

Следующим шагом на пути к идеалу я вижу Dojo Toolkit.

API Dojo Toolkit можно поделить на три отдельных библиотеки это базовые скрипты (Dojo Base, Dojo Core), Dijit – UI состовляющяя фреймворка, Dojox – библиотека расширений, плагины, которые работают, но не внесены в Core и Dijit.

Dojo Base, базовые скрипты кроссбраузерны и обладают широким функционалом. Перечислять можно долго, вот некоторые из них:

• Dojo events, гибка и удобная система событий
  
• Dojo IO, xhr (ajax) запросы, с поддержкой REST технологии
  
• Dojo Package System – удобнейшая система модулей и их загрузки, что уменьшает время загрузки страницы и время готовности приложения.
  
• Dojo OO Tools – объектно-ориентированные возможности фреймворка
  

В Dojo Core, так же входит в стандартный набор, но требует дозагрузки:

• хистори, куки, Drag-n-Drop, colors, Google Gears, локализация (l10n), интернационализация (i18n) и расширенные возможности манипуляции html нодами
  
• Отдельно стоит вынести систему виджетов и их парсинга – dojo.parser, про виджеты будет сказано ниже
  
• dojo.data – api для получения данных с сервера, хранения и доступа и манипуляции в локальных, клиентских базах данных
  

Dijit – юзер интерфес богаче, чем в jQuery, но не без минусов, разработчики гарантируют их 100% работу в современных браузерах, Opera по их мнению в список таковых не входит.

На своем опыте, с проблемой в Opera столкнулся только один раз – это было не правильное позиционирование dijit.Dialog, что можно было исправить, немного почитав документацию.

Насчет документации, в dojo она в своем большинстве на английском, русскоязычных примеров и статей не так уж и много, но кто захочет, тот найдет.

Вся система виджетов базируется на двух классах dijit._Widget и dijit._Temlated

Dijit идеально подходит для написания легковесных веб приложений с большой кастумизацией, в админках и юзер-фронтендах.

Для dijit есть три качественных набора css темплейтов.

В Dojox содержаться расширения к dojo core и dijit.

С своей стороны хотел бы выделить такие расширения как:

• dojox.dtl – шаблонизатор на основе Django Template Language, с идентичным ему синтаксисом и классом dojox.dtl._Templated, расширяя который можно создавать шаблонизируемые виджеты с большими возможностями, чем c dijit._Temlated
  
• dojox.collections – класс являющийся аналогом Java Collections фреймворка, конечно не с таким мощным функционалом
  
• dojox.grid – то, чего так не хватает jQuery – стандартного града. Этот виджет хорошо расширяем и достаточно функционален, что бы удовлетворить Ваши требования
  

Dojo Toolkit используется, как в продуктах IBM так и посторонних приложениях (список).

Качественная интеграция Dojo Toolkit реализована в Zend Framework.

От себя добавлю, dojo отличный фреймворк, не смотря на проблемы с документацией.

ExtJS – полноправно обладает титулом самого страшного монстра среди JavaScript фреймворков.

В начале своего развития писался на Yahoo UI. Сейчас может работать на трех адаптерах jQuery, YUI или на своем родном на Ваш выбор.

Идеально подходит для мощной админчасти или web приложения приближенного интерфейсом к полноценной программе.

Штука не из легких по осваиванию и весу. На форуме официального сайта можно найти ответы на все Ваши вопросы.

Основу ивентов составляет Observer класс, который наследуется Component классом, который в свою очередь составляет основу всех UI элементов фреймворка.

Ext.grid – мощнейший инструмент отображения информации.

Можно долго описывать все возможности, но лучше это все увидеть на странице примеров.

ExtJS распространяется под двойной лицензией: коммерчиской и opensource. Купить лицензию Вы можете за 329$

В свое время, изменение лицензии фреймворка наделал много шума, много компаний отказалось от его использования, и переписывали свои продукты и еще некоторое время опасаясь очередного изменения лицензии.

Сами владельцы ExtJS мотивируют это тем, что настал период когда, фреймворк достиг стабильности и далее не мог так же прогрессивно развиваться как opensource.

Внешние ресурсы:

• jQuery
• Dojo Toolkit, demo, Dojo Explorer, api, документация
  
• ExtJS, api, demo, Ext FAQ Grid
• Qooxdoo
• Cappuccion Web Framework
  
• Zend_Dojo: первые шаги
• Dojo Toolkit для начинающих

Подробней про Dojo Toolkit

• Разводим Dojo Toolkit на максимальную производительность
• Dojo Tips and Tricks
• Набор презентаций – только JavaScript
• Документация к Dojo
• Два примера создания data – таблицы на Dojo Toolkit и JQuery. Часть 1. Часть 2

Про ExtJS

• ExtJS Tree и Ext.utils.Observable

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

Дизайн:

• объемная статья с 50 ссылками, на тему CSS техники New CSS Techniques For Your Next Web Design
• 45 уроков создания web дизайна Step-by-Step Tutorials on Web Design with Photoshop
• 40 уроков векторной графики в Illustator и Photoshop 40+ Vector Characters Adobe Illustrator and Photoshop Tutorials
• CSS stylesheet для создания красивенького sitemap’a

Программирование:

• система слежения за оптимальностью Вашего кода и его анализ (плагин для Eclipse) В данный момент работает для Java и скоро для PHP (выйдет с бета версии) в интеграции с Zend
  • почитать про плагин (n)Wiring your code for success!
  • сам плагин Code Exploration: Developer Productivity Booster
• раздел сайта компании Yahoo! посвященный оптимизации пользовательской части
• 30 шпаргалок web программиста
• JavaScript MVC концепция от Alist Apart
• Еще одна статья посвященная JavaScript MVC, довольно давно написанная, но не потерявшая своей актуальности Alex@Net – Model-View-Controller (MVC) with JavaScript and Dojo Toolkit
• Ajax Magazine – Сайт посвященный Ajax и PHP

Не подшитые:

• Социальные паттерны The Designing Social Interfaces – аспекты создания социальных интерфейсов, мало картинок и на английском, но кому надо, тот поймет

Возможно, некоторые статьи Вы найдете не особо свежими, но тем неменее, они актуальны.