Search code examples
javascriptpython-3.xbrython

Invoke Brython function from JavaScript


EDIT: Google Group post

I'm playing with Brython.

I'm trying to figure out how to execute Brython code from JavaScript.

http://www.brython.info/static_doc/en/jsobjects.html <-- this looks like the relevant documentation page, but it seems to be lacking an example of invoking a Brython function from JavaScript.

For my specific situation, I am listening to MIDI events (using https://github.com/cwilso/WebMIDIAPIShim)

I want Brython code to execute in response to a MIDI event received.

Currently I'm trying:

function myMIDIMessagehandler( event ) 
{
    if( brythonListener != null )
        brythonListener( event );

and Brython code:

<script type="text/python3">

from browser import document as doc, window, html

def foo(event):
    print("BRYTHON!" + event);

window.brythonListener = foo

</script>

But when I press a note on my midi keyboard, I get:

enter image description here

I don't know what to make of this error, and I'm not at all sure the approach is sound.


Solution

  • It's been a year, so i guess you've solved this long ago, but fwiw your method is correct in principle, i do the same and it works when you've mapped it as you have with window.js_func = py_func. Here are some relevent bits from code i'm currently using that works on chromium / firefox:

    <!-- Bottom of HTML.. -->
    <script type="text/javascript">
    var jv_funcs = {
        openfile:function(iptElement, fileType){
            // some file opening code then a call back to python
            open_file(reader.result, fileType);
        }
    };
    </script>
    <script type="text/python3" src="src/pythonscript.py"></script>
    
    
    # separate python script in my case 'pythonscript.py'
    def open_file(fileContent, fileType):
        # show the file in the dom..
    
    def open_clicked():
        window.jv_funcs.openfile(document["idOpen"], "fileType")
    
    
    window.open_file = open_file
    document["btnOpen"].bind("click", open_clicked)
    

    Something that's useful to know is that if you use window.console.log(event) you'll get the event back as an object that you can explore from the dev tools. Print on the other hand flattens it into plain text.

    A bigger problem might be that it can be pretty tricky to figure out the cause of some types of errors using Brython (all respect to Brython though, it's amazing and works very well).

    One thing that makes it easier to get to the bottom of problems like this is sourcemapping. I recently moved a personal project from Brython to Transcrypt and found that Transcrypt's sourcemap support helps a lot to isolate reasons for errors. So much so that i didn't try to do it incrementally, but just boldly compiled the python source and followed up on the errors one by one until everything worked (python part is about 2700 lines). That would have been impossible for me in the other direction, but probably not for someone with knowledge of Brython internals.