Flask not indexing list in template as expected

Hello, I have been running into this bug for a while now that I can’t figure out. I am trying to make a multiuser pixel art system similar to r/place on Reddit. The problem is that for some reason, it’s not detecting the pixel in the database even though it is there. I added print statements for both lists including the one that saves the entire database to improve loading speeds and repl db keys, and it’s in all of them. I have been trying to solve this bug for a while now but I can’t figure it out. I set it to turn the pixel it cant detect red, and it turns them all red. The main solution I want is to be able to detect the JSON for the pixel in the list, then take it from the list directly. I am struggling to detect the JSON though.
Is anyone able to help me?
Also sorry if my question is a little bit confusing
Repl link:
Server code:

import os
from flask import Flask, render_template
from flask_socketio import SocketIO, emit
from replit import db

app = Flask(__name__)
socketio = SocketIO(app)
app.config["TEMPLATES_AUTO_RELOAD"] = (
    True  # if true, it auto reloads templates if a change is made to them
app.secret_key = os.environ["SECRET_KEY"]  # The secret key
board_size = 60  # The size of the pixel board (Warning: A very large size may either break the app or overload repl db)
database = (
)  # Stores data from the database for faster loading speeds and optimization
keys = db.keys()  # Gets the keys
for i in keys:  # loops through all keys in the database

def index():
    """The index page (Board is on it)"""
    keys = db.keys()
    return render_template("index.html", size=board_size, db=database, keys=keys)

"""Socketio events"""

def change_pixel(pixel):
    db[pixel["Pixel"]] = pixel
        {"Pixel": pixel["Pixel"], "Color": pixel["Color"]},

socketio.run(app, host="")

Template code:

<!DOCTYPE html>
<html lang="en">
  <meta charset="UTF-8">
  <meta http-equiv="X-UA-Compatible" content="IE=edge">
  <meta name="viewport" content="width=device-width, initial-scale=1.0">
  <title>Pixel Board</title>
  <link rel="stylesheet" href="static/css/style.css">
  <script src="https://cdnjs.cloudflare.com/ajax/libs/socket.io/4.0.1/socket.io.js"></script>
<div id='board' class='board'>
    {% for i in range(0, size) %}
<div class='row'>
      {% for j in range(0, size) %}
        <div class='pixel' id='pixel_{{i}}_{{j}}' {%if "pixel_{{i}}_{{j}}" in db %} style='background-color: {{db["pixel_{{i}}_{{j}}"].Color}} {%else%} style='background-color:red '{%endif%} onclick='select({{i}}, {{j}})'></div>
    {% endfor %}
{% endfor %}
  <button id='submit_btn' disabled>Place Pixel</button>
  <script src='static/js/script.js'></script>
1 Like

This looks like a drop-in replacement for replit.db, then

1 Like

I will try this module, thank you