[Модификация] Визуальный селектор цвета RGB-ленты

Вносятся изменения в файлы или устанавливаются доп программы

Модераторы: immortal, newz20

layet
Сообщения: 78
Зарегистрирован: Чт янв 16, 2014 2:47 pm
Благодарил (а): 4 раза
Поблагодарили: 31 раз

[Модификация] Визуальный селектор цвета RGB-ленты

Сообщение layet » Пн фев 03, 2014 4:15 pm

Место под светодиодную ленту в полу коридора было запланировано еще при укладке плитки. Только потом я открыл для себя, что есть специальные профили для лент и прочие прикольные штуки. Заказал, жду :D

Установив и подключив ленту к Arduino я сделал банальное управление в виде трех ползунков с надписями Red, Green и Blue. Оказалось, что устанавливать цвет ползунками не очень удобно. Порывшись в интернете нашел небольшой плагин для jQuery который меня в данный момент устраивает больше всего. Итак хватит слов - картинки:

Сам пол:
Изображение

Интерфейс управления:
Изображение

Сам colorpicker можно скачать с сайта автора.
Колорпикер состоит из css-файла, js-файла и 2-х картинок. Мне пришлось поправить css, чтобы указать правильный путь к этим двум картинкам.

Управление светодиодной лентой у меня организовано через объект lightHallRGB.
У него 3 свойства:
  • Red - красный канал
  • Green - зеленый канал
  • Blue - синий канал
  • color - hex-значение цвета для javascript
И 2 метода:
  • turnOn - включение ленты (яркость каждого канала берется из свойств выше)
  • turnOff - выключение ленты
Для вставки в меню использован следующий код (просто HTML-блок):

Код: Выделить всё

<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>
Надеюсь мой опыт кому-нибудь пригодится.
Будут вопросы - спрашивайте ;)
Последний раз редактировалось layet Пт окт 10, 2014 5:27 pm, всего редактировалось 1 раз.
За это сообщение автора layet поблагодарили (всего 2):
foxvlad (Ср ноя 04, 2015 8:19 am) • directman66 (Чт фев 09, 2017 3:38 pm)
Рейтинг: 2.33%
electric
Сообщения: 309
Зарегистрирован: Вт сен 17, 2013 10:11 pm
Благодарил (а): 3 раза
Поблагодарили: 56 раз

Re: Визуальный селектор цвета RGB-ленты

Сообщение electric » Пн фев 03, 2014 4:44 pm

Ачо за ружье с оптикой в углу?
Мелкашка?
Было: Majordomo v.0.6.0.b на Cubietruck. OS Armbian с переносом на HDD
Стало: ioBroker на Cubietruck OS Armbian + ZigBee Xiaomi + OWFS + BLE.
layet
Сообщения: 78
Зарегистрирован: Чт янв 16, 2014 2:47 pm
Благодарил (а): 4 раза
Поблагодарили: 31 раз

Re: Визуальный селектор цвета RGB-ленты

Сообщение layet » Пн фев 03, 2014 4:48 pm

Так и знал, что спросят :) Нет, это пневматика, обычный ИЖ
vtec
Сообщения: 54
Зарегистрирован: Пн янв 20, 2014 7:35 pm
Благодарил (а): 0
Поблагодарили: 0

Re: Визуальный селектор цвета RGB-ленты

Сообщение vtec » Пн фев 03, 2014 7:45 pm

layet писал(а): Только потом я открыл для себя, что есть специальные профили для лент и прочие прикольные штуки. Заказал, жду :D
Можно поподробней, что за профили и что за приколюхи.
Аватара пользователя
shemnik69
Сообщения: 590
Зарегистрирован: Пн дек 24, 2012 3:01 pm
Откуда: Саратов Saratov
Благодарил (а): 67 раз
Поблагодарили: 63 раза

Re: Визуальный селектор цвета RGB-ленты

Сообщение shemnik69 » Пн фев 03, 2014 9:58 pm

Вот это да...
Я такую прогу, почти забросил...
В детской поставил, ленты, усилитель, контроллер, пульт ... регулировка через выключатель (сделан из диммера, переделан. нажал вкл. крутанул цвет меняет ну в общем просто) ну все, короче поиграли, посмотрели и забыли, путал ее с ОпенХабом, там такой плагин есть, но он просит контроллер заводской ....... но мы не ищем легких путей.
Ардуина есть для таких целей. Так что наверное пора вернуться...
layet
Сообщения: 78
Зарегистрирован: Чт янв 16, 2014 2:47 pm
Благодарил (а): 4 раза
Поблагодарили: 31 раз

Re: Визуальный селектор цвета RGB-ленты

Сообщение layet » Вт фев 04, 2014 2:48 am

vtec писал(а):Можно поподробней, что за профили и что за приколюхи.
Наберите в гугле "Профиль для светодиодной ленты" - сразу куча ссылок. Правда у себя в Иркутске еле нашёл. Надеюсь сегодня заберу и покажу что получилось.
layet
Сообщения: 78
Зарегистрирован: Чт янв 16, 2014 2:47 pm
Благодарил (а): 4 раза
Поблагодарили: 31 раз

Re: Визуальный селектор цвета RGB-ленты

Сообщение layet » Вт фев 04, 2014 2:52 am

