Properly wire 'async' through the uploader

This commit is contained in:
pietervdvn 2022-09-02 12:39:40 +02:00
parent 89b9cb4b47
commit cbf5c5a748
4 changed files with 19 additions and 18 deletions

View file

@ -17,7 +17,7 @@ export class Imgur extends ImageProvider {
static uploadMultiple( static uploadMultiple(
title: string, description: string, blobs: FileList, title: string, description: string, blobs: FileList,
handleSuccessfullUpload: ((imageURL: string) => void), handleSuccessfullUpload: ((imageURL: string) => Promise<void>),
allDone: (() => void), allDone: (() => void),
onFail: ((reason: string) => void), onFail: ((reason: string) => void),
offset: number = 0) { offset: number = 0) {
@ -29,8 +29,8 @@ export class Imgur extends ImageProvider {
const blob = blobs.item(offset); const blob = blobs.item(offset);
const self = this; const self = this;
this.uploadImage(title, description, blob, this.uploadImage(title, description, blob,
(imageUrl) => { async (imageUrl) => {
handleSuccessfullUpload(imageUrl); await handleSuccessfullUpload(imageUrl);
self.uploadMultiple( self.uploadMultiple(
title, description, blobs, title, description, blobs,
handleSuccessfullUpload, handleSuccessfullUpload,
@ -45,7 +45,7 @@ export class Imgur extends ImageProvider {
} }
static uploadImage(title: string, description: string, blob: File, static uploadImage(title: string, description: string, blob: File,
handleSuccessfullUpload: ((imageURL: string) => void), handleSuccessfullUpload: ((imageURL: string) => Promise<void>),
onFail: (reason: string) => void) { onFail: (reason: string) => void) {
const apiUrl = 'https://api.imgur.com/3/image'; const apiUrl = 'https://api.imgur.com/3/image';
@ -74,9 +74,9 @@ export class Imgur extends ImageProvider {
// Response contains stringified JSON // Response contains stringified JSON
// Image URL available at response.data.link // Image URL available at response.data.link
// @ts-ignore // @ts-ignore
$.ajax(settings).done(function (response) { $.ajax(settings).done(async function (response) {
response = JSON.parse(response); response = JSON.parse(response);
handleSuccessfullUpload(response.data.link); await handleSuccessfullUpload(response.data.link);
}).fail((reason) => { }).fail((reason) => {
console.log("Uploading to IMGUR failed", reason); console.log("Uploading to IMGUR failed", reason);
// @ts-ignore // @ts-ignore

View file

@ -7,9 +7,9 @@ export default class ImgurUploader {
public readonly failed: UIEventSource<string[]> = new UIEventSource<string[]>([]); public readonly failed: UIEventSource<string[]> = new UIEventSource<string[]>([]);
public readonly success: UIEventSource<string[]> = new UIEventSource<string[]>([]); public readonly success: UIEventSource<string[]> = new UIEventSource<string[]>([]);
public maxFileSizeInMegabytes = 10; public maxFileSizeInMegabytes = 10;
private readonly _handleSuccessUrl: (string) => void; private readonly _handleSuccessUrl: (string) => Promise<void>;
constructor(handleSuccessUrl: (string) => void) { constructor(handleSuccessUrl: (string) => Promise<void>) {
this._handleSuccessUrl = handleSuccessUrl; this._handleSuccessUrl = handleSuccessUrl;
} }
@ -24,11 +24,11 @@ export default class ImgurUploader {
Imgur.uploadMultiple(title, Imgur.uploadMultiple(title,
description, description,
files, files,
function (url) { async function (url) {
console.log("File saved at", url); console.log("File saved at", url);
self.success.data.push(url) self.success.data.push(url)
self.success.ping(); self.success.ping();
self._handleSuccessUrl(url); await self._handleSuccessUrl(url);
}, },
function () { function () {
console.log("All uploads completed"); console.log("All uploads completed");

View file

@ -36,7 +36,7 @@ export class ImageUploadFlow extends Toggle {
perId.set(id, new UIEventSource<number>(0)) perId.set(id, new UIEventSource<number>(0))
} }
const uploadedCount = perId.get(id) const uploadedCount = perId.get(id)
const uploader = new ImgurUploader(url => { const uploader = new ImgurUploader(async url => {
// A file was uploaded - we add it to the tags of the object // A file was uploaded - we add it to the tags of the object
const tags = tagsSource.data const tags = tagsSource.data
@ -48,17 +48,18 @@ export class ImageUploadFlow extends Toggle {
} }
key = imagePrefix + ":" + freeIndex; key = imagePrefix + ":" + freeIndex;
} }
console.log("Adding image:" + key, url);
uploadedCount.data++ await state.changes
uploadedCount.ping()
Promise.resolve(state.changes
.applyAction(new ChangeTagAction( .applyAction(new ChangeTagAction(
tags.id, new Tag(key, url), tagsSource.data, tags.id, new Tag(key, url), tagsSource.data,
{ {
changeType: "add-image", changeType: "add-image",
theme: state.layoutToUse.id theme: state.layoutToUse.id
} }
))) ))
console.log("Adding image:" + key, url);
uploadedCount.data++
uploadedCount.ping()
}) })
const licensePicker = new LicensePicker(state) const licensePicker = new LicensePicker(state)

View file

@ -1062,9 +1062,9 @@ export default class SpecialVisualizations {
const t = Translations.t.notes; const t = Translations.t.notes;
const id = tags.data[args[0] ?? "id"] const id = tags.data[args[0] ?? "id"]
const uploader = new ImgurUploader(url => { const uploader = new ImgurUploader(async url => {
isUploading.setData(false) isUploading.setData(false)
state.osmConnection.addCommentToNote(id, url) await state.osmConnection.addCommentToNote(id, url)
NoteCommentElement.addCommentTo(url, tags, state) NoteCommentElement.addCommentTo(url, tags, state)
}) })