Published on

Masonite Filemanager

Authors

Features

  • Manager Server Files (Currently only supports local files)
  • Upload Files
  • Preview Files
  • Rename Files/Folders
  • Delete Files/Folders
  • Download Files
  • Move Files
  • Search Files
  • Protect Routes
  • Image Editing
  • Third Party Driver Support (S3, DigitalOcean Space, etc)
  • File Picker (Form)

Installation

pip install masonite-filemanager

Configuration

Add FileManagerProvider to your project in config/providers.py:

# config/providers.py
# ...
from filemanager.providers import FileManagerProvider

# ...
PROVIDERS = [
    # ...
    # Third Party Providers
    FileManagerProvider,
    # ...
]

Then you can publish the package resources (if needed) by doing:

python craft package:publish filemanager

Finally add following to STATICFILES section in config/filesystem.py:

# config/filesystem.py

STATICFILES = {
    # ...
    # FileManager resources
    'resources/vendor/filemanager': 'filemanager-assets/',
    "storage/framework/filesystem/filemanager": "filemanager-uploads/",
}

Usage

Once finishing configurations, you can access the file manager by using the following route:

http://localhost:8000/filemanager

If you want to use file picker then all you have to do is include then follow the following guidelines:

  1. Add style in the header of your base template:
    <link href="/filemanager-assets/picker.css" rel="stylesheet" />
    
  2. Add script before the </body> tag of your base template:
    <script src="/filemanager-assets/picker.js"></script>
    
  3. Finally, in your form you can use selector in your form in the following way:
    <div class="file-picker">
      <input type="hidden" name="j-sukai" />
    </div>
    
    or, if you want file-preview:
    <div class="file-picker has-preview">
      <input type="hidden" name="j-sukai" />
    </div>
    

The design of the file-picker is very basic so you might want to customize with your own design by modifying the stylesheet which resides in storage/vendor/filemanager directory.