shemnik69 писал(а):Вот это да...
Я такую прогу, почти забросил...
В детской поставил, ленты, усилитель, контроллер, пульт ... регулировка через выключатель (сделан из диммера, переделан. нажал вкл. крутанул цвет меняет ну в общем просто) ну все, короче поиграли, посмотрели и забыли, путал ее с ОпенХабом, там такой плагин есть, но он просит контроллер заводской ....... но мы не ищем легких путей.
Ардуина есть для таких целей. Так что наверное пора вернуться...
Мне жалко было 1000 руб на контроллер (там просто пару транзисторов и контроллер, который принимает сигнал от пульта) - вот и сделал сам, могу поделиться схемой и кодом для ардуино.
Аватара пользователя
Amarok
Сообщения: 1425
Зарегистрирован: Пт дек 14, 2012 12:24 pm
Откуда: Россия, Нижняя Тура
Благодарил (а): 460 раз
Поблагодарили: 126 раз
Контактная информация:

Re: Визуальный селектор цвета RGB-ленты

Сообщение Amarok » Вт фев 04, 2014 4:34 am

layet писал(а):Мне жалко было 1000 руб на контроллер (там просто пару транзисторов и контроллер, который принимает сигнал от пульта) - вот и сделал сам, могу поделиться схемой и кодом для ардуино.
А может тут выложить сразу?
Алиска живёт на Ubuntu Server 14.04.3 LTS
connect, группа в Telegram, Яндекс.Деньги для благодарностей за помощь: 41001355945165
layet
Сообщения: 78
Зарегистрирован: Чт янв 16, 2014 2:47 pm
Благодарил (а): 4 раза
Поблагодарили: 31 раз

Re: Визуальный селектор цвета RGB-ленты

Сообщение layet » Вт фев 04, 2014 9:56 am

Об аппаратной части RGB-ленты

Схему управления я применил простейшую: полевой транзистор + токоограничивающий резистор на каждый канал.
Изображение
Резисторы - 100 Ом, транзисторы - IRL2505. Батарейка сверху - это источник питания 12 В (должен быть достаточно мощным, чтобы выдержать ленту, у меня источник питания 12-вольтовой сети 8 А, планирую в дальнейшем прикупить 25 А, чтобы с запасом :lol: ). Бирочки - это контакты ленты, +12 В общий и 3 для цветов.
Т.к. транзисторы ощутимо греются - я прикрутил к ним радиаторы для охлаждения.

Фото схемки, собранной на макетной плате:
Изображение

Извиняюсь за бардак с проводами, собираю макетную плату для датчиков на основе телефонных разъемов, чтобы привести в порядок.
На фото видны радиаторы на каждом из транзисторов, разделенные между собой двухсторонним скотчем (на мой взгляд нужно изолировать радиаторы друг от друга, т.к. у транзистора одна из ног подцеплена к корпусу).

Такая схема подойдет для небольшой ленты - 5-7 метров, если лента длинная - лучше использовать "усиленную" схему, например как тут.

Кстати на фото виден край Iteaduino Iboard Pro - аналог Arduino Mega 2560 с Ethernet'ом на борту.

При программировании использована библиотека Webduino для веб-сервера и стандартная EthernetClient для датчиков "немедленного реагирования" (например датчиков движения).

Функция установки цвета ленты:

Код: Выделить всё

void rgbCmd(WebServer &server, WebServer::ConnectionType type, char *url_tail, bool tail_complete)
{
  URLPARAM_RESULT rc;
  char name[32];
  char value[32];
  int pin;
  int r = 0;
  int g = 0;
  int b = 0;

  server.httpSuccess();
  if (type == WebServer::HEAD)
    return;
  server.printP(Page_start); 
  if (strlen(url_tail))
    {
    while (strlen(url_tail))
      {
      rc = server.nextURLparam(&url_tail, name, 32, value, 32);
      if (rc == URLPARAM_EOS)
        server.printP(Page_end);
       else
        {
          if (String(name) == "r")
           {
             r = atoi(value); 
           }
          if (String(name) == "g")
           {
             g = atoi(value);
           }
          if (String(name) == "b")
           {
             b = atoi(value);
           } 
        }
       analogWrite(5, r);
       analogWrite(3, g);
       analogWrite(2, b); 
      }
    }
}
Для управления используется URL вида: http://192.168.0.96/rgb?r=200&g=120&b=30.
Если нужно выключить ленту - все по нулям: http://192.168.0.96/rgb?r=0&g=0&b=0.

Вроде бы все. Следующим в планах - добавить функцию плавного моргания лентой, например для сообщения об ошибке МЖД.
Будут вопросы - задавайте. :D
Последний раз редактировалось layet Ср фев 05, 2014 4:32 am, всего редактировалось 1 раз.
arturmon
Сообщения: 155
Зарегистрирован: Сб июл 07, 2012 11:42 pm
Благодарил (а): 3 раза
Поблагодарили: 3 раза

Re: Визуальный селектор цвета RGB-ленты

Сообщение arturmon » Вт фев 04, 2014 10:51 pm

irl не "биполярный транзистор", а полевой транзистор IRL2505
За это сообщение автора arturmon поблагодарил:
sregeipt (Пн окт 13, 2014 3:57 pm)
Рейтинг: 1.16%
Ответить