Библиотека Javascript


| Следующая

WebIOPi включает в себя HTTP-сервер, обеспечивающий как HTML-ресурсы, так и интерфейс REST API для управления выводами GPIO. При запуске сервера браузер сначала загружает HTML-файл с включенной Javascript-библиотекой webiopi.js, включающей библиотеку jQuery для асинхронных вызовов к REST API. Этот метод очень эффективен, потому что не требует для обновления данных обновления стра­ницы. Расширить возможности WebIOPi можно путем загрузки созданного с использованием Arduino-подобного синтаксиса пользовательского сценария Python, содержащего функции настройки выводов GPIO (рис. 6.14).

Для подключения библиотеки webiopi.js на странице HTML в блоке [header] помещаем следующий код:

<script type="text/javascript" src="/webiopi.js"></script>

Функции библиотеки webiopi.js

Пояснение

Здесь и далее webiopi()— возвращаемый объект WebIOPi.

Функция WebIOPi.ready

Функция Webiopi.ready() регистрирует функцию обратного вызова при загрузке библиотеки webiopi.js.

Синтаксис: WeblOPi. ready(callback)

Параметр: callback — функция обратного вызова.

Функция WeblOPi.setFunction

Функция WeblOPi .setFunction () устанавливает назначение вывода GPIO.

Синтаксис:

* WebIOPi.setFunction(gpio, func)

* WebIOPi.setFunction(gpio, func, callback)

Параметры:

* gpio — номер вывода GPIO;

* func — назначение вывода:

* in — вывод конфигурирован как вход;

* out — вывод конфигурирован как выход;

* pwm — вывод конфигурирован как ШИМ-выход.

* oallback — функция обратного вызова.

Функция WeblOPi.digitalWrite

Функция webiOPi.digitalwrite() устанавливает цифровое значение вывода GPIO, сконфигурированного как выход (OUT).

Синтаксис:

* WebIOPi.digitalWrite(gpio, value)

* WebIOPi.digitalWrite(gpio, value, callback)

Параметры:

* gpio — номер вывода GPIO;

* value — значение для вывода (0 или 1);

* callback — функция обратного вызова.

Функция WebIOPi.digitalRead

Функция WeblOPi.digitalRead () получает значение с вывода GPIO, сконфигуриро­ванного как вход (in).

Синтаксис:

* WeblOPi.digitalRead(gpio)

□         * WebIOPi.digitalRead(gpio, callback)

Параметры:

* gpio — номер вывода GPIO;

* callback — функция обратного вызова.

Возвращаемое значение: value (0 или 1).

Функция WeblOPi.toggleValue

Функция WeblOPi.toggleValue () переключает значение на выводе GPIO на проти­воположное.

Синтаксис: WeblOPi. toggleValue(gpio)

Параметр: gpio — номер вывода GPIO.

Функция WeblOPi.callMacro

Функция WebiOPi.callMacro() выполняет макрофункцию на сервере WebIOPi. Мак­рос может объявляться в скрипте Python, запускаемом при старте WebIOPi.

Синтаксис:

* WeblOPi.callMacro(macro)

* WebIOPi.callMacro(macro, args)

* WebIOPi.callMacro(macro, args, callback)

Параметры:

* macro — наименование макрофункции;

* args — массив передаваемых аргументов для макрофункции;

* callback — функция обратного вызова.

Функция WeblOPi.outputSequence

Функция WeblOPi .outputSequence() отправляет последовательность битов на вы­ход GPIO.

Created by lerkom for rutracker.org 27/02/2016

Параметры:

* gpio — номер вывода GPIO;

* value — значение для вывода (0 или 1);

* callback — функция обратного вызова.

Функция WebIOPi.digitalRead

Функция WeblOPi.digitalRead () получает значение с вывода GPIO, сконфигурированного как вход (in).

Синтаксис:

* WeblOPi.digitalRead(gpio)

* WebIOPi.digitalRead(gpio, callback)

Параметры:

* gpio — номер вывода GPIO;

* callback — функция обратного вызова.

Возвращаемое значение: value (0 или 1).

Функция WeblOPi.toggleValue

Функция WeblOPi.toggleValue () переключает значение на выводе GPIO на противоположное.

Синтаксис: WeblOPi. toggleValue(gpio)

Параметр: gpio — номер вывода GPIO.

Функция WeblOPi.callMacro

Функция WebiOPi.callMacro() выполняет макрофункцию на сервере WebIOPi. Мак­рос может объявляться в скрипте Python, запускаемом при старте WebIOPi.

Синтаксис:

* WeblOPi.callMacro(macro)

* WebIOPi.callMacro(macro, args)

* WebIOPi.callMacro(macro, args, callback)

Параметры:

* macro — наименование макрофункции;

* args — массив передаваемых аргументов для макрофункции;

* callback — функция обратного вызова.

Функция WeblOPi.outputSequence

Функция WeblOPi .outputSequence() отправляет последовательность битов на вы­ход GPIO.

Синтаксис:

* WeblOPi.pulseAngle (gpio, angle)

* WebIOPi.pulseAngle(gpio, angle, callback)

Параметры:

* gpio — вывод GPIO;

* angle — значение сигнала ШИМ (от -45 до +45);

* oallback — функция обратного вызова.

Функция WebIOPi.createButton

