Смена гифки на веб странице.

Adolf_Balalaykin
Offline
Зарегистрирован: 01.02.2021

Доброго времени суток!

При достижения порога открытия, нужно что бы на вэб странице запускался файл гиф анимации win_up.gif, при пороге закрытия, запускался другой файл гиф анимации win_down.gif. То есть необходимо что бы одна анимация сменяла другую.

В loop функции крутится это:

    // порог открытия
    if (IN4 > defTemp1.toFloat() && Auto == "true" && !triggerActive1)
    {
      ws.textAll(String(!ledState1)); // отправляем статус кнопки "ON"
      String message = String("Верх - t° < порога. Текущая температура: ") + String(IN4) + String("C");
      Serial.println(message);
      triggerActive1 = true;
      // Отсюда необходимо вызвать функцию в javascript
      digitalWrite(ledPin1, HIGH);
    }
    // Порог закрытия
    if (IN4 < defTemp1_1.toFloat() && Auto == "true" && triggerActive1)
    {
      ws.textAll(String(ledState1)); // отправляем статус кнопки "OFF"
      String message = String("Верх - t° < порога. Текущая температура: ") + String(IN4) + String("C");
      Serial.println(message);
      triggerActive1 = false;
      // Отсюда необходимо вызвать функцию в javascript
      digitalWrite(ledPin1, LOW);
    }

В джава скрип прописал эти строки. Как их вызвать из лупа?


     gifContainer.setAttribute('src', 'http://192.168.1.68/win_up.gif'
     gifContainer.setAttribute('src', 'http://192.168.1.68/win_down.gif'
sadman41
Offline
Зарегистрирован: 19.10.2016

Никак не вызвать. Arduino и браузер без извращений совместно не работают. Изучайте JavaScript/XMLHttpRequest, Websocket и подобные технологии.

BOOM
BOOM аватар
Offline
Зарегистрирован: 14.11.2018

Без полной перезагрузке страницы еще можно попробовать AJAX.

ЕвгенийП
ЕвгенийП аватар
Offline
Зарегистрирован: 25.05.2015

Если хоть чуть-чуть умеете писать сценарии страниц на JavaScript, то можно самую малость переделать вот этот пример. Нужно, чтобы он не значение по ID пихал, а SRC картинки подменял, по сути то же самое.

Adolf_Balalaykin
Offline
Зарегистрирован: 01.02.2021

Огромное всем спасибо!

Действительно, джаваскрипт сделал свое дело.

document.getElementById("winimg").src = "win_up.gif";

В html

<img id="winimg" src="win_down.gif">

На вебсокете реализовано. Обновлять страницу без надобности.