Установив и подключив ленту к Arduino я сделал банальное управление в виде трех ползунков с надписями Red, Green и Blue. Оказалось, что устанавливать цвет ползунками не очень удобно. Порывшись в интернете нашел небольшой плагин для jQuery который меня в данный момент устраивает больше всего. Итак хватит слов - картинки:
Сам пол:
Интерфейс управления:
Сам colorpicker можно скачать с сайта автора.
Колорпикер состоит из css-файла, js-файла и 2-х картинок. Мне пришлось поправить css, чтобы указать правильный путь к этим двум картинкам.
Управление светодиодной лентой у меня организовано через объект lightHallRGB.
У него 3 свойства:
- Red - красный канал
- Green - зеленый канал
- Blue - синий канал
- color - hex-значение цвета для javascript
- turnOn - включение ленты (яркость каждого канала берется из свойств выше)
- turnOff - выключение ленты
Код: Выделить всё
<script type="text/javascript" src="../js/farbtastic.js"></script>
<link rel="stylesheet" href="../css/farbtastic.css" type="text/css" />
<div id="colorpicker" style="margin: 0 auto;"></div>
<script language="javascript">
function cutHex(h) {return (h.charAt(0)=="#") ? h.substring(1,7):h}
function HexToR(h) {return parseInt((cutHex(h)).substring(0,2),16)}
function HexToG(h) {return parseInt((cutHex(h)).substring(2,4),16)}
function HexToB(h) {return parseInt((cutHex(h)).substring(4,6),16)}
function decToHex(number) { if (number < 0) { number = 0xFFFFFFFF + number + 1; }
return number.toString(16).toUpperCase(); }
$('#colorpicker').farbtastic( function (color) {
r = HexToR(color);
g = HexToG(color);
b = HexToB(color);
$.get("/objects/?object=lightHallRGB&op=set&p=Red&v="+r);
$.get("/objects/?object=lightHallRGB&op=set&p=Green&v="+g);
$.get("/objects/?object=lightHallRGB&op=set&p=Blue&v="+b);
$.get("/objects/?object=lightHallRGB&op=set&p=color&v="+cutHex(color));
$.get("/objects/?object=lightHallRGB&op=m&m=turnOn");
});
$.get("/objects/?object=lightHallRGB&op=get&p=color", function (data) { $.farbtastic("#colorpicker").setColor("#"+data); });
</script>
Будут вопросы - спрашивайте