worker thread interface
parent
394eef9f48
commit
f067aab44c
@ -0,0 +1,21 @@
|
||||
<template>
|
||||
<div id="app">
|
||||
<upload></upload>
|
||||
</div>
|
||||
</template>
|
||||
|
||||
<script charset="utf-8">
|
||||
import Upload from './upload.vue';
|
||||
|
||||
export default {
|
||||
name: 'app',
|
||||
data() {
|
||||
return {
|
||||
msg: 'Hello World'
|
||||
}
|
||||
},
|
||||
components: {
|
||||
Upload,
|
||||
}
|
||||
}
|
||||
</script>
|
@ -0,0 +1,50 @@
|
||||
<template>
|
||||
<div id="upload">
|
||||
<input v-on:change="fileChange($event)" type="file" multiple />
|
||||
<p>selected {{fileCount}} files</p>
|
||||
<ul>
|
||||
<li v-bind:files="files" v-for="file in files">
|
||||
{{ file.name }}
|
||||
<ul>
|
||||
<li>size: {{ file.size / 1000 }} kB </li>
|
||||
<li>type: {{ file.type }} </li>
|
||||
</ul>
|
||||
</li>
|
||||
</ul>
|
||||
</div>
|
||||
</template>
|
||||
|
||||
<script charset="utf-8">
|
||||
import GetWorker from './workerInterface.js';
|
||||
const w = GetWorker('main');
|
||||
|
||||
export default {
|
||||
data(){
|
||||
return {
|
||||
fileCount: 0,
|
||||
files: []
|
||||
}
|
||||
},
|
||||
methods: {
|
||||
fileChange(event) {
|
||||
// reset
|
||||
this.files = []
|
||||
|
||||
|
||||
console.log("change")
|
||||
this.fileCount = event.target.files.length
|
||||
this.files = event.target.files
|
||||
|
||||
// Get sha256 of files
|
||||
for (let file of this.files) {
|
||||
w.post({
|
||||
msg: 'file-sha256',
|
||||
payload: file
|
||||
})
|
||||
|
||||
}
|
||||
}
|
||||
}
|
||||
}
|
||||
|
||||
</script>
|
@ -0,0 +1,28 @@
|
||||
//This worker will be used for cryptographic, long running and API calls
|
||||
//to keep the UI free
|
||||
//
|
||||
const name = 'main'
|
||||
|
||||
function getSHA256(file){
|
||||
console.log('getting sha 256 for ');
|
||||
console.log(file);
|
||||
|
||||
}
|
||||
|
||||
onmessage = function(e) {
|
||||
|
||||
switch (e.data.msg) {
|
||||
case 'init':
|
||||
console.log(`initialized ${name} worker`);
|
||||
break;
|
||||
|
||||
case 'file-sha256':
|
||||
getSHA256(e.data.payload)
|
||||
break;
|
||||
|
||||
default:
|
||||
console.log(`${name} worker: need {msg: "message type", ... }`)
|
||||
|
||||
}
|
||||
|
||||
}
|
@ -0,0 +1,33 @@
|
||||
|
||||
class Worker {
|
||||
constructor(script) {
|
||||
if (window.Worker) {
|
||||
this.worker = new window.Worker(script);
|
||||
|
||||
this.onmessage = this.worker.onmessage;
|
||||
}
|
||||
}
|
||||
|
||||
post(m) {
|
||||
this.worker.postMessage(m)
|
||||
}
|
||||
}
|
||||
|
||||
const workers = {
|
||||
'main': new Worker('./worker.js')
|
||||
}
|
||||
|
||||
|
||||
|
||||
|
||||
|
||||
function getWorker(name){
|
||||
if (name in workers) {
|
||||
return workers[name];
|
||||
} else {
|
||||
console.log(`unknown worker ${name}`)
|
||||
}
|
||||
}
|
||||
|
||||
|
||||
export default getWorker;
|
Loading…
Reference in New Issue