Prompts and Sidebar in

This commit is contained in:
Henrique Dias 2017-07-31 16:55:09 +01:00
parent de673370a5
commit 744973293a
No known key found for this signature in database
GPG Key ID: 936F5EB68D786730
13 changed files with 150 additions and 84 deletions

View File

@ -1,19 +1,19 @@
<template>
<nav :class="{active}">
<router-link class="action" to="/files/" aria-label="My Files" title="My Files">
<router-link class="action" to="/files/" :aria-label="$t('sidebar.myFiles')" :title="$t('sidebar.myFiles')">
<i class="material-icons">folder</i>
<span>{{ $t('My Files') }}</span>
<span>{{ $t('sidebar.myFiles') }}</span>
</router-link>
<div v-if="user.allowNew">
<button @click="$store.commit('showHover', 'newDir')" aria-label="New directory" title="New directory" class="action">
<button @click="$store.commit('showHover', 'newDir')" class="action" :aria-label="$t('sidebar.newFolder')" :title="$t('sidebar.newFolder')">
<i class="material-icons">create_new_folder</i>
<span>New folder</span>
<span>{{ $t('sidebar.newFolder') }}</span>
</button>
<button @click="$store.commit('showHover', 'newFile')" aria-label="New file" title="New file" class="action">
<button @click="$store.commit('showHover', 'newFile')" class="action" :aria-label="$t('sidebar.newFile')" :title="$t('sidebar.newFile')">
<i class="material-icons">note_add</i>
<span>New file</span>
<span>{{ $t('sidebar.newFile') }}</span>
</button>
</div>
@ -25,21 +25,21 @@
</div>
<div>
<router-link class="action" to="/settings" aria-label="Settings" title="Settings">
<router-link class="action" to="/settings" :aria-label="$t('sidebar.settings')" :title="$t('sidebar.settings')">
<i class="material-icons">settings_applications</i>
<span>Settings</span>
<span>{{ $t('sidebar.settings') }}</span>
</router-link>
<button @click="logout" class="action" id="logout" aria-label="Log out" title="Logout">
<button @click="logout" class="action" id="logout" :aria-label="$t('sidebar.logout')" :title="$t('sidebar.logout')">
<i class="material-icons">exit_to_app</i>
<span>Logout</span>
<span>{{ $t('sidebar.logout') }}</span>
</button>
</div>
<p class="credits">
<span>Served with <a rel="noopener noreferrer" href="https://github.com/hacdias/filemanager">File Manager</a>.</span>
<span>{{ $t('sidebar.servedWith') }} <a rel="noopener noreferrer" href="https://github.com/hacdias/filemanager">File Manager</a>.</span>
<span v-for="plugin in plugins" :key="plugin.name" v-html="plugin.credits"><br></span>
<span><a @click="help">Help</a></span>
<span><a @click="help">{{ $t('sidebar.help') }}</a></span>
</p>
</nav>
</template>

View File

@ -7,7 +7,10 @@
<div>
<button class="ok" @click="copy">{{ $t('buttons.copy') }}</button>
<button class="cancel" @click="$store.commit('closeHovers')">{{ $t('buttons.cancel') }}</button>
<button class="cancel"
@click="$store.commit('closeHovers')"
:aria-label="$t('buttons.cancel')"
:title="$t('buttons.cancel')">{{ $t('buttons.cancel') }}</button>
</div>
</div>
</template>

View File

@ -5,7 +5,10 @@
<p v-show="req.kind === 'listing'">{{ $t('prompts.deleteMessageMultiple', { count: selectedCount}) }}</p>
<div>
<button @click="submit" autofocus>{{ $t('buttons.delete') }}</button>
<button @click="closeHovers" class="cancel">{{ $t('buttons.cancel') }}</button>
<button class="cancel"
@click="$store.commit('closeHovers')"
:aria-label="$t('buttons.cancel')"
:title="$t('buttons.cancel')">{{ $t('buttons.cancel') }}</button>
</div>
</div>
</template>

View File

