Difference between revisions of "ECE434 Project Pet Monitor"

From eLinux.org
Jump to: navigation, search
(Installation Instructions)
m
 
(27 intermediate revisions by one other user not shown)
Line 1: Line 1:
[[Category:ECE497 |PT]]
 
 
[[Category:ECE434Fall2020 |PT]]
 
[[Category:ECE434Fall2020 |PT]]
 
{{YoderHead}}
 
{{YoderHead}}
Line 46: Line 45:
  
 
1. First clone the git repository to your beagle bone and then enter said directory:
 
1. First clone the git repository to your beagle bone and then enter said directory:
     bone$ git clone https://github.com/rogers3/ECE434/tree/master/petMonitor
+
     bone$ git clone https://github.com/rogers3/ECE434    
     bone$ cd petMonitor
+
     bone$ cd ECE434/petMonitor
  
2. Add authentication token for ngrok. To do this, first create a ngrok account by visiting https://ngrok.com/ and clicking sign up. After the account is created, a authentication token should be available. Open setup.sh and replace 'ENTER_YOUR_TOKEN_HERE' in line 8 with your authentication token.
+
2. Next, add an authentication token for ngrok. To do this, first create a ngrok account by visiting https://ngrok.com/ and clicking sign up. After the account is created, a authentication token should be available. Open setup.sh and replace 'YOUR_AUTH_TOKEN' in line 11 with your authentication token.
  
3. Next, install all necessary libraries. For your convenience, a install.sh file was created:
+
3. Finally, install all necessary libraries. For your convenience, a install.sh file was created. To execute it run:
 
     bone$ sudo ./install.sh
 
     bone$ sudo ./install.sh
  
  
After this the Pet Monitor is ready to be ran. See the User Instruction section on how to start and use the program.
+
After this the Pet Monitor is ready to go. See the User Instruction section on how to start and use the program.
  
 
== User Instructions ==
 
== User Instructions ==
Line 64: Line 63:
  
  
Once the application is running, open yourLocalHost:434 in a web browser to view the monitor. The variable yourLocalHost should be the same IP address used to open cloud9. This number is 192.168.7.2 for me. So, to open the Pet Moniter I search 192.168.7.2:434 in my web browser. If desired, the pet monitor can be made available on non-local hosts as well. This is done by first configuring ngrok (see Instillation Instructions) and then entering:
+
Once the application is running, open yourLocalHost:434 in a web browser to view the monitor. The variable yourLocalHost should be the same IP address used to open cloud9. For me, this number is 192.168.7.2. So, to open the Pet Monitor I enter 192.168.7.2:434 into a web browser. If desired, the pet monitor can be made available on non-local hosts as well. This is done by first configuring ngrok (see Installation Instructions) and then in a '''new''' terminal entering:
 
     bone$ ./ngrok http 434
 
     bone$ ./ngrok http 434
After this, a screen will show up in the terminal with a public browser that can be used to view the pet monitor from anywhere. One issue with this is that each time ngrok is ran, a new url for the public broswer is generated. This should not be an issue if the pet monitor is not restarted often. However, if this is an issue it is possible to use the same url. It costs $60/year for the subscription to ngrok. For more information visit https://ngrok.com/pricing.
+
Note: If using ngrok there will be two terminals connected to the Bone at once. One is running httpmoniter.py and the other is running ngrok.
 +
 
 +
In the terminal running ngrok, a screen will appear with a public browser that can be used to view the pet monitor from anywhere. One issue with this is that each time ngrok is ran, a new url for the public browser is generated. This should not be an issue if the pet monitor is not restarted often. However, if this is an issue it is possible to use the same url each time the pet monitor is ran. It costs $60/year for the subscription to ngrok that allows this. For more information visit https://ngrok.com/pricing.
  
  
Line 75: Line 76:
 
! Button !! Functionality
 
! Button !! Functionality
 
|-
 
|-
| Camera || Toggles the camera. When turned on, the website will pause for a second while the video loads then display the stream. When turned off, the stream should turn off will little delay.
+
| Camera || Toggles the camera. When turned on, the website will pause for a few seconds while the video is loading and then display the stream and change the button to its on state. When turned off, the stream should disappear will little or no delay and the button will return to its off state.
 
