import tkinter as tk
from PIL import Image, ImageTk
from tkinter import *
from matplotlib.backends.backend_tkagg import FigureCanvasTkAgg
import matplotlib.pyplot as plt
import json
import requests

root = tk.Tk()
root.title("Python Project GUI")
root.maxsize(1200, 600)
root.config(bg="skyblue")

LED_image_off = PhotoImage(file="LED_OFF.png")
LED_image_on = PhotoImage(file="LED_ON.png")

button_state = False


def toggle_button():
    global button_state
    if button_state == False:
        button_state = True
        LED_img.config(image=LED_image_on)
        print("LED is now ON", button_state)
    else:
        button_state = False
        LED_img.config(image=LED_image_off)
        print("LED is now OFF", button_state)


resp = requests.get(
    "https://api.thingspeak.com/channels/2219741/fields/1,2.json?api_key=U4FMUFRZRW0NGNLN&results=10"
)
results = json.loads(resp.text)
temp_data_points = [
    (entry["created_at"], float(entry["field2"])) for entry in results["feeds"]
]
humidity_data_points = [
    (entry["created_at"], float(entry["field1"])) for entry in results["feeds"]
]


# Left frame for title and buttons
left_frame = tk.Frame(root, width=200, height=600, bg="grey")
left_frame.grid(row=0, column=0, padx=10, pady=5)

title_label = tk.Label(
    left_frame,
    text="Python Project GUI",
    font=("Helvetica", 16, "bold"),
    bg="grey",      
    fg="white",
)
title_label.pack(padx=5, pady=10)

tool_bar = tk.Frame(left_frame, width=180, height=185, bg="grey")
tool_bar.pack(padx=5, pady=10)

B = tk.Button(tool_bar, text="Toggle LED", command=toggle_button)
B.pack(padx=5, pady=5)
LED_img = tk.Label(tool_bar, image=LED_image_off)
LED_img.pack(padx=5, pady=5)

# Middle frame for temperature graph
middle_frame = tk.Frame(root, width=400, height=600, bg="white")
middle_frame.grid(row=0, column=1, padx=10, pady=5)

figure_temp = plt.Figure(figsize=(5, 4), dpi=100)
ax_temp = figure_temp.add_subplot(1, 1, 1)
ax_temp.set_title("Temperature Graph")
ax_temp.set_xlabel("Time")
ax_temp.set_ylabel("Temperature (°C)")
ax_temp.plot(
    [point[0] for point in temp_data_points],
    [point[1] for point in temp_data_points],
)

canvas_temp = FigureCanvasTkAgg(figure_temp, master=middle_frame)
canvas_temp.get_tk_widget().pack()

# Right frame for humidity graph
right_frame = tk.Frame(root, width=400, height=600, bg="white")
right_frame.grid(row=0, column=2, padx=10, pady=5)

figure_humidity = plt.Figure(figsize=(5, 4), dpi=100)
ax_humidity = figure_humidity.add_subplot(1, 1, 1)
ax_humidity.set_title("Humidity Graph")
ax_humidity.set_xlabel("Time")
ax_humidity.set_ylabel("Humidity (%)")
ax_humidity.plot(
    [point[0] for point in humidity_data_points],
    [point[1] for point in humidity_data_points],
)

canvas_humidity = FigureCanvasTkAgg(figure_humidity, master=right_frame)
canvas_humidity.get_tk_widget().pack()

root.mainloop()