layer-control

JavaScript контроллер слоев. Сборка слоев и управление ими.

Слой — объект описывающий правила для вставки html, js, css и других элементов в существующий документ.

Пример запуска

var myApp = new LayerControl(options); // инициализировать контроллер
myApp.state('/'); // загрузить слои для нужного состояния

options.index — объект или массив, представляет собой один родительский слой, или соответсвенно массив родительских слоев.

Обрабатываемые параметры слоя

Пути для загрузки файлов могут передаваться массивом любо объектом для определения зависимостей, пути на одном уровне с общим родителем загружаются одновременно. Некоторые параметры появляются после оброботки контроллера системой, также некоторые эти параметры можно менять вручную. При наличии соответствующих условий, параметры могут быть изменены системой. Доступ к слоям для динамического изменения осуществляется с помощью myApp.layers или myApp.labels.

layer.query = 'selector'

Указывает в какое место документа будет вставляться слой.

layer.state = 'state'

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

layer.css = '/path/to/style.css'

Путь для загрузки css-файлов.

layer.json = '/path/to/json/data.json'

Путь для загрузки json-данных.

layer.tpl = '/path/to/template.tpl'

Путь для загрузки шаблона. В качестве контекста для шаблона передается {layer}.

layer.label = 'layerLabel'

Метки слоя через пробел, могут быть одинаковыми у нескольких слоев. Получить скомпилированный массив слоев с определенной меткой — myApp.labels['labelName']. Получить просто скомпилированный массив слоев в порядке приоритета — myApp.layers.

layer.ext = '/path/to/ext/layer.js'

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

layer.config = {config}

Пользовательские данные слоя. Если есть layer.ext.config, то от туда рекурсивно добавляются новые значения, но при совпадении не переопределяются.

layer.data = {data}

Данные слоя, обычно используемые для вставки в шаблон.

layer.tplString = '<p>{{tplString}}</p>'

Текстовый шаблон для вставки в дом.

layer.htmlString = '<p>htmlString</p>'

Текстовые распарсенные шаблонные данные для вставки в дом.

layer.childLayers = [childLayers]

Ссылка на массив всех дочерних слоев.

layer.childQueries = [childLayers]

Содержит объект, ключи в котором вида layer.query, в значениях ключей определяются новые слои. У новых слоев layer.query будет равен его ключу. Причем анализ layer.query нового слоя, будет проходить относительно layer.query родительского слоя. Все новые слои попадают в массив layer.childLayers родительского слоя. У каждого нового слоя параметр layer.parentLayer ссылается на родителя.

layer.childStates = [childLayers]

Содержит объект, ключи в котором вида layer.state, в значениях ключей определяются новые слои. У новых слоев layer.state будет равен его ключу. Причем анализ layer.state нового слоя, будет проходить относительно layer.state родительского слоя. Все новые слои попадают в массив layer.childLayers родительского слоя. У каждого нового слоя параметр layer.parentLayer ссылается на родителя.

layer.node = [NodeList]

DOM-узел где находится слой.

layer.show = true|false

Отметка, показан ли слой.

layer.check = true|false

Результат последней проверки слоя на показ.

layer.parentLayer = {parentLayer}

Ссылка на родительский слой.

layer.status = 'queue|hide|load|show'

Статус слоя, отображает его состояние на данный момент.

Методы слоя

layer.oncheck([cb])

Текущий слой будет доступен в переменной {this}. Если задана функция cb(), то контроллер дожидается окончания выполнения этой функции. Функция layer.oncheck срабатывает каждый раз, когда слой прошел проверку на показ. Все данные слоя только после этого начинают загружаются, если они не загружены были до этого.

layer.onload([cb])

Текущий слой будет доступен в переменной {this}. Если задана функция cb(), то контроллер дожидается окончания выполнения этой функции. Функция layer.onload срабатывает каждый раз, при окончании загрузки всех данных слоя, после этого слой идет на обработку для вставки в DOM, парситься шаблон и тд.

layer.onshow([cb])

Текущий слой будет доступен в переменной {this}. Если задана функция cb(), то контроллер дожидается окончания выполнения этой функции. Функция layer.onshow срабатывает каждый раз, когда слой распарсился и вставился в DOM.

События

compile - обработка нового слоя, перед помещением его в общую очередь слоев

start - начало проверок слоев в раунде

loop - очередной виток проверок в раунде

end - все слои проверены и вставлены, раунд закончен

queue - проверка слоев для следующего раунда в очереди проверок

external(layer, i) - загрузка внешнего слоя

layer(layer, i) - проверка определенного слоя

load(path) - закончена загрузка файла