＜Raspberry Pi-55＞
Raspberry Pi-51とmjpg-streamaerを組み合わしたものを紹介します。
例えば、2階の部屋に置いた、LEDスタンドの点灯・消灯の操作を1階の部屋からタブレット(wifi)で
行い、その様子もタブレット(wifi)で見れると言うものです。
下の画像をクリックすると、タブレットの操作で、LEDの点灯、消灯させているところを映像で見ている
様子が見れます。
必要ファイルはconfig、index.htmlとscript.pyで、/home/pi/webiopi_kisoフォルダを作成し
ここに置きます。
それでは、下記の@ABを行っていきます。
@/etc/webiopi/configファイルで、index.htmlとscript.pyを/home/pi/webiopi_kisoフォルダに置く設定をします。
(下の←←←←←ここですを追加)
#------------------------------------------------------------------------#
[SCRIPTS]
# Load custom scripts syntax :
# name = sourcefile
# each sourcefile may have setup, loop and destroy functions and macros
#myscript = /home/pi/webiopi/examples/scripts/macros/script.py
myscript = /home/pi/webiopi_kiso/script.py #←←←←←ここです
#------------------------------------------------------------------------#
[HTTP]
# HTTP Server configuration
enabled = true
port = 8000
# File containing sha256(base64("user:password"))
# Use webiopi-passwd command to generate it
passwd-file = /etc/webiopi/passwd
# Change login prompt message
prompt = "WebIOPi"
# Use doc-root to change default HTML and resource files location
#doc-root = /home/pi/webiopi/examples/scripts/macros
doc-root = /home/pi/webiopi_kiso #←←←←←ここです
# Use welcome-file to change the default "Welcome" file
#welcome-file = index.html
#------------------------------------------------------------------------#
Aindex.html(＜は半角に修正のこと)
-------------------------------------------------------------------------------
＜!DOCTYPE html>
＜html lang="ja">
＜head>
＜meta charset="UTF-8">
＜title>webiopi_kiso＜/title>
＜script type="text/javascript" src="/webiopi.js">＜/script>
＜script>
/* 起動直後のボタンクリックで動作しないので、ここで一度実行させる*/
webiopi().callMacro( "Controlmode", 0 )
function control(mode){
webiopi().callMacro( "Controlmode", mode ); //
}
＜/script>
＜style>
/*下の＜input class="class1" id="idx" type="button" value="GPIO5" onclick="control(x)" >の
ボタンのサイズ・色を設定*/
/*上位.class1を指定しているので、ボタン全部の指定*/
.class1 {
width: 110px;
height: 70px;
background-color:aqua;
color:black;
font-size:26px
}
/*下位指定なのでid5だけ別の色に指定*/
#id5 {
background-color:yellow
}
/*.class1のボタンにカーソルが乗ると色を変える*/
.class1:hover{background-color:white}
/*id5のボタンにカーソルが乗ると色を変える*/
#id5:hover{background-color:white}
＜/style>
＜/head>
＜body>
＜!-- mjpgの部分ここから(script.pyはGPIO関係だけを記述している)-->
＜center>
JA3RUA Live Video
＜br>
＜!--時刻取得・表示の部分はここから-->
＜p id="Clock1" style="display: inline">＜/p>
＜script type="text/javascript">
setInterval('showClock1()',1000);
function showClock1() {
var DWs = new Array('Sun.','Mon.','Tue.','Wed.','Thu.','Fri.','Sat.');
var Now = new Date();
var YY = Now.getYear();
if (YY ＜ 2000) { YY += 1900; }
var MM = set0( Now.getMonth() + 1 );
var DD = set0( Now.getDate() );
var DW = DWs[ Now.getDay() ];
var hh = set0( Now.getHours() );
var mm = set0( Now.getMinutes() );
var ss = set0( Now.getSeconds() );
var RTime1 = ' ' + YY + '.' + MM + '.' + DD + ' ' + DW + ' ' + hh + ':' + mm + ':' + ss + ' ';
document.getElementById("Clock1").innerHTML = RTime1;
}
function set0(num) {
var ret;
if( num ＜ 10 ) { ret = "0" + num; }
else { ret = num; }
return ret;
}
＜/script>
＜!--時刻取得・表示の部分はここまで-->
＜/center>
＜center>
＜!--シンプル映像を配信させるための記述(ポート8080で接続)-->
＜!--ポート番号は、LD_LIBRARY_PATH・・・の中で設定している-->
＜img src="http://192.168.0.30:8080/?action=stream" />
＜/center>
＜!--mjpgの分ここまで-->
＜br>＜br>
＜center>
＜input class="class1" id="id1" type="button" value="GPIO5" onclick="control(1)" >
＜input class="class1" id="id2" type="button" value="GPIO13" onclick="control(2)" >
＜input class="class1" id="id3" type="button" value="GPIO17" onclick="control(3)" >
＜input class="class1" id="id4" type="button" value="GPIO19" onclick="control(4)" >
＜input class="class1" id="id5" type="button" value="CLEAR" onclick="control(0)" >
＜/center>
＜/body>
＜/html>
-------------------------------------------------------------------------------
Bscript.py
-------------------------------------------------------------------------------
import webiopi
GPIO = webiopi.GPIO
SW1 = 5
SW2 = 13
SW3 = 17
SW4 = 19
GPIO.setFunction( SW1, GPIO.OUT )
GPIO.setFunction( SW2, GPIO.OUT )
GPIO.setFunction( SW3, GPIO.OUT )
GPIO.setFunction( SW4, GPIO.OUT )
def pinclear():
GPIO.pwmWrite(SW1, 0 )
GPIO.pwmWrite(SW2, 0 )
GPIO.pwmWrite(SW3, 0 )
GPIO.pwmWrite(SW4, 0 )
@webiopi.macro
def Controlmode( mode ):
if mode == "0":
pinclear()
if mode == "1":
pinclear()
GPIO.digitalWrite(SW1, GPIO.HIGH )
if mode == "2":
pinclear()
GPIO.digitalWrite(SW2, GPIO.HIGH )
if mode == "3":
pinclear()
GPIO.digitalWrite(SW3, GPIO.HIGH )
if mode == "4":
pinclear()
GPIO.digitalWrite(SW4, GPIO.HIGH )
-------------------------------------------------------------------------------
webiopiを起動させます、コマンドラインから、下のように打ち込みます。
pi@raspberrypi:~ $ sudo /etc/init.d/webiopi start
停止はstartをstopにする
そして、webブラウザから、http://192.168.0.30:8000/にアクセスするとスライダーが
表示します。(IPアドレスは自分の環境)
また、Raspberry Piの電源ON時に自動起動させるには、下記の/etc/rc.localファイルの
←ここを追加をすれば、自動で起動します。
/etc/rc.local
---------------------------------------------------------------------
#!/bin/sh -e
#
# rc.local
#
# This script is executed at the end of each multiuser runlevel.
# Make sure that the script will "exit 0" on success or any other
# value on error.
#
# In order to enable or disable this script just change the execution
# bits.
#
# By default this script does nothing.
# Print the IP address
_IP=$(hostname -I) || true
if [ "$_IP" ]; then
printf "My IP address is %s\n" "$_IP"
fi
sudo /etc/init.d/webiopi start #←ここを追加
exit 0
---------------------------------------------------------------------
Raspberry メニューに戻る