Визуальное уведомление: 9 шагов

2024 Автор: John Day | [email protected]. Последнее изменение: 2024-01-30 11:52

В этом руководстве вы научитесь программировать, чтобы сообщить Филлипсу Хью о предупреждении. Это было бы очень полезно для глухих и слабослышащих, слабовидящих или сенсорных людей. Visual Notification Alert - это оповещение пользователей после получения уведомлений по электронной почте, Facebook, Trello и т. Д. Светодиодная лампа Hue начинает подавать сигнал, мигая.

Photon Particle - это крошечный, перепрограммируемый комплект разработчика Wi-Fi для создания прототипов и масштабирования вашего продукта Интернета вещей.

Шаг 1. Список оборудования и программного обеспечения

Вам необходимо оборудование и программное обеспечение для разработки кодов для Visual Notification Alert.

Аппаратное обеспечение

• Комплект для создания частиц
• Philips Hue - Стартовый комплект (3 светодиодные лампы и 1 мост Hue)

Программное обеспечение

• Общая информация о Particle Photon
• Веб-IDE частиц (сборка) * Требуется для входа в систему *
• IFTTT (Если это, то это)

Шаг 2: установка

У вас должен быть комплект для создания частиц, который включает в себя все, например датчики, перемычки, светодиоды, резисторы и многое другое. Вы можете прочитать больше о Particle Photon.

Прежде чем подключить фотон, вам необходимо узнать состояние светодиодов на фотоне. Вот информация о статусе светодиода.

Подключите свой фотон

1. Подключите USB-кабель к источнику питания. (Ваш компьютер отлично подходит для этой цели). Вашему устройству частиц не нужен компьютер для подключения к Wi-Fi.
2. Когда он подключен, светодиод RGB на вашем фотонном устройстве должен начать мигать синим цветом. Если ваше устройство не мигает синим, удерживайте кнопку SETUP в течение 10 секунд, затем отпустите кнопку SETUP.
3. Войдите в Setup Particle, если у вас уже есть учетная запись. Если у вас нет учетной записи, создайте учетную запись для Photon.
4. Щелкните Photon / P Series.
5. После нажатия на NEXT вам должен быть представлен файл (photonsetup.html)
6. Щелкните ПРОДОЛЖИТЬ С ЛОКАЛЬНЫМ ФАЙЛОМ, чтобы загрузить файл.

После открытия файла

1. Подключите ваш компьютер к Photon, подключившись к сети с именем PHOTON-…
2. Настройте свои учетные данные Wi-Fi. Примечание: если вы неправильно введете свои учетные данные, Photon будет мигать темно-синим или зеленым цветом. Вам нужно повторить процесс снова, обновив страницу или щелкнув часть процесса повтора.
3. Переименуйте ваше устройство. Вы увидите подтверждение, было заявлено устройство или нет.

Прежде чем перейти к следующей части, если ваше устройство Photon имеет голубой цвет, значит, он успешно работает с Интернетом и Photon Cloud! Мы переходим к Particle IDE, Build.

Шаг 3. Кодирование в веб-среде разработки частиц

Вам необходимо создать учетную запись для Particle IDE, Build. Если у вас уже есть учетная запись, тогда отлично! Войдите в Particle IDE.

Мы хотим проверить, мигает ли светодиод на плате. На плате Photon есть маленький синий светодиод. Это рядом с D7. Вы можете скачать файл getstarted-blinknet.ino и посмотреть коды там. Есть объяснение. Щелкните эту ссылку, чтобы открыть исходный код в IDE Particle Web. Если D7 (маленький синий светодиод) мигает, поздравляем, вы только что мигнули светодиодом, используя свое устройство Particle! Если вы хотите узнать больше о Photon, например, о мигании разных светодиодов, считывании фотодатчика и т. Д., Вот ссылка.

Теперь перейдем к Philips Hue.

Шаг 4: Philips Hue

Для справки: Нажмите здесь, чтобы узнать о Phillips Hue API.

Чтобы получить доступ к документации API Philips Hue, вам необходимо зарегистрироваться в качестве разработчика. Это бесплатно, но вам нужно принять условия.

1. Сначала убедитесь, что Philips Hue Bridge (первое изображение) подключен к вашей сети и работает нормально. Тестовое приложение Hue (приложение Hue доступно для iOS и Android), которое управляет светом в той же сети.

