35 lines
1.7 KiB
Markdown
35 lines
1.7 KiB
Markdown
# Менеджер окон
|
||
|
||
[importance 5]
|
||
|
||
Эта задача является продолжением задачи [](/task/draggable-windows).
|
||
|
||
Предусмотрите возможность создавать несколько окон. При этом то, которое получает фокус, становится выше всех.
|
||
|
||
Общее управление окнами должен осуществлять объект `WindowManager`.
|
||
|
||
Синтаксис:
|
||
|
||
```js
|
||
WindowManager.setTemplate(html-шаблон для окон);
|
||
|
||
WindowManager.addWindow({ // создаёт окно по шаблону с заголовком
|
||
title: "Чат с Петей" // и показывает его
|
||
});
|
||
|
||
WindowManager.addWindow({ // ещё одно окно
|
||
title: "Чат с Машей"
|
||
});
|
||
```
|
||
|
||
Демо в ифрейме:
|
||
[iframe src="solution" height=300 border=1]
|
||
|
||
|
||
<ul>
|
||
<li>Окна перекрывают друг-друга по `z-index`. Максимальный `z-index` должен быть ограничен: от 1 до количества окон.</li>
|
||
<li>Информация от окна к менеджеру передаётся через события.</li>
|
||
<li>Инкапсуляция: `WindowManager` использует объект `DraggableWindow`, но не лезет в DOM окна. Обработчики -- только на объект.</li>
|
||
</ul>
|
||
|
||
В качестве исходного документа можно взять решение [предыдущей задачи](/task/draggable-windows). Скорее всего, класс `DraggableWindow` понадобиться немного изменить, добавить события.
|