Цветовой пикер на html5+js+canvas.

Необходимо реализовать цветовой пикер, используя html5+js+canvas. Привожу ссылку на действующий пример. Мне нужна несколько сокращённая реализация этого.

Из чего должен состоять:
1. Квадрат, который отражает текущий выбранный цвет.
2. Текстовое поле, в котором находится hex-значение текущего цвета.
3. Три слайдера RGB.
4. Три слайдера LAB(CIELAB).
5. Четыре слайдера CMYK.

Слайдер, как и на вышеприведённом сайте, представляет собой залитый градиентом прямоугольник, имеет ползунок, а справа - текстовое поле, в которое выводится текущее значение канала.
Ползунок может быть прямоугольным или круглым, единственное отличие от colorizer'a - он должен быть залит текущим цветом, а не просто быть прозрачным.

Схема работы:
1. Вводим hex-значение цвета.
2. Квадрат окрашивается в нужный цвет.
3. Все слайдеры перерисовываются, их ползунки смещаются в соответствии с их каналом выбранного цвета. В текстовом поле рядом с каждым слайдером отображается текущее значение канала слайдера.
4. Смещаем один из слайдеров.
5. Квадрат меняет цвет, hex-поле получает новое значение, все остальные слайдеры перерисовываются как в п. 3.

Важно:
1. Можно использовать библиотеки для работы с цветом, можно использовать jQuery.
2. Все каналы должны правильно определяться, проверять буду на том же сайте.
3. Код должен быть самодокументируемым и понятным другому программисту.
4. Соответственно, постарайтесь не использовать нетривиальные архитектурные решения и языковые конструкции.
5. Вёрстка и оформление не играют роли, но сделайте их приемлемыми для тестирования и приёмки работы.