Can't call JS from Python.

[wimpykid719]

Thank you for good library.

Now I'm making desktop app with your library.

The app has function to show file writing progress.

Python

def get_progress(self, threads):
        while any(t.is_alive() for t in threads):
            with self.lock:
                percent = round(sum(self.percent.values()) / (self.count * 2))
                # sys.stdout.write('  {percent}%\r'.format(percent=percent))
                eel.putProgress(percent)
        print(f'  {percent}%', flush=True)

This function get a progress number like a 43. and I'm trying to send this number to frontend using eel.putProgress(percent). It can start app but it shows error. Could you help me please how do I write a code and call JS from Python

JS

class ProgressBar {
    constructor() {
        this.DOM = {};
        this.DOM.btn = document.querySelector('.downloadButton__circle');       
        this.DOM.container = document.querySelector('.downloadButton');
        this.DOM.icon = document.querySelector('.icon-arrow-down');
        this.DOM.progress = document.querySelector('.progressBar');
        this.DOM.inputURL = document.querySelectorAll('.dlcard__url > input');
        this.DOM.progressNumber = document.querySelector('#progress-css');
        this.eventType = this._getEventType();
        this._addEvent();
    }

    _getEventType() {
        //スマホで見る場合このプロパティが存在する事になる    True        False
        return window.ontouchstart ? 'touchstart' : 'click';
    }

    _transform() {
        const urls = []
        if(this.DOM.container.classList.contains('open')){
            this.DOM.icon.style.display = 'none';
            this.DOM.progress.style.display = 'block';
            console.log('付けました。')
            if(this.DOM.inputURL[0].value){
                this.DOM.inputURL.forEach((el) => {
                    urls.push(el.value)
                    });
                //Pythonプログラムを実行する。
                eel.dowload(urls);
            }
        }else{
            this.DOM.btn.style.position = '';
            this.DOM.icon.style.display = '';
            this.DOM.progress.style.display = 'none';
        }

    }

    _toggle() {
         this.DOM.container.classList.toggle('open');
    }

    // 分けたのは後でaddEventListerを複数登録する予定のため
    _addEvent() {
        // thisを束縛しないとaddEventListerが取得される。ためMobileMenu内の関数なので束縛が必要
        this.DOM.btn.addEventListener(this.eventType, this._toggle.bind(this));
        this.DOM.btn.addEventListener(this.eventType, this._transform.bind(this));
    }

    putProgress(n) {
        console.log(n)
        this.DOM.progressNumber.style.width = `${n}%`;

    }

}

const p = new ProgressBar();
const putProgress = p.putProgress()
eel.expose(putProgress) 

error

Uncaught TypeError: Cannot read property 'toString' of undefined
    at Object.expose (eel.js:10)
    at progress-bar.js:91

Here is every code push to github

Desktop (please complete the following information):

• OS: [OSX]
• Browser [chrome]
• Version [e.g. 86.0.4240.183]

[amantiwari1]

Hi, @wimpykid719

from python

def get_progress(self, threads):
        while any(t.is_alive() for t in threads):
            with self.lock:
                percent = round(sum(self.percent.values()) / (self.count * 2))
                # sys.stdout.write('  {percent}%\r'.format(percent=percent))
                eel.putProgress(percent)
        print(f'  {percent}%', flush=True)

JS

const p = new ProgressBar();
const putProgress = p.putProgress()
eel.expose(putProgress) 

to

Python

@eel.expose
def get_progress(self, threads):
        while any(t.is_alive() for t in threads):
            with self.lock:
                percent = round(sum(self.percent.values()) / (self.count * 2))
                # sys.stdout.write('  {percent}%\r'.format(percent=percent))
                eel.putProgress(percent)
        print(f'  {percent}%', flush=True)

JS

const p = new ProgressBar();
const putProgress = p.putProgress()
window.eel.expose(putProgress, "putProgress") 

let me know It works or not

[wimpykid719]

Hi Sorry for late rep I think It doesn't matter I already solve this problem 4 month ago. And I forget how did I do. but I update my github repository so We can see what is changed.