atas { height: 200px;
width: 800px; text-align: center;
} tengah {
height: 200px; width: 800px;
text-align: center; }
bawah { height: 200px;
width: 800px; text-align: center;
} --
style head
body div
id =
atas input
type =
image src
= 1.png
name =
image
style =
width:200px;height:200px div
div id
= tengah
input type
= image
src =
5.png name
= image
style =
width:200px;height:200px input
type =
image src
= 3.png
name =
image style
= width:200px;height:200px
input type
= image
src =
4.png value
= image
style =
width:200px;height:200px div
div id
= bawah
input type
= image
src =
2.png value
= BACK
FORWARD style
= width:200px;height:200px
div body
html div
3.8 Kombinasi HTML, PHP, dan Python
Umumnya PHP dalam sistem aplikasi web berfungsi sebagai sederetan kode yang dieksekusi, kemudian hasil dari eksekusi tersebut dikirim ke klien. Dalam
Tugas Akhir ini proses PHP akan mengeksekusi file yang berekstensikan .py dimana data tersebut terpisah satu sama lain yaitu terpisah dari kombinasi HTML
dan PHP. Berikut kode kombinasi keseluruhan.
div id
= wrapper
html xmlns
=
http:www.w3.org1999xhtml
Universitas Sumatera Utara
head
program php
?php
if isset
_POST [
MAJU ]
{ exec
sudo python varwwwmaju.py ;
}
if isset
_POST [
KANAN ]
{ exec
sudo python varwwwkanan.py ;
}
if isset
_POST [
KIRI ]
{ exec
sudo python varwwwkiri.py ;
}
if isset
_POST [
MUNDUR ]
{ exec
sudo python varwwwmundur.py ;
}
if isset
_POST [
STOP ]
{ exec
sudo python varwwwstop.py ;
} ?
program php
meta http-equiv
= Content-Type
content =
texthtml; charset=utf- 8
title INDRA RIZKIAWAN
title style
type =
textcss
-- wrapper {
height: 800px; width: 400px;
} atas {
height: 200px; width: 800px;
text-align: center; }
tengah { height: 200px;
width: 800px; text-align: center;
} bawah {
height: 200px; width: 800px;
text-align: center; }
--
style head
body form
method =
post
div id
= atas
input type
= image
src =
1.png name
= MAJU
value =
MAJU style
= width:200px;height:200px
div div
id =
tengah input
type =
image src
= 5.png
name =
KIRI
value =
KIRI style
= width:200px;height:200px
input
Universitas Sumatera Utara
type =
image src
= 3.png
name =
STOP value
= STOP
style =
width:200px;height:200px input
type =
image src
= 4.png
name =
KANAN value
= KANAN
style =
width:200px;height:200px
div div
id =
bawah input
type =
image src
= 2.png
name =
MUNDUR
value =
MUNDUR style
= width:200px;height:200px
div body
html div
Program diatas menunjukkan bahwa proses PHP akan memanggil skrip program python yang berekstensikan .py pada Raspberry Pi yang sudah ditanamkan
di driektori varww untuk di eksekusi. Skrip program python tersebut berisi menggerakkan arah putaran Motor DC. Dalam program PHP tersebut terdapat
fungsi exec berfungsi untuk mengeksekusi program yang terdapat diluar program PHP dan HTML.
Proses pemanggilan skrip program python yaitu dengan program HTML pada baris ke 6 program PHP terdapat variabel “MAJU” proses metode “POST”
digunakan untuk mengirimkan data dari HTTP klien untuk diproses di HTTP server kemudian HTTP server memberikan hasil proses ke GPIO General Purpose Input
Output pada Raspberry Pi yaitu pergerakan Motor DC. Berikut adalah skrip
program python untuk yang berfungsi sebagai menggerakkan arah putaran Motor DC.
MAJU
import RPi
. GPIO
as GPIO
GPIO .
setup 7
, GPIO
. OUT
GPIO .
setup 11
, GPIO
. OUT
GPIO .
setup 12
, GPIO
. OUT
GPIO .
setup 15
, GPIO
. OUT
GPIO .
output 7
, False
GPIO .
output 11
, True
GPIO .
output 12
, True
GPIO .
output 15
, False
time.sleep 2
Universitas Sumatera Utara
GPIO .
output 7
, False
GPIO .
output 11
, False
GPIO .
output 12
, False
GPIO .
output 15
, False
MUNDUR
import RPi
. GPIO
as GPIO
GPIO .
setup 7
, GPIO
. OUT
GPIO .
setup 11
, GPIO
. OUT
GPIO .
setup 12
, GPIO
. OUT
GPIO .
setup 15
, GPIO
. OUT
GPIO .
output 7
, True
GPIO .
output 11
, False
GPIO .
output 12
, False
GPIO .
output 15
, True
time.sleep 2
GPIO .
output 7
, False
GPIO .
output 11
, False
GPIO .
output 12
, False
GPIO .
output 15
, False
KANAN
import RPi
. GPIO
as GPIO
GPIO .
setup 7
, GPIO
. OUT
GPIO .
setup 11
, GPIO
. OUT
GPIO .
setup 12
, GPIO
. OUT
GPIO .
setup 15
, GPIO
. OUT
GPIO .
output 7
, True
GPIO .
output 11
, False
GPIO .
output 12
, True
GPIO .
output 15
, False
time.sleep 0.3
GPIO .
output 7
, False
GPIO .
output 11
, False
GPIO .
output 12
, False
GPIO .
output 15
, False
KIRI
import RPi
. GPIO
as GPIO
GPIO .
setup 7
, GPIO
. OUT
GPIO .
setup 11
, GPIO
. OUT
GPIO .
setup 12
, GPIO
. OUT
GPIO .
setup 15
, GPIO
. OUT
GPIO .
output 7
, False
GPIO .
output 11
, True
GPIO .
output 12
, False
GPIO .
output 15
, True
time.sleep 0.3
GPIO .
output 7
, False
GPIO .
output 11
, False
Universitas Sumatera Utara
GPIO .
output 12
, False
GPIO .
output 15
, False
STOP
import RPi
. GPIO
as GPIO
GPIO .
setup 7
, GPIO
. OUT
GPIO .
setup 11
, GPIO
. OUT
GPIO .
setup 12
, GPIO
. OUT
GPIO .
setup 15
, GPIO
. OUT
GPIO .
output 7
, False
GPIO .
output 11
, False
GPIO .
output 12
, False
GPIO .
output 15
, False
Universitas Sumatera Utara
BAB IV IMPLEMENTASI DAN PENGUJIAN
4.1 Implementasi