Jupyter widget - upload file from browser
Project description
# Jupyter custom ipywidget: **ipyupload**
## 1 - Overview
This repo contains the source code and the building scripts for **ipyupload** a custom [ipywidget](https://ipywidgets.readthedocs.io/en/stable/).
It enables to upload a file from a Jupyter notebook - classic or JupyterLab.
It allows:
- single or multiple file upload
- to restrict the upload to certain file types
- to disable the file upload
Under the hood:
- The [FileReader](https://developer.mozilla.org/en-US/docs/Web/API/FileReader) Web API is used.
- Data is read throught the [readAsArrayBuffer()](https://developer.mozilla.org/en-US/docs/Web/API/FileReader/readAsArrayBuffer) method, then converted to a [DataView](https://developer.mozilla.org/en-US/docs/Web/JavaScript/Reference/Global_Objects/DataView) before syncing back to Python.
- The convertion to Python bytes uses the ipywidgets deserializer [bytes_serialization](https://github.com/jupyter-widgets/ipywidgets/blob/a5709728f71e21c81a89e8d123dde2068dd1e74d/ipywidgets/widgets/trait_types.py#L196) already used for the [Media core widget](https://github.com/jupyter-widgets/ipywidgets/blob/a5709728f71e21c81a89e8d123dde2068dd1e74d/ipywidgets/widgets/widget_media.py#L36).
- The metadata are synced back as a `List(Dict)`.
- The file contents are synced back as a `List(Bytes)`.
- An `Int` counter is observed and upon change triggers the aggregation of the data and presentation to the user as a dict {filename: {metadata, file content in bytes}) in the `.value` property.
After an upload the button displays the number of files uploaded, to provide feedback to the user.
Naturally such an upload widget is mostly useful in a widgetized notebook and/or in a JupyterHub context, with a remote kernel.
## 2 - Install
## 2.1 - User Install
>From terminal:
```bash
# for notebook >= 5.3
$ pip install ipyupload
# for notebook < 5.3
$ pip install ipyupload
$ jupyter nbextension install ipyupload --py --sys-prefix
```
## 2.2 - Developer Install
>From terminal:
```bash
$ git clone https://gitlab.com/oscar6echo/ipyupload.git
$ cd ipyupload/js
$ npm install
$ cd ..
$ pip install -e .
$ jupyter nbextension install --py --symlink --sys-prefix ipyupload
$ jupyter nbextension enable --py --sys-prefix ipyupload
```
# 3 - Use
```python
from IPython.display import display
from ipyupload import FileUpload
w = FileUpload(
# https://developer.mozilla.org/en-US/docs/Web/HTML/Element/input#attr-accept
# eg. '.txt', '.pdf', 'image/*', 'image/*,.pdf'
accept='', # default
# True to accept multiple files upload else False
multiple=False, # default
# True to disable the button else False to enable it
disabled=False, # default
# CSS transparently passed to button (in a fact a label element)
# e.g. 'color: darkblue; background-color: lightsalmon; width: 180px;'
style_button='' # default
)
display(w)
```
See the [demo notebook](https://nbviewer.jupyter.org/urls/gitlab.com/oscar6echo/ipyupload/blob/master/notebooks/demo-ipyupload.ipynb) for samples.
## 1 - Overview
This repo contains the source code and the building scripts for **ipyupload** a custom [ipywidget](https://ipywidgets.readthedocs.io/en/stable/).
It enables to upload a file from a Jupyter notebook - classic or JupyterLab.
It allows:
- single or multiple file upload
- to restrict the upload to certain file types
- to disable the file upload
Under the hood:
- The [FileReader](https://developer.mozilla.org/en-US/docs/Web/API/FileReader) Web API is used.
- Data is read throught the [readAsArrayBuffer()](https://developer.mozilla.org/en-US/docs/Web/API/FileReader/readAsArrayBuffer) method, then converted to a [DataView](https://developer.mozilla.org/en-US/docs/Web/JavaScript/Reference/Global_Objects/DataView) before syncing back to Python.
- The convertion to Python bytes uses the ipywidgets deserializer [bytes_serialization](https://github.com/jupyter-widgets/ipywidgets/blob/a5709728f71e21c81a89e8d123dde2068dd1e74d/ipywidgets/widgets/trait_types.py#L196) already used for the [Media core widget](https://github.com/jupyter-widgets/ipywidgets/blob/a5709728f71e21c81a89e8d123dde2068dd1e74d/ipywidgets/widgets/widget_media.py#L36).
- The metadata are synced back as a `List(Dict)`.
- The file contents are synced back as a `List(Bytes)`.
- An `Int` counter is observed and upon change triggers the aggregation of the data and presentation to the user as a dict {filename: {metadata, file content in bytes}) in the `.value` property.
After an upload the button displays the number of files uploaded, to provide feedback to the user.
Naturally such an upload widget is mostly useful in a widgetized notebook and/or in a JupyterHub context, with a remote kernel.
## 2 - Install
## 2.1 - User Install
>From terminal:
```bash
# for notebook >= 5.3
$ pip install ipyupload
# for notebook < 5.3
$ pip install ipyupload
$ jupyter nbextension install ipyupload --py --sys-prefix
```
## 2.2 - Developer Install
>From terminal:
```bash
$ git clone https://gitlab.com/oscar6echo/ipyupload.git
$ cd ipyupload/js
$ npm install
$ cd ..
$ pip install -e .
$ jupyter nbextension install --py --symlink --sys-prefix ipyupload
$ jupyter nbextension enable --py --sys-prefix ipyupload
```
# 3 - Use
```python
from IPython.display import display
from ipyupload import FileUpload
w = FileUpload(
# https://developer.mozilla.org/en-US/docs/Web/HTML/Element/input#attr-accept
# eg. '.txt', '.pdf', 'image/*', 'image/*,.pdf'
accept='', # default
# True to accept multiple files upload else False
multiple=False, # default
# True to disable the button else False to enable it
disabled=False, # default
# CSS transparently passed to button (in a fact a label element)
# e.g. 'color: darkblue; background-color: lightsalmon; width: 180px;'
style_button='' # default
)
display(w)
```
See the [demo notebook](https://nbviewer.jupyter.org/urls/gitlab.com/oscar6echo/ipyupload/blob/master/notebooks/demo-ipyupload.ipynb) for samples.
Project details
Download files
Download the file for your platform. If you're not sure which to choose, learn more about installing packages.
Source Distribution
ipyupload-0.1.0.tar.gz
(210.2 kB
view details)
Built Distribution
ipyupload-0.1.0-py2.py3-none-any.whl
(422.7 kB
view details)
File details
Details for the file ipyupload-0.1.0.tar.gz
.
File metadata
- Download URL: ipyupload-0.1.0.tar.gz
- Upload date:
- Size: 210.2 kB
- Tags: Source
- Uploaded using Trusted Publishing? No
- Uploaded via: twine/1.11.0 pkginfo/1.4.2 requests/2.19.1 setuptools/40.4.3 requests-toolbelt/0.8.0 tqdm/4.23.4 CPython/3.6.1
File hashes
Algorithm | Hash digest | |
---|---|---|
SHA256 | 0a77ee81f6daec6f56d46c96dbd3f3db0f73cb4980b00ec93c5a34e995fd2783 |
|
MD5 | bc426a9f45ca17495239e16c80131b9d |
|
BLAKE2b-256 | 20817eed7df8c88342d75524bf6cbfd8fa9e9fa2faf76d35c2674de14de4975d |
File details
Details for the file ipyupload-0.1.0-py2.py3-none-any.whl
.
File metadata
- Download URL: ipyupload-0.1.0-py2.py3-none-any.whl
- Upload date:
- Size: 422.7 kB
- Tags: Python 2, Python 3
- Uploaded using Trusted Publishing? No
- Uploaded via: twine/1.11.0 pkginfo/1.4.2 requests/2.19.1 setuptools/40.4.3 requests-toolbelt/0.8.0 tqdm/4.23.4 CPython/3.6.1
File hashes
Algorithm | Hash digest | |
---|---|---|
SHA256 | 5b2fc76802b82f663f569866a7d5aa65aa3a1b21cdc4a3da28fbef21316ccd61 |
|
MD5 | b7ef94823b5203cf6aa99c47d590b2ec |
|
BLAKE2b-256 | 8857f89fc675b0c1b68dab6da3d2375f62ec8a5ea18dd70566d721c34613b775 |