yandex-ui / noscript

Noscript: JavaScript MVC Framework for building SPA
http://yandex-ui.github.io/noscript/
MIT License
34 stars 22 forks source link

[ns.ViewCollection] Возможность указывать произвольный лайаут в качестве элемента коллекции #509

Closed Katochimoto closed 9 years ago

Katochimoto commented 9 years ago

Имеем

ns.ViewCollection.define('my-view-collection', {
  split: {
    byModel: 'my-model-collection',
    intoViews: 'my-view-collection-item'
  }
});

Где intoViews - название вида. Не может иметь вложенные виды.

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

ns.layout.define('my-layout-collection-item', {
  'my-view-collection-item': {
    'sub-item': {
      'sub-item-async&': {}
    }
  }
});

ns.ViewCollection.define('my-view-collection', {
  split: {
    byModel: 'my-model-collection',
    intoViews: 'my-layout-collection-item'
  }
});

Кто-нибудь думал о подобной задаче? Есть какие-нибудь идеи?

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

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

ns.layout.page('app') выдает такое дерево.

[
  {
    'id': 'app',
    'type': 'view',
    'views': [
      { 
        'id': 'some-view1',
        'type': 'view',
        'views': [
          { 'id': 'some-view1.1', 'type': 'view', 'views': [] },
          { 'id': 'some-view1.2', 'type': 'view', 'views': [] },
          { 'id': 'some-view1.3', 'type': 'view', 'views': [] },
        ]
      }
    ]
  }
]

Изменение лайаута сильно затронуло ns.update, вид, коллекцию и бокс... Внешне интерфейс не изменился.

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

match .my-view-collection-item ns-view-content {
    apply view('test-item') ns-view
}

Черновой код можно посмотреть тут. Код местами не рабочий, проходят не все тесты. https://github.com/Katochimoto/noscript/tree/collect_layout https://github.com/Katochimoto/noscript/compare/yandex-ui:unquiet-mail...collect_layout