@ -7,7 +7,10 @@
<div>
<button class="ok" @click="move">{{ $t('buttons.move') }}</button>
<button class="cancel" @click="$store.commit('closeHovers')">{{ $t('buttons.cancel') }}</button>
<button class="cancel"
@click="$store.commit('closeHovers')"
:aria-label="$t('buttons.cancel')"
:title="$t('buttons.cancel')">{{ $t('buttons.cancel') }}</button>
</div>
</div>
</template>

View File

@ -5,7 +5,10 @@
<input autofocus type="text" @keyup.enter="submit" v-model.trim="name">
<div>
<button class="ok" @click="submit">{{ $t('buttons.create') }}</button>
<button class="cancel" @click="$store.commit('closeHovers')">{{ $t('buttons.cancel') }}</button>
<button class="cancel"
@click="$store.commit('closeHovers')"
:aria-label="$t('buttons.cancel')"
:title="$t('buttons.cancel')">{{ $t('buttons.cancel') }}</button>
</div>
</div>
</template>

View File

@ -5,7 +5,10 @@
<input autofocus type="text" @keyup.enter="submit" v-model.trim="name">
<div>
<button class="ok" @click="submit">{{ $t('buttons.create') }}</button>
<button class="cancel" @click="$store.commit('closeHovers')">{{ $t('buttons.cancel') }}</button>
<button class="cancel"
@click="$store.commit('closeHovers')"
:aria-label="$t('buttons.cancel')"
:title="$t('buttons.cancel')">{{ $t('buttons.cancel') }}</button>
</div>
</div>
</template>

View File

@ -27,7 +27,10 @@
:placeholder="input.placeholder">
<div>
<input type="submit" class="ok" :value="prompt.ok">
<button class="cancel" @click.prevent="$store.commit('closeHovers')">{{ $t('buttons.cancel') }}</button>
<button class="cancel"
@click="$store.commit('closeHovers')"
:aria-label="$t('buttons.cancel')"
:title="$t('buttons.cancel')">{{ $t('buttons.cancel') }}</button>
</div>
</form>
</template>

View File

@ -6,7 +6,10 @@
<input autofocus type="text" @keyup.enter="submit" v-model.trim="name">
<div>
<button @click="submit" type="submit">{{ $t('buttons.rename') }}</button>
<button @click="cancel" class="cancel">{{ $t('buttons.cancel') }}</button>
<button class="cancel"
@click="$store.commit('closeHovers')"
:aria-label="$t('buttons.cancel')"
:title="$t('buttons.cancel')">{{ $t('buttons.cancel') }}</button>
</div>
</div>
</template>

View File

