filebrowser/frontend

:milky_way: Vue based front-end.

filebrowser provides a file managing interface within a specified directory and it can be used to upload, delete, preview, rename and edit your files. It allows the creation of multiple users and each user can have its own directory. It can be used as a standalone app.

Demo

url: https://demo.filebrowser.org/

credentials: demo/demo

Features

Please refer to our docs at https://filebrowser.org/features

Install

For installation instructions please refer to our docs at https://filebrowser.org/installation.

Configuration

Authentication Method - You can change the way the user authenticates with the filebrowser server

Command Runner - The command runner is a feature that enables you to execute any shell command you want before or after a certain event.

Custom Branding - You can customize your File Browser installation by change its name to any other you want, by adding a global custom style sheet and by using your own logotype if you want.

Contributing

If you're interested in contributing to this project, our docs are best places to start https://filebrowser.org/contributing.

frontend's Issues

Action required: Greenkeeper could not be activated 🚨

🚨 You need to enable Continuous Integration on Greenkeeper branches of this repository. 🚨

To enable Greenkeeper, you need to make sure that a commit status is reported on all branches. This is required by Greenkeeper because it uses your CI build statuses to figure out when to notify you about breaking changes.

Since we didn’t receive a CI status on the greenkeeper/initial branch, it’s possible that you don’t have CI set up yet. We recommend using Travis CI, but Greenkeeper will work with every other CI service as well.

If you have already set up a CI for this repository, you might need to check how it’s configured. Make sure it is set to run on all new branches. If you don’t want it to run on absolutely every branch, you can whitelist branches starting with greenkeeper/.

Once you have installed and configured CI on this repository correctly, you’ll need to re-trigger Greenkeeper’s initial pull request. To do this, please click the 'fix repo' button on account.greenkeeper.io.

request to rewrite to the Angular

vote up

displaced subtitles in safari

version:

• latest docker (29.07.2018)

Safari:

• latest on mac

Friendlier english error message

frontend/src/i18n/en.yaml

Line 37 in 325e6e0

forbidden: You're not welcome here.

I find this forbidden message rather rude. How about we change that?

Maybe to "You lack needed permission." or simply "Permission denied.", maybe even "I am very sorry, you're not allowed here.". 😉

Something along the lines.

What is it doing ?

frontend/public/index.html

Line 31 in bb0d048

<script>window.FileBrowser = JSON.parse(`[{[ .Json ]}]`)</script>

is it http://www.jsfuck.com/ ?

Can't play mp4

Hello, for some reasons chromium does not play videos, when I put local path to the file, and paste into the browser it works. Also it does not display any controls... Does it detects file type in wrong way ? I tried to play mp4 file...

upd: right, server returns wrong file type...
So I see download only...

codemirror not copied to dist/static/js

When I use the build.sh in filebrowser project, codemirror is not copied to dist/static/js. Thus cause 404 when the browser trying to load the corresponding js.

Weird interaction with directory containing "#"

Description
No problem when entering a directory "name #1", but can't enter a sub-directory.

Expected behaviour
"#" is converted to %23 in URL.

What is happening instead?
"#" is converted to %23 in the URL upon entering directory with "#", but converted back to "#" when entering sub-directory. Manually replacing # with %23 in URL fixes the problem.

Additional context
Example:
filebrowser.com -- Root
=> filebrowser.com/files%231 -- "files#1" is converted to "files%231" in URL.
=> filebrowser.com/files#1/subfolder -- "files%23" is converted back to "files#1" for some reason

How to reproduce?
Can't create a folder with "#" from FileBrowser for some reason. (should I create another Issue?).

Create Folder with "#" => Create a subfolder => Enter Folder with "#" from FileBrowser => Enter subfolder from Filebrowser

Files
None

Support better autofocus

Right now, you are using the autofocus from HTML5, but it only work for the first modal you open. When you are clicking aroud it does not work anymore.

I suggest using a custom directive v-focus to focus every input like in this doc.

What do you think? I can handle these changes, I just need to know where to put the directives in the project.

baseUrl option in vue.config.js is deprecated now, please use publicPath instead

See https://travis-ci.com/filebrowser/frontend/builds/96663931

"baseUrl" option in vue.config.js is deprecated now, please use "publicPath" instead.

"Multiple selection enabled" is always visible

Browser: Latest Chrome
System: Mac

When list of files is fast scrolled to end, blue div with text "Multiple selection enabled" show up for the second ( is "pulled" ) when multiple selection is disabled.

this block should be removed from DOM or hidden in css, not only moved out of the screen

How to setup the dev environment for filebrowser frontend?

Dear Sirs，

