Добавить дополнительный датчик температуры на dash-панель совсем несложно. Давайте подробно рассмотрим как это можно сделать.
Модуль Temperature
В модуле Temperature
скетча Arduino Mega Server находится весь код, ответственный за обслуживание температурных датчиков. Из всего этого кода нас будут интересовать два массива: objSens
, в котором хранятся названия датчиков
char objSens[MAX_TEMP_SENSORS][12] = {"tempSTR", "tempHOM", "tempWRM"};
и current_temp
, который содержит текущие значения температуры датчиков.
float current_temp[MAX_TEMP_SENSORS];
По умолчанию, в системе Arduino Mega Server имеется поддержка трёх датчиков, причём предполагается, что первый датчик — уличный и его значение выводится в dash-панель сайта AMS. Наша задача — вывести значение второго датчика — tempHOM
, предполагается, что это температура внутри дома.
Модуль Server Ajax
Модуль Server Ajax
производит разбор запросов браузера и отсылает ответы на эти запросы. В данном случае, нас будет интересовать функция responseDash()
, которая занимается обслуживанием dash-панели, т. е. постоянно, раз в две секунды, посылает основную информацию из контроллера в браузер.
Из всего кода этой функции нас будет интересовать участок, ответственный за посылку температуры со всех датчиков
#ifdef TEMP_FEATURE for (byte i = 0; i < MAX_TEMP_SENSORS; i++) { sendTagFloat(objSens[i], "", current_temp[i], cl); sendTagByte(objSens[i], "Health", tempSensorHealth[i], cl); } sendTagByte("mdTempHealth", "", tempModulHealth, cl); #endif
где непосредственно посылкой значения температуры занимается строка
sendTagFloat(objSens[i], "", current_temp[i], cl);
где objSens[i]
посылает название датчика, а current_temp[i]
— значение температуры.
В скетче мы ничего менять не будем, код был разобран для того, чтобы вы понимали, как это работает. Теперь переходим непосредственно к браузеру и JavaScript, которые принимают данные и выводят их в dash-панель.
Файл scripts.js
Обслуживанием dash-панели на стороне браузера занимается функция getDashData()
, находящаяся в файле scripts.js
. Из всего её кода нас будет интересовать участок
// Temperature try { var tempSTR = this.responseXML.getElementsByTagName('tempSTR')[0].childNodes[0].nodeValue; } catch (err) { tempSTR = "-"; }
здесь «ловится» значение температуры первого датчика с названием tempSTR
и это значение присваивается переменной tempSTR
. Конструкция try/catch
предназначена для ловли ошибок и позволяет нормально работать скрипту, даже если не приходит никаких значений.
Далее в работу вступает конструкция,
try { var tempSTR_ = Math.round(tempSTR, 1); document.getElementById("dash-voltage").innerHTML = tempSTR_ + "°"; document.getElementById("dash-voltage-hide").innerHTML = tempSTR_ + "°"; } catch (err) { }
которая округляет значение температуры с точностью до одного знака после запятой и выводит его в два поля на веб-странице, помеченных, как dash-voltage
и dash-voltage-hide
. Первое — это то значение, которое вы видите в dash-панели в обычном режиме, второе — во время адаптивного уменьшения страницы (например, на смартфоне).
Примечание. Может вызвать удивление, почему температура выводится в поля, обозначенные как dash-voltage. Это следствие разработки и развития проекта, раньше в эти поля выводилось значение напряжения и идентификаторы просто не успели переименоваться.
Итак, теперь, после подробного объяснения механизмов работы системы, вам должно быть понятно, что нужно сделать для добавления ещё одного значения температуры в dash-панель. Добавляем следующий код
try { var tempHOM = this.responseXML.getElementsByTagName('tempHOM')[0].childNodes[0].nodeValue; } catch (err) { tempHOM = "-"; } try { var tempHOM_ = Math.round(tempHOM, 1); document.getElementById("temp-home").innerHTML = tempHOM_ + "°"; document.getElementById("temp-home-hide").innerHTML = tempHOM_ + "°"; } catch (err) { }
рядом с предыдущим кодом и заменяем идентификаторы на temp-home
.
На этом доработка файла scripts.js
закончена и последнее, что нам нужно сделать, это добавить поля, в которые будет выводиться значение температуры со второго датчика непосредственно в dash-панели.
Файл _dash.htm
HTML код dash-панели находится в файле _dash.htm
. Для добавления вывода значения второго датчика температуры вам нужно найти в этом файле строки dash-voltage
и dash-voltage-hide
<p>На улице: <span class="value" id="dash-voltage-hide">...</span> C</p>
<p>На улице: <span class="value" id="dash-voltage">...</span> C</p>
и добавить рядом с ними, по аналогии, следующие строки
<p>Дома: <span class="value" id="temp-home-hide">...</span> C</p>
<p>Дома: <span class="value" id="temp-home">...</span> C</p>
это «посадочные места» для новых значений температуры. Их необязательно добавлять рядом со старыми значениями, можно добавить их в любое нужное вам место dash-панели.
Заключение
Вот, собственно, и всё, для добавления ещё одного значения температуры в dash-панель вам нужно всего лишь добавить две конструкции в файл scripts.js
и две строки в файл _dash.htm
. Неправда ли, это совсем несложно?
Подсказка. Редактирование и добавление на карту памяти такого большого файла, как scripts.js «на лету» может вызвать трудности у начинающих пользователей. Возможно, вам имеет смысл отредактировать и записать этот файл на карту обычным способом, выключив сервер и вынув карту памяти из Ethernet Shield.
Обратите внимание. Система Arduino Mega Server непрерывно развивается и в код проекта постоянно вносятся изменения и улучшения, поэтому, описание и документация может не соответствовать вашей конкретной версии системы. Последняя правка этой страницы относится к 0.14 версии системы.