Features/lazy loading

src/models/system_information.py

@@ -23,5 +23,8 @@ class SystemInformation(db.Model):
     battery_percent = db.Column(db.Float, nullable=False)
     network_sent = db.Column(db.Float, nullable=False)
     network_received = db.Column(db.Float, nullable=False)
+    dashboard_memory_usage = db.Column(db.Float, nullable=False)
+    cpu_frequency = db.Column(db.Float, nullable=False)
+    current_temp = db.Column(db.Float, nullable=False)
     timestamp = db.Column(db.DateTime, nullable=False)
 

src/routes/__init__.py

@@ -14,4 +14,6 @@
 from src.routes.user import user_bp
 from src.routes.graphs import graphs_bp
 from src.routes.ping import ping_bp
-from src.routes.firewall import firewall_bp
+from src.routes.firewall import firewall_bp
+from src.routes.health import health_bp
+from src.routes.api import api_bp

src/routes/api.py

@@ -0,0 +1,56 @@
+import psutil
+from flask import jsonify, blueprints
+from flask_login import login_required
+from src.config import app
+from src.models import SystemInformation
+from src.utils import cpu_usage_percent, get_cpu_temp, get_cpu_frequency, _get_system_info
+
+api_bp = blueprints.Blueprint("api", __name__)
+
+
+@app.route("/api/system-info", methods=["GET"])
+@login_required
+def cpu_percent_api():
+    system_info = _get_system_info()
+    return jsonify(system_info)
+
+
+@app.route('/api/graphs_data')
+@login_required
+def graph_data_api():
+    # Query the last 3 entries from the SystemInformation table
+    recent_system_info_entries = SystemInformation.query.all()
+
+    if recent_system_info_entries:
+        # Extract data from the query results
+        time_data = [info.timestamp for info in recent_system_info_entries]
+        cpu_data = [info.cpu_percent for info in recent_system_info_entries]
+        memory_data = [info.memory_percent for info in recent_system_info_entries]
+        battery_data = [info.battery_percent for info in recent_system_info_entries]
+        network_sent_data = [info.network_sent for info in recent_system_info_entries]
+        network_received_data = [info.network_received for info in recent_system_info_entries]
+        dashboard_memory_usage = [info.dashboard_memory_usage for info in recent_system_info_entries]
+        cpu_frequency = [info.cpu_frequency for info in recent_system_info_entries]
+        current_temp = [info.current_temp for info in recent_system_info_entries]
+    else:
+        time_data = []
+        cpu_data = []
+        memory_data = []
+        battery_data = []
+        network_sent_data = []
+        network_received_data = []
+        dashboard_memory_usage = []
+        cpu_frequency = []
+        current_temp = []
+
+    return jsonify({
+        "time": time_data,
+        "cpu": cpu_data,
+        "memory": memory_data,
+        "battery": battery_data,
+        "network_sent": network_sent_data,
+        "network_received": network_received_data,
+        "dashboard_memory_usage": dashboard_memory_usage,
+        "cpu_frequency": cpu_frequency,
+        "current_temp": current_temp
+    })

src/routes/cpu_info.py

@@ -28,13 +28,4 @@ def cpu_usage():
         "critical_temp": critical_temp,
     }
 
-    recent_system_info_entries = SystemInformation.query.all()
-    if recent_system_info_entries:
-        cpu_data = [info.cpu_percent for info in recent_system_info_entries]
-        time_data = [info.timestamp for info in recent_system_info_entries]
-    else:
-        cpu_data = []
-        time_data = []
-
-    return render_template("info_pages/cpu_info.html", system_info=system_info,
-                            cpu=cpu_data, time=time_data)
+    return render_template("info_pages/cpu_info.html", system_info=system_info)

src/routes/dashboard.py

@@ -59,9 +59,3 @@ def dashboard():
             last_timestamp=last_speedtest_timestamp,
             current_user=current_user,
         )
-
-
-# health page
-@app.route("/health", methods=["GET"])
-def health():
-    return jsonify({"status": "ok"})

src/routes/graphs.py

@@ -1,33 +1,11 @@
 from flask import render_template, blueprints
+from flask_login import login_required
 from src.config import app
-from src.models import SystemInformation
 
 graphs_bp = blueprints.Blueprint("graphs", __name__)
 
 
 @app.route('/graphs')
+@login_required
 def graphs():
-    # Query the last 3 entries from the SystemInformation table
-    recent_system_info_entries = SystemInformation.query.all()
-
-    if recent_system_info_entries:
-        # Extract data from the query results
-        time_data = [info.timestamp for info in recent_system_info_entries]
-        cpu_data = [info.cpu_percent for info in recent_system_info_entries]
-        memory_data = [info.memory_percent for info in recent_system_info_entries]
-        battery_data = [info.battery_percent for info in recent_system_info_entries]
-        network_sent_data = [info.network_sent for info in recent_system_info_entries]
-        network_received_data = [info.network_received for info in recent_system_info_entries]
-    else:
-        time_data = []
-        cpu_data = []
-        memory_data = []
-        battery_data = []
-        network_sent_data = []
-        network_received_data = []
-
-    # Pass the data to the template
-    return render_template('graphs.html', cpu=cpu_data, time=time_data, 
-                           memory=memory_data, battery=battery_data, 
-                           network_sent=network_sent_data, 
-                           network_received=network_received_data)
+    return render_template('graphs.html')

