Input Velden Electron

ReadMe.md

@@ -0,0 +1,35 @@
+# GoodGarden
+
+Welkom bij ons project genaamd "GoodGarden". Wij hebben besloten om er een monolitische project van te maken. Alles is te vinden binnen deze repository.
+
+### Vereisten
+
+ * Python
+ * Node.Js
+ * XAMPP (of andere naar keuze)
+
+### Installeren
+
+Zorg dat je in de hoofdmap "GoodGarden" zit. Kijk in je path: "/GoodGarden". Als je in de correcte map zit moet je de volgende items installeren:
+
+    - npm install electron
+    - npm install express
+    - npm install body-parser
+    - npm install python-shell
+
+    - pip install mysql-connector-python
+    - pip install requests
+
+## Gebruik
+
+Een paar voorbeelden van nuttig gebruik van dit project of hoe het gebruikt kan worden.
+
+## Versiebeheer
+
+We gebruiken [SemVer](http://semver.org/) voor versiebeheer. Voor de beschikbare versies, zie de [tags op deze repository](https://example.com/tags).
+
+## Auteurs
+
+* **Jouw Naam** - *Initieel werk* - [Gebruikersnaam](https://example.com/)
+
+Zie ook de lijst van [bijdragers](https://example.com/contributors) die hebben bijgedragen aan dit project.

app.js

@@ -0,0 +1,67 @@
+const { app, BrowserWindow } = require('electron'); /* TYPE IN TERMINAL: "npm install electron" */
+const express = require('express');  /* TYPE IN TERMINAL: "npm install express" */
+const bodyParser = require('body-parser');  /* TYPE IN TERMINAL: "npm install body-parser" */
+const { PythonShell } = require('python-shell');  /* TYPE IN TERMINAL: "npm install python-shell" */
+const path = require('path');
+const urlElectron = path.join(__dirname, "src/main.html");
+
+// Maak een Express-app
+const server = express();
+server.use(bodyParser.urlencoded({ extended: true }));
+
+// Definieer een route voor form POST verzoeken
+server.post('/submit-form', (req, res) => {
+  const { plant_naam, plantensoort } = req.body; // Verkrijg de plant_naam uit het formulier
+  const plant_geteelt = req.body.plant_geteelt == 'true' ? 'true' : 'false'; // Zorgt dat de string "true" herkent wordt
+
+  let options = {
+    mode: 'text',
+    args: [plant_naam, plantensoort, plant_geteelt] // Zet hier een variable bij om de data toe te voegen aan de database
+  };
+
+  // Voer Python script uit met de plant_naam als argument
+  PythonShell.run('./script/db_connect_form.py', options, (err, results) => {
+    if (err) {
+      console.error(err);
+      res.send('Er is een fout opgetreden');
+    } else {
+      console.log('Python script uitvoering resultaten:', results);
+      res.send('Formulier succesvol verwerkt');
+    }
+  });
+});
+
+// Start de server voor verbinding met de database
+const PORT = 3000;
+server.listen(PORT, () => {
+  console.log(`Server luistert op port ${PORT}`);
+});
+
+// Maak de Electron applicatie aan met bijbehorende waardes
+function createWindow() {
+  const mainWindow = new BrowserWindow({
+    width: 800,
+    height: 600,
+    webPreferences: {
+      nodeIntegration: true,
+      contextIsolation: false
+    }
+  });
+
+  mainWindow.loadURL(urlElectron);
+}
+
+app.whenReady().then(createWindow);
+
+// Functionaliteit voor het openen en sluiten van de app
+app.on('window-all-closed', () => {
+  if (process.platform !== 'darwin') {
+    app.quit();
+  }
+});
+
+app.on('activate', () => {
+  if (BrowserWindow.getAllWindows().length === 0) {
+    createWindow();
+  }
+});

goodGarden.sql

@@ -1,16 +0,0 @@
--- DROP DATABASE IF EXISTS goodgarden;
--- CREATE DATABASE goodgarden;
-
--- CREATE TABLE goodgarden.sensor_data (
---     id INT UNSIGNED NOT NULL AUTO_INCREMENT,
---     timestamp INT,
---     gateway_receive_time VARCHAR(50),
---     device INT,
---     value DECIMAL(10, 5),
---     PRIMARY KEY (id)
--- );
-
--- Invoegen van gegevens in de 'sensor_data'-tabel
--- INSERT INTO goodgarden.sensor_data (timestamp, gateway_receive_time, device, value)
--- VALUES (1707295162, '2024-02-07T08:39:22Z', 256, 4.107448101043701),
---        (1707261284, '2024-02-06T23:14:44Z', 322, 4.111111164093018);

main.js

@@ -1,39 +0,0 @@
-const { app, BrowserWindow, nativeImage, shell } = require("electron");
-// const screen = require("electron").screen;
-const path = require("path");
-
-let mainWindow;
-
-function createWindow() 
-{
-  // const iconPath = path.join(__dirname, "images/logo.png");
-  // const icon = nativeImage.createFromPath(iconPath);
-  const urlElectron = path.join(__dirname, "src/main.html");
-
-  mainWindow = new BrowserWindow(
-  {
-    width: 1000,
-    height: 650,
-    webPreferences: 
-    {
-      nodeIntegration: true,
-    },
-    resizable: false,
-    frame: true,
-    // icon: icon,
-    alwaysOnTop: true,
-    // backgroundColor: "green"
-  });
-
-  // const { width, height } = screen.getPrimaryDisplay().workAreaSize;
-  // mainWindow.setPosition(width - 450, height - 500);
-
-  mainWindow.loadURL(urlElectron);
-
-  // mainWindow.on("closed", function () 
-  // {
-  //   mainWindow = null;
-  // });
-}
-
-app.on("ready", createWindow);

package.json

@@ -1,10 +1,10 @@
 {
   "name": "goodgarden",
   "description": "",
-  "main": "main.js",
+  "main": "app.js",
   "scripts": {
     "test": "echo \"Error: no test specified\" && exit 1",
-    "start": "electron main.js"
+    "start": "electron app.js"
   },
   "author": "",
   "license": "ISC",
@@ -12,6 +12,10 @@
     "electron": "^23.3.13"
   },
   "dependencies": {
-    "elctron": "^0.0.1-security"
+    "body-parser": "^1.20.2",
+    "elctron": "^0.0.1-security",
+    "express": "^4.18.2",
+    "mysql2": "^3.9.1",
+    "python-shell": "^5.0.0"
   }
 }

script/battery_voltage_events.py

@@ -1,10 +1,13 @@
-import requests
+import requests #** TYPE IN TERMINAL: "pip install requests"
 import time
+import mysql.connector #** TYPE IN TERMINAL: "pip install mysql-connector-python"
 
+# Import python db_connect.py script
 from db_connect import database_connect
 
-def fetch_and_display_all(urls, access_token):
+# Functie voor het aanmaken van gegevens in de database
-    for url in urls:
+def create_data(url, access_token, repeat_count=5):
+    for _ in range(repeat_count):
         try:
             headers = {
                 "Authorization": f"Token {access_token}"
@@ -14,17 +17,19 @@ def fetch_and_display_all(urls, access_token):
 
             data = response.json()
 
-            print(f"Data from {url}:")
+            # print(f"Data from {url}:")
-            # print(data)
+            print(data)
-            load_data(data)
+            insert_data(data)
 
         except requests.exceptions.RequestException as e:
             print(f"Error fetching data from {url}: {e}")
             
-        print("Waiting for the next retrieval action...")
+        print("Waiting for the next create action...")
-        time.sleep(300)  # Time here is in seconds.
+        time.sleep(10)
+        # time.sleep(300)
 
-def load_data(data):
+# Functie voor het invoegen van gegevens in de database
+def insert_data(data):
     mydb = database_connect()
     if mydb.is_connected():
         mycursor = mydb.cursor()
@@ -33,7 +38,9 @@ def load_data(data):
         INSERT INTO goodgarden.battery_voltage_events (timestamp, gateway_receive_time, device, value)
         VALUES (%s, %s, %s, %s)
         """
-        for record in data['results']:
+
+        for record in data['results']:  # Pas dit aan op basis van de werkelijke structuur van de JSON
+
             timestamp = record.get('timestamp', '')
             gateway_receive_time = record.get('gateway_receive_time', '')
             device = record.get('device', '')
@@ -41,24 +48,131 @@ def load_data(data):
 
             print(f"Inserting data: timestamp={timestamp}, gateway_receive_time={gateway_receive_time}, device={device}, value={value}")
 
-            # Execute the query
+            # Voer de query uit
             mycursor.execute(insert_query, (timestamp, gateway_receive_time, device, value))
 
-        # Commit the changes
+        # Bevestig de wijzigingen
         mydb.commit()
 
-        # Close cursor and connection
+        # Sluit cursor en verbinding
         mycursor.close()
         mydb.close()
 
-        # print("Data inserted into the database.")
+# Functie voor het lezen van gegevens uit de database
+def read_data(url, access_token, repeat_count=5):
+    for _ in range(repeat_count):
+        try:
+            headers = {
+                "Authorization": f"Token {access_token}"
+            }
+            response = requests.get(url, headers=headers)
+            response.raise_for_status()
+
+            data = response.json()
+            print(f"Data from {url}:")
+            print(data)
+
+        except requests.exceptions.RequestException as e:
+            print(f"Error fetching data from {url}: {e}")
+
+        # Wacht een bepaalde tijd in secondes
+        print("Waiting for the next read action...")
+        time.sleep(300)
+
+# Functie voor het bijwerken van gegevens in de database
+def update_data(record_id, new_value):
+    try:
+        mydb = database_connect()
+
+        if mydb.is_connected():
+            mycursor = mydb.cursor()
+
+            # Controleer of het record bestaat voordat je het bijwerkt
+            mycursor.execute("SELECT * FROM goodgarden.battery_voltage_events WHERE id = %s", (record_id,))
+            existing_record = mycursor.fetchone()
+
+            if not existing_record:
+                print(f"Record with ID {record_id} not found. Update operation aborted.")
+                return
+
+            # Hier moet je de juiste kolomnamen aanpassen op basis van de structuur van je database
+            update_query = """
+            UPDATE goodgarden.battery_voltage_events
+            SET value = %s
+            WHERE id = %s
+            """
+
+            # Voer de query uit
+            print(f"Executing update query: {update_query}")
+            print(f"Updating record with ID {record_id} to new value: {new_value}")
+
+            mycursor.execute(update_query, (new_value, record_id))  # Provide the tuple with values here
+
+            # Bevestig de wijzigingen
+            mydb.commit()
+
+            print(f"Update executed. Rowcount: {mycursor.rowcount}")
+
+    except mysql.connector.Error as update_err:
+            print(f"Error updating data: {update_err}")
+    finally:
+        # Zorg ervoor dat je altijd de cursor en de databaseverbinding sluit
+        if 'mycursor' in locals() and mycursor is not None:
+            mycursor.close()
+        if 'mydb' in locals() and mydb.is_connected():
+            mydb.close()
+
+
+# Functie voor het verwijderen van gegevens uit de database
+def delete_data(record_id):
+    mydb = database_connect()
+    if mydb.is_connected():
+        mycursor = mydb.cursor()
+
+        # Hier moet je de juiste kolomnamen aanpassen op basis van de structuur van je database
+        delete_query = """
+        DELETE FROM goodgarden.battery_voltage_events
+        WHERE id = %s
+        """
+
+        # Voer de query uit
+        mycursor.execute(delete_query, (record_id,))
+
+        # Bevestig de wijzigingen
+        mydb.commit()
+
+        # Sluit cursor en verbinding
+        mycursor.close()
+        mydb.close()
+
+        print(f"Data with ID {record_id} deleted.")
 
 if __name__ == "__main__":
-    urls = [
+    url = "https://garden.inajar.nl/api/battery_voltage_events/?format=json"
-        "https://garden.inajar.nl/api/battery_voltage_events/?format=json",
-        
-    ]
-    
     access_token = "33bb3b42452306c58ecedc3c86cfae28ba22329c"
 
-    fetch_and_display_all(urls, access_token)
+    repeat_count = 10
+    
+    operation_choice = input("Choose operation (C for Create, R for Read, U for Update, D for Delete): ").upper()
+
+    # Maak gegevens aan
+    if operation_choice == "C":
+        create_data(url, access_token, repeat_count)
+
+    # Lees gegevens
+    elif operation_choice == "R":
+        read_data(url, access_token, repeat_count)
+
+    # Update gegevens
+    elif operation_choice == "U":
+        record_id = int(input("Enter record ID to update: "))
+        new_value = input("Enter new value: ")
+        update_data(record_id, new_value)
+
+    # Verwijder gegevens
+    elif operation_choice == "D":
+        record_id = int(input("Enter record ID to delete: "))
+        delete_data(record_id)
+
+    else:
+        print("Invalid operation choice. Please choose C, R, U, or D.")

script/db_connect.py

@@ -1,4 +1,4 @@
-import mysql.connector
+import mysql.connector #** TYPE IN TERMINAL: "pip install mysql-connector-python"
 from mysql.connector import Error
 
 def database_connect():

script/db_connect_form.py

@@ -0,0 +1,50 @@
+import sys
+import json
+import mysql.connector #** TYPE IN TERMINAL: "pip install mysql-connector-python"
+from mysql.connector import Error
+
+
+# Voeg de data uit het formulier toe aan de database
+def insert_plant_name(plant_naam, plantensoort, plant_geteelt):
+
+    # Als er "true" is meegeven als waarde dan komt in de database 1 anders 0 (false)
+    plant_geteelt_value = 1 if plant_geteelt.lower() == "true" else 0
+
+    try:
+        connection = mysql.connector.connect(
+            host='localhost',
+            database='goodgarden',
+            user='root',
+            password=''
+        )
+
+        # Als er verbinding gemaakt kan worden voer dan onderstaande query uit
+        if connection.is_connected():
+
+            # De crusor() zorgt ervoor dat er een verbinding met de database gelegt kan worden en de data gemanipuleerd
+            cursor = connection.cursor()
+            query = "INSERT INTO goodgarden.planten (plant_naam, plantensoort, plant_geteelt) VALUES (%s, %s, %s)"
+            cursor.execute(query, (plant_naam, plantensoort, plant_geteelt_value)) # "%s" wordt hier ingevuld doormiddel van de variable (parameter)
+            connection.commit()
+            print(json.dumps({"success": True}))
+        
+        else:
+            print(json.dumps({"success": False, "error": "Database connection failed"}))
+    
+    except Error as e:
+        print(json.dumps({"success": False, "error": str(e)}))
+    
+    finally:
+        if connection and connection.is_connected():
+            cursor.close()
+            connection.close()
+        
+# Wordt alleen uitgevoerd als het een standalone script is (geen import!!!) 
+if __name__ == "__main__":
+    # Dit zijn de variables die door het JavaScript bestand (app.js) worden meegegeven --- NOTE: sys.argv[0] is altijd de naam van het script!
+    plant_naam = sys.argv[1]
+    plantensoort = sys.argv[2]
+    plant_geteelt = sys.argv[3]
+
+    # Call de function met de variables
+    insert_plant_name(plant_naam, plantensoort, plant_geteelt)

script/devices.py

@@ -3,8 +3,8 @@ import time
 
 from db_connect import database_connect
 
-def fetch_and_display_all(urls, access_token):
+def fetch_and_display_all(url, access_token, repeat_count=5):
-    for url in urls:
+    for _ in range(repeat_count):
         try:
             headers = {
                 "Authorization": f"Token {access_token}"
@@ -21,7 +21,10 @@ def fetch_and_display_all(urls, access_token):
             print(f"Error fetching data from {url}: {e}")
 
         print("Waiting for the next retrieval action...")
-        time.sleep(300)  # Time here is in seconds.
+
+        # time.sleep(300)  # Time here is in seconds.
+
+        time.sleep(1)  # Time here is in seconds.
 
 def load_data(data):
     mydb = database_connect()
@@ -55,10 +58,14 @@ def load_data(data):
         print("Data inserted into the database.")
 
 if __name__ == "__main__":
-    urls = [
+    url =  "https://garden.inajar.nl/api/devices/?format=json"
-        "https://garden.inajar.nl/api/devices/?format=json"
+    access_token = "33bb3b42452306c58ecedc3c86cfae28ba22329c"  # Replace this with your actual access token
-    ]
     
-    access_token = "33bb3b42452306c58ecedc3c86cfae28ba22329c"
 
-    fetch_and_display_all(urls, access_token)
+    # access_token = "33bb3b42452306c58ecedc3c86cfae28ba22329c"
+
+    # You can change the repeat_count to control how many times you want to repeat the process
+    repeat_count = 10
+
+    
+    fetch_and_display_all(url, access_token, repeat_count)

script/fetch.py

@@ -2,6 +2,7 @@ import requests
 import time
 
 from db_connect import database_connect
+
 # Establish a database connection
 connection = database_connect()
 
@@ -47,26 +48,6 @@ def load_data(data):
             # Execute the query
             mycursor.execute(insert_query, (timestamp, gateway_receive_time, device, value))
 
-        # insert_query = """ Voor deze code werktengid te krijgen moet je in de datebase een ''id, serial_number, name, label, last_seen, last_battery_voltage)' aanmaken en dan werkt het.
-        # INSERT INTO goodgarden.fetch (id, serial_number, name, label, last_seen, last_battery_voltage) Hier de tabel naam veranderen
-        # VALUES (%s, %s, %s, %s, %s, %s)
-        # """
-        # for record in data['results']:  # Adjust this based on the actual structure of the JSON
-        #     id = record.get('id', '')
-        #     serial_number = record.get('serial_number', '')
-        #     name = record.get('name', '')
-        #     label = record.get('label', '')
-        #     last_seen = record.get('last_seen', '')
-        #     last_battery_voltage = record.get('last_battery_voltage', '')
-
-        #     print(f"Inserting data: id={id}, serial_number={serial_number}, name={name}, label={label}, last_seen={last_seen}, last_battery_voltage={last_battery_voltage}")  # Print the data being inserted
-
-        #     # Execute the query
-        #     mycursor.execute(insert_query, (id, serial_number, name, label, last_seen, last_battery_voltage))
-
-
-
-
         # Commit the changes
         mydb.commit()
 

script/main.js

@@ -0,0 +1,27 @@
+function openModal()
+{
+    const modal = document.getElementById("myModal");
+    const button = document.getElementById("modalButton");
+    const close = document.getElementsByClassName("close")[0];
+
+    // Toon de modal wanneer op de knop wordt geklikt
+    button.onclick = function()
+    {
+        modal.style.display = "block";
+    }
+
+    // Sluit de modal wanneer op het 'sluiten' icoon wordt geklikt
+    close.onclick = function() 
+    {
+        modal.style.display = "none";
+    }
+
+    // Sluit de modal wanneer buiten de modal wordt geklikt
+    window.onclick = function(event) 
+    {
+        if (event.target == modal) 
+        {
+            modal.style.display = "none";
+        }
+    }
+}

script/par_events.py

@@ -3,8 +3,8 @@ import time
 
 from db_connect import database_connect
 
-def fetch_and_display_all(urls, access_token):
+def fetch_and_display_all(url, access_token, repeat_count=5):
-    for url in urls:
+    for _ in range(repeat_count):
         try:
             headers = {
                 "Authorization": f"Token {access_token}"
@@ -21,7 +21,9 @@ def fetch_and_display_all(urls, access_token):
             print(f"Error fetching data from {url}: {e}")
 
         print("Waiting for the next retrieval action...")
-        time.sleep(300)  # Time here is in seconds.
+
+        time.sleep(1)  # Time here is in seconds.
+
 
 def load_data(data):
     mydb = database_connect()
@@ -54,10 +56,9 @@ def load_data(data):
         print("Data inserted into the database.")
 
 if __name__ == "__main__":
-    urls = [
+    url =  "https://garden.inajar.nl/api/par_events/?format=json"
-         "https://garden.inajar.nl/api/par_events/?format=json"
-    ]
-    
     access_token = "33bb3b42452306c58ecedc3c86cfae28ba22329c"  
+    # You can change the repeat_count to control how many times you want to repeat the process
+    repeat_count = 10
     
-    fetch_and_display_all(urls, access_token)
+    fetch_and_display_all(url, access_token, repeat_count)

script/relative_humidity_events.py

@@ -3,8 +3,8 @@ import time
 
 from db_connect import database_connect
 
-def fetch_and_display_all(urls, access_token):
+def fetch_and_display_all(url, access_token, repeat_count=5):
-    for url in urls:
+    for _ in range(repeat_count):
         try:
             headers = {
                 "Authorization": f"Token {access_token}"
@@ -21,7 +21,8 @@ def fetch_and_display_all(urls, access_token):
             print(f"Error fetching data from {url}: {e}")
 
         print("Waiting for the next retrieval action...")
-        time.sleep(300)  # Time here is in seconds.
+
+        time.sleep(1)  # Time here is in seconds.
 
 def load_data(data):
     mydb = database_connect()
@@ -54,10 +55,10 @@ def load_data(data):
         print("Data inserted into the database.")
 
 if __name__ == "__main__":
-    urls = [
+    url = "https://garden.inajar.nl/api/relative_humidity_events/?format=json"
-         "https://garden.inajar.nl/api/relative_humidity_events/?format=json"
-    ]
-    
     access_token = "33bb3b42452306c58ecedc3c86cfae28ba22329c"
     
-    fetch_and_display_all(urls, access_token)
+    # You can change the repeat_count to control how many times you want to repeat the process
+    repeat_count = 10
+    
+    fetch_and_display_all(url, access_token, repeat_count)

script/soil_electric_conductivity_events.py

@@ -3,8 +3,8 @@ import time
 
 from db_connect import database_connect
 
-def fetch_and_display_all(urls, access_token):
+def fetch_and_display_all(url, access_token, repeat_count=5):
-    for url in urls:
+    for _ in range(repeat_count):
         try:
             headers = {
                 "Authorization": f"Token {access_token}"
@@ -21,7 +21,8 @@ def fetch_and_display_all(urls, access_token):
             print(f"Error fetching data from {url}: {e}")
 
         print("Waiting for the next retrieval action...")
-        time.sleep(300)  # Time here is in seconds.
+
+        time.sleep(1)  # Time here is in seconds.
 
 def load_data(data):
     mydb = database_connect()
@@ -52,12 +53,11 @@ def load_data(data):
         mydb.close()
 
         print("Data inserted into the database.")
-
 if __name__ == "__main__":
-    urls = [
+    url = "https://garden.inajar.nl/api/soil_electric_conductivity_events/?format=json"
-           "https://garden.inajar.nl/api/soil_electric_conductivity_events/?format=json"
+    access_token = "33bb3b42452306c58ecedc3c86cfae28ba22329c"  # Replace this with your actual access token
-    ]
 
-    access_token = "33bb3b42452306c58ecedc3c86cfae28ba22329c"
+    # You can change the repeat_count to control how many times you want to repeat the process
+    repeat_count = 10
     
-    fetch_and_display_all(urls, access_token)
+    fetch_and_display_all(url, access_token, repeat_count)

script/soil_relative_permittivity_events.py

@@ -3,10 +3,8 @@ import time
 
 from db_connect import database_connect
 
-# connection = database_connect()
+def fetch_and_display_all(url, access_token, repeat_count=5):
-
+    for _ in range(repeat_count):
-def fetch_and_display_all(urls, access_token):
-    for url in urls:
         try:
             headers = {
                 "Authorization": f"Token {access_token}"
@@ -23,7 +21,9 @@ def fetch_and_display_all(urls, access_token):
             print(f"Error fetching data from {url}: {e}")
 
         print("Waiting for the next retrieval action...")
-        time.sleep(300)  # Time here is in seconds.
+
+        time.sleep(1)  # Time here is in seconds.
+
 
 def load_data(data):
     mydb = database_connect()
@@ -32,7 +32,7 @@ def load_data(data):
 
         # Here you need to adjust the correct column names and data formats based on the API response
         insert_query = """
-        INSERT INTO goodgarden.soil_relative_permittivity_events (timestamp, gateway_receive_time, device, value)
+        INSERT INTO goodgarden.soil_temperature_events (timestamp, gateway_receive_time, device, value)
         VALUES (%s, %s, %s, %s)
         """
         for record in data['results']:
@@ -56,10 +56,11 @@ def load_data(data):
         print("Data inserted into the database.")
 
 if __name__ == "__main__":
-    urls = [
+    url = "https://garden.inajar.nl/api/soil_relative_permittivity_events/?format=json"
-     "https://garden.inajar.nl/api/soil_relative_permittivity_events/?format=json"
-    ]
-    
     access_token = "33bb3b42452306c58ecedc3c86cfae28ba22329c"  
+    # You can change the repeat_count to control how many times you want to repeat the process
+    repeat_count = 10
     
-    fetch_and_display_all(urls, access_token)
+    # fetch_and_display_all(urls, access_token)
+
+    fetch_and_display_all(url, access_token, repeat_count)

script/soil_temperature_events.py

@@ -1,12 +1,12 @@
 import requests
 import time
 
+
 from db_connect import database_connect
 
-# connection = database_connect()
+def fetch_and_display_all(url, access_token, repeat_count=5):
+    for _ in range(repeat_count):
 
-def fetch_and_display_all(urls, access_token):
-    for url in urls:
         try:
             headers = {
                 "Authorization": f"Token {access_token}"
@@ -23,7 +23,8 @@ def fetch_and_display_all(urls, access_token):
             print(f"Error fetching data from {url}: {e}")
 
         print("Waiting for the next retrieval action...")
-        time.sleep(300)  # Time here is in seconds.
+
+        time.sleep(1)  # Time here is in seconds.
 
 def load_data(data):
     mydb = database_connect()
@@ -54,12 +55,11 @@ def load_data(data):
         mydb.close()
 
         print("Data inserted into the database.")
-
 if __name__ == "__main__":
-    urls = [
+    url =     "https://garden.inajar.nl/api/soil_temperature_events/?format=json"
-       "https://garden.inajar.nl/api/soil_temperature_events/?format=json"
+    access_token = "33bb3b42452306c58ecedc3c86cfae28ba22329c"  # Replace this with your actual access token
-    ]
 
-    access_token = "33bb3b42452306c58ecedc3c86cfae28ba22329c"
+    # You can change the repeat_count to control how many times you want to repeat the process
+    repeat_count = 10
     
-    fetch_and_display_all(urls, access_token)
+    fetch_and_display_all(url, access_token, repeat_count)

src/css/style.css

@@ -0,0 +1,27 @@
+/* The Modal (background) */
+.modal {
+  display: none;
+  position: fixed;
+  z-index: 999;
+  left: 50%;
+  top: 50%;
+  transform: translate(-50%, -50%);
+  background: white;
+  padding: 20px;
+  box-shadow: 0 4px 8px rgba(0, 0, 0, 0.1);
+  width: 30vw;
+  height: auto;
+  border: solid 2px black;
+  border-radius: 10px;
+}
+.modal .close {
+  color: #aaa;
+  float: right;
+  font-size: 28px;
+  font-weight: bold;
+}
+.modal .close:hover, .modal .close:active {
+  color: black;
+  text-decoration: none;
+  cursor: pointer;
+}/*# sourceMappingURL=style.css.map */

src/css/style.css.map

@@ -0,0 +1 @@
+{"version":3,"sources":["style.scss","style.css"],"names":[],"mappings":"AAAA,2BAAA;AAEA;EAEI,aAAA;EACA,eAAA;EACA,YAAA;EACA,SAAA;EACA,QAAA;EACA,gCAAA;EACA,iBAAA;EACA,aAAA;EACA,wCAAA;EACA,WAAA;EACA,YAAA;EACA,uBAAA;EACA,mBAAA;ACDJ;ADGI;EAEI,WAAA;EACA,YAAA;EACA,eAAA;EACA,iBAAA;ACFR;ADIQ;EAGI,YAAA;EACA,qBAAA;EACA,eAAA;ACJZ","file":"style.css"}

src/css/style.scss

@@ -0,0 +1,34 @@
+/* The Modal (background) */
+
+.modal 
+{
+    display: none;
+    position: fixed;
+    z-index: 999;
+    left: 50%;
+    top: 50%;
+    transform: translate(-50%, -50%);
+    background: white;
+    padding: 20px;
+    box-shadow: 0 4px 8px rgba(0, 0, 0, 0.1);
+    width: 30vw;
+    height: auto;
+    border: solid 2px black;
+    border-radius: 10px;
+
+    .close 
+    {
+        color: #aaa;
+        float: right;
+        font-size: 28px;
+        font-weight: bold;
+
+        &:hover,
+        &:active
+        {
+            color: black;
+            text-decoration: none;
+            cursor: pointer;
+        }
+    }
+}

src/main.html

@@ -4,8 +4,44 @@
     <meta charset="UTF-8">
     <meta name="viewport" content="width=device-width, initial-scale=1.0">
     <title>Document</title>
+    <link rel="stylesheet" href="./css/style.css">
+    <script src="../script/main.js"></script>
+    <script src="../script/main.py" defer></script>
 </head>
 <body>
-        <h1>sdgdfsgjindgfvadsiuuiadsiuhdgnhaewgiadsnugaeuigndfogjdfsgdff</h1>
+    <section id="linkerkant">
+        <article>
+            <img src="" alt="">
+            <h2>Tomaat</h2>
+            <button></button>
+        </article>
+        <article>
+            <img src="" alt="">
+            <button id="modalButton" onclick="openModal()">TOEVOEGEN!!!</button>
+        </article>
+    </section>
+    <section>
+
+    </section>
+    <div id="myModal" class="modal">
+        <span class="close">&times;</span>
+        <form action="http://localhost:3000/submit-form" method="post">
+
+            <input type="text" name="plant_naam" id="plantNaam">
+            <label for="plantNaam">Naam van de plant</label>
+
+            <input type="text" name="plantensoort" id="plantensoort">
+            <label for="plantensoort">Soort van de plant</label>
+
+            <input type="radio" name="plant_geteelt" id="aanwezig" value="true">
+            <label for="aanwezig">Aanwezig</label>
+    
+            <input type="radio" name="plant_geteelt" id="afwezig" value="false">
+            <label for="afwezig">Afwezig</label>
+            
+            <input type="submit" value="Submit">
+        </form>
+        
+    </div>
 </body>
 </html>