Получать новости в rss

Новости ajaxed.ru

Последние комментарии

RSS

Поиск по сайту

MooTools 1.2 что нового ?
Рейтинг пользователей: / 0
ХудшийЛучший 
Архив - Старые записи сайта ajaxed.ru
Автор: Administrator   
25.11.2009 21:02

Все знают framework mootools, отличающийся особым качеством и минимализмом, в моем личном рейтинге, он стоит на третьем месте.
И вообще им пользуются такие проекты как: w3c, cnet, joomla, ubuntu и др.

Оф сайт http://mootools.net/
Что же новенького в вышедшей 1.2 beta 1 версии ?

1. Хэши

В прошлых версиях в ядро был интергрирован плагин Hash Class. Это новые возможности для JavaScript разработчиков.. Нафига он нужен и чем они лучше стандартной объектной модели JS ?
Взглянем на синтаксис:


var hash = new Hash({ 'a': 'one', 'b': 'two', 'c': 'three', 'd': 'four'});
hash.get('a'); //"one"
hash.set('e', 'five'); //hash.e теперь 'five'
hash.set('c', 'new value'); //hash.c теперь 'new value'
hash.f = 'another value here'; //аналогично
hash.has('b') //true
hash.each(function(value, key){ alert(key + ':' + value); }); //alerts a:one, b:two, и т.п..
hash.get('each'); //null

Достоинство хэшей Mootools в том что к ним можно применять map, every, some и filter методы. Ну типа, как только вы попробуете, вас будет уже не оттащщить за уши. Кстати древний Abstract - ушел танцевать, для знатоков. Переход с Abstract на Hash - очень прост, заменить слова и все.

Без разницы к чему вы применяете новые методы, к Hash или к стандартным объектам. Гляньте-ка


var obj = { 'a': 'one', 'b': 'two', 'c': 'three', 'd': 'four'};
Hash.each(obj, function(value, key){ alert(key + ':' + value); }); //покажет a:one, b:two, и т.п..
Hash.filter(obj, function(value, key){ return key.test(/a|c/); }); //вернет хэш с { 'a': 'one', 'c': 'three' }
Hash.getKeys(obj); //вернет ['a', 'b', 'c', 'd']

2. Эффекты. Еще круче..

Не поверите, но jquery и Prototype танцуют. Mootools - всегда радовал качественными эффектами. И опять в новой версии были изменены имена,а старые ПОКА поддержаны.
Если раньше аффтор писал, что Fx.Morph и Fx.Styles одно и то же, то теперь скрывать нету смысла, ведь новые возможности теперь налицо. Дело в том что авторы научились очень просто парсить CSS и теперь описывая эффекты можно применять синтаксис CSS, это очень юзабильно..

Пример в студию:


var myMorph = new Fx.Morph('myElement', { 'duration': 1000 });
// myElement переходит в text color: red, ширину в 200px, и line-height в 20px
myMorph.start({ 'color': '#c03', 'width': 200, 'line-height': 20 });
//вот где танцуют другие: myElement переходит к свойствам определенным в .warning правилах определенных в моем CSS
myMorph.start('.warning');
// еще один забавный морф с примерением крутого парсера Mootools
myMorph.start('#content p.information');

Забавно то что на автомате могут переходить все параметры, ширина, высота, цвета, это удивительно ! А для таких параметров которые не могут изменяться последовательно, параметры меняются мгновенно перед началом трансформации.
Вообщем надо видеть.

Глянем еще на примеры с фосайта:

myMorph.start({ 'background-position': '400px 20px' });
myMorph.start({ 'background-position': '400 20' });
myMorph.start({ 'clip': ['0px 500px 500px 0px', [130, 410, 220, 130]] });
myMorph.start({ 'border-width': '4px 10px 16px' });
myMorph.start({ 'border': '5px solid #f03', 'border-bottom-color': '#ccc', 'background-color': '#fee', 'color': '#f03', 'width': 200, 'height': '300px', margin:[10, 20], 'opacity': 0.6 });

и другое..
Есть еще кое что, но надеюсь рассказать об этом в другой раз

Автор: admin | 19.11.2007

 

Добавить комментарий


Защитный код
Обновить