| Name | droppablefileinput JSON |
| Version |
0.1.2
JSON |
| download |
| home_page | None |
| Summary | DroppableFileInput is a custom Django widget that enhances the usability of file input forms by allowing users to drag and drop files. This widget utilizes JavaScript to provide interactive feedback, such as highlighting the drop area when a file is dragged over and displaying file details on the page. |
| upload_time | 2025-09-08 14:20:10 |
| maintainer | None |
| docs_url | None |
| author | None |
| requires_python | <4.0,>=3.11 |
| license | MIT License Copyright (c) 2024, Krystof Beuermann Permission is hereby granted, free of charge, to any person obtaining a copy of this software and associated documentation files (the "Software"), to deal in the Software without restriction, including without limitation the rights to use, copy, modify, merge, publish, distribute, sublicense, and/or sell copies of the Software, and to permit persons to whom the Software is furnished to do so, subject to the following conditions: The above copyright notice and this permission notice shall be included in all copies or substantial portions of the Software. THE SOFTWARE IS PROVIDED "AS IS", WITHOUT WARRANTY OF ANY KIND, EXPRESS OR IMPLIED, INCLUDING BUT NOT LIMITED TO THE WARRANTIES OF MERCHANTABILITY, FITNESS FOR A PARTICULAR PURPOSE AND NONINFRINGEMENT. IN NO EVENT SHALL THE AUTHORS OR COPYRIGHT HOLDERS BE LIABLE FOR ANY CLAIM, DAMAGES OR OTHER LIABILITY, WHETHER IN AN ACTION OF CONTRACT, TORT OR OTHERWISE, ARISING FROM, OUT OF OR IN CONNECTION WITH THE SOFTWARE OR THE USE OR OTHER DEALINGS IN THE SOFTWARE. |
| keywords |
django
drag-and-drop
file
upload
widget
|
| VCS |
 |
