mirror_html/filegator
1
0
Fork 0
mirror of https://github.com/filegator/filegator.git synced 2025-07-31 23:00:19 +02:00
Code Issues Projects Releases Wiki Activity

refactoring & new config vars

Browse Source
This commit is contained in:
Milos Stojanovic
2020-02-21 14:24:18 +01:00
parent db3cff9d47
commit 580e2afab7
9 changed files with 192 additions and 144 deletions
Download Patch File Download Diff File Expand all files Collapse all files

2
configuration_sample.php
View File

@@ -13,6 +13,8 @@ return [
'upload_chunk_size' => 1 * 1024 * 1024, // 1MB
'upload_simultaneous' => 3,
'default_archive_name' => 'archive.zip',
'editable' => ['.txt', '.css', '.js', '.ts', '.html', '.php'],
'date_format' => 'YY/MM/DD hh:mm:ss',
],
'services' => [

2
docs/configuration/basic.md
View File

@@ -21,6 +21,8 @@ Note: if you've made a mistake in configuration file (forgot to close a quote?)
'upload_chunk_size' => 1 * 1024 * 1024, // 1MB
'upload_simultaneous' => 3,
'default_archive_name' => 'archive.zip',
'editable' => ['.txt', '.css', '.js', '.ts', '.html', '.php'],
'date_format' => 'YY/MM/DD hh:mm:ss',
],
```

4
frontend/App.vue
View File

@@ -84,6 +84,10 @@ html, body, #wrapper, #inner, .container {
justify-content: flex-end;
}
.animation-content {
width: 100%;
}
@media all and (max-width: 1088px) {
.container {
padding: 20px;

6
frontend/mixins/shared.js
View File

@@ -74,7 +74,7 @@ const funcs = {
return parseFloat((bytes / Math.pow(k, i)).toFixed(dm)) + ' ' + sizes[i]
},
formatDate(timestamp) {
return moment.unix(timestamp).format('YY/MM/DD hh:mm:ss')
return moment.unix(timestamp).format(store.state.config.date_format ? store.state.config.date_format : 'YY/MM/DD hh:mm:ss')
},
checkUser() {
api.getUser()
@@ -126,10 +126,10 @@ const funcs = {
return this.isText(name) || this.isImage(name)
},
isText(name) {
return this.hasExtension(name, ['.txt', '.html', '.css', '.js', '.ts', '.php'])
return this.hasExtension(name, store.state.config.editable ? store.state.config.editable : ['.txt'])
},
isImage(name) {
return this.hasExtension(name, ['.jpg', '.jpeg', '.gif', '.png'])
return this.hasExtension(name, ['.jpg', '.jpeg', '.gif', '.png', '.bmp', '.tiff'])
},
hasExtension(name, exts) {
return (new RegExp('(' + exts.join('|').replace(/\./g, '\\.') + ')$', 'i')).test(name)

12
frontend/views/Browser.vue
View File

@@ -154,7 +154,8 @@
import Vue from 'vue'
import Menu from './partials/Menu'
import Tree from './partials/Tree'
import Preview from './partials/Preview'
import Editor from './partials/Editor'
import Gallery from './partials/Gallery'
import Pagination from './partials/Pagination'
import Upload from './partials/Upload'
import api from '../api/api'
@@ -347,11 +348,18 @@ export default {
// TODO: create search logic
},
preview(item) {
let modal = null
if (this.isImage(item.path)) {
modal = Gallery
}
if (this.isText(item.path)) {
modal = Editor
}
this.$modal.open({
parent: this,
props: { item: item },
hasModalCard: true,
component: Preview,
component: modal,
})
},
isArchive(item) {

84
frontend/views/partials/Editor.vue Normal file
View File

@@ -0,0 +1,84 @@
<template>
<div>
<div class="modal-card">
<header class="modal-card-head">
<p class="modal-card-title">
{{ currentItem.name }}
</p>
</header>
<section class="modal-card-body preview">
<template>
<prism-editor v-model="content" language="md" :readonly="!can('write')" :line-numbers="lineNumbers" />
</template>
</section>
<footer class="modal-card-foot">
<button v-if="can('write')" class="button" type="button" @click="saveFile()">
{{ lang('Save') }}
</button>
<button class="button" type="button" @click="$parent.close()">
{{ lang('Close') }}
</button>
</footer>
</div>
</div>
</template>
<script>
import api from '../../api/api'
import 'prismjs'
import 'prismjs/themes/prism.css'
import 'vue-prism-editor/dist/VuePrismEditor.css'
import PrismEditor from 'vue-prism-editor'
export default {
name: 'Editor',
components: { PrismEditor },
props: [ 'item' ],
data() {
return {
content: '',
currentItem: '',
lineNumbers: true,
}
},
mounted() {
this.currentItem = this.item
api.downloadItem({
path: this.item.path,
})
.then((res) => {
this.content = res
})
.catch(error => this.handleError(error))
},
methods: {
saveFile() {
api.saveContent({
name: this.item.name,
content: this.content,
})
.then(() => {
this.$toast.open({
message: this.lang('Updated'),
type: 'is-success',
})
this.$parent.close()
})
.catch(error => this.handleError(error))
}
},
}
</script>
<style scoped>
@media (min-width: 1100px) {
.modal-card {
width: 100%;
min-width: 640px;
}
}
.preview {
min-height: 450px;
}
</style>

85
frontend/views/partials/Gallery.vue Normal file
View File

@@ -0,0 +1,85 @@
<template>
<div>
<div class="modal-card">
<div class="modal-card-body preview">
<strong>{{ currentItem.name }}</strong>
<div class="columns is-mobile">
<div class="column mainbox">
<img :src="imageSrc(currentItem.path)" class="mainimg">
</div>
<div v-if="images.length > 1" class="column is-one-fifth sidebox">
<ul>
<li v-for="(image, index) in images" :key="index">
<img v-lazy="imageSrc(image.path)" @click="currentItem = image">
</li>
</ul>
</div>
</div>
</div>
</div>
</div>
</template>
<script>
import _ from 'lodash'
export default {
name: 'Gallery',
props: [ 'item' ],
data() {
return {
content: '',
currentItem: '',
lineNumbers: true,
}
},
computed: {
images() {
return _.filter(this.$store.state.cwd.content, o => this.isImage(o.name))
},
},
mounted() {
this.currentItem = this.item
},
methods: {
imageSrc(path) {
return this.getDownloadLink(path)
},
},
}
</script>
<style scoped>
@media (min-width: 1100px) {
.modal-card {
width: 100%;
min-width: 640px;
}
}
.mainbox {
height: 70vh;
display:flex;
justify-content:center;
align-items:center;
}
.mainimg {
max-width:100%;
max-height:100%;
}
.sidebox {
overflow-y:auto;
height: 70vh;
}
.sidebox {
border-left: 1px solid #dbdbdb;
}
.sidebox img {
padding: 5px 0 5px 0;
}
</style>

139
frontend/views/partials/Preview.vue
View File

@@ -1,139 +0,0 @@
/* eslint-disable */
<template>
<div>
<div class="modal-card">
<header class="modal-card-head">
<p class="modal-card-title">
{{ currentItem.name }}
</p>
</header>
<section :class="[isImage(item.path) ? 'overflowyh' : '', 'modal-card-body preview']">
<template v-if="isText(item.path)">
<prism-editor v-model="content" language="md" :readonly="!can('write')" :line-numbers="lineNumbers" />
</template>
<div v-if="isImage(item.path)">
<div class="columns is-mobile">
<div class="column mainbox">
<img :src="imageSrc(currentItem.path)" class="mainimg">
</div>
<div v-if="images.length > 1" class="column is-one-fifth sidebox">
<ul>
<li v-for="(image, index) in images" :key="index">
<img v-lazy="imageSrc(image.path)" @click="currentItem = image">
</li>
</ul>
</div>
</div>
</div>
</section>
<footer class="modal-card-foot">
<button v-if="isText(item.path) && can('write')" class="button" type="button" @click="saveFile()">
{{ lang('Save') }}
</button>
<button class="button" type="button" @click="$parent.close()">
{{ lang('Close') }}
</button>
</footer>
</div>
</div>
</template>
<script>
import api from '../../api/api'
import 'prismjs'
import 'prismjs/themes/prism.css'
import 'vue-prism-editor/dist/VuePrismEditor.css'
import PrismEditor from 'vue-prism-editor'
import _ from 'lodash'
export default {
name: 'Preview',
components: { PrismEditor },
props: [ 'item' ],
data() {
return {
content: '',
currentItem: '',
lineNumbers: true,
}
},
computed: {
images() {
return _.filter(this.$store.state.cwd.content, o => this.isImage(o.name))
},
},
mounted() {
this.currentItem = this.item
if (this.isText(this.item.path)) {
api.downloadItem({
path: this.item.path,
})
.then((res) => {
this.content = res
})
.catch(error => this.handleError(error))
}
},
methods: {
imageSrc(path) {
return this.getDownloadLink(path)
},
saveFile() {
api.saveContent({
name: this.item.name,
content: this.content,
})
.then(() => {
this.$toast.open({
message: this.lang('Updated'),
type: 'is-success',
})
this.$parent.close()
})
.catch(error => this.handleError(error))
}
},
}
</script>
<style scoped>
@media (min-width: 1100px) {
.modal-card {
width: 100%;
min-width: 640px;
}
}
.mainbox {
height: 70vh;
display:flex;
justify-content:center;
align-items:center;
}
.mainimg {
max-width:100%;
max-height:100%;
}
.sidebox {
overflow-y:auto;
height: 70vh;
}
.sidebox {
border-left: 1px solid #dbdbdb;
}
.sidebox img {
padding: 5px 0 5px 0;
}
.preview {
min-height: 450px;
}
.overflowyh {
overflow-y: hidden;
}
</style>

2
tests/backend/configuration.php
View File

@@ -12,6 +12,8 @@ return [
'upload_chunk_size' => 1 * 1024 * 1024,
'upload_simultaneous' => 3,
'default_archive_name' => 'archive.zip',
'editable' => ['.txt', '.css', '.js', '.ts', '.html', '.php'],
'date_format' => 'YY/MM/DD hh:mm:ss',
],
'services' => [