Создание своего персонального интерфейса

glory24 · 8 Июн 2020

На юний энергичный друг Виталий

, зала вопрос:

На что уже получил отвел:

Далее по этому вопросу прошу общаться в этой теме.
Меня кстати это тоже интересует.

valeraba · 8 Июн 2020

Вот пример оформления странички, которую можно вставить в iframe

HTML:

<!DOCTYPE html>
<html lang="en">
<head>
  <meta charset="UTF-8">
</head>
<body>

<input id="myCheckbox" type="checkbox" disabled onchange="handler()">
<input id="myTemperature" disabled readonly style="width:50px">

<script>

  //--------это не трогаем----------
  (function () {
    parent.postMessage({cmd: 'start'}, '*');
    var signals = [];
    window.mgt = {
      attach: function (name, callback) {
        var index = signals.length;
        var signal = {
          callback: callback,
          write: function(value) {
            parent.postMessage({cmd: 'write', index: index, value: value}, '*');
          }
        };
        signals.push(signal);
        parent.postMessage({cmd: 'attach', name: name, deviceNum: 0}, '*');
        return signal;
      }
    };
    window.addEventListener("message", function(event) {
      if (event.data.cmd == 'data') {
        signals[event.data.index].callback(event.data.value);
      }
    });
  })();
  //----------------------------------


  var myCheckbox = document.getElementById('myCheckbox');
  var myTemperature = document.getElementById('myTemperature');

  var param_1 = mgt.attach('relay_1', function(value, time) {
    if (value == null) {
      myCheckbox.disabled = true; // запретим
    }
    else if (value == true) {
      myCheckbox.disabled = false; // разрешим
      myCheckbox.checked = true;
    }
    else if (value == false) {
      myCheckbox.disabled = false; // разрешим
      myCheckbox.checked = false;
    }
  });

  function handler() {
    if (myCheckbox.checked)
      param_1.write(true);
    else
      param_1.write(false);
    myCheckbox.disabled = true; // запретим
  }


  mgt.attach('sensor_1', function(value, time) {
    if (value == null)
      myTemperature.disabled = true; // запретим
    else {
      myTemperature.disabled = false; // разрешим
      myTemperature.value = value;
    }
  });


</script>

</body>
</html>

glory24 · 8 Июн 2020

valeraba написал(а):

Вот пример оформления странички, которую можно вставить в iframe

HTML:

<!DOCTYPE html>
<html lang="en">
<head>
  <meta charset="UTF-8">
</head>
<body>

<input id="myCheckbox" type="checkbox" disabled onchange="handler()">
<input id="myTemperature" disabled readonly style="width:50px">

<script>

  //--------это не трогаем----------
  (function () {
    parent.postMessage({cmd: 'start'}, '*');
    var signals = [];
    window.mgt = {
      attach: function (name, callback) {
        var index = signals.length;
        var signal = {
          callback: callback,
          write: function(value) {
            parent.postMessage({cmd: 'write', index: index, value: value}, '*');
          }
        };
        signals.push(signal);
        parent.postMessage({cmd: 'attach', name: name, deviceNum: 0}, '*');
        return signal;
      }
    };
    window.addEventListener("message", function(event) {
      if (event.data.cmd == 'data') {
        signals[event.data.index].callback(event.data.value);
      }
    });
  })();
  //----------------------------------


  var myCheckbox = document.getElementById('myCheckbox');
  var myTemperature = document.getElementById('myTemperature');

  var param_1 = mgt.attach('relay_1', function(value, time) {
    if (value == null) {
      myCheckbox.disabled = true; // запретим
    }
    else if (value == true) {
      myCheckbox.disabled = false; // разрешим
      myCheckbox.checked = true;
    }
    else if (value == false) {
      myCheckbox.disabled = false; // разрешим
      myCheckbox.checked = false;
    }
  });

  function handler() {
    if (myCheckbox.checked)
      param_1.write(true);
    else
      param_1.write(false);
    myCheckbox.disabled = true; // запретим
  }


  mgt.attach('sensor_1', function(value, time) {
    if (value == null)
      myTemperature.disabled = true; // запретим
    else {
      myTemperature.disabled = false; // разрешим
      myTemperature.value = value;
    }
  });


</script>

</body>
</html>

О нет. Чем еще и это осваивать, я лучше стандартным редактором буду пользоваться

glory24 · 8 Июн 2020

glory24 написал(а):
На юний энергичный друг Виталий , зала вопрос: Посмотреть вложение 9303

Кстати, вопрос к Виталию: А что Вы пытаетесь сделать? Может задачу можно решить имеющимися средствами?

И вопрос к Валере: возможно ли, что бы тексту можно было присвоить переменную, к примеру relay@?

У меня пока не получилось.

antenna-krsk · 8 Июн 2020

мой мудрый друг Вячеслав, я еще молод и могу позволить себе загнуть пару извилин , если конечно смогу). просто думаю я от этого ничего не потеряю, попытка - пытка)))))))))))

valeraba · 8 Июн 2020

glory24 написал(а):
Кстати, вопрос к Виталию: А что Вы пытаетесь сделать? Может задачу можно решить имеющимися средствами?

