Scribd
Upload
106 views

Code

This document contains the code for a Flask web application that controls LED lights connected to a Raspberry Pi to automate home functions. It imports necessary libraries like Flask, GPIOZero and renders templates. It defines routes for turning on/off LEDs connected to different rooms and displays a home interface page with buttons to control the lights. The templates contain HTML, CSS and JavaScript code for the user interface.

Uploaded by

api-368678162
Copyright
© © All Rights Reserved
Available Formats
Download as PDF, TXT or read online on Scribd
106 views

Code

This document contains the code for a Flask web application that controls LED lights connected to a Raspberry Pi to automate home functions. It imports necessary libraries like Flask, GPIOZero and renders templates. It defines routes for turning on/off LEDs connected to different rooms and displays a home interface page with buttons to control the lights. The templates contain HTML, CSS and JavaScript code for the user interface.

Uploaded by

api-368678162
Copyright
© © All Rights Reserved
Available Formats
Download as PDF, TXT or read online on Scribd
You are on page 1/ 7

Thonny - /home/pi/MyFlaskProgram/homeinter.

py @ 5 : 1

from gpiozero import LED


from signal import pause
from flask import Flask, render_template

led = LED(2)
led2 = LED(20)
led3 = LED(4)
led4 = LED(21)
app = Flask(__name__, static_url_path = "", static_folder = "static")

@app.route("/")
def index():
return render_template("home.html")

@app.route("/light")
def changetolight():
return render_template("homeinterface.html")

@app.route("/openliving")
def openliving():
led.on()
return render_template("homeinterface.html")

@app.route("/closeliving")
def closeliving():
led.off()
return render_template("homeinterface.html")

@app.route("/openwaterroom")
def openwaterroom():
led2.on()
return render_template("homeinterface.html")

@app.route("/closewaterroom")
def closewaterroom():
led2.off()
return render_template("homeinterface.html")

@app.route("/openfoodroom")
def openfoodroom():
led3.on()
return render_template("homeinterface.html")
@app.route("/closefoodroom")
def closefoodroom():
led3.off()
return render_template("homeinterface.html")
@app.route("/openbedroom")
def openbedroom():
led4.on()
return render_template("homeinterface.html")
@app.route("/closebedroom")
def closebedroom():
led4.off()
return render_template("homeinterface.html")
try:
if __name__== "__main__":
app.run()
finally:
led.off()
led2.off()
led3.off()
led4.off()
home.html

<html>
<head>
<script>
function startTime() {
var today = new Date();
var h = today.getHours();
var m = today.getMinutes();
var s = today.getSeconds();
m = checkTime(m);
s = checkTime(s);
document.getElementById('txt').innerHTML =
h + ":" + m + ":" + s;
var t = setTimeout(startTime, 500);
}
function checkTime(i) {
if (i < 10) {i = "0" + i}; // add zero in front of numbers < 10
return i;
}
function ChangeNightmode() {
document.body.style.backgroundColor = "#4E6B8C";
}
function ChangeSavemode() {
document.body.style.backgroundColor = "#A8E8A3";
}
</script>
<title>Page Title</title>
</head>

<body onload="startTime()">

<div id="txt"></div>
</body>
<body bgcolor="#D29D56">

<h1 style="color:black; text-align:center; font-style:bold">🏡HOME🏡</h1>

</body>
<table align="center"; border="1">

<tr>
<td align="center">
<button type="button" onclick="alert('Routine For Today !')"><img
src="https://png.icons8.com/metro/1600/sun.png" alt="HTML5 Icon" width="90" height="85"
/></button></td>
<td align="center">
<a href="/lock">
<img src="https://d30y9cdsu7xlg0.cloudfront.net/png/18799-200.png" alt="HTML5 Icon"
width="90" height="85" /></a></td>
<td align="center">
<a href="/air">
<img src="https://cdn3.iconfinder.com/data/icons/tools-solid-icons-vol-1/72/29-512.png"
alt="HTML5 Icon" width="90" height="85" /></a></td>
<td align="center">
<a href="/light">
<img
src="http://icons.iconarchive.com/icons/pixelkit/swanky-outlines/256/15-Light-Bulb-icon.png"
alt="HTML5 Icon" width="90" height="85" /></a></td>
<td>
<a href="/alarm">
<img src="https://d30y9cdsu7xlg0.cloudfront.net/png/326193-200.png" alt="HTML5 Icon"
width="90" height="85"/></a></td>
</tr>
<tr>
<td>
<a href="music">
<img src="https://png.icons8.com/metro/1600/music.png" alt="HTML5 Icon" width="90"
height="85" /></a></td>
<td>
<button type="button" onclick="ChangeNightmode()"><img
src="https://d30y9cdsu7xlg0.cloudfront.net/png/595-200.png" alt="HTML5 Icon" width="80"
height="85"/></button></td>
<td>
<a href="door">
<img src="https://cdn1.iconfinder.com/data/icons/door-3/200/1334-512.png" alt="HTML5
Icon" width="80" height="85"/></a></td>
<td>
<a href="home">
<img src="http://riversinsgroup.com/wp-content/uploads/home-home-icon-80046.png"
alt="HTML5 Icon" width="80" height="85"/></a></td>
<td>
<button type="button" onclick="ChangeSavemode()"><img
src="https://d30y9cdsu7xlg0.cloudfront.net/png/394900-200.png" width="80"
height="85"/></td>

</td>
</table>

</html>
homeinterface.html

<!DOCTYPE html>
<html>
<head>
<style>
table, th, td {
border: 1px solid black;
border-collapse: collapse;
}
th, td {
padding: 5px;
}
th {
text-align: left;
}
ul {
list-style-type: none;
margin: 0;
padding: 0;
width: 70px;
background-color: #f1f1f1;
}

li a {
display: block;
color: #000;
padding: 4px 12px;
text-decoration: none;
}

/* Change the link color on hover */


li a:hover {
background-color: #555;
color: white;
}
</style>
<body>
<table>
<tr>
<th colspan="3"><center><img src="https://png.icons8.com/ios/1600/light-on.png" width
="50" hegiht = "50"></center>
</head></th>
</tr>
<tr>
<td><img src="https://cdn0.iconfinder.com/data/icons/housicon/512/living_room-512.png"
width ="25" hegiht = "25"></td>
<td><ul>
<li><a href="/openliving">OPEN</a></li></ul></td>
<td><ul>
<li><a href="/closeliving">CLOSE</a></li></ul></td>
</tr>
<tr>
<td><img
src="https://upload.wikimedia.org/wikipedia/commons/thumb/8/8f/Toilets_unisex.svg/2000px-
Toilets_unisex.svg.png" width ="25" hegiht = "25"></td>
<td><ul>
<li><a href="/openwaterroom">OPEN</a></li></ul></td>
<td><ul>
<li><a href="/closewaterroom">CLOSE</a></li></ul></td>
</tr>
<tr>
<td><img src="http://www.free-icons-download.net/images/a-kitchen-icon-80780.png"
width ="25" hegiht = "25"></td>
<td><ul>
<li><a href="/openfoodroom">OPEN</a></li></ul></td>
<td><ul>
<li><a href="/closefoodroom">CLOSE</a></li></ul></td>
</tr>
<tr>
<td><img
src="https://morino-group.com/wp-content/uploads/2017/06/bedroom-icon-7.png" width
="25" hegiht = "25"></td>
<td><ul>
<li><a href="/openbedroom">OPEN</a></li></ul></td>
<td><ul>
<li><a href="/closebedroom">CLOSE</a></li></ul></td>
</tr>
</table>

</body>
</html>

You might also like