|
|
@@ -1,35 +1,47 @@
|
|
|
# ООП и Canvas: ДЗ.
|
|
|
|
|
|
-## ООП
|
|
|
+## `click`
|
|
|
|
|
|
-Создайте функцию-конструктор для создания объектов кругов (`Circle`), которые мы рисуем. В объектах должны храниться:
|
|
|
-- координаты
|
|
|
-- диаметр
|
|
|
-- цвет
|
|
|
-Функция-конструктор сохраняет каждый новый объект в массиве `items`, находящийся за пределами области видимости конструктора
|
|
|
-(в более общей области видимости). Каждый объект имеет метод `draw`, который отрисовывает его на `Canvas`.
|
|
|
+Сделайте так, что бы рисование происходило не только по движению мыши, но и при первом клике.
|
|
|
|
|
|
-### `redrawAll`
|
|
|
|
|
|
-Создайте функцию `redrawAll`, которая очищает `Canvas` и в цикле отрисовывает каждый объект из массива `items` используя метод `draw`
|
|
|
+## `updateAll`
|
|
|
+
|
|
|
+Создайте функцию `updateAll`, которая очищает `Canvas` и в цикле вызывает переданную в качестве параметра функцию-callback, которая делает определенные операции с каждым объектом из массива `circles`, после чего отрисовывает его используя метод `draw`.
|
|
|
+Если параметр не передан, то функция просто очищает канвас и перерисовывает все кружки.
|
|
|
+
|
|
|
+```javascript
|
|
|
+updateAll(function(circle){
|
|
|
+ circle.setR(circle.getR() +1);
|
|
|
+})
|
|
|
+```
|
|
|
+
|
|
|
+пример выше должен увеличить размер всех кружков на 1. (т. е. заменить текущую реализацию кнопки `+`)
|
|
|
+
|
|
|
+## clear
|
|
|
+
|
|
|
+Сделайте очистку поля рисования. Используйте `updateAll`.
|
|
|
+
|
|
|
+## color
|
|
|
+
|
|
|
+Сделайте выбор цвета. Добавьте методы `setColor` и `getColor` в объект `Circle`.
|
|
|
|
|
|
### undo
|
|
|
|
|
|
-Сделайте возможность отмены добавления круга при нажатии средней кнопки мыши. Для этого измените массив `items` и вызовите `redrawAll`
|
|
|
+Сделайте возможность отмены добавления круга. Используйте `updateAll`
|
|
|
|
|
|
### resize
|
|
|
|
|
|
-Сделайте возможность изменения диаметра всех кругов с помощью колеса мыши. Для этого измените диаметр у всех объектов в массиве `items` и вызовите
|
|
|
-`redrawAll`
|
|
|
+Сделайте возможность изменения диаметра всех кругов с помощью колеса мыши. Используйте `updateAll`
|
|
|
|
|
|
## Синий пояс
|
|
|
|
|
|
-Добавьте тот или иной плагин для выбора цвета и (погуглите `colorPicker`) и сделайте возможность смены цвета всех кругов
|
|
|
-
|
|
|
-## Черный пояс
|
|
|
-
|
|
|
Сделайте возможность выбора кругов, над которыми вы производите операции. Для этого нужно:
|
|
|
- Сделать визуальный переключатель режима рисования или выбора кругов (на ваш выбор)
|
|
|
- в режиме выбора определять к какому элементу ближе всего произошел клик и добавлять его в специальный массив `selected`. Показывать пользователю,
|
|
|
- что элемент выбран, например с помощью штриховой окружности вокруг элемента. Повторный клик отменяет выбор элемента.
|
|
|
-- все операции проводить над элементами `selected`, если же он пуст, то над элементами `items` (т. е. как было описано выше)
|
|
|
+ что элемент выбран, например с помощью штриховой окружности вокруг элемента. Повторный клик отменяет выбор элемента. Модифицируйте `draw` таким образом
|
|
|
+- все операции проводить над элементами `selected`, если же он пуст, то над будущими элементами.
|
|
|
+
|
|
|
+## Черный пояс.
|
|
|
+
|
|
|
+Сделайте неразрывное рисование кружков. Даже если пользователь двигает мышью быстро, кружки должны отрисовываться неразрывно.
|