|-
 
|-
| Speaker at frequency || When turned on, the speaker will play the frequency at the specified frequency which can be changed. When turned off the speaker will stop making sound.
+
| Speaker at frequency || When turned on, the speaker will play a particular frequency and change the button to its on state. The value of this frequency can be chosen by entering the desired frequency in the text box directly to the right of the words "Speaker at frequency." When turned off the speaker will stop making sound and the button will return to its off state.
 
|-
 
|-
| Song|| When play is pressed, the button changes to pause and the song Old McDonald plays on the speaker. If pause is pressed before the song is over, the song will stop playing and the button will change back to play. Otherwise, once the song is over and the page is refreshed the play button is shown.
+
| Song|| When play is pressed, the song Old McDonald plays on the speaker and the button changes to pause. If pause is pressed before the song is over, the song will stop playing and the button will change back to play. Otherwise, once the song is over and the page is refreshed the button will be in its play state.
 
|-
 
|-
| Let out || This button resets the time since last let out section. It should be pressed whenever the pet is let out.
+
| Let out || This button is animated and when pressed it resets the time since last let out. It should be pressed whenever the pet is let out.
 
|-
 
|-
| Feed || This button resets the time since last meal. It should be pressed whenever the pet is fed.
+
| Feed || This button is animated and when pressed it resets the time since last meal. It should be pressed whenever the pet is fed.
 
|-
 
|-
| Refresh || This button refreshes the page. This refreshes the data section as well as the status of the song button. It has the same functionality as pressing refresh in the upper left of the web browser.
+
| Refresh || This button is animated and when pressed it refreshes the page. This refreshes the data section as well as the status of the song button. It has the same functionality as pressing refresh in the upper left of the web browser.
 
|}
 
|}
  
Line 96: Line 97:
 
* Speaker that can produce a frequency given by the input attribute on the HTML/CSS
 
* Speaker that can produce a frequency given by the input attribute on the HTML/CSS
 
* Camera that can be started/killed directly from the website
 
* Camera that can be started/killed directly from the website
* TMP101 sensors that read temperature when the page is refreshed
+
* TMP101 sensors that update the temperature displayed when the page is refreshed
* Data for time since let out and fed that are updated when the page is refreshed
+
* Data for time since let out and time since fed that are updated when the page is refreshed
  