Если вы протестируете его успешно, вам необходимо узнать IP-адрес моста в вашей сети. Воспользуйтесь функцией обнаружения серверов брокера Philips, посетив сайт www.meethue.com/api/nupnp.

Когда вы найдете свой IP-адрес, введите его в адресную строку браузера, добавив к URL-адресу debug / clip.html: https:// IP-адрес моста / debug / clip.html. Вы должны увидеть интерфейс (второе изображение), подобный этому. Примечание. Замените «IP-адрес моста» своим IP-адресом.

2. Выполним простую команду и получим информацию о вашей системе оттенков. Заполните данные ниже, оставив тело пустым, и нажмите кнопку GET. Вы должны увидеть такой интерфейс (третье изображение). Вы должны получить сообщение об ошибке. Примечание. Замените «IP-адрес моста» своим IP-адресом.

Адрес: https:// IP-адрес моста / api / newdeveloperBody: Метод: GET Поздравляем! Вы просто отправляете свою первую команду! 3. Затем введите информацию ниже и нажмите кнопку POST. Примечание. Замените «IP-адрес моста» своим IP-адресом, а «имя телефонного типа» - своим телефоном.

Адрес: https:// IP-адрес моста / apiBody: {"devicetype": "my_hue_app # phonetype name"} Метод: POST

Ссылка помогает создать его за вас. Когда вы нажимаете кнопку POST, вы должны получить обратно сообщение об ошибке (четвертое изображение), сообщающее, что вам нужно нажать кнопку ссылки на Hue Bridge. Это шаг безопасности, так что только приложения или серверы, которым вы хотите управлять своим светом. Нажатие ссылки на Hue Bridge доказывает, что пользователь имеет физический доступ к Hue Bridge.

Когда вы получите успешный ответ (пятое изображение), поздравляем! Вы только что создали авторизованного пользователя, которого мы теперь будем использовать.

4. Последний пример перед тем, как мы интегрируем его в Photon Particle, убедитесь, что один из ваших источников света виден и горит, и вам нужно знать, какое число это свет. Измените URL-адрес на / api / username / lights / light number / state (измените номер источника [это может быть 1, 2, 3 или?]) И отправьте кнопку PUT со следующими данными:

Примечание. Убедитесь, что вы изменили IP-адрес моста, имя пользователя и номер освещения

Адрес: https:// IP-адрес моста / api / имя пользователя / индикаторы / номер освещения / состояние

Body: {"on": true, "sat": 254, "bri": 254, "hue": 10000}

Метод: PUT Вы должны увидеть, как ваш свет меняет цвет:

Шаг 5: Настройка Photon с помощью кнопки и проводов

Прежде чем мы разработаем дополнительные коды в Photon Web IDE, мы хотим настроить наш Photon с помощью кнопки и проводов. У вас есть несколько кнопок и много проводов из вашего стартового набора частиц. Я прикрепил два изображения, одно - диаграмма, а другое - актуальная картина.

1. Убедитесь, что вы поместили фотон на макетную плату.
2. Поместите кнопку в нижней части макета, как показано на рисунке.
3. Вставьте конец черного провода в J4 (GND) и вставьте другой конец того же черного провода в J30.
4. Вставьте конец желтого провода в J7 (D5) и вставьте другой конец того же желтого провода в J28.

Если они соответствуют моему изображению, которое я вам показываю, тогда вы молодцы!

Шаг 6: Написание кодов в фотонной частице

Мы создадим наше первое приложение в Photon Particle - Web IDE.

1. Перейдите на https://build.particle.io/build и войдите в систему (зарегистрируйтесь, если вы еще не создали)
2. Введите «Визуальное уведомление» в поле «Текущее приложение».
3. Нажмите кнопку Enter (см. Первое изображение).

Приложение сохраняется в Photon Particle Cloud. Функция setup () вызывается при однократном запуске и запуске приложения. Функция loop () делает именно то, что делает, и последовательно выполняет цикл, позволяя вашему приложению изменяться и отвечать.

Чтобы добавить HttpClient для частицы фотона:

