updates
Former-commit-id: 419fb04f20d9be50358b0d87285fa92855906f97 [formerly fd974c12d0c06b0bde92e201f636c977a1638608] [formerly faa13a4e0c06720f217e7e4387ca0bf9e367365d [formerly 39f39cca2951018d900ff777b36a9b8f720c4356]] Former-commit-id: b2df427ca1f97e407a549848649bad020eb5453f [formerly 484d32224ca56fa68d6b5b0f01626d69eaa0528b] Former-commit-id: 81103561b811e456c4e50dd0d8a6e555e8584839
This commit is contained in:
parent
4f964faf6e
commit
5d84c22a91
|
@ -1,5 +1,5 @@
|
||||||
<template>
|
<template>
|
||||||
<div id="app" :class="{ multiple }">
|
<div id="app" :class="{ multiple: $store.state.multiple }">
|
||||||
<header>
|
<header>
|
||||||
<div>
|
<div>
|
||||||
<img src="./assets/logo.svg" alt="File Manager">
|
<img src="./assets/logo.svg" alt="File Manager">
|
||||||
|
@ -9,7 +9,7 @@
|
||||||
<rename-button v-show="showRenameButton()"></rename-button>
|
<rename-button v-show="showRenameButton()"></rename-button>
|
||||||
<move-button v-show="showMoveButton()"></move-button>
|
<move-button v-show="showMoveButton()"></move-button>
|
||||||
<delete-button v-show="showDeleteButton()"></delete-button>
|
<delete-button v-show="showDeleteButton()"></delete-button>
|
||||||
<switch-button v-show="req.kind !== 'editor'"></switch-button>
|
<switch-button v-show="$store.state.req.kind !== 'editor'"></switch-button>
|
||||||
<download-button></download-button>
|
<download-button></download-button>
|
||||||
<upload-button v-show="showUpload()"></upload-button>
|
<upload-button v-show="showUpload()"></upload-button>
|
||||||
<info-button></info-button>
|
<info-button></info-button>
|
||||||
|
@ -17,11 +17,11 @@
|
||||||
</header>
|
</header>
|
||||||
|
|
||||||
<nav>
|
<nav>
|
||||||
<a class="action" :href="baseURL + '/'">
|
<a class="action" :href="$store.state.baseURL + '/'">
|
||||||
<i class="material-icons">folder</i>
|
<i class="material-icons">folder</i>
|
||||||
<span>My Files</span>
|
<span>My Files</span>
|
||||||
</a>
|
</a>
|
||||||
<div v-if="user.allowNew">
|
<div v-if="$store.state.user.allowNew">
|
||||||
<button @click="$store.commit('showNewDir', true)" aria-label="New directory" title="New directory" class="action">
|
<button @click="$store.commit('showNewDir', true)" aria-label="New directory" title="New directory" class="action">
|
||||||
<i class="material-icons">create_new_folder</i>
|
<i class="material-icons">create_new_folder</i>
|
||||||
<span>New folder</span>
|
<span>New folder</span>
|
||||||
|
@ -38,9 +38,9 @@
|
||||||
</nav>
|
</nav>
|
||||||
|
|
||||||
<main>
|
<main>
|
||||||
<editor v-if="req.kind === 'editor'"></editor>
|
<editor v-if="$store.state.req.kind === 'editor'"></editor>
|
||||||
<listing v-if="req.kind === 'listing'"></listing>
|
<listing v-if="$store.state.req.kind === 'listing'"></listing>
|
||||||
<preview v-if="req.kind === 'preview'"></preview>
|
<preview v-if="$store.state.req.kind === 'preview'"></preview>
|
||||||
</main>
|
</main>
|
||||||
|
|
||||||
<new-file-prompt v-if="$store.state.showNewFile" :class="{ active: $store.state.showNewFile }"></new-file-prompt>
|
<new-file-prompt v-if="$store.state.showNewFile" :class="{ active: $store.state.showNewFile }"></new-file-prompt>
|
||||||
|
@ -77,8 +77,6 @@ import NewFilePrompt from './components/NewFilePrompt'
|
||||||
import NewDirPrompt from './components/NewDirPrompt'
|
import NewDirPrompt from './components/NewDirPrompt'
|
||||||
import css from './css.js'
|
import css from './css.js'
|
||||||
|
|
||||||
var $ = window.info
|
|
||||||
|
|
||||||
function updateColumnSizes () {
|
function updateColumnSizes () {
|
||||||
let columns = Math.floor(document.querySelector('main').offsetWidth / 300)
|
let columns = Math.floor(document.querySelector('main').offsetWidth / 300)
|
||||||
let items = css(['#listing.mosaic .item', '.mosaic#listing .item'])
|
let items = css(['#listing.mosaic .item', '.mosaic#listing .item'])
|
||||||
|
@ -88,30 +86,6 @@ function updateColumnSizes () {
|
||||||
items.style.width = `calc(${100 / columns}% - 1em)`
|
items.style.width = `calc(${100 / columns}% - 1em)`
|
||||||
}
|
}
|
||||||
|
|
||||||
function showRenameButton () {
|
|
||||||
if ($.req.kind === 'listing') {
|
|
||||||
if ($.selected.length === 1) {
|
|
||||||
return $.user.allowEdit
|
|
||||||
}
|
|
||||||
|
|
||||||
return false
|
|
||||||
}
|
|
||||||
|
|
||||||
return $.user.allowEdit
|
|
||||||
}
|
|
||||||
|
|
||||||
function showDeleteButton () {
|
|
||||||
if ($.req.kind === 'listing') {
|
|
||||||
if ($.selected.length === 0) {
|
|
||||||
return false
|
|
||||||
}
|
|
||||||
|
|
||||||
return $.user.allowEdit
|
|
||||||
}
|
|
||||||
|
|
||||||
return $.user.allowEdit
|
|
||||||
}
|
|
||||||
|
|
||||||
export default {
|
export default {
|
||||||
name: 'app',
|
name: 'app',
|
||||||
components: {
|
components: {
|
||||||
|
@ -142,19 +116,45 @@ export default {
|
||||||
name: document.title
|
name: document.title
|
||||||
}, document.title, window.location.pathname)
|
}, document.title, window.location.pathname)
|
||||||
|
|
||||||
|
window.addEventListener('popstate', (event) => {
|
||||||
|
event.preventDefault()
|
||||||
|
event.stopPropagation()
|
||||||
|
|
||||||
|
this.$store.commit('multiple', false)
|
||||||
|
this.$store.commit('resetSelected')
|
||||||
|
this.$store.commit('resetPrompts')
|
||||||
|
|
||||||
|
let request = new window.XMLHttpRequest()
|
||||||
|
request.open('GET', event.state.url, true)
|
||||||
|
request.setRequestHeader('Accept', 'application/json')
|
||||||
|
|
||||||
|
request.onload = () => {
|
||||||
|
if (request.status === 200) {
|
||||||
|
let req = JSON.parse(request.responseText)
|
||||||
|
this.$store.commit('updateRequest', req)
|
||||||
|
document.title = event.state.name
|
||||||
|
} else {
|
||||||
|
console.log(request.responseText)
|
||||||
|
}
|
||||||
|
}
|
||||||
|
|
||||||
|
request.onerror = (error) => { console.log(error) }
|
||||||
|
request.send()
|
||||||
|
})
|
||||||
|
|
||||||
window.addEventListener('keydown', (event) => {
|
window.addEventListener('keydown', (event) => {
|
||||||
// Esc!
|
// Esc!
|
||||||
if (event.keyCode === 27) {
|
if (event.keyCode === 27) {
|
||||||
this.$store.commit('resetPrompts')
|
this.$store.commit('resetPrompts')
|
||||||
|
|
||||||
// Unselect all files and folders.
|
// Unselect all files and folders.
|
||||||
if ($.req.kind === 'listing') {
|
if (this.$store.state.req.kind === 'listing') {
|
||||||
let items = document.getElementsByClassName('item')
|
let items = document.getElementsByClassName('item')
|
||||||
Array.from(items).forEach(link => {
|
Array.from(items).forEach(link => {
|
||||||
link.setAttribute('aria-selected', false)
|
link.setAttribute('aria-selected', false)
|
||||||
})
|
})
|
||||||
|
|
||||||
$.selected = []
|
this.$store.selected = []
|
||||||
}
|
}
|
||||||
|
|
||||||
return
|
return
|
||||||
|
@ -162,21 +162,21 @@ export default {
|
||||||
|
|
||||||
// Del!
|
// Del!
|
||||||
if (event.keyCode === 46) {
|
if (event.keyCode === 46) {
|
||||||
if (showDeleteButton()) {
|
if (this.showDeleteButton()) {
|
||||||
$.showDelete = true
|
this.$store.commit('showDelete', true)
|
||||||
}
|
}
|
||||||
}
|
}
|
||||||
|
|
||||||
// F1!
|
// F1!
|
||||||
if (event.keyCode === 112) {
|
if (event.keyCode === 112) {
|
||||||
event.preventDefault()
|
event.preventDefault()
|
||||||
$.showHelp = true
|
this.$store.commit('showHelp', true)
|
||||||
}
|
}
|
||||||
|
|
||||||
// F2!
|
// F2!
|
||||||
if (event.keyCode === 113) {
|
if (event.keyCode === 113) {
|
||||||
if (showRenameButton()) {
|
if (this.showRenameButton()) {
|
||||||
$.showRename = true
|
this.$store.commit('showRename', true)
|
||||||
}
|
}
|
||||||
}
|
}
|
||||||
|
|
||||||
|
@ -186,7 +186,7 @@ export default {
|
||||||
case 's':
|
case 's':
|
||||||
event.preventDefault()
|
event.preventDefault()
|
||||||
|
|
||||||
if ($.req.kind !== 'editor') {
|
if (this.$store.state.req.kind !== 'editor') {
|
||||||
window.location = '?download=true'
|
window.location = '?download=true'
|
||||||
return
|
return
|
||||||
}
|
}
|
||||||
|
@ -203,23 +203,40 @@ export default {
|
||||||
loading.parentNode.removeChild(loading)
|
loading.parentNode.removeChild(loading)
|
||||||
}, 1000)
|
}, 1000)
|
||||||
},
|
},
|
||||||
data: function () {
|
|
||||||
return window.info
|
|
||||||
},
|
|
||||||
methods: {
|
methods: {
|
||||||
showUpload: function () {
|
showUpload: function () {
|
||||||
if (this.req.kind === 'editor') return false
|
if (this.$store.state.req.kind === 'editor') return false
|
||||||
return $.user.allowNew
|
return this.$store.state.user.allowNew
|
||||||
},
|
},
|
||||||
showDeleteButton: showDeleteButton,
|
showDeleteButton: function () {
|
||||||
showRenameButton: showRenameButton,
|
if (this.$store.state.req.kind === 'listing') {
|
||||||
showMoveButton: function () {
|
if (this.$store.getters.selectedCount === 0) {
|
||||||
if (this.req.kind !== 'listing') {
|
|
||||||
return false
|
return false
|
||||||
}
|
}
|
||||||
|
|
||||||
if (this.selected.length > 0) {
|
return this.$store.state.user.allowEdit
|
||||||
return $.user.allowEdit
|
}
|
||||||
|
|
||||||
|
return this.$store.state.user.allowEdit
|
||||||
|
},
|
||||||
|
showRenameButton: function () {
|
||||||
|
if (this.$store.state.req.kind === 'listing') {
|
||||||
|
if (this.$store.getters.selectedCount === 1) {
|
||||||
|
return this.$store.state.user.allowEdit
|
||||||
|
}
|
||||||
|
|
||||||
|
return false
|
||||||
|
}
|
||||||
|
|
||||||
|
return this.$store.state.user.allowEdit
|
||||||
|
},
|
||||||
|
showMoveButton: function () {
|
||||||
|
if (this.$store.state.req.kind !== 'listing') {
|
||||||
|
return false
|
||||||
|
}
|
||||||
|
|
||||||
|
if (this.$store.getters.selectedCount > 0) {
|
||||||
|
return this.$store.state.user.allowEdit
|
||||||
}
|
}
|
||||||
|
|
||||||
return false
|
return false
|
||||||
|
|
|
@ -1,24 +0,0 @@
|
||||||
// Removes an element, if exists, from an array
|
|
||||||
function removeElement (array, element) {
|
|
||||||
var i = array.indexOf(element)
|
|
||||||
if (i !== -1) {
|
|
||||||
array.splice(i, 1)
|
|
||||||
}
|
|
||||||
|
|
||||||
return array
|
|
||||||
}
|
|
||||||
|
|
||||||
// Replaces an element inside an array by another
|
|
||||||
function replaceElement (array, oldElement, newElement) {
|
|
||||||
var i = array.indexOf(oldElement)
|
|
||||||
if (i !== -1) {
|
|
||||||
array[i] = newElement
|
|
||||||
}
|
|
||||||
|
|
||||||
return array
|
|
||||||
}
|
|
||||||
|
|
||||||
export default {
|
|
||||||
remove: removeElement,
|
|
||||||
replace: replaceElement
|
|
||||||
}
|
|
|
@ -1,8 +1,8 @@
|
||||||
<template>
|
<template>
|
||||||
<div class="prompt">
|
<div class="prompt">
|
||||||
<h3>Delete files</h3>
|
<h3>Delete files</h3>
|
||||||
<p v-show="req.kind !== 'listing'">Are you sure you want to delete this file/folder?</p>
|
<p v-show="$store.state.req.kind !== 'listing'">Are you sure you want to delete this file/folder?</p>
|
||||||
<p v-show="req.kind === 'listing'">Are you sure you want to delete {{ selected.length }} file(s)?</p>
|
<p v-show="$store.state.req.kind === 'listing'">Are you sure you want to delete {{ $store.getters.selectedCount }} file(s)?</p>
|
||||||
<div>
|
<div>
|
||||||
<button @click="submit" autofocus>Delete</button>
|
<button @click="submit" autofocus>Delete</button>
|
||||||
<button @click="cancel" class="cancel">Cancel</button>
|
<button @click="cancel" class="cancel">Cancel</button>
|
||||||
|
@ -14,13 +14,8 @@
|
||||||
import webdav from '../webdav'
|
import webdav from '../webdav'
|
||||||
import page from '../page'
|
import page from '../page'
|
||||||
|
|
||||||
var $ = window.info
|
|
||||||
|
|
||||||
export default {
|
export default {
|
||||||
name: 'delete-prompt',
|
name: 'delete-prompt',
|
||||||
data: function () {
|
|
||||||
return window.info
|
|
||||||
},
|
|
||||||
methods: {
|
methods: {
|
||||||
cancel: function (event) {
|
cancel: function (event) {
|
||||||
this.$store.commit('showDelete', false)
|
this.$store.commit('showDelete', false)
|
||||||
|
@ -29,7 +24,7 @@ export default {
|
||||||
this.$store.commit('showDelete', false)
|
this.$store.commit('showDelete', false)
|
||||||
// buttons.setLoading('delete')
|
// buttons.setLoading('delete')
|
||||||
|
|
||||||
if ($.req.kind !== 'listing') {
|
if (this.$store.state.req.kind !== 'listing') {
|
||||||
webdav.trash(window.location.pathname)
|
webdav.trash(window.location.pathname)
|
||||||
.then(() => {
|
.then(() => {
|
||||||
// buttons.setDone('delete')
|
// buttons.setDone('delete')
|
||||||
|
@ -43,13 +38,13 @@ export default {
|
||||||
return
|
return
|
||||||
}
|
}
|
||||||
|
|
||||||
if ($.selected.length === 0) {
|
if (this.$store.getters.selectedCount === 0) {
|
||||||
// This shouldn't happen...
|
// This shouldn't happen...
|
||||||
return
|
return
|
||||||
}
|
}
|
||||||
|
|
||||||
if ($.selected.length === 1) {
|
if (this.$store.getters.selectedCount === 1) {
|
||||||
webdav.trash($.req.data.items[$.selected[0]].url)
|
webdav.trash(this.$store.state.req.data.items[this.$store.state.selected[0]].url)
|
||||||
.then(() => {
|
.then(() => {
|
||||||
// buttons.setDone('delete')
|
// buttons.setDone('delete')
|
||||||
page.reload()
|
page.reload()
|
||||||
|
@ -65,8 +60,8 @@ export default {
|
||||||
// More than one item!
|
// More than one item!
|
||||||
let promises = []
|
let promises = []
|
||||||
|
|
||||||
for (let index of $.selected) {
|
for (let index of this.$store.state.selected) {
|
||||||
promises.push(webdav.trash($.req.data.items[index].url))
|
promises.push(webdav.trash(this.$store.state.req.data.items[index].url))
|
||||||
}
|
}
|
||||||
|
|
||||||
Promise.all(promises)
|
Promise.all(promises)
|
||||||
|
|
|
@ -13,7 +13,7 @@ export default {
|
||||||
name: 'download-button',
|
name: 'download-button',
|
||||||
methods: {
|
methods: {
|
||||||
count: function () {
|
count: function () {
|
||||||
return $.selected.length
|
return this.$store.getters.selectedCount
|
||||||
},
|
},
|
||||||
download: function (event) {
|
download: function (event) {
|
||||||
if ($.req.kind !== 'listing') {
|
if ($.req.kind !== 'listing') {
|
||||||
|
|
|
@ -30,7 +30,7 @@ export default {
|
||||||
name: 'help',
|
name: 'help',
|
||||||
methods: {
|
methods: {
|
||||||
close: function (event) {
|
close: function (event) {
|
||||||
window.info.showHelp = false
|
this.$store.commit('showHelp', false)
|
||||||
}
|
}
|
||||||
}
|
}
|
||||||
}
|
}
|
||||||
|
|
|
@ -59,9 +59,9 @@
|
||||||
|
|
||||||
<input style="display:none" type="file" id="upload-input" @change="uploadInput($event)" value="Upload" multiple>
|
<input style="display:none" type="file" id="upload-input" @change="uploadInput($event)" value="Upload" multiple>
|
||||||
|
|
||||||
<div v-show="multiple" :class="{ active: multiple }" id="multiple-selection">
|
<div v-show="$store.state.multiple" :class="{ active: $store.state.multiple }" id="multiple-selection">
|
||||||
<p>Multiple selection enabled</p>
|
<p>Multiple selection enabled</p>
|
||||||
<div @click="cancelMultiple" tabindex="0" role="button" title="Clear" aria-label="Clear" class="action">
|
<div @click="$store.commit('multiple', false)" tabindex="0" role="button" title="Clear" aria-label="Clear" class="action">
|
||||||
<i class="material-icons" title="Clear">clear</i>
|
<i class="material-icons" title="Clear">clear</i>
|
||||||
</div>
|
</div>
|
||||||
</div>
|
</div>
|
||||||
|
@ -73,8 +73,6 @@ import Item from './ListingItem'
|
||||||
import webdav from '../webdav.js'
|
import webdav from '../webdav.js'
|
||||||
import page from '../page.js'
|
import page from '../page.js'
|
||||||
|
|
||||||
var $ = window.info
|
|
||||||
|
|
||||||
export default {
|
export default {
|
||||||
name: 'listing',
|
name: 'listing',
|
||||||
data: function () {
|
data: function () {
|
||||||
|
@ -92,9 +90,6 @@ export default {
|
||||||
base64: function (name) {
|
base64: function (name) {
|
||||||
return window.btoa(name)
|
return window.btoa(name)
|
||||||
},
|
},
|
||||||
cancelMultiple: function () {
|
|
||||||
$.multiple = false
|
|
||||||
},
|
|
||||||
dragEnter: function (event) {
|
dragEnter: function (event) {
|
||||||
let items = document.getElementsByClassName('item')
|
let items = document.getElementsByClassName('item')
|
||||||
|
|
||||||
|
|
|
@ -25,18 +25,18 @@
|
||||||
</template>
|
</template>
|
||||||
|
|
||||||
<script>
|
<script>
|
||||||
|
import { mapMutations } from 'vuex'
|
||||||
import filesize from 'filesize'
|
import filesize from 'filesize'
|
||||||
import moment from 'moment'
|
import moment from 'moment'
|
||||||
import webdav from '../webdav.js'
|
import webdav from '../webdav.js'
|
||||||
import page from '../page.js'
|
import page from '../page.js'
|
||||||
import array from '../array.js'
|
|
||||||
|
|
||||||
var $ = window.info
|
|
||||||
|
|
||||||
export default {
|
export default {
|
||||||
name: 'item',
|
name: 'item',
|
||||||
props: ['name', 'isDir', 'url', 'type', 'size', 'modified', 'index'],
|
props: ['name', 'isDir', 'url', 'type', 'size', 'modified', 'index'],
|
||||||
methods: {
|
methods: {
|
||||||
|
// ...mapGetters('selectedCount'),
|
||||||
|
...mapMutations('addSelected', 'removeSelected'),
|
||||||
icon: function () {
|
icon: function () {
|
||||||
if (this.isDir) return 'folder'
|
if (this.isDir) return 'folder'
|
||||||
if (this.type === 'image') return 'insert_photo'
|
if (this.type === 'image') return 'insert_photo'
|
||||||
|
@ -98,19 +98,21 @@ export default {
|
||||||
link.setAttribute('aria-selected', false)
|
link.setAttribute('aria-selected', false)
|
||||||
})
|
})
|
||||||
|
|
||||||
$.selected = []
|
this.$store.commit('resetSelected')
|
||||||
return false
|
return false
|
||||||
},
|
},
|
||||||
click: function (event) {
|
click: function (event) {
|
||||||
if ($.selected.length !== 0) event.preventDefault()
|
if (this.selectedCount !== 0) event.preventDefault()
|
||||||
if ($.selected.indexOf(this.index) === -1) {
|
if (this.$store.state.selected.indexOf(this.index) === -1) {
|
||||||
if (!event.ctrlKey && !$.multiple) this.unselectAll()
|
if (!event.ctrlKey && !this.$store.state.multiple) this.unselectAll()
|
||||||
|
|
||||||
this.$el.setAttribute('aria-selected', true)
|
this.$el.setAttribute('aria-selected', true)
|
||||||
$.selected.push(this.index)
|
// WORKS: this.$store.commit('addSelected', this.index)
|
||||||
|
this.addSelected(this.index)
|
||||||
} else {
|
} else {
|
||||||
this.$el.setAttribute('aria-selected', false)
|
this.$el.setAttribute('aria-selected', false)
|
||||||
$.selected = array.remove($.selected, this.index)
|
this.removeSelected(this.index)
|
||||||
|
// WORKS: this.$store.commit('removeSelected', this.index)
|
||||||
}
|
}
|
||||||
|
|
||||||
// this.handleSelectionChange()
|
// this.handleSelectionChange()
|
||||||
|
|
|
@ -17,8 +17,7 @@
|
||||||
|
|
||||||
<script>
|
<script>
|
||||||
import page from '../page'
|
import page from '../page'
|
||||||
|
import { mapState } from 'vuex'
|
||||||
var $ = window.info
|
|
||||||
|
|
||||||
export default {
|
export default {
|
||||||
name: 'search',
|
name: 'search',
|
||||||
|
@ -31,6 +30,7 @@ export default {
|
||||||
input: null
|
input: null
|
||||||
}
|
}
|
||||||
},
|
},
|
||||||
|
computed: mapState('user'),
|
||||||
mounted: function () {
|
mounted: function () {
|
||||||
this.scrollable = document.querySelector('#search > div')
|
this.scrollable = document.querySelector('#search > div')
|
||||||
this.box = document.querySelector('#search > div div')
|
this.box = document.querySelector('#search > div div')
|
||||||
|
@ -39,8 +39,8 @@ export default {
|
||||||
},
|
},
|
||||||
methods: {
|
methods: {
|
||||||
reset: function () {
|
reset: function () {
|
||||||
if ($.user.allowCommands && $.user.commands.length > 0) {
|
if (this.user.allowCommands && this.user.commands.length > 0) {
|
||||||
this.box.innerHTML = `Search or use one of your supported commands: ${$.user.commands.join(', ')}.`
|
this.box.innerHTML = `Search or use one of your supported commands: ${this.user.commands.join(', ')}.`
|
||||||
} else {
|
} else {
|
||||||
this.box.innerHTML = 'Type and press enter to search.'
|
this.box.innerHTML = 'Type and press enter to search.'
|
||||||
}
|
}
|
||||||
|
@ -49,8 +49,8 @@ export default {
|
||||||
let value = this.input.value
|
let value = this.input.value
|
||||||
let pieces = value.split(' ')
|
let pieces = value.split(' ')
|
||||||
|
|
||||||
for (let i = 0; i < $.user.commands.length; i++) {
|
for (let i = 0; i < this.user.commands.length; i++) {
|
||||||
if (pieces[0] === $.user.commands[0]) {
|
if (pieces[0] === this.user.commands[0]) {
|
||||||
return true
|
return true
|
||||||
}
|
}
|
||||||
}
|
}
|
||||||
|
@ -69,7 +69,7 @@ export default {
|
||||||
return
|
return
|
||||||
}
|
}
|
||||||
|
|
||||||
if (!this.supported() || !$.user.allowCommands) {
|
if (!this.supported() || !this.user.allowCommands) {
|
||||||
this.box.innerHTML = 'Press enter to search.'
|
this.box.innerHTML = 'Press enter to search.'
|
||||||
} else {
|
} else {
|
||||||
this.box.innerHTML = 'Press enter to execute.'
|
this.box.innerHTML = 'Press enter to execute.'
|
||||||
|
@ -87,7 +87,7 @@ export default {
|
||||||
|
|
||||||
let protocol = this.$store.state.ssl ? 'wss:' : 'ws:'
|
let protocol = this.$store.state.ssl ? 'wss:' : 'ws:'
|
||||||
|
|
||||||
if (this.supported() && $.user.allowCommands) {
|
if (this.supported() && this.user.allowCommands) {
|
||||||
let conn = new window.WebSocket(`${protocol}//${url}?command=true`)
|
let conn = new window.WebSocket(`${protocol}//${url}?command=true`)
|
||||||
|
|
||||||
conn.onopen = () => {
|
conn.onopen = () => {
|
||||||
|
|
|
@ -8,15 +8,13 @@
|
||||||
<script>
|
<script>
|
||||||
import page from '../page'
|
import page from '../page'
|
||||||
|
|
||||||
var $ = window.info
|
|
||||||
|
|
||||||
export default {
|
export default {
|
||||||
name: 'switch-button',
|
name: 'switch-button',
|
||||||
methods: {
|
methods: {
|
||||||
change: function (event) {
|
change: function (event) {
|
||||||
let url = window.location.pathname + '?display='
|
let url = window.location.pathname + '?display='
|
||||||
|
|
||||||
if ($.req.data.display === 'mosaic') {
|
if (this.$store.state.req.data.display === 'mosaic') {
|
||||||
url += 'list'
|
url += 'list'
|
||||||
} else {
|
} else {
|
||||||
url += 'mosaic'
|
url += 'mosaic'
|
||||||
|
@ -25,7 +23,7 @@ export default {
|
||||||
page.open(url)
|
page.open(url)
|
||||||
},
|
},
|
||||||
icon: function () {
|
icon: function () {
|
||||||
if ($.req.data.display === 'mosaic') return 'view_list'
|
if (this.$store.state.req.data.display === 'mosaic') return 'view_list'
|
||||||
return 'view_module'
|
return 'view_module'
|
||||||
}
|
}
|
||||||
}
|
}
|
||||||
|
|
|
@ -3,7 +3,6 @@
|
||||||
import Vue from 'vue'
|
import Vue from 'vue'
|
||||||
import App from './App'
|
import App from './App'
|
||||||
import store from './store/store'
|
import store from './store/store'
|
||||||
// simport page from './page.js'
|
|
||||||
|
|
||||||
Vue.config.productionTip = false
|
Vue.config.productionTip = false
|
||||||
|
|
||||||
|
@ -12,38 +11,6 @@ var $ = (window.info || window.alert('Something is wrong, please refresh!'))
|
||||||
// TODO: keep this here? Maybe on app.vue?
|
// TODO: keep this here? Maybe on app.vue?
|
||||||
document.title = $.req.data.name
|
document.title = $.req.data.name
|
||||||
|
|
||||||
// TODO: keep this here? Maybe on app.vue?
|
|
||||||
window.addEventListener('popstate', (event) => {
|
|
||||||
event.preventDefault()
|
|
||||||
event.stopPropagation()
|
|
||||||
|
|
||||||
$.req.kind = ''
|
|
||||||
$.selected = []
|
|
||||||
$.multiple = false
|
|
||||||
// TODO: find a better way to do this. Maybe on app.vue?
|
|
||||||
window.info.showHelp = false
|
|
||||||
window.info.showInfo = false
|
|
||||||
window.info.showDelete = false
|
|
||||||
window.info.showRename = false
|
|
||||||
window.info.showMove = false
|
|
||||||
|
|
||||||
let request = new window.XMLHttpRequest()
|
|
||||||
request.open('GET', event.state.url, true)
|
|
||||||
request.setRequestHeader('Accept', 'application/json')
|
|
||||||
|
|
||||||
request.onload = () => {
|
|
||||||
if (request.status === 200) {
|
|
||||||
$.req = JSON.parse(request.responseText)
|
|
||||||
document.title = event.state.name
|
|
||||||
} else {
|
|
||||||
console.log(request.responseText)
|
|
||||||
}
|
|
||||||
}
|
|
||||||
|
|
||||||
request.onerror = (error) => { console.log(error) }
|
|
||||||
request.send()
|
|
||||||
})
|
|
||||||
|
|
||||||
/* eslint-disable no-new */
|
/* eslint-disable no-new */
|
||||||
new Vue({
|
new Vue({
|
||||||
el: '#app',
|
el: '#app',
|
||||||
|
|
|
@ -1,10 +1,9 @@
|
||||||
var $ = window.info
|
import store from './store/store'
|
||||||
|
|
||||||
function open (url, history) {
|
function open (url, history) {
|
||||||
// Reset info
|
// Reset info
|
||||||
$.selected = []
|
store.commit('resetSelected')
|
||||||
$.multiple = false
|
store.commit('multiple', false)
|
||||||
$.req.kind = ''
|
|
||||||
|
|
||||||
let request = new window.XMLHttpRequest()
|
let request = new window.XMLHttpRequest()
|
||||||
request.open('GET', url, true)
|
request.open('GET', url, true)
|
||||||
|
@ -12,15 +11,16 @@ function open (url, history) {
|
||||||
|
|
||||||
request.onload = () => {
|
request.onload = () => {
|
||||||
if (request.status === 200) {
|
if (request.status === 200) {
|
||||||
$.req = JSON.parse(request.responseText)
|
let req = JSON.parse(request.responseText)
|
||||||
|
store.commit('updateRequest', req)
|
||||||
|
|
||||||
if (history) {
|
if (history) {
|
||||||
window.history.pushState({
|
window.history.pushState({
|
||||||
name: $.req.data.name,
|
name: req.data.name,
|
||||||
url: url
|
url: url
|
||||||
}, $.req.data.name, url)
|
}, req.data.name, url)
|
||||||
|
|
||||||
document.title = $.req.data.name
|
document.title = req.data.name
|
||||||
}
|
}
|
||||||
} else {
|
} else {
|
||||||
console.log(request.responseText)
|
console.log(request.responseText)
|
||||||
|
|
|
@ -0,0 +1,34 @@
|
||||||
|
const mutations = {
|
||||||
|
showInfo: (state, value) => (state.showInfo = value),
|
||||||
|
showHelp: (state, value) => (state.showHelp = value),
|
||||||
|
showDelete: (state, value) => (state.showDelete = value),
|
||||||
|
showRename: (state, value) => (state.showRename = value),
|
||||||
|
showMove: (state, value) => (state.showMove = value),
|
||||||
|
showNewFile: (state, value) => (state.showNewFile = value),
|
||||||
|
showNewDir: (state, value) => (state.showNewDir = value),
|
||||||
|
resetPrompts: (state) => {
|
||||||
|
state.showHelp = false
|
||||||
|
state.showInfo = false
|
||||||
|
state.showDelete = false
|
||||||
|
state.showRename = false
|
||||||
|
state.showMove = false
|
||||||
|
state.showNewFile = false
|
||||||
|
state.showNewDir = false
|
||||||
|
},
|
||||||
|
multiple: (state, value) => (state.multiple = value),
|
||||||
|
addSelected: (state, value) => (state.selected.push(value)),
|
||||||
|
removeSelected: (state, value) => {
|
||||||
|
let i = state.selected.indexOf(value)
|
||||||
|
if (i === -1) return
|
||||||
|
state.selected.splice(i, 1)
|
||||||
|
},
|
||||||
|
resetSelected: (state) => {
|
||||||
|
state.selected.length = 0
|
||||||
|
},
|
||||||
|
updateRequest: (state, value) => {
|
||||||
|
state.req.kind = value.kind
|
||||||
|
state.req.data = value.data
|
||||||
|
}
|
||||||
|
}
|
||||||
|
|
||||||
|
export default mutations
|
|
@ -1,9 +1,14 @@
|
||||||
import Vue from 'vue'
|
import Vue from 'vue'
|
||||||
import Vuex from 'vuex'
|
import Vuex from 'vuex'
|
||||||
|
import mutations from './mutations'
|
||||||
|
|
||||||
Vue.use(Vuex)
|
Vue.use(Vuex)
|
||||||
|
|
||||||
const state = {
|
const state = {
|
||||||
|
user: window.info.user,
|
||||||
|
req: window.info.req,
|
||||||
|
webDavURL: window.info.webdavURL,
|
||||||
|
baseURL: window.info.baseURL,
|
||||||
ssl: (window.location.protocol === 'https:'),
|
ssl: (window.location.protocol === 'https:'),
|
||||||
selected: [],
|
selected: [],
|
||||||
multiple: false,
|
multiple: false,
|
||||||
|
@ -25,30 +30,8 @@ const getters = {
|
||||||
state.showMove ||
|
state.showMove ||
|
||||||
state.showNewFile ||
|
state.showNewFile ||
|
||||||
state.showNewDir
|
state.showNewDir
|
||||||
}
|
|
||||||
}
|
|
||||||
|
|
||||||
const mutations = {
|
|
||||||
showInfo: (state, value) => (state.showInfo = value),
|
|
||||||
showHelp: (state, value) => (state.showHelp = value),
|
|
||||||
showDelete: (state, value) => (state.showDelete = value),
|
|
||||||
showRename: (state, value) => (state.showRename = value),
|
|
||||||
showMove: (state, value) => (state.showMove = value),
|
|
||||||
showNewFile: (state, value) => (state.showNewFile = value),
|
|
||||||
showNewDir: (state, value) => (state.showNewDir = value),
|
|
||||||
resetPrompts: (state) => {
|
|
||||||
state.showHelp = false
|
|
||||||
state.showInfo = false
|
|
||||||
state.showDelete = false
|
|
||||||
state.showRename = false
|
|
||||||
state.showMove = false
|
|
||||||
state.showNewFile = false
|
|
||||||
state.showNewDir = false
|
|
||||||
},
|
},
|
||||||
multiple: (state, value) => (state.multiple = value),
|
selectedCount: state => state.selected.length
|
||||||
resetSelected: (state) => {
|
|
||||||
state.selected.length = 0
|
|
||||||
}
|
|
||||||
}
|
}
|
||||||
|
|
||||||
export default new Vuex.Store({
|
export default new Vuex.Store({
|
||||||
|
|
|
@ -1,24 +0,0 @@
|
||||||
// Removes an element, if exists, from an array
|
|
||||||
function removeElement (array, element) {
|
|
||||||
var i = array.indexOf(element)
|
|
||||||
if (i !== -1) {
|
|
||||||
array.splice(i, 1)
|
|
||||||
}
|
|
||||||
|
|
||||||
return array
|
|
||||||
}
|
|
||||||
|
|
||||||
// Replaces an element inside an array by another
|
|
||||||
function replaceElement (array, oldElement, newElement) {
|
|
||||||
var i = array.indexOf(oldElement)
|
|
||||||
if (i !== -1) {
|
|
||||||
array[i] = newElement
|
|
||||||
}
|
|
||||||
|
|
||||||
return array
|
|
||||||
}
|
|
||||||
|
|
||||||
export default {
|
|
||||||
remove: removeElement,
|
|
||||||
replace: replaceElement
|
|
||||||
}
|
|
|
@ -1,28 +0,0 @@
|
||||||
export default function getRule (rules) {
|
|
||||||
for (let i = 0; i < rules.length; i++) {
|
|
||||||
rules[i] = rules[i].toLowerCase()
|
|
||||||
}
|
|
||||||
|
|
||||||
let result = null
|
|
||||||
let find = Array.prototype.find
|
|
||||||
|
|
||||||
find.call(document.styleSheets, styleSheet => {
|
|
||||||
result = find.call(styleSheet.cssRules, cssRule => {
|
|
||||||
let found = false
|
|
||||||
|
|
||||||
if (cssRule instanceof window.CSSStyleRule) {
|
|
||||||
for (let i = 0; i < rules.length; i++) {
|
|
||||||
if (cssRule.selectorText.toLowerCase() === rules[i]) {
|
|
||||||
found = true
|
|
||||||
}
|
|
||||||
}
|
|
||||||
}
|
|
||||||
|
|
||||||
return found
|
|
||||||
})
|
|
||||||
|
|
||||||
return result != null
|
|
||||||
})
|
|
||||||
|
|
||||||
return result
|
|
||||||
}
|
|
|
@ -1,50 +0,0 @@
|
||||||
var $ = window.info
|
|
||||||
|
|
||||||
function open (url, history) {
|
|
||||||
// Reset info
|
|
||||||
$.selected = []
|
|
||||||
$.multiple = false
|
|
||||||
$.req.kind = ''
|
|
||||||
|
|
||||||
let request = new window.XMLHttpRequest()
|
|
||||||
request.open('GET', url, true)
|
|
||||||
request.setRequestHeader('Accept', 'application/json')
|
|
||||||
|
|
||||||
request.onload = () => {
|
|
||||||
if (request.status === 200) {
|
|
||||||
$.req = JSON.parse(request.responseText)
|
|
||||||
|
|
||||||
if (history) {
|
|
||||||
window.history.pushState({
|
|
||||||
name: $.req.data.name,
|
|
||||||
url: url
|
|
||||||
}, $.req.data.name, url)
|
|
||||||
|
|
||||||
document.title = $.req.data.name
|
|
||||||
}
|
|
||||||
} else {
|
|
||||||
console.log(request.responseText)
|
|
||||||
}
|
|
||||||
}
|
|
||||||
|
|
||||||
request.onerror = (error) => { console.log(error) }
|
|
||||||
request.send()
|
|
||||||
}
|
|
||||||
|
|
||||||
function removeLastDir (url) {
|
|
||||||
var arr = url.split('/')
|
|
||||||
if (arr.pop() === '') {
|
|
||||||
arr.pop()
|
|
||||||
}
|
|
||||||
return (arr.join('/'))
|
|
||||||
}
|
|
||||||
|
|
||||||
export default {
|
|
||||||
reload: () => {
|
|
||||||
open(window.location.pathname, false)
|
|
||||||
},
|
|
||||||
open: (url) => {
|
|
||||||
open(url, true)
|
|
||||||
},
|
|
||||||
removeLastDir: removeLastDir
|
|
||||||
}
|
|
|
@ -1,109 +0,0 @@
|
||||||
var $ = window.info
|
|
||||||
|
|
||||||
function convertURL (url) {
|
|
||||||
return window.location.origin + url.replace($.baseURL + '/', $.webdavURL + '/')
|
|
||||||
}
|
|
||||||
|
|
||||||
function move (oldLink, newLink) {
|
|
||||||
return new Promise((resolve, reject) => {
|
|
||||||
let request = new window.XMLHttpRequest()
|
|
||||||
|
|
||||||
oldLink = convertURL(oldLink)
|
|
||||||
newLink = newLink.replace($.baseURL + '/', $.webdavURL + '/')
|
|
||||||
newLink = window.location.origin + newLink.substring($.baseURL.length)
|
|
||||||
|
|
||||||
request.open('MOVE', oldLink, true)
|
|
||||||
request.setRequestHeader('Destination', newLink)
|
|
||||||
request.onload = () => {
|
|
||||||
if (request.status === 201 || request.status === 204) {
|
|
||||||
resolve()
|
|
||||||
} else {
|
|
||||||
reject(request.statusText)
|
|
||||||
}
|
|
||||||
}
|
|
||||||
request.onerror = () => reject(request.statusText)
|
|
||||||
request.send()
|
|
||||||
})
|
|
||||||
}
|
|
||||||
|
|
||||||
function put (link, body, headers = {}) {
|
|
||||||
return new Promise((resolve, reject) => {
|
|
||||||
let request = new window.XMLHttpRequest()
|
|
||||||
request.open('PUT', convertURL(link), true)
|
|
||||||
|
|
||||||
for (let key in headers) {
|
|
||||||
request.setRequestHeader(key, headers[key])
|
|
||||||
}
|
|
||||||
|
|
||||||
request.onload = () => {
|
|
||||||
if (request.status === 201) {
|
|
||||||
resolve()
|
|
||||||
} else {
|
|
||||||
reject(request.statusText)
|
|
||||||
}
|
|
||||||
}
|
|
||||||
request.onerror = () => reject(request.statusText)
|
|
||||||
request.send(body)
|
|
||||||
})
|
|
||||||
}
|
|
||||||
|
|
||||||
function propfind (link, body, headers = {}) {
|
|
||||||
return new Promise((resolve, reject) => {
|
|
||||||
let request = new window.XMLHttpRequest()
|
|
||||||
request.open('PROPFIND', convertURL(link), true)
|
|
||||||
|
|
||||||
for (let key in headers) {
|
|
||||||
request.setRequestHeader(key, headers[key])
|
|
||||||
}
|
|
||||||
|
|
||||||
request.onload = () => {
|
|
||||||
if (request.status < 300) {
|
|
||||||
resolve(request.responseText)
|
|
||||||
} else {
|
|
||||||
reject(request.statusText)
|
|
||||||
}
|
|
||||||
}
|
|
||||||
request.onerror = () => reject(request.statusText)
|
|
||||||
request.send(body)
|
|
||||||
})
|
|
||||||
}
|
|
||||||
|
|
||||||
function trash (link) {
|
|
||||||
return new Promise((resolve, reject) => {
|
|
||||||
let request = new window.XMLHttpRequest()
|
|
||||||
request.open('DELETE', convertURL(link), true)
|
|
||||||
request.onload = () => {
|
|
||||||
if (request.status === 204) {
|
|
||||||
resolve()
|
|
||||||
} else {
|
|
||||||
reject(request.statusText)
|
|
||||||
}
|
|
||||||
}
|
|
||||||
request.onerror = () => reject(request.statusText)
|
|
||||||
request.send()
|
|
||||||
})
|
|
||||||
}
|
|
||||||
|
|
||||||
function create (link) {
|
|
||||||
return new Promise((resolve, reject) => {
|
|
||||||
let request = new window.XMLHttpRequest()
|
|
||||||
request.open((link.endsWith('/') ? 'MKCOL' : 'PUT'), convertURL(link), true)
|
|
||||||
request.onload = () => {
|
|
||||||
if (request.status === 201) {
|
|
||||||
resolve()
|
|
||||||
} else {
|
|
||||||
reject(request.statusText)
|
|
||||||
}
|
|
||||||
}
|
|
||||||
request.onerror = () => reject(request.statusText)
|
|
||||||
request.send()
|
|
||||||
})
|
|
||||||
}
|
|
||||||
|
|
||||||
export default {
|
|
||||||
create: create,
|
|
||||||
trash: trash,
|
|
||||||
propfind: propfind,
|
|
||||||
put: put,
|
|
||||||
move: move
|
|
||||||
}
|
|
Loading…
Reference in New Issue