Differences
This shows you the differences between two versions of the page.
|
iothings:proiecte:2022:remote_fish_feeder [2023/01/19 22:45] andreea.pietricica |
iothings:proiecte:2022:remote_fish_feeder [2023/01/20 00:33] (current) andreea.pietricica |
||
|---|---|---|---|
| Line 44: | Line 44: | ||
| == Putting it all together: == | == Putting it all together: == | ||
| {{:iothings:proiecte:2022:schematic.jpg?500| Project schematic}} | {{:iothings:proiecte:2022:schematic.jpg?500| Project schematic}} | ||
| + | |||
| The schematic was created using Fritzing program. | The schematic was created using Fritzing program. | ||
| + | |||
| {{:iothings:proiecte:2022:whatsapp_image_2023-01-11_at_20.20.49_9_.jpeg?500|Project physical implementation}} | {{:iothings:proiecte:2022:whatsapp_image_2023-01-11_at_20.20.49_9_.jpeg?500|Project physical implementation}} | ||
| Line 89: | Line 91: | ||
| ** The entire process is described by the following diagram ** | ** The entire process is described by the following diagram ** | ||
| - | {{:iothings:proiecte:2022:feed_diagram.jpg?600| The feeding functionality}} | + | {{:iothings:proiecte:2022:feed_diagram.jpg?700| The feeding functionality}} |
| == Water temperature monitoring == | == Water temperature monitoring == | ||
| Line 115: | Line 117: | ||
| ** The water temperature monitoring process is described by the following diagram. ** | ** The water temperature monitoring process is described by the following diagram. ** | ||
| - | {{:iothings:proiecte:2022:temp.jpg?600| Water temperature monitoring functionality}} | + | {{:iothings:proiecte:2022:temp.jpg?700| Water temperature monitoring functionality}} |
| == Water level monitoring == | == Water level monitoring == | ||
| Line 125: | Line 127: | ||
| {{:iothings:proiecte:2022:level_firebase.jpg?300| Database level field}} | {{:iothings:proiecte:2022:level_firebase.jpg?300| Database level field}} | ||
| - | In the web application, there is a section where the last registered value is displayed, also with the day when the measurement was done. It is expressed as a number of centimeters above the maximum level. So, at first, when the tank is filled with water, the sensor measuring part must be completely sank. In this way, the user can know how close the water level is to the water filter, in case he is away for a long time. It is important for the water filter to not function in the air, because it will be damaged. | + | In the web application, there is a section where the last registered value is displayed, also with the day when the measurement was done. It is expressed as a number of centimeters below the maximum level. So, at first, when the tank is filled with water, the sensor measuring part must be completely sank. In this way, the user can know how close the water level is to the water filter, in case he is away for a long time. It is important for the water filter to not function in the air, because it will be damaged. |
| An important detail is that the sensor has only 4 centimeters. | An important detail is that the sensor has only 4 centimeters. | ||
| Line 141: | Line 143: | ||
| ** The water level monitoring process is described by the following diagram. ** | ** The water level monitoring process is described by the following diagram. ** | ||
| - | {{:iothings:proiecte:2022:level.jpg?600| Water level monitoring functionality}} | + | {{:iothings:proiecte:2022:level.jpg?700| Water level monitoring functionality}} |
| The web application is also available on mobile format. The graphs are bigger than the screen size, but they are horizontally scrollable. | The web application is also available on mobile format. The graphs are bigger than the screen size, but they are horizontally scrollable. | ||
| - | {{:iothings:proiecte:2022:mobile_5_.jpeg?200|}} {{:iothings:proiecte:2022:mobile_4_.jpeg?200|}} | + | {{:iothings:proiecte:2022:mobile_5_.jpeg?300| Mobile application - part I}} {{:iothings:proiecte:2022:mobile_4_.jpeg?300| Mobile application - part II}} |
| ===== Software description ===== | ===== Software description ===== | ||
| Line 153: | Line 155: | ||
| **For the web application:** | **For the web application:** | ||
| * Visual Studio Code | * Visual Studio Code | ||
| - | * Node.JS | + | * Node.js |
| * Note.js Extension Pack for VS Code | * Note.js Extension Pack for VS Code | ||
| * Firebase tools | * Firebase tools | ||
| Line 159: | Line 161: | ||
| Instructions: | Instructions: | ||
| + | * Install Node.js and Node.js extension Pack for VS Code - https://randomnerdtutorials.com/esp32-firebase-web-app/#install-nodejs \\ | ||
| + | * Install Firebase tools | ||
| + | |||
| + | <code> | ||
| + | npm -g install firebase-tools | ||
| + | </code> | ||
| + | |||
| * Install react | * Install react | ||
| <code> | <code> | ||
| Line 195: | Line 204: | ||
| The web application was implemented in JavaScript using React library. The main advantages of using this library are that it makes JavaScript coding easier, provides developer tools and structures the application into components. | The web application was implemented in JavaScript using React library. The main advantages of using this library are that it makes JavaScript coding easier, provides developer tools and structures the application into components. | ||
| - | The functions created using React and Firebase tools permitted the monitoring of the database changes. In this way, when a new value appears in the database, the effect is seen immediately in the web page. The charts are also updated with the new values of level and temperature. Also, by sending the feed data to Firebase and then waiting for that value to be changed by the hardware components, made possible to display the messages "Feeding successful/failed". | + | The functions created using React and Firebase tools permitted the monitoring of the database changes. In this way, when a new value appears in the database, the effect is seen immediately in the web page. The charts are also updated with the new values of level and temperature. Also, by sending the feed data to Firebase and then waiting for that value to be changed by the hardware components, made it possible to display the messages "Feeding successful/failed". |
| The component //FishFeeder.jsx// contains the implementation for all the described functionalities. The charts are created using //recharts// React library. | The component //FishFeeder.jsx// contains the implementation for all the described functionalities. The charts are created using //recharts// React library. | ||
| Line 205: | Line 214: | ||
| * **The feeding functionality** - detects changes to the database and based on that value, activates the pin that controls the servomotor, in such way that the food will fall from the container, then it switches it back. If this value is greater than 1, the container will stay closed for 5 seconds before the servomotor gets activated the second, the third etc. time. | * **The feeding functionality** - detects changes to the database and based on that value, activates the pin that controls the servomotor, in such way that the food will fall from the container, then it switches it back. If this value is greater than 1, the container will stay closed for 5 seconds before the servomotor gets activated the second, the third etc. time. | ||
| - | * **The water temperature monitoring part** - in these part the value from the temperature sensor is read using the OneWire library. This is done every 8 hours, using a time delay variable that store the value in milliseconds. To prepare for reading the value, the ESP32 activates at first the power pin for that sensor. After reading, it gets deactivated. The temperature is then sent to the database, together with its timestamp. | + | * **The water temperature monitoring part** - in these part the value from the temperature sensor is read using the OneWire library. This is done every 8 hours, using a time delay variable that stores the value in milliseconds. To prepare for reading the value, the ESP32 activates at first the power pin for that sensor. After reading, it gets deactivated. The temperature is then sent to the database, together with its timestamp. |
| + | |||
| + | * **The water level monitoring part** - in these part the value from the level sensor is read as raw value. This value is transformed based on 4 different ranges obtained experimentally, defining each one a level of 1 centimeter. This is done every 2 days, using a time delay variable that stores the value in milliseconds. To prepare for reading the value, the ESP32 activates at first the power pin for that sensor. After reading, it gets deactivated. The level value is then sent to the database, together with its timestamp. | ||
| - | * **The water level monitoring part** - in these part the value from the level sensor is read as raw value. This value is transformed based on 4 different ranges obtained experimentally, defining each one a level of 1 centimeter. This is done every 2 days, using a time delay variable that store the value in milliseconds. To prepare for reading the value, the ESP32 activates at first the power pin for that sensor. After reading, it gets deactivated. The level value is then sent to the database, together with its timestamp. | + | {{:iothings:proiecte:2022:software_diagram.jpg?700| Software diagram}} |
| ===== Problems ===== | ===== Problems ===== | ||
