File input

[Parsa Ghaffari]

Hi folks,

I'd like to build a new block that inputs a file via an html `input[type=file]` and outputs its content (e.g. using `FileReader`) to other blocks. How should I go about doing this?

Thanks,

Parsa

[Neil Fraser]

Keep in mind that JavaScript's FileReader API is asynchronous. So
this means that you can't easily create a single block that chooses a
file and returns the file's contents. This isn't a limitation of
Blockly, it is a limitation of JavaScript FileReader.

So you will need two blocks. One statement block that initiates a
FileReader request, and a second block (that looks like a function
definition) that gets called when the FileReader's onload event fires.
If you only allow a single FileReader, then these two blocks are
reasonably simple to add. Things get more complicated if you want
multiple FileReaders fetching different files concurrently.

> --
> You received this message because you are subscribed to the Google Groups
> "Blockly" group.
> To unsubscribe from this group and stop receiving emails from it, send an
> email to blockly+u...@googlegroups.com.
> For more options, visit https://groups.google.com/groups/opt_out.



--
Neil Fraser
http://neil.fraser.name

[Parsa Ghaffari]

Thanks for noting the async nature of FileReader and the concurrency issues that might arise – both are valid concerns that need to be addressed.

Putting those issues aside, how would you go about implementing these two new blocks? Where does the file input element go and how would the block definition interact with it?