И вопрос к Валере: возможно ли, что бы тексту можно было присвоить переменную, к примеру relay@?
Посмотреть вложение 9310
У меня пока не получилось.

Да, можно. Булевые сигналы, будут отображены как "true" и "false". Если сигналы типа float, то отобразятся как обычное число.

antenna-krsk · 8 Июн 2020

valeraba написал(а):

Вот пример оформления странички, которую можно вставить в iframe

HTML:

<!DOCTYPE html>
<html lang="en">
<head>
  <meta charset="UTF-8">
</head>
<body>

<input id="myCheckbox" type="checkbox" disabled onchange="handler()">
<input id="myTemperature" disabled readonly style="width:50px">

<script>

  //--------это не трогаем----------
  (function () {
    parent.postMessage({cmd: 'start'}, '*');
    var signals = [];
    window.mgt = {
      attach: function (name, callback) {
        var index = signals.length;
        var signal = {
          callback: callback,
          write: function(value) {
            parent.postMessage({cmd: 'write', index: index, value: value}, '*');
          }
        };
        signals.push(signal);
        parent.postMessage({cmd: 'attach', name: name, deviceNum: 0}, '*');
        return signal;
      }
    };
    window.addEventListener("message", function(event) {
      if (event.data.cmd == 'data') {
        signals[event.data.index].callback(event.data.value);
      }
    });
  })();
  //----------------------------------


  var myCheckbox = document.getElementById('myCheckbox');
  var myTemperature = document.getElementById('myTemperature');

  var param_1 = mgt.attach('relay_1', function(value, time) {
    if (value == null) {
      myCheckbox.disabled = true; // запретим
    }
    else if (value == true) {
      myCheckbox.disabled = false; // разрешим
      myCheckbox.checked = true;
    }
    else if (value == false) {
      myCheckbox.disabled = false; // разрешим
      myCheckbox.checked = false;
    }
  });

  function handler() {
    if (myCheckbox.checked)
      param_1.write(true);
    else
      param_1.write(false);
    myCheckbox.disabled = true; // запретим
  }


  mgt.attach('sensor_1', function(value, time) {
    if (value == null)
      myTemperature.disabled = true; // запретим
    else {
      myTemperature.disabled = false; // разрешим
      myTemperature.value = value;
    }
  });


</script>

</body>
</html>

ничего не пойму, выбрал iframe в редакторе, появился квадрат, а воткнуть то и некуда)

glory24 · 8 Июн 2020

valeraba написал(а):
Да, можно. Булевые сигналы, будут отображены как "true" и "false". Если сигналы типа float, то отобразятся как обычное число.

О! Теперь и мне нифига не понятно

glory24 · 8 Июн 2020

antenna-krsk написал(а):
ничего не пойму, выбрал iframe в редакторе, появился квадрат, а воткнуть то и некуда)

Ща разберемся

Я так понимаю, что тот текст нужно сохранить как html файл, далее запостить его на какой-то удаленный сервер, типа Гугледиска, и получить оттуда страничку примерно такого вида https://storage.googleapis.com/mgt24/switches.html
Только я не знаю как именно это сделать

antenna-krsk · 8 Июн 2020

ооо, нужно образец

glory24 · 8 Июн 2020

antenna-krsk написал(а):
ооо, нужно образец

Нужна инструкция от Валеры

valeraba · 8 Июн 2020

glory24 написал(а):
Ща разберемся
Я так понимаю, что тот текст нужно сохранить как html файл, далее запостить его на какой-то удаленный сервер, типа Гугледиска, и получить оттуда страничку примерно такого вида https://storage.googleapis.com/mgt24/switches.html
Только я не знаю как именно это сделать

Да, страничку нужно хостить, где-нибудь в облаке, на чужом сервере. Я не могу на своём сервере хранить ваши html странички, это не безопасно, так как можно создать фиктивную страничку, которая украдёт ваши пароли. Кто-нибудь подсунет вам ссылку на такую страницу, вы увидите, что она с mgt24.ru и поверите ей, а там вас попросят снова набрать пароль. Читать про фишинг

valeraba · 8 Июн 2020

glory24 написал(а):
Нужна инструкция от Валеры

Хостить файлы можно, где угодно, полно всяких сервисов. Главное, чтобы, там была поддержка https протокола. Яндекс облако, гугл облако и прочее.

glory24 · 8 Июн 2020

valeraba написал(а):
Хостить файлы можно, где угодно, полно всяких сервисов. Главное, чтобы, там была поддержка https протокола. Яндекс облако, гугл облако и прочее.

Я уже дважды подступался к гугл облаку, но так как внятной инструкции нигде не нашел как это делается, снова забрасывал.

Создание своего персонального интерфейса

glory24

Member

valeraba

Moderator

glory24

Member

glory24

Member

antenna-krsk

Active member

valeraba

Moderator

antenna-krsk

Active member

glory24

Member

glory24

Member

antenna-krsk

Active member

glory24

Member

valeraba

Moderator

valeraba

Moderator

glory24

Member