angular-filemanager

File manager developed with AngularJS and Bootstrap by Jonas Sciangula Street

Try the DEMO (only listing)

---

App Features

• Multilanguage (English / Spanish / Portuguese)
• Multiple templates (List / Icons)
• Multiple file upload
• Search files
• Directory tree navigation
• Copy (Interactive UX)
• Move (Interactive UX)
• Rename
• Delete
• Edit
• Preview
• Download

External Libs / Plugins used

• @angular
• @angular-cookies
• @angular-translate
• @bootstrap
• @jquery

TODO

• Multiple file selector (nice to have)
• Unix chmod permissions
• Backend controllers (PHP, Python, NodeJS, .Net, etc)

---

Backend API

Listing

URL: $config.listUrl
Method: POST

JSON Request content

{
    "params": {
        "mode": "list",
        "onlyFolders": false,
        "path": "/public_html"
    }
}

JSON Response

{
    "result": [
        {
            "name": "joomla",
            "rights": "drwxr-xr-x",
            "size": "4096",
            "time": "16:07",
            "type": "dir"
        },
        {
            "name": "magento",
            "rights": "drwxr-xr-x",
            "size": "4096",
            "time": "17:42",
            "type": "dir"
        },
        {
            "name": ".htaccess",
            "rights": "-rw-r--r--",
            "size": "0",
            "time": "17:42",
            "type": "file"
        },
        {
            "name": "index.php",
            "rights": "-rw-r--r--",
            "size": "0",
            "time": "17:41",
            "type": "file"
        }
    ]
}

---

Rename / Move

URL: $config.renameUrl
Method: POST

JSON Request content

{
    "params": {
        "mode": "rename",
        "path": "/public_html/index.php",
        "newPath": "/public_html/index2.php"
    }
}

JSON Response

{
    "result": {
        "success": true,
        "error": null
    }
}

---

Copy

URL: $config.copyUrl
Method: POST

JSON Request content

{
    "params": {
        "mode": "copy",
        "path": "/public_html/index.php",
        "newPath": "/public_html/index-copy.php"
    }
}

JSON Response

{
    "result": {
        "success": true,
        "error": null
    }
}

---

Remove

URL: $config.removeUrl
Method: POST

JSON Request content

{
    "params": {
        "mode": "delete",
        "path": "/public_html/index.php",
    }
}

JSON Response

{
    "result": {
        "success": true,
    	"error": null
    }
}

---

Edit file

URL: $config.removeUrl
Method: POST

JSON Request content

{
    "params": {
        "mode": "edit",
        "content": "<?php echo random(); ?>",
        "path": "/public_html/index.php",
    }
}

JSON Response

{
    "result": {
        "success": true,
        "error": null
    }
}

---

Get content of a file

URL: $config.getContentUrl
Method: POST

JSON Request content

{
    "params": {
        "mode": "editfile",
        "path": "/public_html/index.php",
    }
}

JSON Response

{
    "result": "<?php echo random(); ?>",
}

---

Create folder

URL: $config.createFolderUrl
Method: POST

JSON Request content

{
    "params": {
        "mode": "addfolder",
        "name": "new-folder",
        "path": "/public_html"
    }
}

JSON Response

{
    "result": {
        "success": true,
        "error": null
    }
}

---

Compress file

URL: $config.compressUrl
Method: POST

JSON Request content

{
    "params": {
        "mode": "compress",
        "path": "/public_html/compressed.zip",
        "destination": "/public_html/backups"
    }
}

JSON Response

{
    "result": {
        "success": true,
        "error": null
    }
}

---

Extract file

URL: $config.extractUrl
Method: POST

JSON Request content

{
    "params": {
        "mode": "extract",
        "destination": "/public_html/extracted-files",
        "path": "/public_html/compressed.zip",
        "sourceFile": "/public_html/compressed.zip"
    }
}

JSON Response

{
    "result": {
        "success": true,
        "error": null
    }
}

---

Upload file

URL: $config.uploadUrl
Method: POST
Content-Type: multipart/form-data
Unlimited file upload, each item will be enumerated as file-1, file-2, etc.

Http post params

[$config.uploadUrl]?destination=/public_html/image.jpg&file-1={..}&file-2={...}

JSON Response

{
    "result": {
        "success": true,
        "error": null
    }
}

---

Download / Preview file

URL: $config.downloadFileUrl
Method: GET

Http query params

[$config.downloadFileUrl]?mode=download&preview=true&path=/public_html/image.jpg

Response

-File content

---

Errors / Exceptions

Every backend errors should be with an Error 500 HTTP code.

Btw, you can report errors with a 200 response with this json structure

{
    "result": {
        "success": false,
        "error": "Access denied to remove file"
    }
}