Pilot: многофункциональный JavaScript роутер

[Davert]

Да, прикольно. Спасибо за либу! Попробую по возможности.
Кстати, хотел узнать: будет ли документация на английском?
Я тут недавно апрувил вашу либу на Jster.net, и было б неплохо, чтобы не только русскоязычные пользователи могли ею воспользоваться.

[RubaXa]

В процессе.

[termi]

Мне не понравилось, что тянутся некоторые зависимости. Я понимаю, что jQuery тянется для Deferred и селекторов, но всё равно, роутер получился слишком перегруженным. Да и реализация View в роутере, мне кажется, весьма сомнительные плюсы даёт.

[RubaXa]

Есть такое. В планах была идея отказа от jQuery, но большинство задач так и или иначе связанны с использование его, поэтому решил обождать. Также Pilot.View можно использовать как замену Backbone.View, который в свою очередь завязан на jQuery. Возможно в дальнейшем появиться «чистая» сборка.

[javascript]

А чем это отличается от Backbone.js?

[RubaXa]

Backbone — MVC фреймворк
Pilot — только роутер с расширенными возможностями.

Правильно сравнивать Backbone.Router и Pilot. Тут основное отличие в том, что обработчик маршрута не просто получает какие-то параметры, а знает, что именно произошло (события: routestart, routechange, routeend), а также работает непосредственно с объектом "запроса". И только малая часть, посмотрите документацию (например метод go или loadData), не пожелеете :]

[maxatwork]

А чем это решение лучше director'a?

События (on, before, after, once) есть, есть и так называемые scopes (обработчики для сегмента пути, например, для /profile/common и /profile/contacts назначить один общий обработчик для profile, и отдельные для common и contacts), обработка «404», поддержка хеша и history api, никаких зависимостей, работа на сервере и клиенте, и прочее, и прочее.

Из отсутствующих вещей я на вскидку вижу только «переключение адреса до разрешения некоего deferred», но это, на самом деле, спорная фича: если ссылка поменяется сразу, то выполняемое действие можно, например, отменить нажатием кнопки «назад», а так этой возможности нет.

[RubaXa]

Смотрел director перед тем, как начать что-то делать. Он почти подходил, но как и другие решения работает не с запросом, а только параметрами. + в нем есть расширение прототипа для Array, а это сужало возможность использования либы. Также не решен вопрос маршрутизации по id маршрута и нет групп.

По поводу «back» не понял, можно поподробнее?

[maxatwork]

Не совсем понял «работает не с запросом, а только параметрами».

По поводу «back» не понял, можно поподробнее?

Если я правильно понял идею loadData:

0. пользователь переходит на некий адрес в нашем приложении с about:blank
1. пользователь вызывает некое действие, вызывающее смену маршрута
2. роутер вызывает loadData, которая возвращает deferred
3. роутер ждет разрешения deferred
4. роутер меняет адресную строку и вызывает onRoute.

Если я прав на счет №№3 и 4, то при нажатии back на шаге 3 произойдет переход на about:blank.

[RubaXa]

Не совсем понял «работает не с запросом, а только параметрами».

В director и подобных, обработчик маршрута получает только параметры описанные в паттерне:

router.on('/books/view/:bookId', function (bookId){ /*...*/ })

также не понятно, как в этом случае получить GET-параметры?

Pilot передает объект запроса:

pilot.route('/books/view/:bookId', function (evt, req){ 
    var path = req.path;
    var query = req.query; // GET-параметры
    var bookId = req.params.bookId;
    /* и т.д. */
})

Если я правильно понял идею loadData:

Да, вы правы, сейчас это так.
Каюсь, забыл добавить второй режим, который позволяет менять url сразу (#1).

P.S. В этом есть свои + и -, например gmail работает именно по такой схеме.

[zandroid]

И именно такую схему (как сейчас реализована) я бы считал дефолтной, а предложенную выше — опциональной.

[maxatwork]

Думаю, поведение навигации в браузере не должно отличаться для «обычных» приложений и одностраничных — просто из соображений удобства для пользователя, т. к. в таком случае не надо думать, а как себя поведет навигация сейчас. По умолчанию, браузер при переходе по ссылке меняет урл сразу, не дожидаясь загрузки данных, соответственно, поведение роутера (по крайней мере, по умолчанию) должно быть таким же.

[zandroid]

Браузер меняет урл сразу после получения ответа от сервера (или его не получении), но не сразу после клика по ссылке. Пока ответ от сервера ожидается — урл старый остаётся.

[zandroid]

Решил попробовать вашу разработку, возник такой вопрос, как можно пометить несколько роутов какой-то категорией, а потом её прочитать в обработчике. Поясню на примере:
* есть блок навигации, где представлены только страницы верхнего уровня: Dashboard, Articles, Users
* при этом самих страниц больше: /dashboard, /articles/list/:page?, /articles/edit/:id?, /users/list/:page?, /users/edit/:id?, /users/roles
И вот задача, пометить список роутов категориями, чтобы подсвечивать нужный пунк в болке навигации. Т.е. в коде, я бы это хотел видеть, например, так:

Кусок кода

app.nav = Pilot.View.extend({
    onRoute: function(e, req) {
        this.$('.active').removeClass('active');
        this.$('.cat-', req.route.options.cat).addClass('active');
    }
});
// ... объявление прочих Views
app.router = new Pilot()
    .route('*', App.nav)
    .route('usersList', '/users/list/:page?', App.usersList, { cat: 'users' })
    .route('editUser', '/users/edit/:id?', App.editUser, { cat: 'users' })
    .route('articlesList', '/articles/list/:page?', App.articlesList, { cat: 'articles' });

[RubaXa]

Идею понял, но пока в голове нет картины как это осуществить, т.к. на один маршрут может быть N-ое количество контроллеров, либо сделать так:

Пример

app.nav = Pilot.View.extend({
    onRoute: function(e, req) {
        this.$('.active').removeClass('active');
        this.$('.cat-', req.params.cat).addClass('active');
    }
});

app.router = new Pilot
   .route('/:cat(users|articles)/*', app.nav)
;

[zandroid]

Хм..., предложенный вариант мне подходит, но не подойдёт для общего случая. Про N контроллеров я потом уже и сам понял, и что это и мешает как раз, даже писал комментарий, но то ли отправить его забыл, то ли потерялся он где-то по дороге до хабра. Это, кстати, довольно не стандартно для моего восприятия маршрутов. Я привык, что срабатывает первый подошедший маршрут и все последующие шаблоны отбразываются (опыт работы есть только с серверными реализациями).
В любом случае, спасибо, за ответ и за либу.

А не планируется ли какого-нибудь описания для начинающих, а то для того, кто не имел опыта с подобными вещами в JS-apps, явно не хватает ни этой статьи, ни довольно кратких доков.

[RubaXa]

По поводу множественных контролером.
Это делалось специально, т.к. страница может стоять из «блоков», есть спец. параметр singleton для удобства. Например вот такая задача:

app.router
   .route('settings', '/:page/settings', app.layer.settings)
   .route('page', '/:page/*', app.page);
;

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