diff --git a/routes/_actions/media.js b/routes/_actions/media.js index e6ac67e..7ad9c7b 100644 --- a/routes/_actions/media.js +++ b/routes/_actions/media.js @@ -1,6 +1,7 @@ import { store } from '../_store/store' import { uploadMedia } from '../_api/media' import { toast } from '../_utils/toast' +import { scheduleIdleTask } from '../_utils/scheduleIdleTask' export async function doMediaUpload (realm, file) { let instanceName = store.get('currentInstance') @@ -13,9 +14,17 @@ export async function doMediaUpload (realm, file) { uploadedMedia[instanceName][realm] = uploadedMedia[instanceName][realm] || [] uploadedMedia[instanceName][realm].push({ data: response, - file: file + file: { + name: file.name + } }) - store.set({ uploadedMedia }) + let rawComposeText = store.get('rawComposeText') || '' + rawComposeText += ' ' + response.text_url + store.set({ + uploadedMedia, + rawComposeText + }) + scheduleIdleTask(() => store.save()) } catch (e) { console.error(e) toast.say('Failed to upload media: ' + (e.message || '')) @@ -28,7 +37,15 @@ export function deleteMedia (realm, i) { let uploadedMedia = store.get('uploadedMedia') let instanceName = store.get('currentInstance') let uploadedMediaArray = uploadedMedia[instanceName][realm] + let deletedMedia = uploadedMediaArray.splice(i, 1)[0] - uploadedMediaArray.splice(i, 1) - store.set({uploadedMedia}) + let rawComposeText = store.get('rawComposeText') || '' + + rawComposeText = rawComposeText.replace(' ' + deletedMedia.data.text_url, '') + + store.set({ + uploadedMedia, + rawComposeText + }) + scheduleIdleTask(() => store.save()) } diff --git a/routes/_components/compose/ComposeInput.html b/routes/_components/compose/ComposeInput.html index acc5787..f46f05f 100644 --- a/routes/_components/compose/ComposeInput.html +++ b/routes/_components/compose/ComposeInput.html @@ -79,7 +79,8 @@ store: () => store, computed: { rawComposeText: ($rawComposeText) => $rawComposeText, - currentComposeText: ($currentComposeText) => $currentComposeText + currentComposeText: ($currentComposeText) => $currentComposeText, + uploadedMedia: ($currentUploadedMedia, realm) => $currentUploadedMedia[realm] || [] } } \ No newline at end of file diff --git a/routes/_store/store.js b/routes/_store/store.js index 2143e76..50d58b2 100644 --- a/routes/_store/store.js +++ b/routes/_store/store.js @@ -14,7 +14,8 @@ const KEYS_TO_STORE_IN_LOCAL_STORAGE = new Set([ 'autoplayGifs', 'markMediaAsSensitive', 'pinnedPages', - 'composeText' + 'composeText', + 'uploadedMedia' ]) class PinaforeStore extends LocalStorageStore { diff --git a/tests/spec/13-compose-media.js b/tests/spec/13-compose-media.js index a9c7d69..87a455f 100644 --- a/tests/spec/13-compose-media.js +++ b/tests/spec/13-compose-media.js @@ -1,4 +1,4 @@ -import { getNthDeleteMediaButton, getNthMedia, mediaButton, uploadKittenImage } from '../utils' +import { composeInput, getNthDeleteMediaButton, getNthMedia, mediaButton, uploadKittenImage } from '../utils' import { foobarRole } from '../roles' fixture`13-compose-media.js` @@ -39,4 +39,18 @@ test('removes media', async t => { .click(getNthDeleteMediaButton(2)) .expect(getNthMedia(2).exists).notOk() .expect(getNthMedia(1).exists).ok() + .click(getNthDeleteMediaButton(1)) + .expect(getNthMedia(2).exists).notOk() +}) + +test('changes URLs as media is added/removed', async t => { + await t.useRole(foobarRole) + await (uploadKittenImage(1)()) + await t.expect(composeInput.value).match(/^ http:\/\/localhost:3000\/media\/\S+$/) + await (uploadKittenImage(1)()) + await t.expect(composeInput.value).match(/^ http:\/\/localhost:3000\/media\/\S+ http:\/\/localhost:3000\/media\/\S+$/) + .click(getNthDeleteMediaButton(1)) + .expect(composeInput.value).match(/^ http:\/\/localhost:3000\/media\/\S+$/) + .click(getNthDeleteMediaButton(1)) + .expect(composeInput.value).eql('') })