Функция WeblOPi .createButton() возвращает объект простую кнопку.

Синтаксис:

* WebIOPi.createButton(id, label)

* WebIOPi.createButton(id, label, mousedown)

* WebIOPi.createButton(id, label, mousedown, mouseup)

Параметры:

* id — идентификатор кнопки;

* label — надпись на кнопке;

* mousedown — функция, вызываемая при событии mousedown (нажатие по кнопке);

* mouseup — функция, вызываемая при событии mouseup (отпускание кнопки).

Примечание

События mousedown и mouseup в основном используются, когда идет нажатие на кнопку, перемещение ее, а потом мышь отпускается.

Чтобы кнопка появилась на странице, ее необходимо добавить — например, так:

button = webiopi().createButton("bt1", "buttonl", fun down, fun up);

$("#div1").append(button);

Функция WebIOPi.createFunctionButton

Функция WeblOPi .createFunctionButton () создает объект кнопку, при нажатии на

которую изменяется назначение вывода GPIO.

Синтаксис:WeblOPi.createFunctionButton(gpio)

Параметр: gpio — вывод, назначение которого изменяется (in, out), при этом на кнопке выводится соответствующая надпись (IN, OUT).

Функция WebIOPi.createGPIOButton

Функция WebiOPi.createGPiOButton() создает объект — кнопку, при нажатии на которую изменяется значение (0 или 1) вывода GPIO.

Синтаксис: WebIOPi.createGPIOButton(label, gpio)

Параметры:

* label — надпись на кнопке;

* gpio — вывод, назначение которого изменяется (0, 1), при этом на кнопке выво­дится соответствующая надпись (0, 1).

Функция WebIOPi.createMacroButton

Функция WeblOPi .createMacroButton () создает объект  кнопку, при нажатии на которую выполняется макрофункция на сервере (макрофункции прописываются в Python-скрипте, запускаемом при старте webiopi).

Синтаксис: WebIOPi.createMacroButton(id, label, macro, args)

Параметры:

* id — идентификатор кнопки;

* label — надпись на кнопке;

* macro — название макрофункции на сервере;

* args — список параметров, передаваемых макрофункции.

Функция WebIOPi.createSequenceButton

Функция WeblOPi .createSequenceButton () создает объект кнопку, при нажатии на

которую на вывод GPIO отправляется последовательность битов.

Синтаксис: WebIOPi.createSequenceButton(id, label, gpio, period, sequence)

Параметры:

* id — идентификатор кнопки;

* label — надпись на кнопке;

* gpio — вывод для отправки последовательности битов;

* period — время отправки одного бита (мсек);

* sequence — последовательность битов в виде строки.

* Пример:

button = webiopi().createSequenceButton("but1", "label1", 25, 100, "01010100110011001100101010");

$("#div1").append(button);

Функция WebIOPi.createRatioSlider

Функция WebIOPi.createRatioSlider() создает объект — шкалу (рис. 6.15), положе­нием указателя на которой регулируется значение ШИМ-сигнала на выводе GPIO.

Синтаксис: WebIOPi.createRatioSlider(gpio, ratio)

Параметры:

* gpio — вывод для отправки последовательности битов;

* ratio — начальное значение для ШИМ (0,0-1,0).

Пример:

button = webiopi().createRatioSlider(24, 1.0);

$("#div1").append(button);

Функция WebIOPi.createAngleSlider

Функция WeblOPi. createAngleSlider () создает объект  шкалу, положением указа­теля которой регулируется значение ШИМ-сигнала, подаваемого на вывод GPIO при управлении сервоприводом для значений поворота угла рабочего органа от -45 до +45 градусов.

Синтаксис: WebIOPi.createAngleSlider(gpio, angle)

Параметры:

* gpio — вывод для отправки последовательности битов;

* angle — начальное значение угла для сигнала ШИМ (от -45 до +45).

Функция WebIOPi.setLabel

Функция WeblOPi .setLabel() изменяет надпись на кнопке.

Синтаксис:WeblOPi.setLabel(id, label)

Параметры:

* id — идентификатор кнопки;

* lable — новая надпись для кнопки.

В листинге 6.8 представлен пример кода страницы для формирования элементов управления webiopi, а на рис. 6.15 представлен вид этой HTML-страницы.

Листинг 6.8. Пример кода страницы для формирования элементов управления webiopi

<html>

<head>

<meta http-equiv="Content-Type" content="text/html; charset=UTF-8">

<meta name="viewport" content = "height = device-height, width = 420, user-scalable = no" />

<title>WebIOPi | Demo</title>

<script type="text/javascript" src="/webiopi.js"></script>

<script type="text/javascript"> webiopi().ready(function()  {

var content, button; content = $("#content");

button = webiopi().createFunctionButton(25); content.append(button);

button = webiopi().createGPIOButton(7, "SWITCH"); content.append(button);

button = webiopi().createSequenceButton("sos", "S.O.S 1", 25, 100, "01010100110011001100101010");

content.append(button);

button = webiopi().createMacroButton("macro", "Print Time", "PrintTime");

content.append(button);

button = webiopi().createAngleSlider(23, 30); content.append(button);

button = webiopi().createRatioSlider(24, 0.5); content.append(button);

webiopi().refreshGPIO(true);

}) ;

</head>

<body>

<div id="content" align="center"></div>

</body>

</html>