Organisation and reworking stuff
Former-commit-id: 01621444e51316cc9f125e4d541caf9d6c9d37a1 [formerly 733a976b594348754cb34b27c594c485fd5b0df4] [formerly 36a2f39b0e471ee231343ebaed474ae247764b37 [formerly 8d891f0d513d21282adfd9e1b9f206b69f4b17c7]] Former-commit-id: 505c381e3135c0e0607e984a37e908672e8100a3 [formerly a6e70288608c6ee1edc380af76ee3e82ff62861a] Former-commit-id: d946069b4f8ad1b19da7ee087901762b3f4b7936
This commit is contained in:
Henrique Dias
68
_assets/src/components/prompts/DeletePrompt.vue
Normal file
68
_assets/src/components/prompts/DeletePrompt.vue
Normal file
@@ -0,0 +1,68 @@
|
||||
<template>
|
||||
<div class="prompt">
|
||||
<h3>Delete files</h3>
|
||||
<p v-show="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 {{ selectedCount }} file(s)?</p>
|
||||
<div>
|
||||
<button @click="submit" autofocus>Delete</button>
|
||||
<button @click="showDelete(false)" class="cancel">Cancel</button>
|
||||
</div>
|
||||
</div>
|
||||
</template>
|
||||
|
||||
<script>
|
||||
import {mapGetters, mapMutations, mapState} from 'vuex'
|
||||
import webdav from '@/utils/webdav'
|
||||
import page from '@/utils/page'
|
||||
|
||||
export default {
|
||||
name: 'delete-prompt',
|
||||
computed: {
|
||||
...mapGetters(['selectedCount']),
|
||||
...mapState(['req', 'selected'])
|
||||
},
|
||||
methods: {
|
||||
...mapMutations(['showDelete']),
|
||||
submit: function (event) {
|
||||
this.showDelete(false)
|
||||
// buttons.setLoading('delete')
|
||||
|
||||
if (this.req.kind !== 'listing') {
|
||||
webdav.trash(window.location.pathname)
|
||||
.then(() => {
|
||||
// buttons.setDone('delete')
|
||||
page.open(page.removeLastDir(window.location.pathname) + '/')
|
||||
})
|
||||
.catch(error => {
|
||||
// buttons.setDone('delete', false)
|
||||
console.log(error)
|
||||
})
|
||||
|
||||
return
|
||||
}
|
||||
|
||||
if (this.selectedCount === 0) {
|
||||
// This shouldn't happen...
|
||||
return
|
||||
}
|
||||
|
||||
let promises = []
|
||||
|
||||
for (let index of this.selected) {
|
||||
promises.push(webdav.trash(this.req.items[index].url))
|
||||
}
|
||||
|
||||
Promise.all(promises)
|
||||
.then(() => {
|
||||
page.reload()
|
||||
// buttons.setDone('delete')
|
||||
})
|
||||
.catch(error => {
|
||||
console.log(error)
|
||||
page.reload()
|
||||
// buttons.setDone('delete', false)
|
||||
})
|
||||
}
|
||||
}
|
||||
}
|
||||
</script>
|
||||
42
_assets/src/components/prompts/DownloadPrompt.vue
Normal file
42
_assets/src/components/prompts/DownloadPrompt.vue
Normal file
@@ -0,0 +1,42 @@
|
||||
<template>
|
||||
<div class="prompt" id="download">
|
||||
<h3>Download files</h3>
|
||||
<p>Choose the format you want to download.</p>
|
||||
<button @click="download('zip')" autofocus>zip</button>
|
||||
<button @click="download('tar')" autofocus>tar</button>
|
||||
<button @click="download('targz')" autofocus>tar.gz</button>
|
||||
<button @click="download('tarbz2')" autofocus>tar.bz2</button>
|
||||
<button @click="download('tarxz')" autofocus>tar.xz</button>
|
||||
</div>
|
||||
</template>
|
||||
|
||||
<script>
|
||||
import {mapGetters, mapState} from 'vuex'
|
||||
|
||||
export default {
|
||||
name: 'download-prompt',
|
||||
computed: {
|
||||
...mapState(['selected', 'req']),
|
||||
...mapGetters(['selectedCount'])
|
||||
},
|
||||
methods: {
|
||||
download: function (format) {
|
||||
let uri = `${window.location.pathname}?download=${format}`
|
||||
|
||||
if (this.selectedCount > 0) {
|
||||
let files = ''
|
||||
|
||||
for (let i of this.selected) {
|
||||
files += this.req.items[i].url.replace(window.location.pathname, '') + ','
|
||||
}
|
||||
|
||||
files = files.substring(0, files.length - 1)
|
||||
files = encodeURIComponent(files)
|
||||
uri += `&files=${files}`
|
||||
}
|
||||
|
||||
window.open(uri)
|
||||
}
|
||||
}
|
||||
}
|
||||
</script>
|
||||
108
_assets/src/components/prompts/InfoPrompt.vue
Normal file
108
_assets/src/components/prompts/InfoPrompt.vue
Normal file
@@ -0,0 +1,108 @@
|
||||
<template>
|
||||
<div class="prompt">
|
||||
<h3>File Information</h3>
|
||||
|
||||
<p v-show="selected.length > 1">{{ selected.length }} files selected.</p>
|
||||
|
||||
<p v-show="selected.length < 2"><strong>Display Name:</strong> {{ name() }}</p>
|
||||
<p><strong>Size:</strong> <span id="content_length"></span>{{ humanSize() }}</p>
|
||||
<p v-show="selected.length < 2"><strong>Last Modified:</strong> {{ humanTime() }}</p>
|
||||
|
||||
<section v-show="dir() && selected.length === 0">
|
||||
<p><strong>Number of files:</strong> {{ req.numFiles }}</p>
|
||||
<p><strong>Number of directories:</strong> {{ req.numDirs }}</p>
|
||||
</section>
|
||||
|
||||
<section v-show="!dir()">
|
||||
<p><strong>MD5:</strong> <code><a @click="checksum($event, 'md5')">show</a></code></p>
|
||||
<p><strong>SHA1:</strong> <code><a @click="checksum($event, 'sha1')">show</a></code></p>
|
||||
<p><strong>SHA256:</strong> <code><a @click="checksum($event, 'sha256')">show</a></code></p>
|
||||
<p><strong>SHA512:</strong> <code><a @click="checksum($event, 'sha512')">show</a></code></p>
|
||||
</section>
|
||||
|
||||
<div>
|
||||
<button type="submit" @click="$store.commit('showInfo', false)" class="ok">OK</button>
|
||||
</div>
|
||||
</div>
|
||||
</template>
|
||||
|
||||
<script>
|
||||
import {mapState, mapGetters} from 'vuex'
|
||||
import filesize from 'filesize'
|
||||
import moment from 'moment'
|
||||
|
||||
export default {
|
||||
name: 'info-prompt',
|
||||
computed: {
|
||||
...mapState(['req', 'selected']),
|
||||
...mapGetters(['selectedCount'])
|
||||
},
|
||||
methods: {
|
||||
humanSize: function () {
|
||||
if (this.selectedCount === 0 || this.req.kind !== 'listing') {
|
||||
return filesize(this.req.size)
|
||||
}
|
||||
|
||||
var sum = 0
|
||||
|
||||
for (let i = 0; i < this.selectedCount; i++) {
|
||||
sum += this.req.items[this.selected[i]].size
|
||||
}
|
||||
|
||||
return filesize(sum)
|
||||
},
|
||||
humanTime: function () {
|
||||
if (this.selectedCount === 0) {
|
||||
return moment(this.req.modified).fromNow()
|
||||
}
|
||||
|
||||
return moment(this.req.items[this.selected[0]]).fromNow()
|
||||
},
|
||||
name: function () {
|
||||
if (this.selectedCount === 0) {
|
||||
return this.req.name
|
||||
}
|
||||
|
||||
return this.req.items[this.selected[0]].name
|
||||
},
|
||||
dir: function () {
|
||||
if (this.selectedCount > 1) {
|
||||
// Don't show when multiple selected.
|
||||
return true
|
||||
}
|
||||
|
||||
if (this.selectedCount === 0) {
|
||||
return this.req.isDir
|
||||
}
|
||||
|
||||
return this.req.items[this.selected[0]].isDir
|
||||
},
|
||||
checksum: function (event, hash) {
|
||||
event.preventDefault()
|
||||
|
||||
let request = new window.XMLHttpRequest()
|
||||
let link
|
||||
|
||||
if (this.selectedCount) {
|
||||
link = this.req.items[this.selected[0]].url
|
||||
} else {
|
||||
link = window.location.pathname
|
||||
}
|
||||
|
||||
request.open('GET', `${link}?checksum=${hash}`, true)
|
||||
|
||||
request.onload = () => {
|
||||
if (request.status >= 300) {
|
||||
console.log(request.statusText)
|
||||
return
|
||||
}
|
||||
|
||||
event.target.innerHTML = request.responseText
|
||||
}
|
||||
|
||||
request.onerror = (e) => console.log(e)
|
||||
request.send()
|
||||
}
|
||||
}
|
||||
}
|
||||
</script>
|
||||
148
_assets/src/components/prompts/MovePrompt.vue
Normal file
148
_assets/src/components/prompts/MovePrompt.vue
Normal file
@@ -0,0 +1,148 @@
|
||||
<template>
|
||||
<div class="prompt">
|
||||
<h3>Move</h3>
|
||||
<p>Choose new house for your file(s)/folder(s):</p>
|
||||
|
||||
<ul class="file-list">
|
||||
<li @click="select" @dblclick="next" :key="item.name" v-for="item in items" :data-url="item.url">{{ item.name }}</li>
|
||||
</ul>
|
||||
|
||||
<p>Currently navigating on: <code>{{ current }}</code>.</p>
|
||||
|
||||
<div>
|
||||
<button class="ok" @click="move">Move</button>
|
||||
<button class="cancel" @click="$store.commit('showMove', false)">Cancel</button>
|
||||
</div>
|
||||
</div>
|
||||
</template>
|
||||
|
||||
<script>
|
||||
import { mapState } from 'vuex'
|
||||
import page from '@/utils/page'
|
||||
import webdav from '@/utils/webdav'
|
||||
|
||||
export default {
|
||||
name: 'move-prompt',
|
||||
data: function () {
|
||||
return {
|
||||
items: [],
|
||||
current: window.location.pathname
|
||||
}
|
||||
},
|
||||
computed: mapState(['req', 'selected', 'baseURL']),
|
||||
mounted: function () {
|
||||
if (window.location.pathname !== this.baseURL + '/') {
|
||||
this.items.push({
|
||||
name: '..',
|
||||
url: page.removeLastDir(window.location.pathname) + '/'
|
||||
})
|
||||
}
|
||||
|
||||
if (this.req.kind === 'listing') {
|
||||
for (let item of this.req.items) {
|
||||
if (!item.isDir) continue
|
||||
|
||||
this.items.push({
|
||||
name: item.name,
|
||||
url: item.url
|
||||
})
|
||||
}
|
||||
|
||||
return
|
||||
}
|
||||
},
|
||||
methods: {
|
||||
move: function (event) {
|
||||
event.preventDefault()
|
||||
|
||||
let el = event.currentTarget
|
||||
let promises = []
|
||||
let dest = this.current
|
||||
// buttons.setLoading('move')
|
||||
|
||||
let selected = el.querySelector('li[aria-selected=true]')
|
||||
if (selected !== null) {
|
||||
dest = selected.dataset.url
|
||||
}
|
||||
|
||||
for (let item of this.selected) {
|
||||
let from = this.req.items[item].url
|
||||
let to = dest + '/' + encodeURIComponent(this.req.items[item].name)
|
||||
to = to.replace('//', '/')
|
||||
|
||||
promises.push(webdav.move(from, to))
|
||||
}
|
||||
|
||||
this.$store.commit('showMove', false)
|
||||
|
||||
Promise.all(promises)
|
||||
.then(() => {
|
||||
// buttons.setDone('move')
|
||||
page.open(dest)
|
||||
})
|
||||
.catch(e => {
|
||||
// buttons.setDone('move', false)
|
||||
console.log(e)
|
||||
})
|
||||
},
|
||||
next: function (event) {
|
||||
let url = event.currentTarget.dataset.url
|
||||
this.json(url)
|
||||
.then((data) => {
|
||||
this.current = url
|
||||
this.items = []
|
||||
|
||||
if (url !== this.baseURL + '/') {
|
||||
this.items.push({
|
||||
name: '..',
|
||||
url: page.removeLastDir(url) + '/'
|
||||
})
|
||||
}
|
||||
|
||||
let req = JSON.parse(data)
|
||||
for (let item of req.items) {
|
||||
if (!item.isDir) continue
|
||||
|
||||
this.items.push({
|
||||
name: item.name,
|
||||
url: item.url
|
||||
})
|
||||
}
|
||||
})
|
||||
.catch(e => console.log(e))
|
||||
},
|
||||
json: function (url) {
|
||||
return new Promise((resolve, reject) => {
|
||||
let request = new XMLHttpRequest()
|
||||
request.open('GET', url)
|
||||
request.setRequestHeader('Accept', 'application/json')
|
||||
request.onload = () => {
|
||||
if (request.status === 200) {
|
||||
resolve(request.responseText)
|
||||
} else {
|
||||
reject(request.statusText)
|
||||
}
|
||||
}
|
||||
request.onerror = () => reject(request.statusText)
|
||||
request.send()
|
||||
})
|
||||
},
|
||||
select: function (event) {
|
||||
let el = event.currentTarget
|
||||
|
||||
if (el.getAttribute('aria-selected') === 'true') {
|
||||
el.setAttribute('aria-selected', false)
|
||||
return
|
||||
}
|
||||
|
||||
let el2 = this.$el.querySelector('li[aria-selected=true]')
|
||||
if (el2) {
|
||||
el2.setAttribute('aria-selected', false)
|
||||
}
|
||||
|
||||
el.setAttribute('aria-selected', true)
|
||||
return
|
||||
}
|
||||
}
|
||||
}
|
||||
</script>
|
||||
53
_assets/src/components/prompts/NewDirPrompt.vue
Normal file
53
_assets/src/components/prompts/NewDirPrompt.vue
Normal file
@@ -0,0 +1,53 @@
|
||||
<template>
|
||||
<div class="prompt">
|
||||
<h3>New directory</h3>
|
||||
<p>Write the name of the new directory.</p>
|
||||
<input autofocus type="text" @keyup.enter="submit" v-model.trim="name">
|
||||
<div>
|
||||
<button class="ok" @click="submit">Create</button>
|
||||
<button class="cancel" @click="$store.commit('showNewDir', false)">Cancel</button>
|
||||
</div>
|
||||
</div>
|
||||
</template>
|
||||
|
||||
<script>
|
||||
import page from '@/utils/page'
|
||||
import webdav from '@/utils/webdav'
|
||||
|
||||
export default {
|
||||
name: 'new-dir-prompt',
|
||||
data: function () {
|
||||
return {
|
||||
name: ''
|
||||
}
|
||||
},
|
||||
methods: {
|
||||
submit: function (event) {
|
||||
event.preventDefault()
|
||||
if (this.new === '') return
|
||||
|
||||
let url = window.location.pathname
|
||||
if (this.$store.state.req.kind !== 'listing') {
|
||||
url = page.removeLastDir(url) + '/'
|
||||
}
|
||||
|
||||
url += this.name + '/'
|
||||
url = url.replace('//', '/')
|
||||
|
||||
// buttons.setLoading('newDir')
|
||||
webdav.create(url)
|
||||
.then(() => {
|
||||
// buttons.setDone('newDir')
|
||||
page.open(url)
|
||||
})
|
||||
.catch(e => {
|
||||
// buttons.setDone('newDir', false)
|
||||
console.log(e)
|
||||
})
|
||||
|
||||
this.$store.commit('showNewDir', false)
|
||||
}
|
||||
}
|
||||
}
|
||||
</script>
|
||||
|
||||
53
_assets/src/components/prompts/NewFilePrompt.vue
Normal file
53
_assets/src/components/prompts/NewFilePrompt.vue
Normal file
@@ -0,0 +1,53 @@
|
||||
<template>
|
||||
<div class="prompt">
|
||||
<h3>New file</h3>
|
||||
<p>Write the name of the new file.</p>
|
||||
<input autofocus type="text" @keyup.enter="submit" v-model.trim="name">
|
||||
<div>
|
||||
<button class="ok" @click="submit">Create</button>
|
||||
<button class="cancel" @click="$store.commit('showNewFile', false)">Cancel</button>
|
||||
</div>
|
||||
</div>
|
||||
</template>
|
||||
|
||||
<script>
|
||||
import page from '@/utils/page'
|
||||
import webdav from '@/utils/webdav'
|
||||
|
||||
export default {
|
||||
name: 'new-file-prompt',
|
||||
data: function () {
|
||||
return {
|
||||
name: ''
|
||||
}
|
||||
},
|
||||
methods: {
|
||||
submit: function (event) {
|
||||
event.preventDefault()
|
||||
if (this.new === '') return
|
||||
|
||||
let url = window.location.pathname
|
||||
if (this.$store.state.req.kind !== 'listing') {
|
||||
url = page.removeLastDir(url) + '/'
|
||||
}
|
||||
|
||||
url += this.name
|
||||
url = url.replace('//', '/')
|
||||
|
||||
// buttons.setLoading('newFile')
|
||||
webdav.create(url)
|
||||
.then(() => {
|
||||
// buttons.setDone('newFile')
|
||||
page.open(url)
|
||||
})
|
||||
.catch(e => {
|
||||
// buttons.setDone('newFile', false)
|
||||
console.log(e)
|
||||
})
|
||||
|
||||
this.$store.commit('showNewFile', false)
|
||||
}
|
||||
}
|
||||
}
|
||||
</script>
|
||||
|
||||
76
_assets/src/components/prompts/RenamePrompt.vue
Normal file
76
_assets/src/components/prompts/RenamePrompt.vue
Normal file
@@ -0,0 +1,76 @@
|
||||
<template>
|
||||
<div class="prompt">
|
||||
<h3>Rename</h3>
|
||||
<p>Insert a new name for <code>{{ oldName() }}</code>:</p>
|
||||
<input autofocus type="text" @keyup.enter="submit" v-model.trim="name">
|
||||
<div>
|
||||
<button @click="submit" type="submit">Rename</button>
|
||||
<button @click="cancel" class="cancel">Cancel</button>
|
||||
</div>
|
||||
</div>
|
||||
</template>
|
||||
|
||||
<script>
|
||||
import { mapState } from 'vuex'
|
||||
import page from '@/utils/page'
|
||||
import webdav from '@/utils/webdav'
|
||||
|
||||
export default {
|
||||
name: 'rename-prompt',
|
||||
data: function () {
|
||||
return {
|
||||
name: ''
|
||||
}
|
||||
},
|
||||
computed: mapState(['req', 'selected', 'selectedCount']),
|
||||
methods: {
|
||||
cancel: function (event) {
|
||||
this.$store.commit('showRename', false)
|
||||
},
|
||||
oldName: function () {
|
||||
if (this.req.kind !== 'listing') {
|
||||
return this.req.name
|
||||
}
|
||||
|
||||
if (this.selectedCount === 0 || this.selectedCount > 1) {
|
||||
// This shouldn't happen.
|
||||
return
|
||||
}
|
||||
|
||||
return this.req.items[this.selected[0]].name
|
||||
},
|
||||
submit: function (event) {
|
||||
let oldLink = ''
|
||||
let newLink = ''
|
||||
|
||||
if (this.req.kind !== 'listing') {
|
||||
oldLink = this.req.url
|
||||
} else {
|
||||
oldLink = this.req.items[this.selected[0]].url
|
||||
}
|
||||
|
||||
this.name = encodeURIComponent(this.name)
|
||||
newLink = page.removeLastDir(oldLink) + '/' + this.name
|
||||
|
||||
// buttons.setLoading('rename')
|
||||
|
||||
webdav.move(oldLink, newLink)
|
||||
.then(() => {
|
||||
if (this.req.kind !== 'listing') {
|
||||
page.open(newLink)
|
||||
return
|
||||
}
|
||||
// TODO: keep selected after reload?
|
||||
page.reload()
|
||||
// buttons.setDone('rename')
|
||||
}).catch(error => {
|
||||
// buttons.setDone('rename', false)
|
||||
console.log(error)
|
||||
})
|
||||
|
||||
this.$store.commit('showRename', false)
|
||||
return
|
||||
}
|
||||
}
|
||||
}
|
||||
</script>
|
||||
Reference in New Issue
Block a user