1. Щелкните Библиотеки в нижнем левом углу веб-среды IDE.
2. Введите «HttpClient» в строку поиска.
3. Нажмите «Включить в проект» на синей кнопке.
4. Щелкните VisualNotificationAlert (он удаляет пробелы после создания приложения).
5. Щелкните Подтвердить.

Теперь он добавил HttpClient в начало веб-IDE.

/ Этот оператор #include был автоматически добавлен IDE частиц. # Include

/ *** Конфигурация для Филиппа Хью ***

/ 1. Замените это на свое имя пользователя API из шага 1 const String API_USERNAME = "Ваше имя пользователя API"; // 2. Замените его IP-адресом вашего моста из шага 1 IPAddress hueIP (x, x, x, x); // 3. Замените на путь к источникам света, которым вы хотите управлять. Используйте веб-страницу из шага 1, чтобы убедиться, что она работает. // Убедитесь, что вы узнали номер источника света Philip Hue // / lights / NUMBER / state const String LIGHT_PATH = "/ lights / Number / state"; // 4. Замените это текстом вашего запроса на включение света. const String REQUEST_BODY_ON = "{" on / ": true, \" bri / ": 254}"; // 5. Замените это текстом вашего запроса на выключение света. const String REQUEST_BODY_OFF = "{" on / ": false, \" bri / ": 254}"; / *** КОНЕЦ конфигурации для Филиппа Хью *** / Button const int BUTTON_PIN = D5; // Объект HttpClient, используемый для выполнения HTTP-запросов к мосту Hue HttpClient http; // Заголовок по умолчанию для HTTP-запросов http_header_t headers = {{"Accept", "* / *"}, {NULL, NULL} // ПРИМЕЧАНИЕ: всегда завершать заголовки будут NULL}; // Объекты запроса и ответа http_request_t request; http_response_t ответ; void setup () {Serial.begin (9600); request.ip = hueIP; request.port = 80; // Встроенный светодиод как индикатор для обнаруженного касания pinMode (D7, OUTPUT); // Для ввода мы определяем BUTTON_UP как подтягивание ввода. При этом используется внутренний подтягивающий резистор // для управления последовательными чтениями с устройства. pinMode (BUTTON_PIN, INPUT_PULLUP); // устанавливает контакт в качестве входа // Мы «подписываемся» на наше событие IFTTT с именем Button, чтобы получать для него события Particle.subscribe («RIT_Gmail», myHandler); Particle.subscribe («Trello», myHandler); } // setup () function void loop () {/ * * Это раздел тестирования, в котором световые предупреждения * / // узнают, нажата кнопка или нет, путем чтения из нее. int buttonState = digitalRead (BUTTON_PIN); // Когда кнопка НАЖАТА, мы получим НИЗКИЙ сигнал. // Когда кнопка НЕ НАЖАТА, мы получим ВЫСОКИЙ. если (buttonState == LOW) gmailAlert (); } // loop () function void printInfo () {Serial.print ("Приложение> / tResponse status:"); Serial.println (response.status); Serial.print ("Приложение> / tHTTP Response Body:"); Serial.println (response.body); } // функция printInfo () int i = 0; // Функция, обрабатывающая событие из IFTTT void myHandler (const char * event, const char * data) {// Тест на печать в последовательном режиме Serial.print (event); Serial.print (", данные:"); if (данные) Serial.println (данные); иначе Serial.println ("NULL"); если (strcmp (событие, "Trello") == 0) {trelloAlert (); } else if (strcmp (event, "Gmail") == 0) {gmailAlert (); }} // функция myHandler () / ** Значение оттенка для установки света. * Значение оттенка - это значение обтекания от 0 до 65535. * И 0, и 65535 - красный, * 25500 - зеленый, а 46920 - синий. * / / ** * При использовании умной лампы Philips Hue Smart Bulb он подаст сигнал синим цветом. Он будет предупреждать в течение 15 секунд. * / void trelloAlert () {String trello_body_alert = "{" on / ": true, \" bri / ": 255, \" sat / ": 255, \" hue / ": 46920, \" alert / ": / "lselect \"} "; sendHttpPut (trello_body_alert); } / ** * Он будет предупреждать об использовании интеллектуальной лампы Philips Hue с использованием красного цвета. Он будет предупреждать в течение 15 секунд. * / void gmailAlert () {String gmail_body_alert = "{" on / ": true, \" sat / ": 254, \" bri / ": 254, \" hue / ": 65535, \" alert / ": / "lselect \"} "; sendHttpPut (gmail_body_alert); } / ** * Мы отправим PUT в Philips Hue * @param httpPutBody тело строки * / void sendHttpPut (String httpPutBody) {request.path = "/ api /" + API_USERNAME + LIGHT_PATH; request.body = httpPutBody; http.put (запрос, ответ, заголовки); }

