File Manager

File Manager is a Gramex app used to upload, download, rename, delete and annotate files within a Gramex application.

Usage

FileManager can be imported in a Gramex app as follows:

  import:
    filemanager:
      path: $GRAMEXAPPS/filemanager/gramex.yaml
      YAMLURL: $YAMLURL/filemanager/
  

This mounts the FileManager page at /filemanager/. For each DriveHandler endpoint configured in your Gramex app, the FileManager page shows a FormHandler table of files stored in that drive. This table can be used to:

• Upload new files - Click the "Upload" button, or drop files anywhere on the table.
• Download files - Click any file under the "File" column to download it.
• Delete existing files - Click the cross for a file under the "Delete" column.
• Rename files - Click the "Edit" button, make changes to filenames, and click "Save".

FileManager Options

FileManager can be configured by using options under FILEMANAGER_KWARGS in gramex.yaml as follows:

  import:
    filemanager:
      path: $GRAMEXAPPS/filemanager/gramex.yaml
      YAMLURL: $YAMLURL/filemanager/
      FILEMANAGER_KWARGS:
        drives: ['drive1', 'drive2']              # Show only these drives in the FileManager page
        title: "MyAwesomeFileManager"             # Title of the FileManager page
        logo: $YAMLPATH/data/assets/gramener.png  # Logo for the FileManager page
        theme: ...                                # Bootstrap theme for the FileManager page.
  

Drive Handler

DriveHandler allows uploading, downloading, renaming, deletion and annotation of files in a Gramex application.

Usage

Use DriveHandler in Gramex app as follows:

url:
  pattern: /$YAMLURL/mydrive
  handler: DriveHandler
  kwargs:
    path: $YAMLPATH/path/to/drive  # folder where files are stored
    user_fields: [id, role, hd]         # user attributes to store
    tags: [tag]                         # <input name=""> to store
    allow: [.doc, .docx]            # Only allow these files
    ignore: [.pdf]                 # Exclude these files
    max_file_size: 100000                # Files must be smaller than this
    redirect:                           # After uploading the file,
        query: next                     #   ... redirect to ?next=
        url: /$YAMLURL/                 #   ... else to this directory

This endpoint is a FormHandler that allows:

• GET ?ext=.xlsx - List Excel files (FormHandler interface)
• GET ?_format=file&id=2 - Download file with ID=2
• PUT ?id=3&file=abc.txt - Rename file with ID=3 to abc.txt
• PUT ?id=3&mime=text/html&tag=x - Set MIME type type and tag of ID=4
• DELETE ?id=4 - Delete file with ID=4
• POST ?tag=x&tag=y - Upload one or more files. Tag 1st file as x, 2nd as y

Embedding FileManager

Just like FormHandler, the FileManager component can be embedded in any <div> element, as follows:

  <!-- Include Dropzone and moment -->
  <link rel="stylesheet" href="ui/dropzone/dist/min/dropzone.min.css">
  <script src="ui/dropzone/dist/min/dropzone.min.js"></script>
  <script src="ui/moment/min/moment-with-locales.min.js"></script>
  <div class="filemanager" data-src="drive"></div>
  <script>
    Dropzone.autodiscover = false
    $('.filemanager').filemanager({
      pageSize: 4,
      data: ...,
      columns: [
        {name: "foo"},
        {name: "bar"}
      ]
      // FormHandler options
    })
  </script>