DEV Community

Cover image for Folder and File Explorer Widget in Javascript
cubiclesocial
cubiclesocial

Posted on • Edited on

Folder and File Explorer Widget in Javascript

After over two months of design and development (and lots of debugging), the CubicleSoft File Explorer widget is ready!

GitHub logo cubiclesoft / js-fileexplorer

A zero dependencies, customizable, pure Javascript widget for navigating, managing, uploading, and downloading files and folders or other hierarchical object structures on any modern web browser.

Here's a live demo of the widget:

Things you can do with the widget (non-exhaustive list):

  • Create new folders and files.
  • Rename folders and files.
  • Upload files and entire folders. Supports drag-and-drop from the desktop.
  • Download files one by one OR a bunch of files and/or entire folders as streaming ZIP files.
  • Cut/copy/paste using the clipboard. Even works between different web browsers.
  • Drag-and-drop items to move them to another folder. Even works between different browser tabs.
  • Delete files and folders and/or move them to a recycling bin.
  • Select multiple folders and files. Many different ways to do this.
  • Open files. (Open being application-defined.)
  • Navigate back and forth through folder history.

If I were to pick one feature as my favorite, it would have to be the mouse click + drag selection box with variable speed scrolling. I sunk more time into that feature than I probably should have.

I look forward to reading what you think about this widget in the comments below! Or just hit the heart/unicorn button and/or star the repo or whatever. That's cool too.

Top comments (0)