Adaptando o projeto bootstrap-toggle para RaspberryPi

Alan Victor Quinta, 14 de Janeiro de 2016


Nesse post vou mostrar uma forma simples e legal de um swtch button ou button toggle, para usar com raspberry pi.

O esquema foi feito em cima do projeto bootstrap-toggle, de forma um pouco diferente como vista pela internet, nesse caso eu usei: bootstrap, jquery, php e shell-script.

Se adaptado, pode funcionar com qualquer projeto que use checkbox.

Para alegrar, fiz um pequeno vídeo mostrando o seu funcionamento na prática

 

Antes de mostrar os códigos, é preciso entender o funcionamento e os principais arquivos do esquema:

Vale lembrar que isso é um exemplo crú, sem autenticação.

Para o apache poder executar os scripts, é necessário a instalação do sudo e a configuração do usuário www-data, edite o arquivo /etc/sudoers e adicione a linha:

# configure a linha de acordo com os caminhos absolutos do scripts
www-data	ALL=(ALL) NOPASSWD: /var/www/gpio.sh, NOPASSWD: /var/www/estado.sh

 

gpio.sh : shell-script para manipular os pinos gpio da raspberry pi

#!/bin/bash
pino="$1"
estado="$2"
echo $pino > /sys/class/gpio/export 2> /dev/null
echo $estado > /sys/class/gpio/gpio$pino/direction 2> /dev/null

 

estado.sh : shell-script para verificar o estado dos pinos gpio da raspberry pi.

#!/bin/bash
pino=$1
cat /sys/class/gpio/gpio$pino/direction 2> /dev/null

 

acao.php - Script php para fazer a chamada do shell-script gpio.sh

<?php
        if($_GET['acao'] == '20_on') {
                exec("sudo ./gpio.sh 20 out");
        }

        if($_GET['acao'] == '20_off') {
                exec("sudo ./gpio.sh 20 in");
        }
?>

 

acoes.js : jquery para manipular a acão do button toggle

$(document).ready(function () {
  $('#pin20').change(function () {
   if($(this).is(":checked")) {
        $.get("acao.php?acao=20_on");
   }else{
        $.get("acao.php?acao=20_off");
   }
   });
 });

 

Chamada de estado

<?php
$estado_20 = exec("./estado.sh 20");
?>

 

Chamada do botão

<?php
if($estado_20 == 'out') {
     echo "<input id='pin20' type='checkbox' checked data-toggle='toggle' data-size='normal' data-onstyle='primary' data-style='ios'>";
else{
     echo "<input id='pin20' type='checkbox' data-toggle='toggle' data-size='normal' data-onstyle='primary' data-style='ios'>";
}     
?>

Criei um esquema de exemplo para ser usado e adaptado de forma fácil.

http://consultalinux.com/blog/uploads/rasp-toggle.tar.gz

Aqui segue o site do projeto oficial do bootstrap-toggle.

http://www.bootstraptoggle.com/

 

Espero ter ajudado alguém nos seus projetos com raspberry pi. yes