WSL/SLF GitLab Repository

Commit 25a8f03f authored by Dominik's avatar Dominik
Browse files

increased minor version to 1.2.0 with back button in case of wrong prefix;

clean up of texts; Improved readme; and layout fixes for the TreeCard
parent 0fe03b23
......@@ -11,7 +11,7 @@ file tree structure.
- Search directories and files
- The content of folders is "lazy-loaded" to prevent a long initial rendering time
- prefix query parameter to start from a certain folder
- It works **only for public S3 Buckets** (by version 1.1.5)
- It works **only for public S3 Buckets** (by version 1.2.0)
Check https://envicloud.wsl.ch/ as a demo.
......@@ -185,5 +185,5 @@ For now only the s3Factory methods are being tested.
- Rendering large amounts of folder and files is still pretty slow. For the https://envicloud.wsl.ch we are having folders which have >1k or even >4k files which makes the rendering from the v-tree-view component of vuetify very slow. To handle such large amounts of entries a virtual list is needed, which will probably be implemented in the future.
- Bulk downloading files, for downloading mutliple files at once you need to use a different protocol / client, make sure to enable the `showProtocols` option.
- Multiple entires >10k as mentioned the rendering isn't performant, so this issue isn't tackled yet, but if for any folder there are more than 10k entires the needs to be a pagniation of sorts or at least multiple requests to the backend. The default server side maximum seems to be 10k, this might be configurable, so how. For a multiple request scenario the `Marker` parameter can be used make any futher calls. The `Marker` would be the last key which was provided from the last request and from there the new request should provide again the amount given with the max-keys parameter or the server side maxium. (As of version 1.1.5 such a scenario isn't implemented yet.)
- Multiple entires >10k as mentioned the rendering isn't performant, so this issue isn't tackled yet, but if for any folder there are more than 10k entires the needs to be a pagniation of sorts or at least multiple requests to the backend. The default server side maximum seems to be 10k, this might be configurable, so how. For a multiple request scenario the `Marker` parameter can be used make any futher calls. The `Marker` would be the last key which was provided from the last request and from there the new request should provide again the amount given with the max-keys parameter or the server side maxium. (As of version 1.2.0 such a scenario isn't implemented yet.)
{
"name": "s3_browsing",
"version": "1.1.5",
"version": "1.2.0",
"lockfileVersion": 1,
"requires": true,
"dependencies": {
......@@ -14476,9 +14476,9 @@
"dev": true
},
"node-forge": {
"version": "0.9.0",
"resolved": "https://registry.npmjs.org/node-forge/-/node-forge-0.9.0.tgz",
"integrity": "sha512-7ASaDa3pD+lJ3WvXFsxekJQelBKRpne+GOVbLbtHYdd7pFspyeuJHnWfLplGf3SwKGbfs/aYl5V/JCIaHVUKKQ==",
"version": "0.10.0",
"resolved": "https://registry.npmjs.org/node-forge/-/node-forge-0.10.0.tgz",
"integrity": "sha512-PPmu8eEeG9saEUvI97fm4OYxXVB6bFvyNTyiUOBichBpFG8A1Ljw3bY62+5oOjDEMHRnd0Y7HQ+x7uzxOzC6JA==",
"dev": true
},
"node-int64": {
......@@ -17261,12 +17261,12 @@
"dev": true
},
"selfsigned": {
"version": "1.10.7",
"resolved": "https://registry.npmjs.org/selfsigned/-/selfsigned-1.10.7.tgz",
"integrity": "sha512-8M3wBCzeWIJnQfl43IKwOmC4H/RAp50S8DF60znzjW5GVqTcSe2vWclt7hmYVPkKPlHWOu5EaWOMZ2Y6W8ZXTA==",
"version": "1.10.8",
"resolved": "https://registry.npmjs.org/selfsigned/-/selfsigned-1.10.8.tgz",
"integrity": "sha512-2P4PtieJeEwVgTU9QEcwIRDQ/mXJLX8/+I3ur+Pg16nS8oNbrGxEso9NyYWy8NAmXiNl4dlAp5MwoNeCWzON4w==",
"dev": true,
"requires": {
"node-forge": "0.9.0"
"node-forge": "^0.10.0"
}
},
"semver": {
......
{
"name": "s3_browsing",
"version": "1.1.5",
"version": "1.2.0",
"private": true,
"description": "Web app for browsing through S3 XML and provide it's links.",
"author": {
......
<template>
<v-card height="100%">
<v-card >
<v-sheet class="pa-4" color="primary">
<v-row no-gutters>
......@@ -42,17 +42,37 @@
</v-sheet>
<v-card-text :style="`max-height: ${height}; overflow:auto;`">
<TreeView :search="search"
<v-card-text v-if="contentMapValues"
:style="`max-height: ${height}; overflow:auto;`">
<TreeView :items="contentMapValues"
:search="search"
:allCollapsed="allCollapsed"
@showSnack="catchShowSnack"
@collapsed="catchCollapsed" />
</v-card-text>
<v-sheet v-if="!contentMapValues"
class="pa-4">
<v-card-text :style="`background-color: ${$vuetify.theme.themes.light.error};`">
{{ `No files or folder found for the prefix: ${prefix}` }}
</v-card-text>
<v-card-actions>
<v-btn color="secondary"
href="/">
Back to main site
</v-btn>
</v-card-actions>
</v-sheet>
</v-card>
</template>
<script>
import {
mapGetters,
} from 'vuex';
import IconButton from './IconButton';
import TreeView from './TreeView';
......@@ -64,6 +84,7 @@ export default {
type: String,
default: '75vh',
},
prefix: String,
},
data: () => ({
caseSensitive: false,
......@@ -72,6 +93,10 @@ export default {
allCollapsed: false,
}),
computed: {
...mapGetters(['contentMap']),
contentMapValues() {
return this.contentMap ? Object.values(this.contentMap) : null;
},
// filter() {
// return this.caseSensitive
// ? (item, search, textKey) => item[textKey].indexOf(search) > -1
......
......@@ -97,6 +97,8 @@ export default {
search: String,
caseSensitive: Boolean,
allCollapsed: Boolean,
prefix: String,
items: Array,
},
computed: {
...mapGetters([
......@@ -108,13 +110,6 @@ export default {
'content',
'contentLoading',
]),
items() {
return this.values ? this.values : [];
},
values() {
// return this.contentMap ? this.contentMap.values() : null;
return this.contentMap ? Object.values(this.contentMap) : null;
},
},
methods: {
catchCopyClick(url) {
......
<template>
<v-container fluid>
<v-row v-if="loading" >
<v-row v-if="configLoading" >
<v-col cols="12"
sm="3">
<PlaceholderCard />
......@@ -40,13 +40,14 @@
@expand="catchBucketInfoExpand" />
</v-col> -->
<v-col v-if="!contentError"
<v-col v-if="!configLoading && !contentError"
cols="12"
:sm="showProtocols ? 9 : 12" >
<TreeCard @showSnack="catchShowSnack" />
<TreeCard @showSnack="catchShowSnack"
:prefix="urlPrefix" />
</v-col>
<v-col v-if="showProtocols"
<v-col v-if="!loading && showProtocols"
cols="12"
sm="3" >
<DownloadToolsCard :tools="getDownloadTools()" />
......@@ -146,43 +147,46 @@ export default {
this.$store.dispatch(GET_S3_CONTENT, { url: this.contentUrl, prefix: this.urlPrefix });
},
getDownloadTools() {
// not done via computedProperty because the DownloadToolCard can change the showDescription
// via computed that isn't working
if (!this.downloadTools) {
const tools = [];
if (this.cyberduckProfileName && this.cyberduckHostName && this.vendorUrl) {
tools.push({
title: 'Download CyberDuck bookmark',
toolTip: 'Use CyberDuck to access the files.',
title: 'Download Cyberduck bookmark',
toolTip: 'Download a Cyberduck bookmark to access the files via the Cyberduck client.',
image: this.imagesPng('./cyberduck-icon-64.png'),
href: this.hrefCyberduckFile(this.urlPrefix),
downloadFileName: `${this.cyberduckProfileName}.cyberduckprofile`,
moreInfoUrl: 'https://cyberduck.io/',
showDescription: false,
description: 'Use CyberDuck client to access the files the S3 bucket.',
description: 'Access the files in the S3 Bucket via Cyberduck client.',
});
}
if (this.WebDAVDomainHttp) {
tools.push({
title: 'Browse via Http WebDAV',
toolTip: 'Use WebDAV to access the files.',
toolTip: 'Open a new tab to access the files via WebDAV.',
image: this.imagesPng('./dav-100-2.png'),
href: `${this.WebDAVDomainHttp}${this.urlPrefix}`,
moreInfoUrl: 'https://webdav.io/webdav-client/',
showDescription: false,
description: 'Direclty browse the files via WebDAV in the browser.',
description: 'Access the files in the S3 Bucket via the WebDAV protocol over HTTP.',
});
}
if (this.WebDAVDomainHttps) {
tools.push({
title: 'Brose via Https WebDAV',
title: 'Browse via Https WebDAV',
toolTip: 'Use WebDAV to access the files.',
image: this.imagesPng('./dav-100-2.png'),
href: `${this.WebDAVDomainHttps}${this.urlPrefix}`,
moreInfoUrl: 'https://webdav.io/webdav-client/',
showDescription: false,
description: 'Direclty browse the files via WebDAV in the browser.',
description: 'Access the files in the S3 Bucket via the WebDAV protocol over HTTP(S).',
});
}
......
Supports Markdown
0% or .
You are about to add 0 people to the discussion. Proceed with caution.
Finish editing this message first!
Please register or to comment