refactor
This commit is contained in:
parent
333ac62b61
commit
4ef576b7f1
|
@ -23,7 +23,7 @@ export function switchToInstance (instanceName) {
|
|||
currentInstance: instanceName,
|
||||
searchResults: null,
|
||||
queryInSearch: '',
|
||||
rawInputTextInCompose: ''
|
||||
rawComposeText: ''
|
||||
})
|
||||
store.save()
|
||||
switchToTheme(instanceThemes[instanceName])
|
||||
|
@ -47,7 +47,7 @@ export async function logOutOfInstance (instanceName) {
|
|||
currentInstance: newInstance,
|
||||
searchResults: null,
|
||||
queryInSearch: '',
|
||||
rawInputTextInCompose: ''
|
||||
rawComposeText: ''
|
||||
})
|
||||
store.save()
|
||||
toast.say(`Logged out of ${instanceName}`)
|
||||
|
|
|
@ -16,8 +16,8 @@
|
|||
export default {
|
||||
store: () => store,
|
||||
computed: {
|
||||
disabled: ($rawInputTextInComposeOverLimit, $rawInputTextInComposeLength) => {
|
||||
return $rawInputTextInComposeOverLimit || $rawInputTextInComposeLength === 0
|
||||
disabled: ($rawComposeTextOverLimit, $rawComposeTextLength) => {
|
||||
return $rawComposeTextOverLimit || $rawComposeTextLength === 0
|
||||
}
|
||||
}
|
||||
}
|
||||
|
|
|
@ -2,7 +2,7 @@
|
|||
class="compose-box-input"
|
||||
placeholder="What's on your mind?"
|
||||
ref:textarea
|
||||
bind:value=$rawInputTextInCompose
|
||||
bind:value=$rawComposeText
|
||||
></textarea>
|
||||
<style>
|
||||
.compose-box-input {
|
||||
|
@ -31,7 +31,7 @@
|
|||
|
||||
export default {
|
||||
oncreate() {
|
||||
this.store.set({rawInputTextInCompose: store.get('currentInputTextInCompose')})
|
||||
this.store.set({rawComposeText: store.get('currentComposeText')})
|
||||
|
||||
requestAnimationFrame(() => {
|
||||
mark('autosize()')
|
||||
|
@ -40,11 +40,11 @@
|
|||
})
|
||||
|
||||
const saveText = debounce(() => scheduleIdleTask(() => this.store.save()), 1000)
|
||||
this.observe('rawInputTextInCompose', rawInputTextInCompose => {
|
||||
let inputTextInCompose = this.store.get('inputTextInCompose')
|
||||
this.observe('rawComposeText', rawComposeText => {
|
||||
let composeText = this.store.get('composeText')
|
||||
let currentInstance = this.store.get('currentInstance')
|
||||
inputTextInCompose[currentInstance] = rawInputTextInCompose || ''
|
||||
this.store.set({inputTextInCompose: inputTextInCompose})
|
||||
composeText[currentInstance] = rawComposeText || ''
|
||||
this.store.set({composeText: composeText})
|
||||
saveText()
|
||||
}, {init: false})
|
||||
},
|
||||
|
@ -55,8 +55,8 @@
|
|||
},
|
||||
store: () => store,
|
||||
computed: {
|
||||
rawInputTextInCompose: ($rawInputTextInCompose) => $rawInputTextInCompose,
|
||||
currentInputTextInCompose: ($currentInputTextInCompose) => $currentInputTextInCompose,
|
||||
rawComposeText: ($rawComposeText) => $rawComposeText,
|
||||
currentComposeText: ($currentComposeText) => $currentComposeText,
|
||||
}
|
||||
}
|
||||
</script>
|
|
@ -1,4 +1,4 @@
|
|||
<div class="compose-box-length-gauge {{shouldAnimate ? 'should-animate' : ''}} {{$rawInputTextInComposeOverLimit ? 'over-char-limit' : ''}}"
|
||||
<div class="compose-box-length-gauge {{shouldAnimate ? 'should-animate' : ''}} {{$rawComposeTextOverLimit ? 'over-char-limit' : ''}}"
|
||||
style="transform: scaleX({{inputLengthAsFractionRoundedAfterRaf || 0}});"
|
||||
aria-hidden="true"
|
||||
></div>
|
||||
|
@ -36,8 +36,8 @@
|
|||
},
|
||||
store: () => store,
|
||||
computed: {
|
||||
inputLengthAsFraction: ($rawInputTextInComposeLength) => {
|
||||
return Math.min(CHAR_LIMIT, $rawInputTextInComposeLength) / CHAR_LIMIT
|
||||
inputLengthAsFraction: ($rawComposeTextLength) => {
|
||||
return Math.min(CHAR_LIMIT, $rawComposeTextLength) / CHAR_LIMIT
|
||||
},
|
||||
inputLengthAsFractionRounded: (inputLengthAsFraction) => {
|
||||
// We don't need to update the gauge for every decimal point, so round it to the nearest 0.02
|
||||
|
|
|
@ -1,4 +1,4 @@
|
|||
<span class="compose-box-length {{$rawInputTextInComposeOverLimit ? 'over-char-limit' : ''}}"
|
||||
<span class="compose-box-length {{$rawComposeTextOverLimit ? 'over-char-limit' : ''}}"
|
||||
aria-label="{{inputLengthLabel}}">
|
||||
{{inputLengthToDisplayAfterRaf || '0'}}
|
||||
</span>
|
||||
|
@ -33,13 +33,13 @@
|
|||
},
|
||||
store: () => store,
|
||||
computed: {
|
||||
inputLengthToDisplay: ($rawInputTextInComposeLength) => {
|
||||
return ($rawInputTextInComposeLength <= CHAR_LIMIT
|
||||
? $rawInputTextInComposeLength
|
||||
: CHAR_LIMIT - $rawInputTextInComposeLength)
|
||||
inputLengthToDisplay: ($rawComposeTextLength) => {
|
||||
return ($rawComposeTextLength <= CHAR_LIMIT
|
||||
? $rawComposeTextLength
|
||||
: CHAR_LIMIT - $rawComposeTextLength)
|
||||
},
|
||||
inputLengthLabel: ($rawInputTextInComposeOverLimit, inputLengthToDisplay) => {
|
||||
if ($rawInputTextInComposeOverLimit) {
|
||||
inputLengthLabel: ($rawComposeTextOverLimit, inputLengthToDisplay) => {
|
||||
if ($rawComposeTextOverLimit) {
|
||||
return `${inputLengthToDisplay} characters over limit`
|
||||
} else {
|
||||
return `${inputLengthToDisplay} characters`
|
||||
|
|
|
@ -102,8 +102,8 @@ export function instanceComputations (store) {
|
|||
return statusModifications[currentInstance]
|
||||
})
|
||||
|
||||
store.compute('currentInputTextInCompose',
|
||||
['inputTextInCompose', 'currentInstance'],
|
||||
(inputTextInCompose, currentInstance) => (inputTextInCompose[currentInstance] || '')
|
||||
store.compute('currentComposeText',
|
||||
['composeText', 'currentInstance'],
|
||||
(composeText, currentInstance) => (composeText[currentInstance] || '')
|
||||
)
|
||||
}
|
||||
|
|
|
@ -1,13 +1,13 @@
|
|||
import { CHAR_LIMIT } from '../_static/statuses'
|
||||
|
||||
export function statusComputations (store) {
|
||||
store.compute('rawInputTextInComposeLength',
|
||||
['rawInputTextInCompose'],
|
||||
(rawInputTextInCompose) => rawInputTextInCompose.length
|
||||
store.compute('rawComposeTextLength',
|
||||
['rawComposeText'],
|
||||
(rawComposeText) => rawComposeText.length
|
||||
)
|
||||
|
||||
store.compute('rawInputTextInComposeOverLimit',
|
||||
['rawInputTextInComposeLength'],
|
||||
(rawInputTextInComposeLength) => rawInputTextInComposeLength > CHAR_LIMIT
|
||||
store.compute('rawComposeTextOverLimit',
|
||||
['rawComposeTextLength'],
|
||||
(rawComposeTextLength) => rawComposeTextLength > CHAR_LIMIT
|
||||
)
|
||||
}
|
||||
|
|
|
@ -14,7 +14,7 @@ const KEYS_TO_STORE_IN_LOCAL_STORAGE = new Set([
|
|||
'autoplayGifs',
|
||||
'markMediaAsSensitive',
|
||||
'pinnedPages',
|
||||
'inputTextInCompose'
|
||||
'composeText'
|
||||
])
|
||||
|
||||
class PinaforeStore extends LocalStorageStore {
|
||||
|
@ -39,8 +39,8 @@ export const store = new PinaforeStore({
|
|||
pinnedStatuses: {},
|
||||
instanceInfos: {},
|
||||
statusModifications: {},
|
||||
inputTextInCompose: {},
|
||||
rawInputTextInCompose: ''
|
||||
composeText: {},
|
||||
rawComposeText: ''
|
||||
})
|
||||
|
||||
mixins(PinaforeStore)
|
||||
|
|
Loading…
Reference in New Issue