0% found this document useful (0 votes)
114 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
We take content rights seriously. If you suspect this is your content, claim it here.
Available Formats
Download as PDF, TXT or read online on Scribd
0% found this document useful (0 votes)
114 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
We take content rights seriously. If you suspect this is your content, claim it here.
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