Разработка виджета (Javascript) для выбора цветовой палитры
Требуется разработать виджет на javascript (c jQuery) для выбора палитры сочетаемых цветов.
За основу берётся цветовой круг, теория описана здесь:
http://www.adme.ru/tvorchestvo-dizajn/krutaya-shpargalka-po-sochetaniyu-cvetov-1169610/
Внешне виджет должен представлять собой цветовой круг, с возможностью вращения на нём
конструкции из N точек (для выбора сочетаний цветов), а также движения точек по
радиусу (для изменения яркости составляющих).
Также пользователь должен иметь возможность выбора количества цветов в палитре и способа их взаимного
расположения ("схема" - триада, аналогичные, тетрада, раздельно комплиментарное
и тд).
Возможное количество цветов передается виджету во входных параметрах, конкретное количество цветов и схему расположение выбирает
пользователь.При вызове виджет заполняет указанный контейнер. При закрытии удаляет сам себя. На странице одновременно может быть активно несколько виджетов в различных
контейнерах.
Итак передаваемые параметры:
container - jquery объект в который встраивать виджет.
count - допустимое количество цветов, массив чисел от 2 до...
colors - текущие цвета. их будет или столько сколько сохранили при юзании круга или один если это первый запуск и что-то передается
для начала.
для примера, если мы передадим count=3 и colors['FF0000'] - т.е. один цвет красный, но нам нужно 3, виджет должен предложить пользователю схемы
расположения трех цветов (триада, аналогичные и тд), при этом сразу сделав
какой-то вариант активным и добавить в набор еще 2 цвета, расчитанные на
основании выбранной схемы.
Цвета в формате RRGGBB.
scheme - то, как выстроены цвета. будет передаваться при повторных вызовах, что бы сразу
активировать нужный режим цветового круга. пусть это будет строка. конкретные
значения определит разработчик виджета. "triada", "tetrada" и так далее по
способам выбора в цветовом круге
обработчики событий - функции, получают параметром объект, описание полей см ниже.
onApply - вызывается по нажатию кнопки "применить" в виджете. функция получает текущие colors и
scheme.
onSave - Когда юзер закончил работу с цветовым кругом и нажал "ок" или "сохранить". функция получает colors и scheme.
onCancel - юзер нажал "отмена".
после двух последних событий виджет деактивируется, код удаляется, container скрывается вызывающим кодом, виджет его не трогает.также необходимо предусмотреть возможность отключать виджет на время обработки
onApply. К примеру простановкой некоторого свойства в dom-элемент или наличия
функции у объекта виджета.