I'm confused with how to integrate this frondend with the go-lang backend. Could you please give step by step instructions for us to setup the dev environment for filebrowser frontend? so that we can modify something and see the results immediately in web browsers. Thanks a lot.

Add Green Keeper after 2.0

https://account.greenkeeper.io/account/filebrowser

Action required: Greenkeeper could not be activated 🚨

🚨 You need to enable Continuous Integration on Greenkeeper branches of this repository. 🚨

To enable Greenkeeper, you need to make sure that a commit status is reported on all branches. This is required by Greenkeeper because it uses your CI build statuses to figure out when to notify you about breaking changes.

Since we didn’t receive a CI status on the greenkeeper/initial branch, it’s possible that you don’t have CI set up yet. We recommend using Travis CI, but Greenkeeper will work with every other CI service as well.

If you have already set up a CI for this repository, you might need to check how it’s configured. Make sure it is set to run on all new branches. If you don’t want it to run on absolutely every branch, you can whitelist branches starting with greenkeeper/.

Once you have installed and configured CI on this repository correctly, you’ll need to re-trigger Greenkeeper’s initial pull request. To do this, please click the 'fix repo' button on account.greenkeeper.io.

unable to share files for users with read-only permissions

diff --git a/src/components/Header.vue b/src/components/Header.vue
index 46a10b8..278fcc6 100644
--- a/src/components/Header.vue
+++ b/src/components/Header.vue
@@ -50,6 +50,7 @@
           <schedule-button v-show="showPublishButton"></schedule-button>
         </template>

+        <share-button v-show="showRenameButton"></share-button>
         <switch-button v-show="showSwitchButton"></switch-button>
         <download-button v-show="showCommonButton"></download-button>
         <upload-button v-show="showUpload"></upload-button>

Add download, rename, open... buttons on hovering over items

When mouse hover on item in icon view mode - appear some buttons like: download, rename, open in new tab etc

Dragging folder to itself issues a 500 error

This is a minor issue, but I think could be annoying to inexperienced users.

When you drag a folder in itself (maybe because you just do it by accident or you changed you mind) the client tries to move the folder inside itself issuing a 500 error by the server:
rename folder folder/folder: invalid argument

To me the client should not send this request and simply ignore the move/copy behavior when a folder is dragged onto itself. This is the behaviour the user is used to by file explorers in various OSes.

I would gladly fix this myself but at the moment I don't have time for digging into the code.

By the way, thanks for this great project!

Action required: Greenkeeper could not be activated 🚨

🚨 You need to enable Continuous Integration on Greenkeeper branches of this repository. 🚨

To enable Greenkeeper, you need to make sure that a commit status is reported on all branches. This is required by Greenkeeper because it uses your CI build statuses to figure out when to notify you about breaking changes.

Since we didn’t receive a CI status on the greenkeeper/initial branch, it’s possible that you don’t have CI set up yet. We recommend using Travis CI, but Greenkeeper will work with every other CI service as well.

If you have already set up a CI for this repository, you might need to check how it’s configured. Make sure it is set to run on all new branches. If you don’t want it to run on absolutely every branch, you can whitelist branches starting with greenkeeper/.

Once you have installed and configured CI on this repository correctly, you’ll need to re-trigger Greenkeeper’s initial pull request. To do this, please click the 'fix repo' button on account.greenkeeper.io.

IIS ARR Rewrite?

Hi,
I can't seem to get this (filebrowser/frontend) to work with IIS. Any guidelines on how to get this to work?

What I want:
https://subdomain.domain.com => https://subdomain.domain.com/filebrowser

What I get: https://subdomain.domain.com
It seems that it always is trying to reach the HTTP_HOST.

Could this be fixed with; window.location.pathname instead of window.location.hostname?

I have some questions about CSS

Hi, I'm using the css. I appreciate your data.
But there's a problem.
Tell me how to change icons.
Also, teach me how to insert additional text and how to add links.

And I am writing an interpreter because I am not good at English.
I hope you will answer easily. Thank you.

i18n on 2.0

So I thought that, for v2.0, we could take a new approach at translations and use Transifex: https://www.transifex.com/file-browser/file-browser/

It automatically synchronizes with the source language file (which is english) and people can signup there and translate for their own language. Then we just need to pull the data here using the cli tx pull.

Why is it better?

1. The interface for people translating is nice.
2. If we change stuff in en like removing keys or adding new keys, they'll be added or removed from the other translations too.
3. I'll also create a script to update Languages.vue file when adding new languages.

Add a QR code when sharing files to others?

So it will be easy for them to scan and download files to there phones.

source map empty

Hello, I tried to run frontend, but unfortunately the sources map are empty at chromium...