rahix/openflexure-microscope-server
1
0
Fork 0
Code Issues Pull requests Projects Releases Packages Wiki Activity Actions

Functioning capture pane

Browse source
This commit is contained in:
Joel Collins 2019-02-14 16:56:23 +00:00
parent 6e0a079c2a
commit 729c76eba3
3 changed files with 210 additions and 35 deletions
Download patch file Download diff file Expand all files Collapse all files

58
src/components/paneDisplayComponents/galleryComponents/captureCard.vue
View file

@ -10,15 +10,20 @@
</div>
<div class="uk-card-body uk-padding-small">
<p> {{ metadata.filename }} </p>
<div class="uk-width-1-1" uk-grid>
<div class="uk-text-meta uk-margin-remove-top uk-width-expand"><time>{{ betterTimestring }}</time></div>
<div class="uk-text-meta uk-margin-remove-top uk-width-auto">
<a v-bind:href="metadataModalTarget" uk-toggle>More...</a>
<div class="uk-width-1-1 uk-margin-small uk-margin-remove-left uk-margin-remove-right" uk-grid>
<div class="uk-margin-remove-top uk-padding-remove uk-width-expand">{{ metadata.filename }}</div>
<div class="uk-margin-remove-top uk-padding-remove uk-width-auto">
<a href="#" v-on:click="delCaptureConfirm()" class="uk-icon-link" uk-icon="trash"></a>
</div>
</div>
<div class="uk-text-meta uk-margin-remove-top uk-padding-remove uk-width-expand"><time>{{ betterTimestring }}</time></div>
<div class="uk-text-meta uk-margin-remove-top uk-padding-remove uk-width-auto">
<a v-bind:href="metadataModalTarget" uk-toggle>More...</a>
</div>
</div>
<div class="uk-card-footer uk-padding-small">
@ -103,6 +108,27 @@ export default {
UIkit.modal(event.target.parentNode).hide();
},
delCaptureConfirm: function(tag_string) {
var self = this;
UIkit.modal.confirm('Permanantly delete capture?').then(function() {
self.delCaptureRequest()
}, function () {
console.log('Rejected.')
});
},
delCaptureRequest: function() {
// Send tag DELETE request
axios.delete(this.captureURL)
.then(response => {
// Emit signal to update capture list
this.$root.$emit('globalUpdateCaptureList')
})
.catch(error => {
this.$store.dispatch('handleHTTPError', error); // Let store handle error
})
},
newTagRequest: function(tag_string) {
// Send tag PUT request
axios.put(this.tagURL, [tag_string])
@ -172,13 +198,16 @@ export default {
return "#" + this.metadataModalID
},
thumbURL: function () {
return this.$store.getters.uri + "/camera/capture/" + this.metadata.id + "/download?thumbnail=true"
return this.captureURL + "/download?thumbnail=true"
},
imgURL: function () {
return this.$store.getters.uri + "/camera/capture/" + this.metadata.id + "/download/" + this.metadata.filename
return this.captureURL + "/download/" + this.metadata.filename
},
tagURL: function () {
return this.$store.getters.uri + "/camera/capture/" + this.metadata.id + "/tags"
return this.captureURL + "/tags"
},
captureURL: function () {
return this.$store.getters.uri + "/camera/capture/" + this.metadata.id
},
betterTimestring: function () {
var dtSplit = this.metadata.time.split("_");
@ -190,14 +219,3 @@ export default {
}
</script>
<style scoped lang="less">
.deletable-label {
cursor: pointer;
}
.deletable-label:hover {
background-color: #f0506e;
}
</style>

9
src/components/paneDisplayComponents/galleryDisplay.vue
View file

@ -6,7 +6,7 @@
</div>
<div uk-lightbox="toggle: .lightbox-link">
<div class="uk-grid-medium uk-padding uk-padding-remove-right uk-grid-match" uk-grid="masonry: true">
<div class="uk-grid-medium uk-padding uk-padding-remove-right uk-grid-match" uk-grid>
<captureCard
v-for="capture in captureList"
@ -40,6 +40,13 @@ export default {
}
},
mounted() {
// A global signal listener to perform a gallery refresh
this.$root.$on('globalUpdateCaptureList', () => {
this.updateCaptureList()
})
},
methods: {
updateCaptureList: function() {
console.log("Updating capture list...")