Когда вы закончите вводить или копировать код в свою веб-среду разработки Photon Particle, щелкните значок проверки (Проверить) в верхнем левом углу панели. Если он соответствует очень успешно, мы перейдем к следующему шагу!

Шаг 7. Загрузка кода в Photon

Это очень простой шаг. Прежде чем загружать коды в Фотон:

1. Подключите USB-кабель к источнику питания (я рекомендую ноутбук).
2. Убедитесь, что у вашего фотона есть голубой светодиод. Если он не излучает голубой или другой цвет, переходите к Шагу 2: Установка.
3. Щелкните значок Освещение в веб-среде разработки Photon Particle.
4. Когда он загружает коды в Photon, вы должны увидеть пурпурный. Это означает, что код начинает загружаться в код. Затем он будет быстро мигать зеленым, а затем снова станет дышать голубым.
5. Нажмите кнопку, чтобы увидеть, мигает ли ваша умная лампа Philips (или предупреждает).

Если Philips Smart Bulb предупреждает, поздравляем! Мы почти закончили!

Перейдем к программной части.

Шаг 8: Создание апплетов из IFTTT (если это, то то)

Мы будем создавать апплеты с сайта IFTTT (If This, Then That). Апплеты опубликуют событие в Photon, а затем Photon отправит команду Philips Hue Bridge, чтобы предупредить интеллектуальные лампочки.

В этом проекте мы будем использовать Trello и Gmail для публикации событий в Photon.

Перейдите на https://ifttt.com/ и зарегистрируйтесь.

Trello

1. Щелкните Мои апплеты вверху.
2. Щелкните Новый апплет.
3. Щелкните + это в синем тексте.
4. Введите Trello в строке поиска и щелкните.
5. Щелкните Карточка, назначенная мне.
6. Выберите свою доску в Trello.
7. Щелкните + это в синем тексте.
8. Введите Particle в строке поиска и щелкните.
9. Щелкните Опубликовать мероприятие.
10. Введите "Trello" в поле "Затем опубликуйте" (название события).
11. Выберите общедоступный.

Gmail (Примечание: они будут использовать ваш адрес электронной почты при регистрации)

1. Щелкните Мои апплеты вверху.
2. Щелкните Новый апплет.
3. Щелкните + это в синем тексте.
4. Введите Gmail в строке поиска и нажмите
5. Выберите Любое новое электронное письмо в почтовом ящике.
6. Щелкните + это в синем тексте.
7. Введите Particle в строку поиска и нажмите
8. Щелкните Опубликовать мероприятие.
9. Введите "Gmail" в поле "Затем опубликуйте" (название события).
10. Выберите общедоступный.

Когда у вас есть два апплета, Trello и Gmail, мы переходим к последнему шагу.

Шаг 9: Наконец, тестирование

Будем тестировать публикацию событий от Апплетов до Фотона. Убедитесь, что ваши апплеты включены.

Trello

Когда кто-то создает новую карточку в Trello, он назначит (пометит) вас в карточке. IFTTT прослушивает это и начинает публиковать событие в Photon. Затем Photon отправляет команду на мост Филипа Хью, чтобы предупредить умные лампочки.

Gmail

Когда вы получаете новое электронное письмо в свой почтовый ящик, IFTTT прослушивает его и начинает публиковать событие в Photon. Затем Photon отправляет команду на мост Филипа Хью, чтобы предупредить умные лампочки.

Вызовы

• Каждый раз, когда мы получаем новое уведомление от Trello и Gmail, происходит огромная задержка для отправки события из IFTTT и отправки команды из Photon. Для оповещения умных лампочек должно потребоваться менее 5 минут.
• Аплет Gmail иногда отключается сам по себе, потому что апплет необходимо повторно подключить или обновить.