src/routes/health.py

@@ -0,0 +1,10 @@
+from flask import jsonify, blueprints
+from src.config import app
+
+health_bp = blueprints.Blueprint("health", __name__)
+
+# health page
+@app.route("/health", methods=["GET"])
+def health():
+    return jsonify({"status": "ok"})
+

src/routes/user.py

@@ -99,18 +99,20 @@ def change_user_settings(username):
         new_username = request.form['username']
         new_email = request.form['email']
         new_user_level = request.form['user_level']
+        new_profession = request.form['profession']
         receive_email_alerts = 'receive_email_alerts' in request.form
 
         # Update user details
         user.username = new_username
         user.email = new_email
         user.user_level = new_user_level
         user.receive_email_alerts = receive_email_alerts
+        user.profession = new_profession
 
         db.session.commit()
 
         flash('User settings updated successfully!', 'success')
-        return redirect(url_for('change_user_settings', username=user.username))
+        return redirect(url_for('view_users', username=user.username))
 
     return render_template('users/change_user.html', user=user)
 
@@ -181,4 +183,31 @@ def change_password():
         flash('Password changed successfully!', 'success')
         return redirect(url_for('view_profile'))
 
-    return render_template('users/change_password.html')
+    return render_template('users/change_password.html')
+
+@app.route('/edit_profile', methods=['GET', 'POST'])
+@login_required
+def edit_profile():
+    """
+    This route allows the user to edit their profile information.
+    """
+    user = current_user  # Get the currently logged-in user
+
+    if request.method == 'POST':
+        new_username = request.form['username']
+        new_email = request.form['email']
+        profession = request.form['profession']
+        receive_email_alerts = 'receive_email_alerts' in request.form
+
+        # Update user information
+        user.username = new_username
+        user.email = new_email
+        user.profession = profession
+        user.receive_email_alerts = receive_email_alerts
+
+        db.session.commit()
+
+        flash('Profile updated successfully!', 'success')
+        return redirect(url_for('view_profile'))
+
+    return render_template('users/edit_profile.html', user=user)

src/static/css/edit_profile.css

@@ -0,0 +1,49 @@
+/* static/css/edit_profile.css */
+
+form {
+    max-width: 600px;
+    margin: 0 auto;
+    padding: 20px;
+    border-radius: 8px;
+    background-color: #f7f7f7;
+    box-shadow: 0 0 10px rgba(0, 0, 0, 0.1);
+}
+
+.form-group {
+    margin-bottom: 15px;
+}
+
+.form-group label {
+    font-weight: bold;
+    display: block;
+    margin-bottom: 5px;
+}
+
+.form-group input {
+    width: 100%;
+    padding: 10px;
+    font-size: 16px;
+    border-radius: 4px;
+    border: 1px solid #ccc;
+}
+
+.form-group input[type="checkbox"] {
+    display: inline-block;
+    width: auto;
+    margin-left: 10px;
+}
+
+.btn {
+    display: inline-block;
+    padding: 10px 20px;
+    font-size: 16px;
+    border-radius: 4px;
+    background-color: #007bff;
+    color: white;
+    border: none;
+    cursor: pointer;
+}
+
+.btn:hover {
+    background-color: #0056b3;
+}

src/static/css/footer.css

@@ -1,48 +1,33 @@
+body, html {
+    height: 100%;
+    margin: 0;
+}
+
+.container {
+    min-height: 100%;
+    flex-direction: column;
+}
+
+.content {
+    flex: 1;
+    /* Other content styling */
+}
+
 footer {
-    background-color: #343a40;
-    color: #adb5bd;
-    padding: 1rem 0;
+    background-color: #333;
+    color: white;
     text-align: center;
+    padding: 10px;
+    position: relative;
     width: 100%;
-    position: sticky;
     bottom: 0;
-    z-index: 1000;
-    box-shadow: 0 -2px 10px rgba(0, 0, 0, 0.3);
-    transition: background-color 0.3s ease;
 }
 
-footer:hover {
-    background-color: #495057;
-}
-
-
 footer a {
-    color: #3498db;
+    color: white;
     text-decoration: none;
 }
 
 footer a:hover {
     text-decoration: underline;
 }
-
-footer p {
-    margin: 0;
-    padding: 0;
-    font-size: 0.9rem;
-}
-
-footer .social-icons {
-    margin-top: 0.5rem;
-}
-
-footer .social-icons a {
-    color: #adb5bd;
-    font-size: 1.2rem;
-    margin: 0 10px;
-    transition: color 0.3s ease, transform 0.3s ease;
-}
-
-footer .social-icons a:hover {
-    color: #ffffff;
-    transform: scale(1.1);
-}

src/static/css/style.css

@@ -38,13 +38,20 @@
 
 /* General Styles */
 body {
-    font-family: 'Segoe UI', Tahoma, Geneva, Verdana, sans-serif; /* Default font stack */
+    font-family: 'Roboto', sans-serif;
     color: #333;
     background-size: cover; /* Ensure the image covers the entire background */
     background-repeat: no-repeat; /* Prevent the image from repeating */
     background-position: center center; /* Center the image */
 }
 
+
+
+.card-title {
+    font-weight: 600;
+    font-size: 1.25rem;
+}
+
 .header {
     background-color: #343a40;
     color: #ffffff;