| bugtrack_url |
|
| requirements |
No requirements were recorded.
|
| Travis-CI |
No Travis.
|
| coveralls test coverage |
No coveralls.
|
# droppablefileinput
[](https://img.shields.io/github/v/release/blackbox-innovation/django-droppablefileinput)
[](https://github.com/blackbox-innovation/django-droppablefileinput/actions/workflows/main.yml?query=branch%3Amain)
[](https://codecov.io/gh/blackbox-innovation/django-droppablefileinput)
[](https://img.shields.io/github/commit-activity/m/blackbox-innovation/django-droppablefileinput)
[](https://img.shields.io/github/license/blackbox-innovation/django-droppablefileinput)
DroppableFileInput is a custom Django widget that enhances the usability of file input forms by allowing users to drag and drop files. This widget utilizes JavaScript to provide interactive feedback, such as highlighting the drop area when a file is dragged over and displaying file details on the page. This uses no external JavaScript dependencies, all functionality is brought by this package.
- **Github repository**: <https://github.com/blackbox-innovation/django-droppablefileinput/>
- **Documentation**: <https://blackbox-innovation.github.io/droppablefileinput/>
## Features
- **Drag and Drop**: Easy file uploading by dragging files into the drop area.
- **Interactive Feedback**: Highlights the drop area during a drag operation and shows file details once a file is selected.
- **Size Validation**: Validates the file size on the client side before submitting to the server.
- **Type Validation**: Ensures that only allowed file types can be uploaded.
- **Auto Submit**: Optionally auto-submits the form once a file is selected.
## Installation
To install DroppableFileInput, you can download it directly from GitHub or use pip:
```python
pip install git+https://github.com/blackbox-innovation/django-droppablefileinput.git
```
Setup
-----
After installation, add `droppablefileinput` to your `INSTALLED_APPS` in your Django settings:
```python
INSTALLED_APPS = [
...
'droppablefileinput',
...
]
```
Ensure you have Django's static file handling set up, as this widget relies on associated CSS and JavaScript files.
Usage
-----
To use the `DroppableFileInput` in your Django forms, import the widget and use it in a form field:
```python
from django import forms
from droppablefileinput.widgets import DroppableFileInput
class UploadForm(forms.Form):
file = forms.FileField(widget=DroppableFileInput())
```
In your templates, make sure to include the form's media:
```html
<!DOCTYPE html>
<html lang="en">
<head>
<meta charset="UTF-8" />
<title>Upload File</title>
{{ form.media }}
</head>
<body>
<form method="post" enctype="multipart/form-data">
{% csrf_token %} {{ form.as_p }}
<button type="submit">Upload</button>
</form>
</body>
</html>
```
Customization
-------------
The `DroppableFileInput` widget can be customized with the following parameters:
- `auto_submit`: Whether to auto-submit the form upon file selection.
- `max_file_size`: Maximum file size allowed for upload.
- `allowed_types`: List of allowed file MIME types.
- `icon_url`: URL to the icon image to display in the drop area.
- `icon_width`: Width of the icon image.
- `icon_height`: Height of the icon image.
Example:
```python
class UploadForm(forms.Form):
file = forms.FileField(widget=DroppableFileInput(
auto_submit=True,
max_file_size="10M",
allowed_types="image/jpeg,image/png",
icon_url=static('images/custom-icon.svg'),
icon_width=40,
icon_height=40
))
```
Contributing
------------
Contributions are welcome! If you would like to contribute to this project, please follow these steps:
1. Fork the repository on GitHub.
2. Clone your forked repository to your local machine.
3. Create a new branch for your feature or fix.
4. Make changes and test.
5. Submit a pull request with a clear description of the changes and any relevant issue numbers.
License
-------
Distributed under the MIT License. See `LICENSE` file for more information.
Support
-------
If you have any issues or feature requests, please file an issue on the GitHub repository issue tracker.
Raw data
{
"_id": null,
"home_page": null,
"name": "droppablefileinput",
"maintainer": null,
"docs_url": null,
"requires_python": "<4.0,>=3.11",
"maintainer_email": null,
"keywords": "django, drag-and-drop, file, upload, widget",
"author": null,
"author_email": "Krystof Beuermann <krystof@blackbox.ms>",
"download_url": "https://files.pythonhosted.org/packages/72/37/8bad099d6fa012185f034e9f497e8fc70b42049d76c37e9e339298a74810/droppablefileinput-0.1.2.tar.gz",
"platform": null,
"description": "# droppablefileinput\n\n\n[](https://img.shields.io/github/v/release/blackbox-innovation/django-droppablefileinput)\n[](https://github.com/blackbox-innovation/django-droppablefileinput/actions/workflows/main.yml?query=branch%3Amain)\n[](https://codecov.io/gh/blackbox-innovation/django-droppablefileinput)\n[](https://img.shields.io/github/commit-activity/m/blackbox-innovation/django-droppablefileinput)\n[](https://img.shields.io/github/license/blackbox-innovation/django-droppablefileinput)\n\n\nDroppableFileInput is a custom Django widget that enhances the usability of file input forms by allowing users to drag and drop files. This widget utilizes JavaScript to provide interactive feedback, such as highlighting the drop area when a file is dragged over and displaying file details on the page. This uses no external JavaScript dependencies, all functionality is brought by this package.\n\n\n- **Github repository**: <https://github.com/blackbox-innovation/django-droppablefileinput/>\n- **Documentation**: <https://blackbox-innovation.github.io/droppablefileinput/>\n\n## Features\n\n- **Drag and Drop**: Easy file uploading by dragging files into the drop area.\n- **Interactive Feedback**: Highlights the drop area during a drag operation and shows file details once a file is selected.\n- **Size Validation**: Validates the file size on the client side before submitting to the server.\n- **Type Validation**: Ensures that only allowed file types can be uploaded.\n- **Auto Submit**: Optionally auto-submits the form once a file is selected.\n\n## Installation\n\nTo install DroppableFileInput, you can download it directly from GitHub or use pip:\n```python\npip install git+https://github.com/blackbox-innovation/django-droppablefileinput.git\n```\n\n\nSetup\n-----\nAfter installation, add `droppablefileinput` to your `INSTALLED_APPS` in your Django settings:\n\n\n```python\nINSTALLED_APPS = [\n...\n'droppablefileinput',\n...\n]\n```\n\n\nEnsure you have Django's static file handling set up, as this widget relies on associated CSS and JavaScript files.\n\n\nUsage\n-----\nTo use the `DroppableFileInput` in your Django forms, import the widget and use it in a form field:\n\n\n```python\nfrom django import forms\nfrom droppablefileinput.widgets import DroppableFileInput\nclass UploadForm(forms.Form):\nfile = forms.FileField(widget=DroppableFileInput())\n```\n\n\nIn your templates, make sure to include the form's media:\n\n\n```html\n<!DOCTYPE html>\n<html lang=\"en\">\n <head>\n <meta charset=\"UTF-8\" />\n <title>Upload File</title>\n {{ form.media }}\n </head>\n <body>\n <form method=\"post\" enctype=\"multipart/form-data\">\n {% csrf_token %} {{ form.as_p }}\n <button type=\"submit\">Upload</button>\n </form>\n </body>\n</html>\n\n\n```\nCustomization\n-------------\n\n\nThe `DroppableFileInput` widget can be customized with the following parameters:\n- `auto_submit`: Whether to auto-submit the form upon file selection.\n- `max_file_size`: Maximum file size allowed for upload.\n- `allowed_types`: List of allowed file MIME types.\n- `icon_url`: URL to the icon image to display in the drop area.\n- `icon_width`: Width of the icon image.\n- `icon_height`: Height of the icon image.\n\nExample:\n\n\n```python\nclass UploadForm(forms.Form):\n file = forms.FileField(widget=DroppableFileInput(\n auto_submit=True,\n max_file_size=\"10M\",\n allowed_types=\"image/jpeg,image/png\",\n icon_url=static('images/custom-icon.svg'),\n icon_width=40,\n icon_height=40\n))\n```\n\n\n\nContributing\n------------\nContributions are welcome! If you would like to contribute to this project, please follow these steps:\n1. Fork the repository on GitHub.\n2. Clone your forked repository to your local machine.\n3. Create a new branch for your feature or fix.\n4. Make changes and test.\n5. Submit a pull request with a clear description of the changes and any relevant issue numbers.\n\nLicense\n-------\nDistributed under the MIT License. See `LICENSE` file for more information.\n\n\nSupport\n-------\nIf you have any issues or feature requests, please file an issue on the GitHub repository issue tracker.",
"bugtrack_url": null,
"license": "MIT License Copyright (c) 2024, Krystof Beuermann Permission is hereby granted, free of charge, to any person obtaining a copy of this software and associated documentation files (the \"Software\"), to deal in the Software without restriction, including without limitation the rights to use, copy, modify, merge, publish, distribute, sublicense, and/or sell copies of the Software, and to permit persons to whom the Software is furnished to do so, subject to the following conditions: The above copyright notice and this permission notice shall be included in all copies or substantial portions of the Software. THE SOFTWARE IS PROVIDED \"AS IS\", WITHOUT WARRANTY OF ANY KIND, EXPRESS OR IMPLIED, INCLUDING BUT NOT LIMITED TO THE WARRANTIES OF MERCHANTABILITY, FITNESS FOR A PARTICULAR PURPOSE AND NONINFRINGEMENT. IN NO EVENT SHALL THE AUTHORS OR COPYRIGHT HOLDERS BE LIABLE FOR ANY CLAIM, DAMAGES OR OTHER LIABILITY, WHETHER IN AN ACTION OF CONTRACT, TORT OR OTHERWISE, ARISING FROM, OUT OF OR IN CONNECTION WITH THE SOFTWARE OR THE USE OR OTHER DEALINGS IN THE SOFTWARE. ",
"summary": "DroppableFileInput is a custom Django widget that enhances the usability of file input forms by allowing users to drag and drop files. This widget utilizes JavaScript to provide interactive feedback, such as highlighting the drop area when a file is dragged over and displaying file details on the page.",
"version": "0.1.2",
"project_urls": {
"Homepage": "https://github.com/krystofbe/droppablefileinput",
"Issues": "https://github.com/krystofbe/droppablefileinput/issues",
"Repository": "https://github.com/krystofbe/droppablefileinput"
},
"split_keywords": [
"django",
" drag-and-drop",
" file",
" upload",
" widget"
],
"urls": [
{
"comment_text": null,
"digests": {
"blake2b_256": "16408fc4fff6051d6ec87831ab26e2daff8eceb6517b23f45a7031f3b2920f96",
"md5": "249726360160efcec949da90d53858f0",
"sha256": "ec8b8e3b48b35dd4856aa9fbd6befd20c586bfff4c486e9265c85c260745a419"
},
"downloads": -1,
"filename": "droppablefileinput-0.1.2-py3-none-any.whl",
"has_sig": false,
"md5_digest": "249726360160efcec949da90d53858f0",
"packagetype": "bdist_wheel",
"python_version": "py3",
"requires_python": "<4.0,>=3.11",
"size": 14583,
"upload_time": "2025-09-08T14:20:09",
"upload_time_iso_8601": "2025-09-08T14:20:09.235844Z",
"url": "https://files.pythonhosted.org/packages/16/40/8fc4fff6051d6ec87831ab26e2daff8eceb6517b23f45a7031f3b2920f96/droppablefileinput-0.1.2-py3-none-any.whl",
"yanked": false,
"yanked_reason": null
},
{
"comment_text": null,
"digests": {
"blake2b_256": "72378bad099d6fa012185f034e9f497e8fc70b42049d76c37e9e339298a74810",
"md5": "dd7154dbe5acb4d584dc3ee0243b529e",
"sha256": "d2514086ad89cbc46c320d530d382a9fe1f1411b452ffe8e73a070ac7d87c8a5"
},
"downloads": -1,
"filename": "droppablefileinput-0.1.2.tar.gz",
"has_sig": false,
"md5_digest": "dd7154dbe5acb4d584dc3ee0243b529e",
"packagetype": "sdist",
"python_version": "source",
"requires_python": "<4.0,>=3.11",
"size": 58198,
"upload_time": "2025-09-08T14:20:10",
"upload_time_iso_8601": "2025-09-08T14:20:10.320430Z",
"url": "https://files.pythonhosted.org/packages/72/37/8bad099d6fa012185f034e9f497e8fc70b42049d76c37e9e339298a74810/droppablefileinput-0.1.2.tar.gz",
"yanked": false,
"yanked_reason": null
}
],
"upload_time": "2025-09-08 14:20:10",
"github": true,
"gitlab": false,
"bitbucket": false,
"codeberg": false,
"github_user": "krystofbe",
"github_project": "droppablefileinput",
"github_not_found": true,
"lcname": "droppablefileinput"
}