Include a [http://www.youtube.com/ YouTube] demo the audio description.
+
Link to YouTube demo: https://youtu.be/aGgOKW0TiHc
  
 
== Theory of Operation ==
 
== Theory of Operation ==
 +
When the program httpMonitor.py is ran, Flask starts a web browser at yourLocalIp:434. When a button is pressed on the website, it redirects the website to a new address. For example when the camera button is pressed, the url redirects to yourLocalIP:434/camera/toggle. When this location is reached a portion of the python code runs. This code determines which button is pressed and then executes the appropriate function. Most function are relatively simple only changing variables or interacting with i2c/pwm. However, both the camera and the song buttons have function that require threading. This means these functions and the main program are run simultaneously. This allows the program to continue running (refresh the page) while they execute (stream video/play Old McDonald). Once functions finish they redirect the url back to '\' which looks like yourLocalIP:434. When the code reaches this url it runs a new section of python code which updates the information in the HTML/CSS. This is when the user sees change which is why the user never sees the url change. It also explains some delays in buttons changing. For instance, when the camera button is pushed a thread is created to run motion. The main code then waits four seconds and then redirects to '/' (updating the page). This four seconds allows the video stream to load so that a stream appears when the refresh occurs.
  
Give a high level overview of the structure of your software. Are you using GStreamer?  Show a diagram of the pipeline.  Are you running multiple tasks?  Show what they do and how they interact.
+
[[File:PetMonitorTheroyOfOperation.JPG|1100px|Pet Monitor theory of operation]]
  
 
== Work Breakdown ==
 
== Work Breakdown ==
Line 115: Line 117:
 
* Created Flask page
 
* Created Flask page
 
* Used Motion to stream from camera
 
* Used Motion to stream from camera
* Added the ability to start and stop camera stream using animated button from website
+
* Added the ability to start and stop the camera stream using animated button from website
* Adjusted size of displayed camera stream on the website
+
* Adjusted the size of the displayed camera stream on the website
* Added a speaker that can play a song as well as a specified frequency
+
* Added a speaker that can play a song as well as at a specified frequency
* Developed an interface to speaker on website- this includes two animated buttons and one user input
+
* Developed an interface to the speaker on the website- this includes two animated buttons and one user input
* Attached TMP101 sensor that updates temperature on website upon any refresh
+
* Attached TMP101 sensor that updates the temperature displayed on the website upon any refresh
 
* Included time since last meal and time since let out displays that can be updated upon corresponding button press  
 
* Included time since last meal and time since let out displays that can be updated upon corresponding button press  
 
* Added refresh button with animation
 
* Added refresh button with animation
* Edited Website so that it is visually appealing
+
* Edited website so that it is visually appealing
 
* Figured out how to use ngrok to publicly stream the Pet Monitor website
 
* Figured out how to use ngrok to publicly stream the Pet Monitor website
  
Line 129: Line 131:
 
If I had more time to work on this project, I would use SSH tunneling or ngrok to broadcast the pet monitor onto non-local hosts. This would allow access to the website while not being directly connected to the Beagle Bone. At the moment, it is possible to stream using ngrok, but a different website is used each time the program is ran. This is inconvenient and can be improved upon. If I had time to add this feature, I would also want to add a security feature. This would protect the camera feed of your home from being publicly accessible.
 
If I had more time to work on this project, I would use SSH tunneling or ngrok to broadcast the pet monitor onto non-local hosts. This would allow access to the website while not being directly connected to the Beagle Bone. At the moment, it is possible to stream using ngrok, but a different website is used each time the program is ran. This is inconvenient and can be improved upon. If I had time to add this feature, I would also want to add a security feature. This would protect the camera feed of your home from being publicly accessible.
  
Another improvement that could be added is to use Blynk to create a web app that works in parallel with current website. In the beginning stages of the project I was able to stream from the camera to a Blynk app on my phone. However, the quality was horrible so I switched to making a website. If the quality issues could be resolved, a user could access the pet monitor from both a web browser and an app on their phone.
+
Another potential improvement is to use Blynk to create a web app that works in parallel with current website. In the beginning stages of the project I was able to stream from the camera to a Blynk app on my phone. However, the quality was horrible so I switched to making a website. If the quality issues could be resolved, a user could access the pet monitor from both a web browser and an app on their phone.
  
 
Aside from these two, smaller features could be added to the project as well. For example, more songs could be added to the play song feature or an alarm could go off if time since last fed is greater then a certain threshold.
 
Aside from these two, smaller features could be added to the project as well. For example, more songs could be added to the play song feature or an alarm could go off if time since last fed is greater then a certain threshold.
Line 135: Line 137:
 
== Conclusions ==
 
== Conclusions ==
  
Give some concluding thoughts about the project. Suggest some future additions that could make it even more interesting.
+
This project has has taught me a lot. This is my first time using HTML/CSS to make more then simple labels or buttons. I think the website ended up looking better then I expected especially since I did not use a template. I also learned about threading which is practical knowledge. I was able to successfully use threading twice during this project
 +
 
 +
An idea for a spin off this project would be to create a pet trainer. This would be a program that buzzes whenever a pet enters a certain area. The application I used to stream video also tracks motion. So, this could be used to detect when there is movement in a specified area. When there is motion a buzzer is triggered. This would be useful to train dogs to stay away from food, valuable, or other items.
  
 
{{YoderFoot}}
 
{{YoderFoot}}

Latest revision as of 12:50, 8 April 2021

thumb‎ Embedded Linux Class by Mark A. Yoder


Team members: Mark A. Yoder

Grading Template

I'm using the following template to grade. Each slot is 10 points. 0 = Missing, 5=OK, 10=Wow!

09 Executive Summary
09 Packaging
09 Installation Instructions 
09 User Instructions
09 Highlights
09 Theory of Operation
09 Work Breakdown
09 Future Work/Conclusions
09 Hackster.io
09 Demo/Poster
00 Late
Comments: Have a good day.

Score:  90/100

(Inline Comment)

Executive Summary

My project is a device that allows you to monitor a pet at home through a website. It has various ways to interact with your pet. The first is a camera which when turned on displays the video feed from a USB camera attached to the Bone. The second is a speaker which has two functionalities: play song and play frequency. This allows you to get the attention of your pet. The pet monitor also tracks data that is useful for pet owners. This includes temperature, last time your pet was fed, and last time your pet was let outside. All of these features make this device a great way to observe and interact with pets at home while away.

Screen Capture of Pet Monitor Website

Packaging

There is not much hardware for this project. There are three devices that need to be connected to the Beagle Bone: the camera, the speaker, and the TMP101 sensor. The speaker input port connects to P9_14. The TMP101 sensor connects P9_21 for SCL and P9_22 for SDA. The camera is a PlayStation 3 Eye which is USB camera, so it connects to the USB port on the Beagle Bone. For more information on the camera visit: https://en.wikipedia.org/wiki/PlayStation_Eye.

Hardware for Pet Monitor

Installation Instructions

Pet Monitor project git page: https://github.com/rogers3/ECE434/tree/master/petMonitor


Installing the project:

1. First clone the git repository to your beagle bone and then enter said directory:

    bone$ git clone https://github.com/rogers3/ECE434     
    bone$ cd ECE434/petMonitor

2. Next, add an authentication token for ngrok. To do this, first create a ngrok account by visiting https://ngrok.com/ and clicking sign up. After the account is created, a authentication token should be available. Open setup.sh and replace 'YOUR_AUTH_TOKEN' in line 11 with your authentication token.

3. Finally, install all necessary libraries. For your convenience, a install.sh file was created. To execute it run:

    bone$ sudo ./install.sh


After this the Pet Monitor is ready to go. See the User Instruction section on how to start and use the program.

User Instructions

Once everything is installed, the program can be ran by executing the following commands:

    bone$ sudo ./setup.sh
    bone$ sudo ./httpMonitor.py


Once the application is running, open yourLocalHost:434 in a web browser to view the monitor. The variable yourLocalHost should be the same IP address used to open cloud9. For me, this number is 192.168.7.2. So, to open the Pet Monitor I enter 192.168.7.2:434 into a web browser. If desired, the pet monitor can be made available on non-local hosts as well. This is done by first configuring ngrok (see Installation Instructions) and then in a new terminal entering:

    bone$ ./ngrok http 434

Note: If using ngrok there will be two terminals connected to the Bone at once. One is running httpmoniter.py and the other is running ngrok.

In the terminal running ngrok, a screen will appear with a public browser that can be used to view the pet monitor from anywhere. One issue with this is that each time ngrok is ran, a new url for the public browser is generated. This should not be an issue if the pet monitor is not restarted often. However, if this is an issue it is possible to use the same url each time the pet monitor is ran. It costs $60/year for the subscription to ngrok that allows this. For more information visit https://ngrok.com/pricing.


On the website, there are many buttons that control the pet monitor. A table is included below describing their functionality:

Button Functionality
Camera Toggles the camera. When turned on, the website will pause for a few seconds while the video is loading and then display the stream and change the button to its on state. When turned off, the stream should disappear will little or no delay and the button will return to its off state.
Speaker at frequency When turned on, the speaker will play a particular frequency and change the button to its on state. The value of this frequency can be chosen by entering the desired frequency in the text box directly to the right of the words "Speaker at frequency." When turned off the speaker will stop making sound and the button will return to its off state.
Song When play is pressed, the song Old McDonald plays on the speaker and the button changes to pause. If pause is pressed before the song is over, the song will stop playing and the button will change back to play. Otherwise, once the song is over and the page is refreshed the button will be in its play state.
Let out This button is animated and when pressed it resets the time since last let out. It should be pressed whenever the pet is let out.
Feed This button is animated and when pressed it resets the time since last meal. It should be pressed whenever the pet is fed.
Refresh This button is animated and when pressed it refreshes the page. This refreshes the data section as well as the status of the song button. It has the same functionality as pressing refresh in the upper left of the web browser.

Highlights

This project has many cool features including:

  • Visually appealing HTML/CSS website
  • Animated HTML/CSS buttons
  • Speaker that can play a melody (Old McDonald)
  • Speaker that can produce a frequency given by the input attribute on the HTML/CSS
  • Camera that can be started/killed directly from the website
  • TMP101 sensors that update the temperature displayed when the page is refreshed
  • Data for time since let out and time since fed that are updated when the page is refreshed

Link to YouTube demo: https://youtu.be/aGgOKW0TiHc

Theory of Operation

When the program httpMonitor.py is ran, Flask starts a web browser at yourLocalIp:434. When a button is pressed on the website, it redirects the website to a new address. For example when the camera button is pressed, the url redirects to yourLocalIP:434/camera/toggle. When this location is reached a portion of the python code runs. This code determines which button is pressed and then executes the appropriate function. Most function are relatively simple only changing variables or interacting with i2c/pwm. However, both the camera and the song buttons have function that require threading. This means these functions and the main program are run simultaneously. This allows the program to continue running (refresh the page) while they execute (stream video/play Old McDonald). Once functions finish they redirect the url back to '\' which looks like yourLocalIP:434. When the code reaches this url it runs a new section of python code which updates the information in the HTML/CSS. This is when the user sees change which is why the user never sees the url change. It also explains some delays in buttons changing. For instance, when the camera button is pushed a thread is created to run motion. The main code then waits four seconds and then redirects to '/' (updating the page). This four seconds allows the video stream to load so that a stream appears when the refresh occurs.

Pet Monitor theory of operation

Work Breakdown

Project Timeline:

Pet Monitor project timeline


Major Tasks:

  • Created Flask page
  • Used Motion to stream from camera
  • Added the ability to start and stop the camera stream using animated button from website
  • Adjusted the size of the displayed camera stream on the website
  • Added a speaker that can play a song as well as at a specified frequency
  • Developed an interface to the speaker on the website- this includes two animated buttons and one user input
  • Attached TMP101 sensor that updates the temperature displayed on the website upon any refresh
  • Included time since last meal and time since let out displays that can be updated upon corresponding button press
  • Added refresh button with animation
  • Edited website so that it is visually appealing
  • Figured out how to use ngrok to publicly stream the Pet Monitor website

Future Work

If I had more time to work on this project, I would use SSH tunneling or ngrok to broadcast the pet monitor onto non-local hosts. This would allow access to the website while not being directly connected to the Beagle Bone. At the moment, it is possible to stream using ngrok, but a different website is used each time the program is ran. This is inconvenient and can be improved upon. If I had time to add this feature, I would also want to add a security feature. This would protect the camera feed of your home from being publicly accessible.

Another potential improvement is to use Blynk to create a web app that works in parallel with current website. In the beginning stages of the project I was able to stream from the camera to a Blynk app on my phone. However, the quality was horrible so I switched to making a website. If the quality issues could be resolved, a user could access the pet monitor from both a web browser and an app on their phone.

Aside from these two, smaller features could be added to the project as well. For example, more songs could be added to the play song feature or an alarm could go off if time since last fed is greater then a certain threshold.

Conclusions

This project has has taught me a lot. This is my first time using HTML/CSS to make more then simple labels or buttons. I think the website ended up looking better then I expected especially since I did not use a template. I also learned about threading which is practical knowledge. I was able to successfully use threading twice during this project

An idea for a spin off this project would be to create a pet trainer. This would be a program that buzzes whenever a pet enters a certain area. The application I used to stream video also tracks motion. So, this could be used to detect when there is movement in a specified area. When there is motion a buzzer is triggered. This would be useful to train dogs to stay away from food, valuable, or other items.




thumb‎ Embedded Linux Class by Mark A. Yoder