separate uploaded media by instance/realm
This commit is contained in:
parent
5b94dd7829
commit
e79003d8d7
|
@ -34,6 +34,7 @@ export async function logOutOfInstance (instanceName) {
|
|||
let instanceThemes = store.get('instanceThemes')
|
||||
let loggedInInstancesInOrder = store.get('loggedInInstancesInOrder')
|
||||
let composeText = store.get('composeText')
|
||||
let uploadedMedia = store.get('uploadedMedia')
|
||||
let currentInstance = store.get('currentInstance')
|
||||
loggedInInstancesInOrder.splice(loggedInInstancesInOrder.indexOf(instanceName), 1)
|
||||
let newInstance = instanceName === currentInstance
|
||||
|
@ -42,6 +43,7 @@ export async function logOutOfInstance (instanceName) {
|
|||
delete loggedInInstances[instanceName]
|
||||
delete instanceThemes[instanceName]
|
||||
delete composeText[instanceName]
|
||||
delete uploadedMedia[instanceName]
|
||||
store.set({
|
||||
loggedInInstances: loggedInInstances,
|
||||
instanceThemes: instanceThemes,
|
||||
|
@ -50,7 +52,8 @@ export async function logOutOfInstance (instanceName) {
|
|||
searchResults: null,
|
||||
queryInSearch: '',
|
||||
rawComposeText: '',
|
||||
composeText: composeText
|
||||
composeText: composeText,
|
||||
uploadedMedia: uploadedMedia
|
||||
})
|
||||
store.save()
|
||||
toast.say(`Logged out of ${instanceName}`)
|
||||
|
|
|
@ -2,14 +2,16 @@ import { store } from '../_store/store'
|
|||
import { uploadMedia } from '../_api/media'
|
||||
import { toast } from '../_utils/toast'
|
||||
|
||||
export async function doMediaUpload (file) {
|
||||
export async function doMediaUpload (realm, file) {
|
||||
let instanceName = store.get('currentInstance')
|
||||
let accessToken = store.get('accessToken')
|
||||
store.set({uploadingMedia: true})
|
||||
try {
|
||||
let response = await uploadMedia(instanceName, accessToken, file)
|
||||
let uploadedMedia = store.get('uploadedMedia') || []
|
||||
uploadedMedia.push({
|
||||
let uploadedMedia = store.get('uploadedMedia')
|
||||
uploadedMedia[instanceName] = uploadedMedia[instanceName] || {}
|
||||
uploadedMedia[instanceName][realm] = uploadedMedia[instanceName][realm] || []
|
||||
uploadedMedia[instanceName][realm].push({
|
||||
data: response,
|
||||
file: file
|
||||
})
|
||||
|
@ -22,8 +24,11 @@ export async function doMediaUpload (file) {
|
|||
}
|
||||
}
|
||||
|
||||
export function deleteMedia (i) {
|
||||
export function deleteMedia (realm, i) {
|
||||
let uploadedMedia = store.get('uploadedMedia')
|
||||
uploadedMedia.splice(i, 1)
|
||||
let instanceName = store.get('currentInstance')
|
||||
let uploadedMediaArray = uploadedMedia[instanceName][realm]
|
||||
|
||||
uploadedMediaArray.splice(i, 1)
|
||||
store.set({uploadedMedia})
|
||||
}
|
||||
|
|
|
@ -49,6 +49,9 @@
|
|||
export default {
|
||||
components: {
|
||||
Avatar
|
||||
},
|
||||
computed: {
|
||||
verifyCredentials: ($currentVerifyCredentials) => $currentVerifyCredentials
|
||||
}
|
||||
}
|
||||
</script>
|
|
@ -1,10 +1,10 @@
|
|||
<div class="compose-box {{overLimit ? 'over-char-limit' : ''}}">
|
||||
<ComposeAuthor :verifyCredentials />
|
||||
<ComposeInput />
|
||||
<ComposeAuthor />
|
||||
<ComposeInput :realm />
|
||||
<ComposeLengthGauge />
|
||||
<ComposeToolbar />
|
||||
<ComposeToolbar :realm />
|
||||
<ComposeLengthIndicator />
|
||||
<ComposeMedia />
|
||||
<ComposeMedia :realm />
|
||||
<ComposeButton />
|
||||
</div>
|
||||
<style>
|
||||
|
|
|
@ -32,30 +32,46 @@
|
|||
|
||||
export default {
|
||||
oncreate() {
|
||||
this.store.set({rawComposeText: store.get('currentComposeText')})
|
||||
|
||||
requestAnimationFrame(() => {
|
||||
mark('autosize()')
|
||||
autosize(this.refs.textarea)
|
||||
stop('autosize()')
|
||||
this.setupSyncFromStore()
|
||||
this.setupSyncToStore()
|
||||
this.setupAutosize()
|
||||
},
|
||||
ondestroy() {
|
||||
this.teardownAutosize()
|
||||
},
|
||||
methods: {
|
||||
setupSyncFromStore() {
|
||||
let currentComposeText = store.get('currentComposeText')
|
||||
let realm = this.get('realm')
|
||||
this.store.set({
|
||||
rawComposeText: currentComposeText[realm] || ''
|
||||
})
|
||||
|
||||
},
|
||||
setupSyncToStore() {
|
||||
const saveText = debounce(() => scheduleIdleTask(() => this.store.save()), 1000)
|
||||
|
||||
this.observe('rawComposeText', rawComposeText => {
|
||||
let composeText = this.store.get('composeText')
|
||||
let currentInstance = this.store.get('currentInstance')
|
||||
composeText[currentInstance] = rawComposeText || ''
|
||||
let realm = this.get('realm')
|
||||
composeText[currentInstance] = composeText[currentInstance] || {}
|
||||
composeText[currentInstance][realm] = rawComposeText || ''
|
||||
this.store.set({composeText: composeText})
|
||||
saveText()
|
||||
}, {init: false})
|
||||
},
|
||||
ondestroy() {
|
||||
setupAutosize() {
|
||||
requestAnimationFrame(() => {
|
||||
mark('autosize()')
|
||||
autosize(this.refs.textarea)
|
||||
stop('autosize()')
|
||||
})
|
||||
},
|
||||
teardownAutosize() {
|
||||
mark('autosize.destroy()')
|
||||
autosize.destroy(this.refs.textarea)
|
||||
stop('autosize.destroy()')
|
||||
},
|
||||
methods: {
|
||||
onBlur() {
|
||||
this.store.set({composeSelectionStart: this.refs.textarea.selectionStart})
|
||||
}
|
||||
|
|
|
@ -1,6 +1,6 @@
|
|||
{{#if $uploadedMedia && $uploadedMedia.length}}
|
||||
<div class="compose-media-container" style="grid-template-columns: repeat({{$uploadedMedia.length}}, 1fr);">
|
||||
{{#each $uploadedMedia as media, i}}
|
||||
{{#if uploadedMedia.length}}
|
||||
<div class="compose-media-container" style="grid-template-columns: repeat({{uploadedMedia.length}}, 1fr);">
|
||||
{{#each uploadedMedia as media, i}}
|
||||
<div class="compose-media">
|
||||
<img src="{{media.data.preview_url}}" alt="{{media.file.name}}"/>
|
||||
<div class="compose-media-delete">
|
||||
|
@ -96,8 +96,11 @@
|
|||
store: () => store,
|
||||
methods: {
|
||||
onDeleteMedia(i) {
|
||||
deleteMedia(i)
|
||||
deleteMedia(this.get('realm'), i)
|
||||
}
|
||||
},
|
||||
computed: {
|
||||
uploadedMedia: ($currentUploadedMedia, realm) => $currentUploadedMedia[realm] || []
|
||||
}
|
||||
}
|
||||
</script>
|
|
@ -8,7 +8,7 @@
|
|||
label="Add media"
|
||||
href="{{$uploadingMedia ? '#fa-spinner' : '#fa-camera'}}"
|
||||
on:click="onMediaClick()"
|
||||
disabled="{{$uploadingMedia || ($uploadedMedia && $uploadedMedia.length === 4)}}"
|
||||
disabled="{{$uploadingMedia || (uploadedMedia.length === 4)}}"
|
||||
/>
|
||||
<IconButton label="Adjust privacy" href="#fa-globe" />
|
||||
<IconButton label="Add content warning" href="#fa-exclamation-triangle" />
|
||||
|
@ -60,9 +60,12 @@
|
|||
},
|
||||
onFileChange(e) {
|
||||
let file = e.target.files[0]
|
||||
doMediaUpload(file)
|
||||
let realm = this.get('realm')
|
||||
doMediaUpload(realm, file)
|
||||
}
|
||||
},
|
||||
computed: {
|
||||
uploadedMedia: ($currentUploadedMedia, realm) => $currentUploadedMedia[realm] || []
|
||||
}
|
||||
|
||||
}
|
||||
</script>
|
|
@ -104,7 +104,12 @@ export function instanceComputations (store) {
|
|||
|
||||
store.compute('currentComposeText',
|
||||
['composeText', 'currentInstance'],
|
||||
(composeText, currentInstance) => (composeText[currentInstance] || '')
|
||||
(composeText, currentInstance) => (composeText[currentInstance] || {})
|
||||
)
|
||||
|
||||
store.compute('currentUploadedMedia',
|
||||
['uploadedMedia', 'currentInstance'],
|
||||
(uploadedMedia, currentInstance) => (uploadedMedia[currentInstance] || {})
|
||||
)
|
||||
|
||||
store.compute('currentCustomEmoji',
|
||||
|
|
|
@ -41,7 +41,8 @@ export const store = new PinaforeStore({
|
|||
statusModifications: {},
|
||||
composeText: {},
|
||||
rawComposeText: '',
|
||||
customEmoji: {}
|
||||
customEmoji: {},
|
||||
uploadedMedia: {}
|
||||
})
|
||||
|
||||
mixins(PinaforeStore)
|
||||
|
|
|
@ -5,7 +5,7 @@
|
|||
<Layout page='home'>
|
||||
{{#if $isUserLoggedIn}}
|
||||
{{#if $currentVerifyCredentials}}
|
||||
<ComposeBox verifyCredentials="{{$currentVerifyCredentials}}"/>
|
||||
<ComposeBox realm="home" />
|
||||
{{/if}}
|
||||
<LazyTimeline timeline='home' />
|
||||
{{else}}
|
||||
|
|
|
@ -2,7 +2,7 @@ import { Selector as $ } from 'testcafe'
|
|||
import {
|
||||
composeButton, composeInput, composeLengthIndicator, emojiButton, getComposeSelectionStart, getUrl,
|
||||
homeNavButton,
|
||||
notificationsNavButton, uploadMedia
|
||||
notificationsNavButton
|
||||
} from '../utils'
|
||||
import { foobarRole } from '../roles'
|
||||
import times from 'lodash/times'
|
||||
|
|
Loading…
Reference in New Issue