PyScript OpenCV -- Blank Screen

[guruvishnuvardan]

I am attempting to load an opencv-python functionality to HTML using pyscript, but I am only getting blank browser screen after the messages - "Loading Runtime ... Runtime Created ... Initializing Components", as attached in the screenshot

Please find the python code and HTML for your review, Can you please let me know, if anything is wrong.

import cv2
import os
import numpy as np
import inotify.adapters
import glob
import time
from pathlib import Path
from rembg import remove, new_session
import glob
from pyscript import display


session = new_session()
edgeTotal = 0.0
for file in Path('/home/kali/Desktop/TVS/REMBG/').glob('*.png'):
    input_path = str(file)
    #output_path = str('/home/kali/Downloads/REMBG/' + (file.stem + ".out.png"))

    with open(input_path, 'rb') as i:
        input = i.read()
        #print(input)
        input_img = cv2.imread(input_path)
        #img = cv2.resize(input_img, (500, 500))
        img_gray = cv2.cvtColor(input_img, cv2.COLOR_BGR2GRAY)
        # Blur the image for better edge detection
        img_blur = cv2.GaussianBlur(img_gray, (3, 3), 0)
        gray = cv2.cvtColor(input_img, cv2.COLOR_BGR2GRAY)
        edged = cv2.Canny(gray, 30, 200)
        edgedRes = 0
        #edgeTotal = 0.0
        edgedRes = np.sum(edged)

        edgeTotal += edgedRes
        print("summa")
        print(edgeTotal)
        display(edgeTotal, target="mpl")

Thanks
Guru

[JeffersGlass]

PyScript has come a long way since the alpha release from 2022 - I would start by updating to the newest version and syntax. See the documentation for the scaffolding of what using modern PyScript looks like.

[JeffersGlass]

As a place to start, I don't know what the inotify or rembg packages are, but they probably want to be included in your configuration.

[guruvishnuvardan]

@JeffersGlass -- Thanks for your advise. I will change the Code , as per the samples from Pyscript website and I will also include the TOML Configuration file.

rembg is a package to remove background of an image and inotify is used for file handling in python.

I wil post the results shortly.

[guruvishnuvardan]

@JeffersGlass - Please note,I have updated the python code and HTML, but I am encountering the same result(blank screen) and I tried to execute the python code using the linux terminal, I have encountered the following error:

from pyscript import display
ImportError: cannot import name 'display' from 'pyscript' (/usr/local/lib/python3.11/dist-packages/pyscript/init.py)

Now, I am printing the value using print statement, instead of display from pyscript

Please find the attached code, HTML and config file

`import cv2
import os
import numpy as np
import glob
import time
from pathlib import Path
#from pyscript import display

#session = new_session()
edgeTotal = 0.0
for file in Path('/home/kali/Desktop/TVS/REMBG/').glob('*.png'):
input_path = str(file)
#output_path = str('/home/kali/Downloads/REMBG/' + (file.stem + ".out.png"))

with open(input_path, 'rb') as i:
    input = i.read()
    #print(input)
    input_img = cv2.imread(input_path)
    #img = cv2.resize(input_img, (500, 500))
    img_gray = cv2.cvtColor(input_img, cv2.COLOR_BGR2GRAY)
    # Blur the image for better edge detection
    img_blur = cv2.GaussianBlur(img_gray, (3, 3), 0)
    gray = cv2.cvtColor(input_img, cv2.COLOR_BGR2GRAY)
    edged = cv2.Canny(gray, 30, 200)
    edgedRes = 0
    #edgeTotal = 0.0
    edgedRes = np.sum(edged)
    edgeTotal += edgedRes
    #print(edge)
    print(edgeTotal)`

Config FIle:

name = "Edge"
description = "OpenCV Edge Detection"
packages = ["opencv-python", "numpy", "pathlib"]

Can you please let me know, if there is any mistake made again.

Thanks
GUru

[WebReflection]

for file in Path('/home/kali/Desktop/TVS/REMBG/').glob('*.png'):

you can't load files in PyScript from your local hard drive out of the box, you need to upload files or attach these to the virtual File System then grab these from there but also save these from there.

The pyscript namespace doesn't exist in pyodide out of the box so testing in Linux terminal won't bring you far neither ... they are the same pyodide but one has full access to your File System, the other one running on the Web can't directly access that due security reasons of the Web.

See this example on how to upload and download and put your logic with your packages in between: https://pyscript.recipes/2024.1.1/basic/file-upload/

[guruvishnuvardan]

@WebReflection -- Thanks for your response. I will work as per your advise.

[guruvishnuvardan]

Closing this Issue.