diff --git a/client/index.html b/client/index.html index 53b85083..835ec4d3 100644 --- a/client/index.html +++ b/client/index.html @@ -11,10 +11,23 @@ - diff --git a/client/src/components/content-forms/ImageForm.vue b/client/src/components/content-forms/ImageForm.vue index 83e8be89..fe8f6856 100644 --- a/client/src/components/content-forms/ImageForm.vue +++ b/client/src/components/content-forms/ImageForm.vue @@ -1,6 +1,9 @@ @@ -12,12 +15,30 @@ mounted() { console.log('ImageForm mounted'); console.log(this.$refs); - const widget = uploadcare.Widget(this.$refs.widget); + const uploadcarePanel = uploadcare.openPanel(this.$refs['uploadcare-panel'], null, { + tabs: ['file'], + }, { + publicKey: 'ad89e9f42d4f5532d176', + imagesOnly: true, + }); - widget.onUploadComplete(info => { - console.log(info); - console.log(info.cdnUrl); - this.$emit('link-change-url', info.cdnUrl, this.index) + uploadcarePanel.done((result) => { + console.log(result); + result.progress(function(p) { + console.log('progress'); + console.log(p); + }); + result.done(fileInfo => { + console.log(fileInfo); + this.url = fileInfo.cdnUrl; + this.$emit('link-change-url', fileInfo.cdnUrl, this.index) + }); + }); + + uploadcarePanel.progress(function(tabName) { + console.log(tabName); + // tabName is selected. progress() works when you click a tab name on the list. + // Technically, it would work on any dialog progress, i.e. when preview appears. }); } }