commit 90d5f73e32c1d944056d93ff2481d1617a63cca2
parent c8a3b0ceef6f69d4e9810649be1aa0c6a4b37321
Author: Vetle Haflan <vetle@haflan.dev>
Date: Thu, 4 Feb 2021 23:10:40 +0100
Add working 'Download ZIP' button
Diffstat:
3 files changed, 26 insertions(+), 4 deletions(-)
diff --git a/ui/dist/index.html b/ui/dist/index.html
@@ -5,6 +5,8 @@
<meta name="viewport" content="width=device-width, initial-scale=1.0">
<title>LiPre</title>
<link rel="stylesheet" href="https://cdnjs.cloudflare.com/ajax/libs/highlight.js/10.5.0/styles/default.min.css">
+ <link href="https://fonts.googleapis.com/css?family=Roboto:100,300,400,500,700,900" rel="stylesheet">
+ <link href="https://cdn.jsdelivr.net/npm/@mdi/font@4.x/css/materialdesignicons.min.css" rel="stylesheet">
</head>
<body>
<div id="app"></div>
diff --git a/ui/package.json b/ui/package.json
@@ -16,6 +16,8 @@
"babel-loader": "^8.0.6",
"css-loader": "^3.3.0",
"deepmerge": "^4.2.2",
+ "file-saver": "^2.0.5",
+ "jszip": "^3.5.0",
"rimraf": "^3.0.0",
"sass": "^1.32.2",
"sass-loader": "^10.1.0",
diff --git a/ui/src/App.vue b/ui/src/App.vue
@@ -8,6 +8,9 @@
{{filename}}
</v-tab>
</v-tabs>
+ <v-spacer/>
+ <v-icon title="Download ZIP"
+ @click="download">mdi-zip-box</v-icon>
</v-app-bar>
<v-main>
<v-alert dense
@@ -29,6 +32,8 @@
</template>
<script>
+import JSZip from "jszip"
+import { saveAs } from "file-saver"
export default {
name: "App",
data() {
@@ -39,21 +44,20 @@ export default {
connected: null,
ws: null,
follow: true,
+ zip: new JSZip()
}
},
methods: {
connect() {
this.connected = null
- let qParams = new URLSearchParams(window.location.search)
- let roomCode = qParams.get("r")
- if (!roomCode) {
+ if (!this.roomCode) {
//this.status = "No room specified" // TODO: Use?
this.connected = false
return
}
// Quick fix to determine whether to use WSS or not
let proto = window.location.href.startsWith("https://") ? "wss" : "ws"
- let url = `${proto}://${document.location.host}/ws/view/${roomCode}`
+ let url = `${proto}://${document.location.host}/ws/view/${this.roomCode}`
this.ws = new WebSocket(url)
this.ws.onclose = () => {
this.connected = false
@@ -83,6 +87,20 @@ export default {
}
//hljs.highlightBlock(document.getElementById("viewer"))
}
+ },
+ download() {
+ for (let fn in this.files) {
+ this.zip.file(fn, this.files[fn])
+ }
+ this.zip.generateAsync({type:"blob"}).then(content => {
+ saveAs(content, this.roomCode + ".zip")
+ })
+ }
+ },
+ computed: {
+ roomCode() {
+ let qParams = new URLSearchParams(window.location.search)
+ return qParams.get("r")
}
},
mounted() {
