Управление компоновкой JavaScript для приложения MVC / Backbone.js? - PullRequest
Новая
       16

Управление компоновкой JavaScript для приложения MVC / Backbone.js?

2 голосов
/ 31 мая 2011

Мое веб-приложение, написанное на Backbone.js, содержит несколько режимов.Каждый режим описывает, какие модели и виды активны в данный момент.Изменяя параметр mode в хэше (#), я переключаюсь между режимами и создаю экземпляры необходимых базовых моделей и представлений.

Кажется логичным также описать предпочтительный макет и внедрить html-код контейнера на уровне режима.

Допустим, в режиме «PopulationPyramidMode» есть модель и 3 представления Backbone.«HeaderView» должен занимать 30 пикселей по вертикали.«SidebarView» должен занимать 200 пикселей по горизонтали, а «CanvasView» должен заполнять влажность экрана и масштабироваться при событиях изменения размера.

Чтобы еще больше усложнить ситуацию, CanvasView содержит визуализацию, которую необходимо повторно визуализировать визменить размер, то есть x / y-шкалы должны быть пересчитаны.

Итак, каков наилучший подход к этому?

1) Где должна быть логика расположенияgo?
- В отдельном layoutManager - и в таком случае как?
- Должно ли каждое представление описывать свой предпочтительный размер и т. д.?

2) Как добавить необходимый HTML / CSS для моих макетови переключаться между ними?

<!-- Layout 1 -->
<div id="header"></div>
<div id="sidebar"></div>
<div id="canvas"></div>

<!-- Layout 2 -->
<div id="header"></div>
<div id="canvas"></div>

Спасибо за любые конкретные советы, а также за макеты JavaScript в целом!

Ответы [ 2 ]

0 голосов
/ 18 июня 2011

Мое мнение относительно создания таких приложений было бы использовать прямую модель наблюдателя. Разработайте свой контроллер таким образом, чтобы он просто отправлял определенные события при изменении хэштега. Имейте карту событий в контроллере, которая действует как справочная таблица между событиями, которые должны быть отправлены, и URL-адресами, а еще лучше, вы можете следовать определенному соглашению относительно выбора частей хеша, например. Каждый раз, когда пользователь переходит на URL mydomain.com/#part1/part2, контроллер отправляет событие evt_part1_part2. Вы можете использовать общую точку отправки (которая может быть элементом dom или объектом javascript, особенно используемым для этой цели).

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

0 голосов
/ 01 июня 2011

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

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

...