@ -1,10 +1,10 @@
<template>
<div class="dashboard">
<h1>Global Settings</h1>
<h1>{{ $t('settings.globalSettings') }}</h1>
<ul>
<li><router-link to="/settings/profile">Go to Profile Settings</router-link></li>
<li><router-link to="/settings/users">Go to User Management</router-link></li>
<li><router-link to="/settings/profile">{{ $t('settings.goTo') }} {{ $t('settings.profileSettings') }}</router-link></li>
<li><router-link to="/settings/users">{{ $t('settings.goTo') }} {{ $t('settings.userManagement') }}</router-link></li>
</ul>
<form @submit="savePlugin" v-if="plugins.length > 0">
@ -23,11 +23,9 @@
</form>
<form @submit="saveCommands">
<h2>Commands</h2>
<h2>{{ $t('settings.commands') }}</h2>
<p class="small">Here you can set commands that are executed in the named events. You write one command
per line. If the event is related to files, such as before and after saving, the environment variable
<code>file</code> will be available with the path of the file.</p>
<p class="small">{{ $t('settings.commandsHelp') }}</p>
<template v-for="command in commands">
<h3>{{ capitalize(command.name) }}</h3>
@ -103,7 +101,7 @@ export default {
}
api.updateCommands(commands)
.then(() => { this.showSuccess('Commands updated!') })
.then(() => { this.showSuccess(this.$t('settings.commandsUpdated')) })
.catch(error => { this.showError(error) })
},
savePlugin (event) {
@ -132,7 +130,7 @@ export default {
console.log(plugins)
api.updatePlugins(plugins)
.then(() => { this.showSuccess('Plugins settings updated!') })
.then(() => { this.showSuccess(this.$t('settings.pluginsUpdated')) })
.catch(error => { this.showError(error) })
},
parsePlugin (name, plugin) {

View File

@ -1,22 +1,22 @@
<template>
<div class="dashboard">
<h1>Profile Settings</h1>
<h1>{{ $t('settings.profileSettings') }}</h1>
<ul v-if="user.admin">
<li><router-link to="/settings/global">Go to Global Settings</router-link></li>
<li><router-link to="/settings/global">{{ $t('settings.goTo') }} {{ $t('settings.globalSettings') }}</router-link></li>
</ul>
<form @submit="changePassword">
<h2>Change Password</h2>
<p><input :class="passwordClass" type="password" placeholder="Your new password" v-model="password" name="password"></p>
<p><input :class="passwordClass" type="password" placeholder="Confirm your new password" v-model="passwordConf" name="password"></p>
<p><input type="submit" value="Change Password"></p>
<h2>{{ $t('settings.changePassword') }}</h2>
<p><input :class="passwordClass" type="password" :placeholder="$t('settings.newPassword')" v-model="password" name="password"></p>
<p><input :class="passwordClass" type="password" :placeholder="$t('settings.newPasswordConfirm')" v-model="passwordConf" name="password"></p>
<p><input type="submit" :value="$t('buttons.update')"></p>
</form>
<form @submit="updateCSS">
<h2>Custom Stylesheet</h2>
<h2>{{ $t('settings.changePassword') }}</h2>
<textarea v-model="css" name="css"></textarea>
<p><input type="submit" value="Update"></p>
<p><input type="submit" :value="$t('buttons.update')"></p>
</form>
</div>
</template>

View File

@ -1,58 +1,52 @@
<template>
<div>
<form @submit="save" class="dashboard">
<h1 v-if="id === 0">New User</h1>
<h1 v-else>User {{ username }}</h1>
<h1 v-if="id === 0">{{ $t('settings.newUser') }}</h1>
<h1 v-else>{{ $t('settings.user') }} {{ username }}</h1>
<p><label for="username">Username</label><input type="text" v-model="username" id="username"></p>
<p><label for="password">Password</label><input type="password" :placeholder="passwordPlaceholder" v-model="password" id="password"></p>
<p><label for="scope">Scope</label><input type="text" v-model="filesystem" id="scope"></p>
<p><label for="username">{{ $t('settings.username') }}</label><input type="text" v-model="username" id="username"></p>
<p><label for="password">{{ $t('settings.password') }}</label><input type="password" :placeholder="passwordPlaceholder" v-model="password" id="password"></p>
<p><label for="scope">{{ $t('settings.scope') }}</label><input type="text" v-model="filesystem" id="scope"></p>
<h2>Permissions</h2>
<h2>{{ $t('settings.permissions') }}</h2>
<p class="small">{{ $t('settings.permissionsHelp') }}</p>
<p class="small">You can set the user to be an administrator or choose the permissions individually.
If you select "Administrator", all of the other options will be automatically checked.
The management of users remains a privilege of an administrator.</p>
<p><input type="checkbox" v-model="admin"> Administrator</p>
<p><input type="checkbox" :disabled="admin" v-model="allowNew"> Create new files and directories</p>
<p><input type="checkbox" :disabled="admin" v-model="allowEdit"> Edit, rename and delete files or directories.</p>
<p><input type="checkbox" :disabled="admin" v-model="allowCommands"> Execute commands</p>
<p><input type="checkbox" v-model="admin"> {{ $t('settings.administrator') }}</p>
<p><input type="checkbox" :disabled="admin" v-model="allowNew"> {{ $t('settings.allowNew') }}</p>
<p><input type="checkbox" :disabled="admin" v-model="allowEdit"> {{ $t('settings.allowEdit') }}</p>
<p><input type="checkbox" :disabled="admin" v-model="allowCommands"> {{ $t('settings.allowCommands') }}</p>
<p v-for="(value, key) in permissions" :key="key">
<input type="checkbox" :disabled="admin" v-model="permissions[key]"> {{ capitalize(key) }}
</p>
<h3>Commands</h3>
<p class="small">A space separated list with the available commands for this user. Example: <i>git svn hg</i>.</p>
<h3>{{ $t('settings.userCommands') }}</h3>
<p class="small">{{ $t('settings.userCommandsHelp') }} <i>git svn hg</i>.</p>
<input type="text" v-model.trim="commands">
<h2>Rules</h2>
<h2>{{ $t('settings.rules') }}</h2>
<p class="small">Here you can define a set of allow and disallow rules for this specific user. The blocked files won't
show up in the listings and they won't be accessible to the user. We support regex and paths relative to
the user's scope.</p>
<p class="small">{{ $t('settings.rulesHelp1') }}</p>
<p class="small">Each rule goes in one different line and must start with the keyword <code>allow</code> or <code>disallow</code>.
Then you should write <code>regex</code> if you are using a regular expression and then the expression or the path.</p>
<i18n path="settings.rulesHelp2" tag="p" class="small">
<code>allow</code><code>disallow</code><code>regex</code>
</i18n>
<p class="small"><strong>Examples</strong></p>
<p class="small"><strong>{{ $t('settings.examples') }}</strong></p>
<ul class="small">
<li><code>disallow regex \\/\\..+</code> - prevents the access to any dot file (such as .git, .gitignore) in every folder.</li>
<li><code>disallow /Caddyfile</code> - blocks the access to the file named <i>Caddyfile</i> on the root of the scope</li>
<li><code>disallow regex \\/\\..+</code> - {{ $t('settings.ruleExample1') }}</li>
<li><code>disallow /Caddyfile</code> - {{ $t('settings.ruleExample2') }}</li>
</ul>
<textarea v-model.trim="rules"></textarea>
<h2>Custom Stylesheet</h2>
<h2>{{ $t('settings.customStylesheet') }}</h2>
<textarea name="css"></textarea>
<p>
<button v-if="id !== 0" @click.prevent="deletePrompt" type="button" class="delete">Delete</button>
<input type="submit" value="Save">
<button v-if="id !== 0" @click.prevent="deletePrompt" type="button" class="delete" :aria-label="$t('buttons.delete')" :title="$t('buttons.delete')">{{ $t('buttons.delete') }}</button>
<input type="submit" :value="$t('buttons.save')">
</p>
</form>
@ -60,8 +54,13 @@
<h3>Delete User</h3>
<p>Are you sure you want to delete this user?</p>
<div>
<button @click="deleteUser" autofocus>Delete</button>
<button @click="closeHovers" class="cancel">Cancel</button>
<button @click="deleteUser" autofocus>{{ $t('buttons.delete') }}</button>
<button class="cancel"
@click="closeHovers"
:aria-label="$t('buttons.cancel')"
:title="$t('buttons.cancel')">
{{ $t('buttons.cancel') }}
</button>
</div>
</div>
</div>
@ -91,8 +90,8 @@ export default {
},
computed: {
passwordPlaceholder () {
if (this.$route.path === '/users/new') return ''
return '(leave blank to avoid changes)'
if (this.$route.path === '/settings/users/new') return ''
return this.$t('settings.avoidChanges')
}
},
created () {
@ -115,7 +114,7 @@ export default {
fetchData () {
let user = this.$route.params[0]
if (this.$route.path === '/users/new') {
if (this.$route.path === '/settings/users/new') {
user = 'base'
}
@ -149,7 +148,7 @@ export default {
this.rules = this.rules.trim()
}).catch(() => {
this.$router.push({ path: '/users/new' })
this.$router.push({ path: '/settings/users/new' })
})
},
capitalize (name) {
@ -184,7 +183,7 @@ export default {
api.deleteUser(this.id).then(location => {
this.$router.push({ path: '/users' })
this.$store.commit('showSuccess', 'User deleted!')
this.$store.commit('showSuccess', this.$t('settings.userDeleted'))
}).catch(e => {
this.$store.commit('showError', e)
})
@ -193,10 +192,10 @@ export default {
event.preventDefault()
let user = this.parseForm()
if (this.$route.path === '/users/new') {
if (this.$route.path === '/settings/users/new') {
api.newUser(user).then(location => {
this.$router.push({ path: location })
this.$store.commit('showSuccess', 'User created!')
this.$store.commit('showSuccess', this.$t('settings.userCreated'))
}).catch(e => {
this.$store.commit('showError', e)
})
@ -205,7 +204,7 @@ export default {
}
api.updateUser(user).then(location => {
this.$store.commit('showSuccess', 'User updated!')
this.$store.commit('showSuccess', this.$t('settings.userUpdated'))
}).catch(e => {
this.$store.commit('showError', e)
})
@ -269,7 +268,3 @@ export default {
}
}
</script>
<style>
</style>

View File

@ -1,12 +1,12 @@
<template>
<div class="dashboard">
<h1>Users <router-link to="/users/new"><button>New</button></router-link></h1>
<h1>{{ $t('settings.users') }} <router-link to="/settings/users/new"><button>{{ $t('buttons.new') }}</button></router-link></h1>
<table>
<tr>
<th>Username</th>
<th>Admin</th>
<th>Scope</th>
<th>{{ $t('settings.username') }}</th>
<th>{{ $t('settings.admin') }}</th>
<th>{{ $t('settings.scope') }}</th>
<th></th>
</tr>

View File

@ -18,7 +18,11 @@
"upload": "Upload",
"cancel": "Cancel",
"create": "Create",
"close": "Close",
"reportIssue": "Report Issue",
"update": "Update",
"save": "Save",
"new": "New",
"ok": "OK"
},
"errors": {
@ -39,6 +43,15 @@
"multipleSelectionEnabled": "Multiple selection enabled",
"closePreview": "Close preview"
},
"sidebar": {
"myFiles": "My files",
"newFolder": "New folder",
"newFile": "New file",
"settings": "Settings",
"logout": "Logout",
"servedWith": "Served with",
"help": "Help"
},
"prompts": {
"copy": "Copy",
"copyMessage": "Choose the place to copy your files:",
@ -78,5 +91,44 @@
},
"click": "select file or directory",
"doubleClick": "open a file or directory"
},
"settings": {
"globalSettings": "Global Settings",
"profileSettings": "Profile Settings",
"userManagement": "User Management",
"goTo": "Go to",
"commands": "Commands",
"commandsHelp": "Here you can set commands that are executed in the named events. You write one command per line. If the event is related to files, such as before and after saving, the environment variable \"file\" will be available with the path of the file.",
"commandsUpdated": "Commands updated!",
"pluginsUpdated": "Plugins settings updated!",
"changePassword": "Change Password",
"newPassword": "Your new password",
"newPasswordConfirm": "Confirm your new password",
"customStylesheet": "Custom Stylesheet",
"newUser": "New User",
"user": "User",
"users": "Users",
"username": "Username",
"password": "Password",
"scope": "Scope",
"admin": "Admin",
"permissions": "Permissions",
"permissionsHelp": "You can set the user to be an administrator or choose the permissions individually. If you select \"Administrator\", all of the other options will be automatically checked. The management of users remains a privilege of an administrator.",
"administrator": "Administrator",
"allowNew": "Create new files and directories",
"allowEdit": "Edit, rename and delete files or directories.",
"allowCommands": "Execute commands",
"userCommands": "Commands",
"userCommandsHelp": "A space separated list with the available commands for this user. Example:",
"rules": "Rules",
"rulesHelp1": "Here you can define a set of allow and disallow rules for this specific user. The blocked files won't show up in the listings and they won't be accessible to the user. We support regex and paths relative to the user's scope.",
"rulesHelp2": "Each rule goes in one different line and must start with the keyword {0} or {1}. Then you should write {2} if you are using a regular expression and then the expression or the path.",
"examples": "Examples",
"ruleExample1": "prevents the access to any dot file (such as .git, .gitignore) in every folder.",
"ruleExample2": "blocks the access to the file named Caddyfile on the root of the scope.",
"avoidChanges": "(leave blank to avoid changes)",
"userDeleted": "User deleted!",
"userCreated": "User created!",
"userUpdated": "User updated!"
}
}